/* =====================================================================
   RMR — OUTILS GRATUITS (extension rmr-outils) — styles des calculateurs
   Les variables --rmr-* viennent du CSS personnalisé du site (Elementor → Réglages du site).
   ===================================================================== */
.rmr-outil{ --teal:var(--rmr-teal,#77bfbb); --teal-deep:var(--rmr-teal-deep,#234f4c); --teal-soft:var(--rmr-teal-soft,#e4f2ef); --navy:var(--rmr-navy,#0f3235); --navy-2:var(--rmr-navy-2,#022226);
  --ink:var(--rmr-ink,#13302e); --ink-soft:var(--rmr-ink-soft,#3f5b58); --line:var(--rmr-line,#e3e1da); --white:#fff; --mist:var(--rmr-mist,#f1f1ee); --mist-2:var(--rmr-mist-2,#f8f8f6);
  --display:var(--rmr-display,'Sora',sans-serif); --ui:var(--rmr-sans,'Schibsted Grotesk',sans-serif); --pill:999px; --shadow-soft:0 26px 60px -36px rgba(14,50,53,.5);
  font-family:var(--ui); color:var(--ink); }
.rmr-outil *, .rmr-outil *::before, .rmr-outil *::after{ box-sizing:border-box; }
/* boutons (mêmes pilules que le site) */
.rmr-outil .b{ display:inline-flex; align-items:center; gap:.55em; font-family:var(--ui); font-weight:600; font-size:1rem; letter-spacing:.01em; padding:.92em 1.6em; border-radius:var(--pill); border:1.6px solid transparent; cursor:pointer; transition:all .22s ease; white-space:nowrap; text-decoration:none; }
.rmr-outil .b .ar{ transition:transform .22s ease; } .rmr-outil .b:hover .ar{ transform:translate(2px,-2px); }
.rmr-outil .b--teal{ background:var(--teal); color:var(--navy-2) !important; } .rmr-outil .b--teal:hover{ background:var(--ink); color:#fff !important; transform:translateY(-2px); box-shadow:0 12px 26px -12px rgba(12,39,64,.55); }
.rmr-outil .b--line{ background:transparent; color:var(--ink) !important; border-color:var(--ink); } .rmr-outil .b--line:hover{ background:var(--ink); color:#fff !important; transform:translateY(-2px); }
.rmr-outil .b--ghost{ background:transparent; color:var(--ink) !important; border-color:var(--line); }
/* select stylé comme les champs */
.rmr-outil .inp--select select{ width:100%; font:inherit; font-size:1.02rem; font-weight:600; color:var(--ink); background:var(--mist-2); border:1.5px solid var(--line); border-radius:13px; padding:13px 40px 13px 16px; appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23234f4c' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; background-size:16px; }
.rmr-outil .inp--select select:focus{ outline:none; border-color:var(--teal); background-color:#fff; box-shadow:0 0 0 4px rgba(21,160,146,.13); }
/* diagnostic : oui/non + options proposées */
.rmr-outil .dg-choices{ display:flex; gap:8px; flex-wrap:wrap; }
.rmr-outil .dg-choice{ display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border:1.5px solid var(--line); border-radius:999px; background:var(--mist-2); font-weight:600; font-size:.94rem; cursor:pointer; }
.rmr-outil .dg-choice:has(input:checked){ background:var(--teal-soft); border-color:var(--teal); color:var(--teal-deep); }
.rmr-outil .dg-choice input{ accent-color:var(--teal-deep); margin:0; }
.rmr-outil .dg-opts{ display:flex; flex-direction:column; gap:8px; margin-top:18px; }
.rmr-outil .dg-opt{ display:grid; grid-template-columns:1fr auto; grid-template-areas:"t a" "s a"; column-gap:12px; align-items:center; padding:12px 16px; border-radius:16px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14); color:#fff !important; text-decoration:none; transition:background .2s; }
.rmr-outil .dg-opt:hover{ background:rgba(255,255,255,.13); } .rmr-outil .dg-opt b{ grid-area:t; font-size:.98rem; } .rmr-outil .dg-opt span{ grid-area:s; font-size:.86rem; color:rgba(255,255,255,.75); margin-top:2px; } .rmr-outil .dg-opt i{ grid-area:a; font-style:normal; font-size:1.2rem; color:var(--teal); }
.rmr-outil .result__big--sm{ font-size:clamp(1.5rem,2.6vw,2rem); line-height:1.15; }
/* liste « préparer ma consultation » */
.rmr-prep__list{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:10px 22px; }
.rmr-prep__list li{ position:relative; padding-left:30px; font-size:1rem; line-height:1.45; }
.rmr-prep__list li::before{ content:""; position:absolute; left:0; top:2px; width:20px; height:20px; border-radius:50%; background:var(--teal); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F3235' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E"); background-size:12px; background-position:center; background-repeat:no-repeat; }
.rmr-prep__note{ margin:18px 0 0; color:var(--ink-soft); font-size:.95rem; line-height:1.55; }
.rmr-prep__print{ margin-top:18px; }
@media (max-width:767px){ .rmr-prep__list{ grid-template-columns:1fr; } }
/* ---- styles de la maquette (calc, champs, résultat, budget) ---- */
.rmr-outil /* Bloc calculateur : grille formulaire + résultat */
.calc{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(20px,3vw,40px); margin-top:-clamp(28px,4vw,52px); position:relative; z-index:3; }
.rmr-outil .calc__panel{ background:var(--white); border:1px solid var(--line); border-radius:22px; padding:clamp(24px,3vw,38px); box-shadow:0 26px 60px -36px rgba(14,50,53,.5); }
.rmr-outil .calc__panel h2{ font-family:var(--display); font-weight:700; font-size:1.18rem; color:var(--ink); margin:0 0 6px; letter-spacing:-.01em; }
.rmr-outil .calc__panel .hint{ color:var(--ink-soft); font-size:.92rem; margin:0 0 20px; line-height:1.5; }
.rmr-outil /* Champs */
.field{ margin-bottom:16px; }
.rmr-outil .field > label{ display:block; font-weight:600; font-size:.92rem; color:var(--ink); margin-bottom:7px; }
.rmr-outil .field .sub{ font-weight:500; color:var(--ink-soft); font-size:.84rem; }
.rmr-outil .inp{ position:relative; display:flex; align-items:center; }
.rmr-outil .inp__pre, .rmr-outil .inp__post{ position:absolute; color:var(--ink-soft); font-weight:600; font-size:.96rem; pointer-events:none; }
.rmr-outil .inp__pre{ left:15px; }
.rmr-outil .inp__post{ right:15px; }
.rmr-outil .inp input{ width:100%; font:inherit; font-size:1.05rem; font-weight:600; color:var(--ink); background:var(--mist-2,#f8f8f6); border:1.5px solid var(--line); border-radius:13px; padding:13px 16px; transition:border-color .16s, background .16s, box-shadow .16s; -moz-appearance:textfield; }
.rmr-outil .inp input::-webkit-outer-spin-button, .rmr-outil .inp input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.rmr-outil .inp input:focus{ outline:none; border-color:var(--teal); background:#fff; box-shadow:0 0 0 4px rgba(21,160,146,.13); }
.rmr-outil .inp--money input{ padding-left:30px; }
.rmr-outil .inp--pct input, .rmr-outil .inp--month input{ padding-right:48px; }
.rmr-outil /* Lignes de dépenses dynamiques */
.exprow{ display:grid; grid-template-columns:1fr 150px; gap:10px; align-items:center; margin-bottom:9px; }
.rmr-outil .exprow label{ font-size:.92rem; color:var(--ink); font-weight:500; }
.rmr-outil .exprow .inp input{ font-size:1rem; padding-top:10px; padding-bottom:10px; }
.rmr-outil .exptotal{ display:flex; justify-content:space-between; align-items:baseline; border-top:2px solid var(--line); margin-top:14px; padding-top:14px; font-weight:600; color:var(--ink); }
.rmr-outil .exptotal b{ font-family:var(--display); font-size:1.15rem; }
.rmr-outil .subhead{ font-family:var(--display); font-weight:700; font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--teal-deep); margin:22px 0 12px; }
.rmr-outil /* Carte résultat (sticky) */
.result{ align-self:start; position:sticky; top:96px; background:linear-gradient(160deg,var(--navy) 0%, var(--navy-2) 100%); color:#eaf4f2; border-radius:22px; padding:clamp(26px,3vw,38px); box-shadow:0 26px 60px -34px rgba(8,32,34,.7); overflow:hidden; }
.rmr-outil .result::after{ content:""; position:absolute; right:-40px; top:-40px; width:160px; height:160px; border-radius:50%; background:radial-gradient(circle, rgba(21,160,146,.32), transparent 70%); }
.rmr-outil .result__label{ font-size:.82rem; letter-spacing:.10em; text-transform:uppercase; color:#7fd3c9; font-weight:700; }
.rmr-outil .result__big{ font-family:var(--display); font-weight:800; font-size:clamp(2.4rem,6vw,3.4rem); line-height:1; margin:10px 0 4px; letter-spacing:-.02em; color:#fff; }
.rmr-outil .result__sub{ color:#bcd9d4; font-size:.96rem; line-height:1.5; }
.rmr-outil .result__rows{ margin-top:22px; border-top:1px solid rgba(255,255,255,.16); padding-top:18px; display:grid; gap:11px; }
.rmr-outil .result__row{ display:flex; justify-content:space-between; align-items:baseline; font-size:.96rem; }
.rmr-outil .result__row span{ color:#bcd9d4; }
.rmr-outil .result__row b{ font-weight:700; color:#fff; font-variant-numeric:tabular-nums; }
.rmr-outil .result__gauge{ height:12px; border-radius:7px; background:rgba(255,255,255,.16); overflow:hidden; margin:18px 0 8px; }
.rmr-outil .result__gauge i{ display:block; height:100%; border-radius:7px; transition:width .35s cubic-bezier(.4,0,.2,1), background .35s; }
.rmr-outil .result__verdict{ display:inline-flex; align-items:center; gap:8px; margin-top:14px; padding:9px 15px; border-radius:999px; font-weight:700; font-size:.92rem; background:rgba(255,255,255,.10); }
.rmr-outil .result__verdict .dot{ width:9px; height:9px; border-radius:50%; background:currentColor; }
.rmr-outil .result__cta{ margin-top:22px; }
.rmr-outil .result__cta .b{ width:100%; justify-content:center; }
.rmr-outil .result__note{ font-size:.8rem; color:#8fb6b0; margin-top:14px; line-height:1.5; }
@media (max-width:860px){
.rmr-outil .calc{ grid-template-columns:1fr; margin-top:0; }
.rmr-outil .result{ position:static; }
}
.rmr-outil /* =====================================================================
   BUDGET — assistant multi-étapes (réharmonisé NEO)
   Réutilise .field/.inp/.result d'au-dessus ; ajoute le pas-à-pas.
   ===================================================================== */
.bw{ margin-top:-clamp(28px,4vw,52px); position:relative; z-index:3; }
.rmr-outil /* Barre d'étapes */
.bw-steps{ display:flex; flex-wrap:wrap; gap:6px 8px; justify-content:center; background:var(--white); border:1px solid var(--line); border-radius:16px; padding:13px 14px; box-shadow:var(--shadow-soft); margin-bottom:22px; }
.rmr-outil .bw-step{ display:inline-flex; align-items:center; gap:8px; padding:5px 11px; border-radius:999px; font-size:.84rem; font-weight:600; color:var(--ink-soft); white-space:nowrap; cursor:pointer; background:none; border:0; font-family:var(--ui); transition:color .18s; }
.rmr-outil .bw-step:hover{ color:var(--teal-deep); }
.rmr-outil .bw-step__n{ width:26px; height:26px; border-radius:50%; display:grid; place-items:center; background:var(--mist); color:var(--ink-soft); font-family:var(--display); font-weight:700; font-size:.8rem; border:1.5px solid var(--line); transition:.2s; }
.rmr-outil .bw-step.is-active{ color:var(--teal-deep); }
.rmr-outil .bw-step.is-active .bw-step__n{ background:var(--teal); color:var(--navy-2); border-color:var(--teal); }
.rmr-outil .bw-step.is-done .bw-step__n{ background:var(--teal-soft); color:var(--teal-deep); border-color:var(--teal-soft); }
.rmr-outil /* Disposition formulaire + résumé */
.bw-layout{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(20px,3vw,40px); align-items:start; }
.rmr-outil .bw-panel{ background:var(--white); border:1px solid var(--line); border-radius:22px; padding:clamp(24px,3vw,38px); box-shadow:0 26px 60px -36px rgba(14,50,53,.5); min-height:540px; display:flex; flex-direction:column; }
.rmr-outil .bw-sec{ display:none; }
.rmr-outil .bw-sec.is-active{ display:block; animation:bwfade .34s ease; }
@media (prefers-reduced-motion:reduce){
.rmr-outil .bw-sec.is-active{ animation:none; }
}
.rmr-outil from{ opacity:0; transform:translateY(6px); }
.rmr-outil to{ opacity:1; transform:none; }
.rmr-outil .bw-h{ font-family:var(--display); font-weight:700; font-size:1.4rem; color:var(--ink); margin:0 0 6px; letter-spacing:-.01em; }
.rmr-outil .bw-sub{ color:var(--ink-soft); font-size:.96rem; margin:0 0 22px; line-height:1.5; }
.rmr-outil .bw-grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.rmr-outil .bw-grid .field{ margin-bottom:0; }
.rmr-outil .bw-body{ flex:1; }
.rmr-outil /* Choix de situation */
.bw-choices{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.rmr-outil .bw-choice{ cursor:pointer; border:1.5px solid var(--line); border-radius:16px; padding:22px; min-height:124px; background:var(--white); display:flex; justify-content:space-between; align-items:center; gap:14px; transition:.18s; }
.rmr-outil .bw-choice:hover{ border-color:var(--teal); background:var(--teal-soft); }
.rmr-outil .bw-choice.selected{ border-color:var(--teal); background:var(--teal-soft); box-shadow:0 0 0 3px rgba(119,191,187,.28); }
.rmr-outil .bw-choice input{ width:18px; height:18px; accent-color:var(--teal-deep); margin-right:11px; }
.rmr-outil .bw-choice__l{ display:flex; align-items:center; font-size:1.06rem; font-weight:600; color:var(--ink); }
.rmr-outil .bw-choice__ic{ width:52px; height:52px; flex:none; color:var(--teal-deep); }
.rmr-outil .bw-choice__ic svg{ width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:4; stroke-linecap:round; stroke-linejoin:round; }
.rmr-outil /* Total de section */
.bw-total{ margin-top:20px; padding:15px 18px; border-radius:14px; background:var(--teal-soft); color:var(--teal-deep); font-weight:600; display:flex; justify-content:space-between; gap:14px; align-items:baseline; }
.rmr-outil .bw-total b{ font-family:var(--display); font-size:1.12rem; }
.rmr-outil /* Navigation */
.bw-nav{ display:flex; justify-content:space-between; gap:14px; margin-top:26px; }
.rmr-outil .bw-nav .b{ min-width:128px; justify-content:center; }
.rmr-outil .bw-reset{ background:none; border:0; color:var(--ink-soft); font:inherit; font-size:.86rem; font-weight:600; cursor:pointer; text-decoration:underline; text-underline-offset:3px; padding:0; }
.rmr-outil .bw-reset:hover{ color:var(--teal-deep); }
.rmr-outil /* Résumé : barres de catégories + message (sur fond navy .result) */
.bw-cats{ margin-top:18px; border-top:1px solid rgba(255,255,255,.16); padding-top:16px; }
.rmr-outil .bw-cats__t{ font-size:.8rem; letter-spacing:.10em; text-transform:uppercase; color:#7fd3c9; font-weight:700; margin-bottom:12px; }
.rmr-outil .bw-catrow{ display:grid; grid-template-columns:92px 1fr 72px; align-items:center; gap:10px; margin:9px 0; font-size:.82rem; color:#bcd9d4; }
.rmr-outil .bw-bar{ height:7px; border-radius:999px; background:rgba(255,255,255,.16); overflow:hidden; }
.rmr-outil .bw-bar i{ display:block; height:100%; width:0; background:var(--teal); border-radius:999px; transition:width .3s ease; }
.rmr-outil .bw-catrow b{ color:#fff; text-align:right; font-variant-numeric:tabular-nums; font-weight:700; }
.rmr-outil .bw-msg{ margin-top:16px; padding:14px 16px; border-radius:14px; font-size:.92rem; line-height:1.5; background:rgba(255,255,255,.10); color:#dcefe9; }
.rmr-outil .bw-msg.is-success{ background:rgba(123,231,196,.16); color:#bff0d6; }
.rmr-outil .bw-msg.is-warn{ background:rgba(255,217,138,.15); color:#ffe2a8; }
.rmr-outil .bw-msg.is-alert{ background:rgba(255,157,138,.18); color:#ffc1b3; }
@media (max-width:860px){
.rmr-outil .bw{ margin-top:0; }
.rmr-outil .bw-layout{ grid-template-columns:1fr; }
.rmr-outil .bw-grid, .rmr-outil .bw-choices{ grid-template-columns:1fr; }
.rmr-outil .bw-step span:last-child{ display:none; }
.rmr-outil .bw-step{ padding:5px 7px; }
}

@media (max-width:760px){

}


/* Priorité sur les styles globaux de boutons d'Elementor / du thème */
.rmr-outil button.b.b--teal, .rmr-outil a.b.b--teal{ background:var(--teal) !important; border-color:transparent !important; color:var(--navy-2) !important; }
.rmr-outil button.b.b--teal:hover, .rmr-outil a.b.b--teal:hover{ background:var(--ink) !important; color:#fff !important; }
.rmr-outil button.b.b--line, .rmr-outil a.b.b--line{ background:transparent !important; border-color:var(--ink) !important; color:var(--ink) !important; }
.rmr-outil button.b.b--line:hover, .rmr-outil a.b.b--line:hover{ background:var(--ink) !important; color:#fff !important; }
