/* JOJO — feuille de style du site (sortie de index.html le 2026-11-07 pour être mise en cache). */
.persoReco{display:inline-block;margin-left:8px;padding:2px 9px;border-radius:100px;background:var(--l);color:var(--l-on);
  font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;vertical-align:middle}

/* ===========================================================
   JOJO — Direction A « Les lignes de la ville »
   Inter (opsz variable). La couleur sert de navigation.
   =========================================================== */
:root{
  --creme:#FFF6EF; --sable:#F6EBE0; --blanc:#FFFFFF;
  --encre:#12100E; --encre2:#5A4F47; --encre3:#74675E;
  --filet:#E7D9CC; --filet2:#D6C4B3; --nuit:#171310;
  --accent:#FF5470; --accent-t:#C81E45;
  --gout:26px;
  --sp:80px; --sp-s:56px; --sp-xs:36px; --sp-t:44px; --sp-tb:38px;
  --profond:#7A2405; --profond-2:#FFD9C2; --profond-acc:#FF8C1A;
  --go:#046C4E; --go-wash:#E6F7F0; --stop:#A8201F; --stop-wash:#FBEDEC;

  /* ligne active — pilotée par [data-ligne] */
  /* Transport (2026-11-07) : texte blanc sur orange, demandé par JOJO ; orange de fond un peu plus profond (#D4421A) pour que le blanc reste lisible (4,6:1) */
  --l:#D4421A; --l-t:#C34118; --l-w:#FEEFEB; --l-on:var(--blanc);

  --disp:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --txt:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --e:cubic-bezier(.16,1,.3,1);
  --t1:120ms; --t2:280ms; --t3:640ms;
  --r-f:var(--ray-2); --r-c:var(--ray-3); --r-s:32px;
  /* système visuel 2026-11-07 : rayons, ombres */
  --ray-1:10px;--ray-2:16px;--ray-3:24px;
  --sh-1:0 1px 2px rgba(18,16,14,.06),0 4px 12px rgba(18,16,14,.05);
  --sh-2:0 3px 8px rgba(18,16,14,.08),0 12px 28px rgba(18,16,14,.08);
  --sh-3:0 20px 50px rgba(18,16,14,.18),0 2px 6px rgba(18,16,14,.06);
}
/* la gamme : cinq crans entre #A63208 et #FF8C1A,
   espacés par la clarté pour rester distinguables */
[data-ligne="demenagement"]{--l:#A63208;--l-t:#A63208;--l-w:#F7EDE9;--l-on:var(--blanc)}
[data-ligne="cle"]         {--l:#C14A0D;--l-t:#B0420B;--l-w:#F9EFE9;--l-on:var(--blanc)}
[data-ligne="transport"]   {--l:#D4421A;--l-t:#C34118;--l-w:#FEEFEB;--l-on:var(--blanc)}
[data-ligne="manutention"] {--l:#F07A16;--l-t:#A8550F;--l-w:#FEF3EA;--l-on:#12100E}
[data-ligne="secours"]     {--l:#FF8C1A;--l-t:#A65B11;--l-w:#FFF5EA;--l-on:#12100E}
.lDemenagement{--l:#A63208;--l-t:#A63208;--l-w:#F7EDE9;--l-on:var(--blanc)}
.lCle         {--l:#C14A0D;--l-t:#B0420B;--l-w:#F9EFE9;--l-on:var(--blanc)}
.lTransport   {--l:#D4421A;--l-t:#C34118;--l-w:#FEEFEB;--l-on:var(--blanc)}
.lManutention {--l:#F07A16;--l-t:#A8550F;--l-w:#FEF3EA;--l-on:#12100E}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--creme);color:var(--encre);font-family:var(--txt);font-size:18px;
  line-height:1.6;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;overflow-x:hidden;
  transition:background var(--t2) var(--e)}
img{max-width:100%}
/* Filet : aucun SVG ne peut plus s'afficher à sa taille intrinsèque */
svg{max-width:100%;vertical-align:middle}
.btn svg,a svg,li svg,summary svg,.plus svg{width:1.15em;height:1.15em;flex-shrink:0}
.btn svg{width:18px;height:18px}
.ico,.ico svg{width:26px;height:26px}
::selection{background:var(--l);color:var(--l-on)}

/* ---------- mouvement ---------- */
.rv,.rvs,.rvx{opacity:1;transform:none}
html.anim-ok .rv{opacity:0;transform:translateY(20px);transition:opacity var(--t3) var(--e),transform var(--t3) var(--e)}
html.anim-ok .rv.in{opacity:1;transform:none}
html.anim-ok .rv.d1{transition-delay:70ms}.rv.d2{transition-delay:140ms}.rv.d3{transition-delay:210ms}
html.anim-ok .rv.d4{transition-delay:280ms}.rv.d5{transition-delay:350ms}.rv.d6{transition-delay:420ms}
html.anim-ok .rvs{opacity:0;transform:scale(.975);transition:opacity var(--t3) var(--e),transform var(--t3) var(--e)}
html.anim-ok .rvs.in{opacity:1;transform:none}
html.anim-ok .rvx{opacity:0;transform:translateX(-16px);transition:opacity var(--t3) var(--e),transform var(--t3) var(--e)}
html.anim-ok .rvx.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .rv,.rvs,.rvx{opacity:1!important;transform:none!important}
}

/* ---------- structure ---------- */
/* Trois largeurs, trois usages, un seul gouttière :
   large 1160 (grilles) · lecture 820 (texte et formulaires) */
.wrap{max-width:1160px;margin:0 auto;padding:0 var(--gout)}
.narrow{max-width:820px;margin:0 auto;padding:0 var(--gout)}
/* Le calculateur et la candidature occupent la grille large et se
   divisent en deux colonnes : questions à gauche, suivi à droite. */
.sim{max-width:1160px;margin:0 auto;padding:0 var(--gout)}
.simduo{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start}
.simcol{min-width:0}
.simside{position:sticky;top:92px;display:grid;gap:14px}
@media(max-width:1040px){.simduo{grid-template-columns:1fr;gap:26px}.simside{position:static}}
/* panneau de suivi */
.suivi{background:var(--blanc);border:1px solid var(--filet);border-radius:var(--r-c);overflow:hidden}
.suiviH{background:var(--sable);padding:13px 18px;font-size:12px;font-weight:800;letter-spacing:.07em;
  text-transform:uppercase;color:var(--encre3);border-bottom:1px solid var(--filet)}
.suiviB{padding:18px}
.suiviP{font-family:var(--disp);font-size:2.3rem;font-weight:800;letter-spacing:-.045em;line-height:1;
  color:var(--l-t);font-variant-numeric:tabular-nums}
.suiviP small{display:block;font-family:var(--txt);font-size:12px;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;color:var(--encre3);margin-bottom:5px}
.suiviF{display:flex;align-items:center;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--filet)}
.suiviF i{width:10px;height:10px;border-radius:50%;background:var(--l);flex-shrink:0}
.suiviF b{font-size:15px;color:var(--encre)}
.suiviF span{font-size:13px;color:var(--encre3);display:block}
.suiviL{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.suiviL li{display:flex;gap:10px;font-size:13px;color:var(--encre3);line-height:1.4}
.suiviP .att{font-style:normal;font-weight:600;color:var(--encre3)}

.dureeBox{margin:18px 0 0;padding:16px;border:1px solid var(--filet2);border-radius:var(--ray-2)}
.dureeBox .dt{font-weight:700;margin:0 0 4px}
.dureeBox .dd{margin:0 0 12px;color:var(--encre3);font-size:14px}
.dureeCtl{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.dureeCtl .pas{width:44px;height:44px;flex:0 0 44px;border-radius:var(--ray-1);border:1px solid var(--filet2);background:transparent;font-size:20px;line-height:1;cursor:pointer;color:inherit;display:inline-flex;align-items:center;justify-content:center}
.dureeCtl .pas:disabled{opacity:.35;cursor:not-allowed}
.dureeReset{margin:12px 0 0}
.dureeReset button{min-height:44px;padding:0;text-align:left}
.dureeCtl .val{font-size:22px;font-weight:700;min-width:82px;text-align:center}
.dureeCtl .rec{font-size:13px;color:var(--encre3)}
.dureeAvert{margin:12px 0 0;padding:12px 14px;border-radius:var(--ray-1);background:rgba(244,81,30,.08);font-size:14px;line-height:1.5}
.suiviL li b{color:var(--encre);font-weight:600}
.suiviL li .k{width:74px;flex-shrink:0}
.suiviL li.vide{display:none}

/* ============ carte « affiner avec mon inventaire » ============ */
.affiner{display:flex;width:100%;text-align:left;font:inherit;cursor:pointer;margin-bottom:6px;
  align-items:center;gap:15px;border:1.6px dashed var(--filet2);background:var(--blanc);
  border-radius:var(--r-f);padding:17px 20px;transition:all var(--t2) var(--e)}
.affiner:hover{border-color:var(--l);border-style:solid;background:var(--l-w);transform:translateY(-2px)}
.affiner .ai{width:46px;height:46px;border-radius:var(--ray-1);background:var(--l-w);border:1.5px solid var(--l);
  display:grid;place-items:center;flex-shrink:0;color:var(--l-t);transition:all var(--t2) var(--e)}
.affiner:hover .ai{background:var(--l);color:var(--l-on)}
.affiner .ai svg{width:22px;height:22px}
.affiner .g{flex:1;min-width:0}
.affiner .t{display:block;font-weight:700;font-size:16px;color:var(--encre);line-height:1.3}
.affiner .d{display:block;font-size:13px;color:var(--encre3);margin-top:4px;line-height:1.45}
.affiner .ab{font-weight:700;font-size:14px;color:var(--l-t);white-space:nowrap;display:flex;align-items:center;gap:7px}
.affiner:hover .ab .fl{transform:translateX(4px)}
@media(max-width:560px){.affiner{flex-wrap:wrap}.affiner .ab{width:100%;justify-content:flex-end}}

/* ============ nombre de Gros Bras ============ */

.pers{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:10px;margin-top:4px}

/* Échelle d'espacement vertical, une seule source.
   tete = bandeau d'en-tête de page · suite = section qui le prolonge */
section{padding:var(--sp) 0;position:relative}
section.sm{padding:var(--sp-s) 0}

section.tete{padding:var(--sp-t) 0 var(--sp-tb)}
section.suite{padding-top:var(--sp-s)}
@media(max-width:1040px){:root{--sp:64px;--sp-s:46px;--sp-xs:30px;--sp-t:38px;--sp-tb:32px}}
@media(max-width:760px){:root{--sp:52px;--sp-s:38px;--sp-xs:26px;--sp-t:32px;--sp-tb:26px;--gout:20px}}

/* Rythme : clair -> teinté -> blanc -> couleur pleine -> clair */
.rythme1{background:var(--creme)}
.rythme2{background:var(--l-w);transition:background var(--t2) var(--e)}
.rythme3{background:var(--blanc)}
/* Bande profonde : contraste garanti quelle que soit la ligne active.
   blanc 10,1:1 · crème 7,7:1 · or 4,3:1 — jamais de ton sur ton. */
.rythme4{background:var(--profond);color:var(--blanc)}
.rythme4 h1,.rythme4 h2,.rythme4 h3,.rythme4 h4{color:var(--blanc)}
.rythme4 p,.rythme4 li,.rythme4 .mini{color:var(--profond-2)}
.rythme4 li::marker{color:var(--profond-acc)}
.rythme4 .eyeb{color:var(--profond-acc)}
.rythme4 .eyeb::before{background:var(--profond-acc)}
.rythme4 strong,.rythme4 b{color:var(--blanc)}
.rythme4 a{color:var(--profond-acc)}
.rythme4 .kfig{color:var(--profond-acc)}
.rythme4 .klab{color:var(--profond-2)}
.rythme4 .plus li{color:var(--profond-2)}
.rythme4 .plus li svg{color:var(--profond-acc)}

.rythme4 .deco{color:var(--blanc)}
.rythme4 .btn-1{background:var(--profond-acc);color:#2A1004;border-color:var(--profond-acc)}
.rythme4 .btn-2{color:var(--blanc);border-color:rgba(255,255,255,.4)}
.rythme4 .btn-2:hover{border-color:var(--blanc);background:rgba(255,255,255,.08)}
.rythme4 .card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)}
.rythme4 .reass > div{background:rgba(255,255,255,.08)}
.rythme4 .reass{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.18)}
.rythme4 .reass .t{color:var(--blanc)}
.rythme4 .reass .d{color:var(--profond-2)}
.rythme4 .reass svg{color:var(--profond-acc)}
.rythme5{background:var(--sable)}
/* séparateur en arc entre deux sections */
.arc{position:relative}
.arc::before{content:"";position:absolute;left:50%;top:-1px;width:180%;height:56px;transform:translateX(-50%);
  background:inherit;border-radius:0 0 50% 50%/0 0 100% 100%;pointer-events:none;z-index:1}
/* décors géométriques discrets */
.deco{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.deco i{position:absolute;display:block;border-radius:50%}
.deco .c1{width:320px;height:320px;right:-110px;top:-120px;border:1.5px solid currentColor;opacity:.12}
.deco .c2{width:180px;height:180px;left:-70px;bottom:-80px;background:currentColor;opacity:.05}
.deco .c3{width:10px;height:10px;right:16%;bottom:22%;background:currentColor;opacity:.3}
.deco .c4{width:6px;height:6px;left:12%;top:18%;background:currentColor;opacity:.25}
section > .wrap,section > .narrow,section > .sim{position:relative;z-index:2}

/* ============ 3. MICRO-INTERACTIONS ============ */
.btn-1::after,.btn-d::after{content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.26),transparent 70%);
  transform:translateX(-130%);transition:transform 620ms var(--e)}
.btn-1,.btn-d{position:relative;overflow:hidden}
.btn-1:hover::after,.btn-d:hover::after{transform:translateX(130%)}
.btn .fl{display:inline-block;transition:transform var(--t2) var(--e)}
.btn:hover .fl{transform:translateX(4px)}

.card.lift:hover .icobox{transform:rotate(-6deg) scale(1.06)}
.ligneCard::before{content:"";position:absolute;right:-30px;top:-30px;width:130px;height:130px;
  border:1.5px solid rgba(255,255,255,.28);border-radius:50%;transition:transform 700ms var(--e)}
.ligneCard:hover::before{transform:scale(1.25) rotate(20deg)}

/* ============ 4. HÉROS ============ */
@media(min-width:961px){
  /* 80 px entre le dernier élément du contenu et le bas de la section */
  .hero{padding-bottom:80px}
}
.panneau{background:var(--blanc);position:relative;z-index:6;border-radius:var(--r-s);padding:28px;
  border:1px solid var(--filet);
  box-shadow:var(--sh-3)}
.panneau .titreP{display:flex;align-items:center;gap:11px;margin-bottom:6px}
.panneau .titreP .pastille{width:30px;height:30px;border-radius:100px;background:var(--l);color:var(--l-on);
  display:grid;place-items:center;font-size:14px;font-weight:800;flex-shrink:0}
.panneau .titreP h4{margin:0;font-size:1.08rem;font-weight:800;letter-spacing:-.022em;color:var(--encre)}
.panneau .sousP{font-size:13px;color:var(--encre3);margin:0 0 16px;line-height:1.45}
.panneau .etapesP{display:flex;gap:6px;margin-bottom:16px}
.panneau .etapesP i{height:4px;flex:1;border-radius:4px;background:var(--filet)}
.panneau .etapesP i.on{background:var(--l)}

/* la zone d'atterrissage sous le héros laisse la place au panneau */
.apresHero{background:var(--sable)}

/* ============ 5. MARQUEE ============ */
.marq{background:var(--blanc);color:var(--encre2);padding:0;overflow:hidden;position:relative;z-index:8;
  border-top:1px solid var(--filet);border-bottom:1px solid var(--filet);min-height:58px;display:block}
.marq .piste{overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.marq .rail{display:flex;width:max-content;align-items:center;min-height:58px;
  animation:slide 52s linear infinite;will-change:transform}
.marq:hover .rail,.marq:focus-within .rail{animation-play-state:paused}
.marq a{display:inline-flex;align-items:center;gap:12px;padding:17px 28px;text-decoration:none;
  color:var(--encre2);font-size:16px;white-space:nowrap;
  transition:background var(--t1),color var(--t1)}
.marq a:hover,.marq a:focus-visible{background:var(--l-w);color:var(--l-t);outline:none}
.marq a b{font-weight:700;color:var(--encre);letter-spacing:-.018em;transition:color var(--t1)}
.marq a:hover b{color:var(--l-t)}
.marq a em{font-style:normal;color:var(--encre3);font-size:14px}
.marq a:hover em{color:var(--l-t);opacity:.8}
.marq a i{width:10px;height:10px;border-radius:50%;display:block;flex-shrink:0;
  transition:transform var(--t1) var(--e)}
.marq a:hover i{transform:scale(1.45)}
.marq .sepm{display:flex;align-items:center;color:var(--filet2);font-size:12px;user-select:none}
@media (prefers-reduced-motion:reduce){
  .marq .rail{animation:none}
  .marq .piste{overflow-x:auto;scrollbar-width:thin}
}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ============ 6. MENU SERVICES ORGANISÉ ============ */
.megagr{display:block;padding:6px}
.megagr + .megagr{border-left:1px solid var(--filet)}
.megagr > h6{display:block;font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
  color:var(--encre3);margin:6px 0 8px;padding:0 14px;line-height:1.3}
@media(max-width:960px){.megagr + .megagr{border-left:0;border-top:1px solid var(--filet);margin-top:8px;padding-top:12px}}
.megalien .mi{width:36px;height:36px;border-radius:var(--ray-1);display:grid;place-items:center;flex-shrink:0;
  transition:transform var(--t2) var(--e)}
.megalien .mi svg{width:19px;height:19px;color:var(--blanc)}
.megalien:hover .mi{transform:rotate(-6deg) scale(1.08)}
.megapan .pied{display:flex;grid-column:1 / -1;border-top:1px solid var(--filet);margin-top:10px;
  padding:16px 14px 6px;gap:16px;align-items:center;flex-wrap:wrap}
.megapan .pied .t{font-size:14px;color:var(--encre3);flex:1;min-width:170px;line-height:1.45}
.megapan .pied .btn{flex:0 0 auto;padding:12px 22px;font-size:14px;color:var(--l-on);
  background:var(--l);border-color:var(--l);white-space:nowrap}
.megapan .pied .btn:hover{background:var(--l-t);border-color:var(--l-t);color:var(--blanc)}
@media(max-width:960px){.megapan .pied .btn{width:100%;justify-content:center}}
@media(max-width:960px){.megapan{grid-template-columns:1fr}.megapan .pied{padding:14px 0 0}}

/* ============ 7. COMMENT ÇA MARCHE ============ */
.parcours{position:relative;padding-left:0}
.etapeP{display:flex;gap:22px;position:relative;padding:0 0 30px}
.etapeP:last-child{padding-bottom:0}
.etapeP .colG{display:flex;flex-direction:column;align-items:center;flex-shrink:0;width:56px}
.etapeP .rond{width:56px;height:56px;border-radius:100px;background:var(--l);color:var(--l-on);
  display:grid;place-items:center;flex-shrink:0;position:relative;z-index:2;
  transition:transform var(--t2) var(--e)}
.etapeP .rond svg{width:25px;height:25px}
.etapeP:hover .rond{transform:scale(1.07) rotate(-5deg)}
.etapeP .trait{flex:1;width:2px;margin:8px 0 0;background:repeating-linear-gradient(var(--filet2) 0 5px,transparent 5px 11px)}
.etapeP:last-child .trait{display:none}
.etapeP .txt{flex:1;padding-bottom:6px}
.etapeP .num{font-size:12px;font-weight:800;letter-spacing:.08em;color:var(--l-t);margin-bottom:5px}
.etapeP h3{margin-bottom:6px}
.etapeP p{margin:0;font-size:15px}
.etapeP .pt{font-size:13px;color:var(--encre3);margin-top:7px}
@media(max-width:560px){.etapeP{gap:15px}.etapeP .colG{width:44px}.etapeP .rond{width:44px;height:44px}
  .etapeP .rond svg{width:20px;height:20px}}

/* ============ 9. COMPACTAGE DES BLOCS ============ */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
@media(max-width:760px){.duo{grid-template-columns:1fr}}
.serre h2{margin-bottom:8px}
.serre .lede{margin-bottom:22px}
.mini{font-size:15px;line-height:1.5}

.wash{background:var(--l-w);transition:background var(--t2) var(--e)}
.nuit{background:var(--nuit);color:#F7F1EC}
.nuit h1,.nuit h2,.nuit h3{color:var(--blanc)}
.nuit p,.nuit li{color:#C8BCB2}

/* ---------- typographie ---------- */
h1{font-family:var(--disp);font-size:clamp(2.6rem,7.2vw,4.9rem);font-weight:800;line-height:1;
  letter-spacing:-.042em;margin:0 0 20px;font-variation-settings:'opsz' 32}
h2{font-family:var(--disp);font-size:clamp(1.8rem,4.4vw,2.9rem);font-weight:800;line-height:1.08;
  letter-spacing:-.034em;margin:0 0 14px;font-variation-settings:'opsz' 32}
h3{font-family:var(--disp);font-size:1.25rem;font-weight:700;letter-spacing:-.024em;margin:0 0 8px;line-height:1.25}
h4{font-size:.9rem;font-weight:700;color:var(--encre2);margin:0 0 9px}
p{margin:0 0 17px;max-width:68ch;color:var(--encre2)}
ul,ol{margin:0 0 17px;padding-left:22px;max-width:68ch;color:var(--encre2)}
li{margin-bottom:8px}li::marker{color:var(--l-t)}
strong,b{color:var(--encre);font-weight:700}
.nuit strong,.nuit b{color:var(--blanc)}
a{color:var(--l-t);text-underline-offset:3px}
.lede{font-size:clamp(1.06rem,2vw,1.3rem);line-height:1.48;color:var(--encre2);max-width:54ch}
.muted{color:var(--encre3);font-size:14px}
.eyeb{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:700;color:var(--l-t);margin:0 0 14px}
.eyeb::before{content:"";width:26px;height:3px;border-radius:3px;background:var(--l)}
.nuit .eyeb{color:var(--l)}

/* ---------- barre ---------- */
header.nav{position:sticky;top:0;z-index:90;background:color-mix(in srgb,var(--creme) 88%,transparent);
  backdrop-filter:saturate(1.5) blur(8px);border-bottom:1px solid transparent;transition:border-color var(--t2),background var(--t2)}
header.nav.stuck{border-color:var(--filet)}
.navin{max-width:1160px;margin:0 auto;padding:13px 26px;display:flex;align-items:center;gap:28px}
.logoimg{height:32px;width:auto;display:block}
.menu{display:flex;gap:26px;flex:1;font-size:15px}
.menu a{color:var(--encre2);text-decoration:none;position:relative;padding:5px 0;font-weight:500;white-space:nowrap}
.menu a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:3px;background:var(--l);
  border-radius:3px;transition:right var(--t2) var(--e)}
.menu a:hover,.menu a.on{color:var(--encre)}
.menu a:hover::after,.menu a.on::after{right:0}
.navact{display:flex;gap:10px;align-items:center;flex-shrink:0}
.burger{display:none;background:none;border:1.5px solid var(--filet2);border-radius:100px;
  padding:9px 15px;cursor:pointer;color:var(--encre);font:inherit;font-size:14px;font-weight:600}
@media(max-width:960px){
  .menu{display:none;position:absolute;top:100%;left:0;right:0;background:var(--creme);
    border-bottom:1px solid var(--filet);flex-direction:column;gap:0;padding:8px 26px 20px}
  .menu.open{display:flex}
  .menu a{padding:14px 0;border-bottom:1px solid var(--filet)}
  .burger{display:block}.navact .cta{display:none}
  /* téléphone et tablette : logo à gauche, « Menu » calé contre le bord droit (2026-11-07) */
  .navact{margin-left:auto}
}

/* ---------- boutons ---------- */
.btn{font-family:var(--txt);font-size:16px;font-weight:700;border-radius:100px;padding:14px 27px;
  cursor:pointer;border:2px solid transparent;text-decoration:none;display:inline-flex;align-items:center;gap:9px;
  transition:transform var(--t1) var(--e),background var(--t2),color var(--t2),border-color var(--t2)}
.btn:focus-visible{outline:3px solid var(--encre);outline-offset:3px}
.btn-1{background:var(--l);color:var(--l-on);border-color:var(--l)}
.btn-1:hover{transform:translateY(-2px);filter:brightness(1.06)}
.btn-2{background:transparent;color:var(--encre);border-color:var(--filet2)}
.btn-2:hover{border-color:var(--encre);transform:translateY(-2px)}
.nuit .btn-2{color:var(--blanc);border-color:rgba(255,255,255,.3)}
.nuit .btn-2:hover{border-color:var(--blanc)}
.btn-d{background:var(--encre);color:var(--creme);border-color:var(--encre)}
.btn-d:hover{transform:translateY(-2px)}
.btn-sm{font-size:14px;padding:10px 20px}
.btn-3{background:none;border:0;color:var(--encre2);text-decoration:underline;text-underline-offset:4px;
  padding:8px 2px;font:inherit;font-size:15px;cursor:pointer}
.row{display:flex;gap:13px;flex-wrap:wrap;align-items:center}

/* ---------- jeton de ligne (signature) ---------- */
.jeton{display:inline-flex;align-items:center;gap:8px;border-radius:100px;padding:8px 15px;
  font-size:13px;font-weight:700;background:var(--l-w);color:var(--l-t);border:1.5px solid var(--l);
  white-space:nowrap}
.jeton i{width:9px;height:9px;border-radius:50%;background:var(--l);display:block;flex-shrink:0}
.jeton.plein{background:var(--l);color:var(--l-on);border-color:var(--l)}
.jeton.plein i{background:var(--l-on)}

/* ---------- barre de volume (signature) ---------- */
.vol{display:flex;gap:3px;align-items:flex-end;height:28px;margin:14px 0 8px}
.vol i{--k:0;display:block;flex:1;background:var(--filet);border-radius:3px;height:100%;
  transform-origin:bottom;transform:scaleY(.2);opacity:.45;
  transition:transform 420ms var(--e),opacity 300ms}
.vol.in i{transform:scaleY(1);opacity:1;transition-delay:calc(var(--k) * 26ms)}
.vol i.on{background:var(--l)}

/* ---------- surfaces ---------- */
.card{background:var(--blanc);border:1px solid var(--filet);border-radius:var(--r-c);padding:28px;
  transition:transform var(--t2) var(--e),border-color var(--t2)}
.card.lift:hover{transform:translateY(-4px);border-color:var(--l)}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}

@media(max-width:960px){.g2,.g3{grid-template-columns:1fr}}

/* ---------- héros ---------- */
.hero{background:var(--l);color:var(--l-on);padding:56px 0 var(--sp-s);position:relative;
  transition:background var(--t2) var(--e);isolation:isolate}
.hero > .heroph{overflow:hidden}
.hero::after{content:"";position:absolute;right:-140px;top:-120px;width:460px;height:460px;z-index:0;
  border-radius:50%;background:rgba(255,255,255,.09);pointer-events:none}

.hero h1{color:var(--l-on);max-width:14ch}
.hero .lede{color:var(--l-on);opacity:.94;max-width:44ch}
.hgrid{display:grid;grid-template-columns:1.06fr .94fr;gap:44px;align-items:center;position:relative;z-index:3}
@media(max-width:960px){.hgrid{grid-template-columns:minmax(0,1fr);gap:30px}.hero{padding-top:44px}}
.hgrid > *{min-width:0}
/* cercles décoratifs (héros, arcs, déco) : ils dépassent à droite ; sans rognage, un téléphone élargissait toute la page (2026-11-07) */
.hero,.arc{overflow-x:clip}
.hstats{display:flex;gap:34px;flex-wrap:wrap;margin-top:34px;padding-top:24px;border-top:1px solid rgba(255,255,255,.26)}
[data-ligne="secours"] .hstats,
[data-ligne="manutention"] .hstats{border-top-color:rgba(18,16,14,.22)}
.hstat .v{font-family:var(--disp);font-size:1.85rem;font-weight:800;letter-spacing:-.04em;line-height:1;color:var(--l-on)}
.hstat .l{font-size:13px;opacity:.9;margin-top:8px;max-width:20ch;line-height:1.4}
.lignes{display:flex;gap:8px;flex-wrap:wrap;margin-top:26px}
.lgpick{border-radius:100px;padding:9px 16px;font-size:14px;font-weight:700;cursor:pointer;
  background:rgba(255,255,255,.17);color:var(--l-on);border:1.5px solid rgba(255,255,255,.3);
  display:inline-flex;align-items:center;gap:8px;font-family:var(--txt);
  transition:background var(--t1),transform var(--t1) var(--e)}
.lgpick:hover{transform:translateY(-2px)}
.lgpick i{width:9px;height:9px;border-radius:50%;background:currentColor;display:block}
.lgpick[aria-pressed="true"]{background:var(--blanc);color:var(--encre);border-color:var(--blanc)}
[data-ligne="secours"] .lgpick,
[data-ligne="manutention"] .lgpick{background:rgba(18,16,14,.1);border-color:rgba(18,16,14,.22)}

.panneau h4{font-family:var(--disp);font-size:1.1rem;font-weight:800;color:var(--encre);letter-spacing:-.02em;margin-bottom:16px}
.bf{position:relative;margin-bottom:10px}

/* ---------- photographie ---------- */
.photo{position:relative;overflow:hidden;border-radius:var(--r-c);background:var(--sable)}
.photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 900ms var(--e)}
.photo:hover img{transform:scale(1.04)}
.photo.tall{aspect-ratio:4/5}
.photo .cap{position:absolute;left:0;right:0;bottom:0;padding:22px;color:var(--blanc);
  background:linear-gradient(transparent,rgba(18,16,14,.88))}
.photo .cap .t{font-family:var(--disp);font-weight:800;font-size:1.15rem;letter-spacing:-.02em}
.photo .cap .d{font-size:14px;color:rgba(255,255,255,.85);margin-top:7px;line-height:1.5}
.photo .tag{position:absolute;top:16px;left:16px}
.photo .tr{position:absolute;inset:0;pointer-events:none}
.heroph{position:absolute;inset:0;z-index:0;overflow:hidden;clip-path:inset(0)}
.heroph img{width:100%;height:100%;object-fit:cover;opacity:.17;filter:grayscale(1) contrast(1.1)}
.bandph{position:absolute;inset:0;z-index:0}
.bandph img{width:100%;height:100%;object-fit:cover}
.bandph::after{content:"";position:absolute;inset:0;background:rgba(23,19,16,.82)}
.band{position:relative;overflow:hidden;isolation:isolate}
.band > .wrap{position:relative;z-index:2}

/* ---------- cartes de ligne ---------- */
.ligneCard{border-radius:var(--r-s);padding:30px;color:var(--l-on);background:var(--l);
  display:flex;flex-direction:column;min-height:220px;text-decoration:none;position:relative;overflow:hidden;
  transition:transform var(--t2) var(--e)}
.ligneCard:hover{transform:translateY(-6px)}
.ligneCard::after{content:"";position:absolute;right:-60px;bottom:-90px;width:220px;height:220px;
  border-radius:50%;background:rgba(255,255,255,.1)}
.ligneCard .k{font-size:12px;font-weight:700;opacity:.82;position:relative}
.ligneCard .t{font-family:var(--disp);font-size:1.8rem;font-weight:800;letter-spacing:-.036em;
  line-height:1.05;margin-top:7px;position:relative}
.ligneCard .d{font-size:15px;opacity:.94;margin-top:11px;position:relative;line-height:1.5}
.ligneCard .p{font-weight:800;font-size:16px;margin-top:18px;position:relative;display:flex;align-items:center;gap:7px}
.ligneCard .p::after{content:"→";transition:transform var(--t2) var(--e)}
.ligneCard:hover .p::after{transform:translateX(5px)}

/* ---------- tableaux ---------- */
.tw{overflow-x:auto;border:1px solid var(--filet);border-radius:var(--r-c);margin:22px 0;background:var(--blanc)}
/* grille tarifaire : chaque ligne porte sa couleur */
.grilleT tbody tr{border-left:4px solid transparent}
.grilleT tbody tr td:first-child{font-weight:700;color:var(--encre)}
.grilleT .pastT{display:inline-flex;align-items:center;gap:9px}
.grilleT .pastT i{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.grilleT td.n{font-variant-numeric:tabular-nums;font-weight:600;color:var(--encre2)}
.grilleT td.mini2{color:var(--filet2);font-weight:400}
.grilleT td.best{background:var(--l-w);color:var(--l-t);font-weight:800;position:relative}
.grilleT thead th.n{color:var(--encre)}
.grilleT tbody tr:hover td{background:color-mix(in srgb,var(--l) 7%,transparent)}
.grilleT tbody tr:hover td.best{background:color-mix(in srgb,var(--l) 16%,transparent)}
/* matrice : cellules colorées */
.matT td a{text-decoration:none}
.matT .cellO{display:block;border-radius:var(--ray-1);padding:12px 14px;border:1.5px solid;transition:all var(--t1) var(--e)}
.matT .cellO:hover{transform:translateY(-2px)}
.matT .cellO b{display:block;font-weight:700;font-size:15px}
.matT .cellO span{display:block;font-size:13px;opacity:.8;margin-top:3px}
.matT .vide{color:var(--filet2);text-align:center;font-size:18px}
.matT th:first-child,.matT td:first-child{background:var(--sable);font-weight:700;color:var(--encre)}
/* ce qui fait varier : plus / moins */
.varT td:last-child{font-weight:600}
.varT .plusV{color:#B4423B}
.varT .moinsV{color:#1B7A4B}
.varT .egalV{color:var(--encre3)}
.varT .egalV i{background:var(--sable);color:var(--encre3)}
.varT .pcV{display:inline-flex;align-items:center;gap:7px}
.varT .pcV i{width:26px;height:26px;border-radius:var(--ray-1);display:grid;place-items:center;font-size:13px;font-weight:800;flex-shrink:0}
.varT .plusV i{background:#FBEDEC;color:#B4423B}
.varT .moinsV i{background:#E9F5EE;color:#1B7A4B}
table{border-collapse:collapse;width:100%;font-size:14px;min-width:580px}
th,td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--filet);vertical-align:top;color:var(--encre2)}
th{background:var(--sable);font-weight:700;font-size:13px;color:var(--encre)}
tbody tr:last-child td{border-bottom:0}
tbody tr{transition:background var(--t1)}
tbody tr:hover{background:var(--l-w)}
td.n,th.n{text-align:right}

td b{color:var(--encre)}

/* ---------- notes ---------- */
.note{border-left:4px solid var(--l);background:var(--l-w);padding:17px 22px;border-radius:0 var(--r-f) var(--r-f) 0;
  margin:22px 0;font-size:15px;color:var(--encre2)}
.note.g{border-left-color:#00A86B;background:var(--go-wash);color:var(--go)}
.note.r{border-left-color:var(--stop);background:var(--stop-wash)}
.note p{margin:0;max-width:none}.note p+p{margin-top:9px}
.tag{display:inline-block;font-size:12px;font-weight:700;padding:4px 11px;border-radius:100px;
  background:var(--l-w);color:var(--l-t);border:1px solid var(--l)}
.tag-n{background:var(--sable);color:var(--encre2);border-color:var(--filet2)}

/* ---------- formulaires ---------- */
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.two{grid-template-columns:1fr}}
.choices{display:grid;gap:10px}
.choice{border:1.6px solid var(--filet2);border-radius:var(--r-f);padding:18px 21px;cursor:pointer;
  display:flex;gap:16px;align-items:center;background:var(--blanc);position:relative;
  transition:border-color var(--t1),transform var(--t1) var(--e),background var(--t1)}
.choice:hover{border-color:var(--encre3);transform:translateX(3px)}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice:has(input:checked){border-color:var(--l);background:var(--l-w);border-width:2px;padding:17px 20px}
.choice:has(input:focus-visible){outline:3px solid var(--encre);outline-offset:3px}
.choice .g{flex:1}
.choice .t{font-weight:600;font-size:16px;color:var(--encre);line-height:1.3;display:block}
.choice .d{font-size:14px;color:var(--encre3);margin-top:6px;line-height:1.45;display:block}
.choice .p{font-weight:800;white-space:nowrap;font-size:15px;color:var(--encre)}
.choice .p.gain{color:var(--go)}
.pills{display:flex;flex-wrap:wrap;gap:9px}
.pill{position:relative}
.pill input{position:absolute;opacity:0;width:0;height:0}
.pill span{display:inline-block;border:1.6px solid var(--filet2);border-radius:100px;padding:9px 17px;
  font-size:15px;cursor:pointer;background:var(--blanc);user-select:none;transition:all var(--t1) var(--e)}
.pill input:checked+span{border-color:var(--l);background:var(--l-w);color:var(--l-t);font-weight:700}
.pill input:focus-visible+span{outline:3px solid var(--encre);outline-offset:3px}

/* ---------- simulateur ---------- */

.room{border:1px solid var(--filet);border-radius:var(--r-f);margin-bottom:11px;overflow:hidden;background:var(--blanc)}
.room>h4{margin:0;padding:11px 17px;background:var(--sable);font-size:13px;font-weight:700;color:var(--encre2);
  border-bottom:1px solid var(--filet)}
.item:last-child{border:0}
.cnt{display:flex;align-items:center;gap:9px}
.cnt button{font:inherit;width:32px;height:32px;border-radius:100px;border:1.6px solid var(--filet2);
  background:var(--blanc);color:var(--encre);cursor:pointer;font-weight:800;line-height:1;
  transition:all var(--t1) var(--e)}
.cnt button:hover{border-color:var(--l);color:var(--l-t);transform:scale(1.1)}
.cnt span{min-width:22px;text-align:center;font-weight:800;color:var(--encre)}
.cnt.zero span{color:var(--encre3);font-weight:500}
.avertPark{margin-top:12px;border:2px solid #E0A100;background:#FFF6D6;color:#3A332D;border-radius:var(--r-f,var(--ray-2));padding:14px 16px;font-size:14px;line-height:1.55}
.avertPark .apT{font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:13px;color:#8A5A00;margin-bottom:6px}
.avertPark p{margin:6px 0 0}
/* ---------- V2 (2026-11-06) : éléments du parcours ---------- */
/* l'attribut hidden l'emporte toujours (certaines classes comme .field le contredisaient) */
[hidden]{display:none!important}
/* les cartes de méthode remplacent la numérotation 1-2-3 des blocs d'affaires */
.bloc3 .b3n{display:none}
/* focus programmatique sur le titre d'étape : pas de cadre, la lecture d'écran suffit */
.qhead h2[tabindex="-1"]:focus{outline:none}
.quand{margin-top:22px;padding-top:18px;border-top:1px solid var(--filet)}
.quandT,.accTete{font-weight:700;font-size:15px;color:var(--encre);margin:0 0 10px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.accTete{margin-top:18px}
.step[data-s="4"] .accTete:first-of-type{margin-top:0}
#accArr{margin-top:22px;padding-top:18px;border-top:1px solid var(--filet)}
.memeAcc{margin:0 0 4px}
#arrChamps{margin-top:14px}
/* Distance calculée : bien visible (2026-11-07) */
.kmAuto{display:flex;align-items:center;gap:14px;margin:6px 0 0;padding:12px 16px;
  background:var(--l-w);border:1.5px solid var(--l);border-radius:var(--ray-2);color:var(--encre)}
.kmAuto[hidden]{display:none}
.kmIc{flex:0 0 auto;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;
  background:var(--blanc);color:var(--l-t)}
.kmIc svg{width:22px;height:22px}
.kmTx{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.kmL{font-size:13px;font-weight:600;color:var(--encre2)}
.kmV{font-size:20px;font-weight:800;letter-spacing:-.01em;color:var(--encre)}
.kmS{font-size:13px;color:var(--encre2)}
/* distance calculée : sur toute la largeur, les deux adresses se partagent la ligne */
.traj .kmAuto{grid-column:1/-1;margin:0}
.traj:has(#blocKm[hidden]){grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media(max-width:560px){.traj:has(#blocKm[hidden]){grid-template-columns:1fr}}
.cptNote{margin:14px 0 0;padding:12px 14px;border-radius:var(--ray-1);background:var(--l-w);color:var(--encre2);font-size:14px}
.methodeQ{margin-bottom:16px}
.detTarif{margin-top:10px}.detTarif summary,.persoOptsD summary{cursor:pointer;font-weight:600}
.detTarif summary{color:var(--l-t);font-size:14px}
.persoOptsD summary{list-style:revert}
.lourdsD summary{cursor:pointer;font-weight:600;color:var(--l-t);margin-top:6px}
.lourdsG{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin-top:10px}
.confiance{margin:10px 0 14px;font-size:14px;color:var(--encre2)}
.detTarif[open] .lines2{margin-top:10px}
.etM{margin-left:auto;border:0;background:none;padding:0 2px;font:inherit;font-size:13px;color:var(--l-t,var(--l));text-decoration:underline;cursor:pointer}
.etL .etM{grid-column:2;justify-self:start;margin:2px 0 0}
/* cahier des charges 6.4 : boutons Retour / Continuer toujours accessibles sur mobile */
@media(max-width:760px){
  html .simnav{position:sticky;bottom:0;z-index:30;background:var(--sable,#FFF6EF);margin-top:20px;
    padding:10px 0 calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--filet);flex-wrap:nowrap}
  html .simnav #next{min-width:0;flex:1;order:2;white-space:nowrap}
  html[data-route="/estimer"] .haut{display:none}  /* la barre fixe suffit ; il chevauchait le résumé */
  html .simnav #prev{order:1}
  html .simnav #prev[style*="hidden"]{display:none}
  html .simnav .sp{display:none}
  html .simnav #reset{display:none}
  html .simnav #prev{padding-left:18px;padding-right:18px}
  .lourdsG{grid-template-columns:1fr}
  /* cahier des charges 6.4 : résumé « Votre projet » repliable, pas de colonne sous le formulaire */
  /* accès : deux colonnes sur téléphone pour raccourcir l'écran */
  html .acc3{grid-template-columns:1fr;gap:10px}  /* une colonne : libellés entiers, aide de l'accès difficile sur sa ligne */
  html .acc3 .accInfo,html .acc3 .trot,html .acc3 .field:has(select){grid-column:1/-1}
  html .acc3 .bascule .bl{font-size:13px}
  html .suivi:not(.ouvert) .suiviB{display:none}
  html .suiviH::after{content:"Afficher";margin-left:auto;font-size:13px;font-weight:600;text-decoration:underline}
  html .suivi.ouvert .suiviH::after{content:"Masquer"}
  /* pages plus courtes : pas d'avis sous le calculateur sur téléphone */
  html[data-route="/estimer"] .avisC-w{display:none}
}
.suiviH{display:flex;align-items:center;width:100%;border:0;font-family:inherit;color:inherit;text-align:left;cursor:default}
@media(max-width:760px){html .suiviH{cursor:pointer}}
.cptZone{margin-top:16px;padding:14px 16px;border:1px solid var(--filet2);border-radius:var(--r-f,var(--ray-2));background:var(--blanc,var(--blanc))}
.cptL{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 0}
.cptT{font-weight:600}
.cptZone .help{margin:6px 0 0}

.est{border-radius:var(--r-s);overflow:hidden;border:2px solid var(--encre);margin-bottom:22px;background:var(--blanc)}
.est .hd{background:var(--l);color:var(--l-on);padding:32px;position:relative;overflow:hidden}
.est .hd .l{font-size:14px;opacity:.85}
.est .hd .v{font-family:var(--disp);font-size:clamp(2.7rem,9vw,3.8rem);font-weight:800;letter-spacing:-.054em;
  line-height:1;margin:8px 0 5px;font-variant-numeric:tabular-nums}
.est .hd .w{font-size:15px;opacity:.9}
/* Carte de prix (2026-11-07) : le montant à gauche, ce qu'il comprend à droite */
.est .hd{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:center}
@media(min-width:640px){.est .hd:has(.estInc){grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:28px}}
.estInc{background:color-mix(in srgb,var(--l-on) 9%,transparent);border:1px solid color-mix(in srgb,var(--l-on) 22%,transparent);
  border-radius:var(--ray-2);padding:14px 16px}
.estIncT{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.85;margin:0 0 10px}
/* la couleur suit celle de la carte (blanc ou encre selon la ligne), pas celle des listes du calculateur */
.est .hd .estInc,.est .hd .estInc ul,.est .hd .estInc li,.est .hd .estInc p{color:var(--l-on)}
.est .hd::after{z-index:0}.est .hd > *{z-index:1}
.estInc ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.estInc li{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600;line-height:1.3}
.estIco{flex:0 0 auto;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  background:color-mix(in srgb,var(--l-on) 14%,transparent)}
.estIco svg{width:17px;height:17px}
@media(max-width:639px){.estInc{padding:12px 14px}.estIncT{margin-bottom:8px}.estInc ul{gap:5px}.estInc li{font-size:14px}
  .estIco{width:26px;height:26px}.estIco svg{width:15px;height:15px}}
.est .lines2{padding:18px 32px}
.est .lines2>div{display:flex;justify-content:space-between;gap:18px;font-size:15px;padding:10px 0;
  border-bottom:1px solid var(--filet);color:var(--encre2)}
.est .lines2>div:last-child{border:0;font-weight:800;padding-top:14px;color:var(--encre);font-size:16px}
.est .lines2 span{color:var(--encre3)}

.est .foot{padding:16px 32px;border-top:1px solid var(--filet);font-size:13px;color:var(--encre3)}
.alt{border:1.5px solid var(--filet);border-radius:var(--r-f);padding:16px 20px;margin-bottom:10px;
  display:flex;gap:16px;align-items:center;font-size:15px;cursor:pointer;background:var(--blanc);
  transition:transform var(--t1) var(--e),border-color var(--t1)}
.alt:hover{transform:translateX(4px);border-color:var(--l)}
.alt .g{flex:1}.alt .t{font-weight:600;color:var(--encre);line-height:1.3}
.alt .d{font-size:14px;color:var(--encre3);margin-top:5px;line-height:1.4}
.alt .p{font-weight:800;white-space:nowrap;text-align:right;color:var(--encre)}

/* ---------- offres ---------- */
.offer{border:1.5px solid var(--filet);border-radius:var(--r-c);background:var(--blanc);padding:28px;
  display:flex;flex-direction:column;transition:transform var(--t2) var(--e),border-color var(--t2)}
.offer:hover{transform:translateY(-5px);border-color:var(--l)}
.offer .nm{font-family:var(--disp);font-size:1.55rem;font-weight:800;letter-spacing:-.036em;line-height:1.06}
.offer .meta{font-size:14px;color:var(--encre3);margin-top:8px;line-height:1.45}
.offer .price{font-family:var(--disp);font-size:2.6rem;font-weight:800;letter-spacing:-.052em;line-height:1;
  margin:18px 0 3px;color:var(--l-t)}
.offer .per{font-size:13px;color:var(--encre3)}
.offer .lines{list-style:none;padding:0;margin:20px 0 0;font-size:14px;flex:1}
.offer .lines li{padding:9px 0;border-top:1px solid var(--filet);display:flex;justify-content:space-between;gap:10px;margin:0;color:var(--encre2)}
.offer .lines li span{color:var(--encre3)}
.offer .acts{margin-top:22px;display:flex;gap:10px}

/* ---------- accordéon ---------- */
details{border:1px solid var(--filet);border-radius:var(--r-f);margin-bottom:10px;background:var(--blanc);overflow:hidden}
details[open]{border-color:var(--l)}
details summary{padding:18px 22px;cursor:pointer;font-weight:700;font-size:16px;list-style:none;
  color:var(--encre);display:flex;align-items:center;gap:14px}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"";margin-left:auto;width:11px;height:11px;flex-shrink:0;
  border-right:2.5px solid var(--l);border-bottom:2.5px solid var(--l);
  transform:rotate(45deg) translate(-2px,-2px);transition:transform var(--t2) var(--e)}
details[open] summary::after{transform:rotate(-135deg) translate(-3px,-3px)}
details .in{padding:0 22px 20px;font-size:16px;color:var(--encre2)}
details .in p{margin:0 0 11px}details .in p:last-child{margin:0}

/* ---------- témoignages ---------- */
.avisG{display:grid;grid-template-columns:repeat(auto-fit,minmax(288px,1fr));gap:20px}
.tmo{background:var(--blanc);border:1px solid var(--filet);border-radius:var(--r-c);padding:26px;
  display:flex;flex-direction:column;gap:14px;transition:transform var(--t2) var(--e),border-color var(--t2)}
.tmo:hover{transform:translateY(-4px);border-color:var(--l)}
.tmo .st{display:flex;gap:2px}.tmo .st svg{width:15px;height:15px;fill:#F07A16}
.tmo q{font-size:16px;line-height:1.55;color:var(--encre);quotes:"«\00a0" "\00a0»";flex:1}
.tmo .who{display:flex;align-items:center;gap:12px;padding-top:14px;border-top:1px solid var(--filet)}
.tmo .av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:800;
  font-size:16px;color:var(--blanc);flex-shrink:0;font-family:var(--disp)}
.tmo .nm{font-weight:700;font-size:15px;color:var(--encre);line-height:1.25}
.tmo .dt{font-size:13px;color:var(--encre3);margin-top:3px}

/* ---------- blog ---------- */
.post{border-bottom:1px solid var(--filet);padding:22px 0;display:flex;gap:20px;align-items:baseline;
  text-decoration:none;color:var(--encre);transition:padding-left var(--t2) var(--e)}
.post:hover{padding-left:12px}
.post .t{font-family:var(--disp);font-weight:800;font-size:1.13rem;line-height:1.28;letter-spacing:-.02em;flex:1;transition:color var(--t1)}
.post:hover .t{color:var(--l-t)}
.post .m{font-size:13px;color:var(--encre3);white-space:nowrap}

/* ---------- chiffres ---------- */
.kfig{font-family:var(--disp);font-size:clamp(2.3rem,5.4vw,3.6rem);font-weight:800;letter-spacing:-.052em;
  line-height:1;color:var(--l)}
.klab{font-size:14px;color:var(--encre3);margin-top:10px;max-width:22ch;line-height:1.45}
.nuit .klab{color:#A2958B}

/* ---------- bandeau défilant ---------- */

/* ---------- vidéo ---------- */
.video{position:relative;border-radius:var(--r-s);overflow:hidden;background:var(--nuit)}
.video img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;opacity:.66}
.video .play{position:absolute;inset:0;display:grid;place-items:center;text-decoration:none}
.video .pb{width:84px;height:84px;border-radius:50%;background:var(--l);display:grid;place-items:center;
  transition:transform var(--t2) var(--e)}
.video .pb::after{content:"";width:0;height:0;border-left:23px solid var(--l-on);
  border-top:14px solid transparent;border-bottom:14px solid transparent;margin-left:7px}
.video .play:hover .pb{transform:scale(1.1)}
.video .lb{position:absolute;left:26px;bottom:24px;color:var(--blanc);font-family:var(--disp);font-weight:800;font-size:16px}

/* ---------- pied ---------- */
footer{background:var(--nuit);color:#C8BCB2;padding:80px 0 34px;position:relative;overflow:hidden}
.fbig{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px;align-items:start}
@media(max-width:1040px){.fbig{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}}
@media(max-width:760px){.fbig{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.fbig > :first-child{grid-column:1/-1}}
@media(max-width:560px){.fbig{grid-template-columns:1fr;gap:0}}
.flogo{height:28px;width:auto;display:block;margin-bottom:16px}
.fstores{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px;padding-top:20px;
  border-top:1px solid rgba(255,255,255,.12);align-items:stretch}
.fstores a{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  border:1px solid rgba(255,255,255,.22);border-radius:var(--ray-1);padding:11px 12px;font-size:13px;
  color:#C8BCB2;white-space:nowrap;transition:all var(--t1) var(--e)}
.fstores a:hover{border-color:var(--l);color:var(--blanc);transform:translateY(-2px)}
.fstores svg{width:17px;height:17px;flex-shrink:0}
footer h5{font-size:13px;font-weight:700;color:var(--blanc);margin:0 0 14px}
footer ul{list-style:none;padding:0;margin:0;font-size:15px}
footer li{margin-bottom:9px}
footer a{color:#C8BCB2;text-decoration:none;transition:color var(--t1)}
footer a:hover{color:var(--l)}
footer p{color:#8F8279;font-size:14px;max-width:32ch;margin:0 0 18px}
.fligne{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px}
.fligne i{width:34px;height:5px;border-radius:100px;display:block}
.fbot{border-top:1px solid rgba(255,255,255,.12);margin-top:44px;padding-top:22px;font-size:13px;
  color:#8F8279;display:flex;gap:18px;flex-wrap:wrap;align-items:center;justify-content:space-between}
/* Colonnes de liens en <details> : toujours ouvertes au-delà de 560 px (2026-11-07) */
/* (sélecteurs préfixés de footer : ils doivent l'emporter sur le style général des <details>) */
footer details.fcol{border:0;border-radius:0;margin:0;background:none;overflow:visible}
footer .fcol > summary{list-style:none;display:block;padding:0;font-size:inherit;color:inherit}
footer .fcol > summary::-webkit-details-marker{display:none}
footer .fcol > summary::after{content:none}
footer .fcol > summary h5{margin:0 0 14px}
@media(min-width:561px){footer .fcol > summary{pointer-events:none;cursor:default}}
.flegal{display:flex;flex-wrap:wrap;gap:6px 16px}
.flegal a{color:#C8BCB2}
/* Téléphone : pied de page compact, colonnes en accordéon */
@media(max-width:560px){
  footer{padding:44px 0 24px}
  footer p{margin:0 0 14px}
  .fligne{display:none}
  /* le bouton d'estimation est déjà dans la barre fixe du bas sur téléphone */
  .fbig > :first-child > .btn{display:none}
  .fbig > :first-child{padding-bottom:22px}
  .fstores{margin-top:16px;padding-top:16px}
  footer details.fcol{border-top:1px solid rgba(255,255,255,.12)}
  footer details.fcol:last-child{border-bottom:1px solid rgba(255,255,255,.12)}
  footer .fcol > summary{display:flex;align-items:center;justify-content:space-between;min-height:52px;cursor:pointer}
  footer .fcol > summary h5{margin:0;font-size:15px}
  footer .fcol > summary::after{content:"";width:9px;height:9px;margin:0 4px 0 auto;border-right:2px solid #C8BCB2;
    border-bottom:2px solid #C8BCB2;transform:rotate(45deg) translateY(-3px);transition:transform var(--t1) var(--e)}
  footer .fcol[open] > summary::after{transform:rotate(-135deg) translateY(-3px)}
  footer .fcol ul{display:grid;grid-template-columns:1fr 1fr;gap:2px 16px;padding:0 0 14px}
  footer .fcol li{margin:0}
  footer .fcol li a{display:flex;align-items:center;min-height:40px}
  .fbot{margin-top:22px;padding-top:0;border-top:0;flex-direction:column;align-items:flex-start;gap:12px}
  .flegal a{min-height:32px;display:inline-flex;align-items:center}
}

.fin{text-align:center;padding:96px 0}
.fin .ok{width:78px;height:78px;border-radius:50%;background:var(--go-wash);color:var(--go);
  display:grid;place-items:center;margin:0 auto 26px;font-size:36px;border:2px solid var(--go);
  animation:pop 500ms var(--e);box-shadow:0 0 0 8px var(--go-wash)}
@keyframes pop{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}
.ref{font-family:var(--disp);font-size:22px;font-weight:800;letter-spacing:.02em;background:var(--blanc);
  border:1px solid var(--filet);border-radius:100px;padding:13px 26px;display:inline-block;margin:20px 0;color:var(--encre)}
.doc .g{flex:1;min-width:150px}
.doc .n{font-weight:600;font-size:15px;color:var(--encre);line-height:1.3}
.doc .s{font-size:13px;color:var(--encre3);margin-top:5px;line-height:1.4}

.filebtn{position:relative;overflow:hidden;display:inline-block}
.filebtn input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.avis{display:inline-flex;align-items:center;gap:11px;color:var(--l-on);background:rgba(255,255,255,.2);
  border:1.5px solid rgba(255,255,255,.34);border-radius:100px;padding:8px 16px 8px 13px;margin-bottom:20px}
.avis .st{display:flex;gap:2px}.avis .st svg{width:15px;height:15px;fill:currentColor}
.avis .tx{font-size:14px;color:var(--l-on);opacity:.92}
.avis .tx b{font-weight:800}
/* Sur un fond de couleur de ligne, le gras garde la couleur du texte (blanc) au lieu de l'encre (2026-11-07) */
.hero strong,.hero b,.avis b,.ligneCard strong,.ligneCard b,.est .hd strong,.est .hd b,
.btn-1 strong,.btn-1 b,.jeton.plein b,.phone .ph-b b{color:inherit}
.eng{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:1px;background:var(--filet);
  border:1px solid var(--filet);border-radius:var(--r-c);overflow:hidden}
.eng > div{background:var(--blanc);padding:24px 22px}
.eng .n{font-family:var(--disp);font-weight:700;font-size:1.08rem;letter-spacing:-.022em;color:var(--encre);margin-bottom:9px}
.eng .x{font-size:14px;color:var(--encre3);line-height:1.5}
.eng .ic svg{width:22px;height:22px;color:var(--l)}
.eng .ic{margin-bottom:12px}
.clics{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--filet);
  border-radius:var(--r-c);overflow:hidden;background:var(--blanc)}
@media(max-width:760px){.clics{grid-template-columns:1fr}}
.clics > div{padding:30px 26px}
.clics > div + div{border-left:1px solid var(--filet)}
@media(max-width:760px){.clics > div + div{border-left:0;border-top:1px solid var(--filet)}}
.clics .no{font-family:var(--disp);font-size:3.2rem;font-weight:800;letter-spacing:-.06em;line-height:1;color:var(--l)}
.clics h3{margin-top:14px}
.clics p{font-size:15px;margin:0;color:var(--encre3)}
.plus{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.plus li{display:flex;gap:13px;align-items:flex-start;font-size:16px;color:var(--encre2);margin:0;line-height:1.5}
.plus li svg{width:20px;height:20px;color:var(--l);flex-shrink:0;margin-top:2px}
.nuit .plus li{color:#C8BCB2}
.icobox{width:52px;height:52px;border-radius:var(--ray-2);display:grid;place-items:center;flex-shrink:0;
  background:var(--l-w);border:1.5px solid var(--l);transition:transform var(--t2) var(--e)}
.icobox svg{width:26px;height:26px;color:var(--l-t)}
.fleet{display:grid;grid-template-columns:repeat(auto-fit,minmax(228px,1fr));gap:18px}
.fleetc{border:1px solid var(--filet);border-radius:var(--r-c);background:var(--blanc);padding:22px;
  text-decoration:none;color:inherit;display:block;transition:transform var(--t2) var(--e),border-color var(--t2)}
.fleetc:hover{transform:translateY(-4px);border-color:var(--l)}
.fleetc .cap2{font-size:13px;color:var(--encre3)}
.fleetc .nm{font-family:var(--disp);font-weight:700;font-size:1.1rem;letter-spacing:-.022em;margin-top:6px}
.fleetc .pr{font-family:var(--disp);font-weight:800;font-size:1.6rem;letter-spacing:-.045em;margin-top:10px;color:var(--l-t)}

/* ============ CALCULATEUR — traitement dédié ============ */

.simtop{position:sticky;top:60px;z-index:40;background:color-mix(in srgb,var(--creme) 94%,transparent);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--filet);padding:14px 0 13px;margin-bottom:34px}
.simtop .in1{display:flex;align-items:center;gap:14px;margin-bottom:11px}
.simtop .etape{font-size:13px;font-weight:600;color:var(--encre3)}
.simtop .prix{margin-left:auto;text-align:right;line-height:1.1}
.simtop .prix b{font-size:24px;font-weight:800;letter-spacing:-.04em;color:var(--encre);display:block;
  font-variant-numeric:tabular-nums}
.simtop .prix small{font-size:12px;color:var(--encre3);font-weight:500}
.simtop .prix.vide b{color:var(--filet2);font-size:20px}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:11px}
.chip{font-size:12px;font-weight:600;padding:4px 11px;border-radius:100px;background:var(--l-w);
  color:var(--l-t);border:1px solid color-mix(in srgb,var(--l) 40%,transparent);white-space:nowrap}

.qhead{margin-bottom:26px}
.qhead .no{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;
  color:var(--l-t);margin-bottom:12px}
.qhead .no i{width:22px;height:22px;border-radius:100px;background:var(--l);color:var(--l-on);
  display:grid;place-items:center;font-size:12px;font-weight:800;font-style:normal}
.qhead h2{font-size:clamp(1.6rem,4.4vw,2.2rem);letter-spacing:-.032em;line-height:1.1;margin:0 0 10px}
.qhead p{font-size:16px;color:var(--encre3);margin:0;max-width:52ch;line-height:1.5}

.step{display:none}
.step.on{display:block}
.step.on{animation:stepIn 180ms var(--e)}
@keyframes stepIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.choice .mark{width:24px;height:24px;border-radius:100px;border:2px solid var(--filet2);flex-shrink:0;
  display:grid;place-items:center;transition:border-color var(--t1),background var(--t1)}
.choice .mark::after{content:"";width:10px;height:10px;border-radius:100px;background:var(--l);
  transform:scale(0);transition:transform var(--t1) var(--e)}
.choice:has(input:checked) .mark{border-color:var(--l)}
.choice:has(input:checked) .mark::after{transform:scale(1)}
.choice input[type=checkbox] ~ .mark{border-radius:var(--ray-1)}
.choice input[type=checkbox] ~ .mark::after{border-radius:3px}

.mentionEst{font-size:12px;color:var(--encre3);margin:9px 0 0;max-width:none;line-height:1.4}

/* inventaire */

.item.actif{background:var(--l-w)}
.item.actif .em{transform:scale(1.08)}

/* estimation */
html.anim-ok .est .lines2 > div{opacity:0;animation:lineIn 420ms var(--e) forwards}
@keyframes lineIn{to{opacity:1}}
.est .lines2 > div:nth-child(1){animation-delay:.10s}
.est .lines2 > div:nth-child(2){animation-delay:.19s}
.est .lines2 > div:nth-child(3){animation-delay:.28s}
.est .lines2 > div:nth-child(4){animation-delay:.37s}
.est .lines2 > div:nth-child(5){animation-delay:.46s}
.est .lines2 > div:nth-child(6){animation-delay:.55s}
.est .hd::after{content:"";position:absolute;right:-70px;top:-90px;width:260px;height:260px;
  border-radius:50%;background:rgba(255,255,255,.1)}
.est .hd > *{position:relative}
.badgeEst{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;
  background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.34);
  border-radius:100px;padding:5px 12px;margin-bottom:14px}
[data-ligne="secours"] .badgeEst,
[data-ligne="manutention"] .badgeEst{background:rgba(18,16,14,.12);border-color:rgba(18,16,14,.22)}

.alt.reco{border-color:var(--l);border-width:2px}
@media(max-width:560px){
  .simtop{top:56px}
  .est .hd{padding:26px 22px}.est .lines2{padding:16px 22px}.est .foot{padding:15px 22px}
  .qhead h2{font-size:1.5rem}
}

/* ==========================================================
   FORMULAIRES — système premium
   Champs hauts, libellés lisibles, états explicites,
   aucune ombre grise : de la lumière et des filets.
   ========================================================== */
.fcard{background:var(--blanc);border:1px solid var(--filet);border-radius:var(--r-c);padding:30px 32px;
  margin-bottom:20px}
.fcard > h3{margin-bottom:6px}
.fcard > .sub{font-size:15px;color:var(--encre3);margin:0 0 24px;line-height:1.5}
.fcard + .fcard{margin-top:20px}
@media(max-width:560px){.fcard{padding:24px 20px;border-radius:var(--r-f)}}

.flegend{display:flex;align-items:center;gap:12px;margin:0 0 20px}
.flegend .n{width:30px;height:30px;border-radius:100px;background:var(--l);color:var(--l-on);
  display:grid;place-items:center;font-size:13px;font-weight:800;flex-shrink:0}
.flegend .t{font-weight:700;font-size:1.06rem;letter-spacing:-.02em;color:var(--encre)}

.field{display:flex;flex-direction:column;gap:0;margin-bottom:20px;position:relative}
.field > label{font-size:14px;font-weight:600;color:var(--encre2);margin-bottom:8px;
  display:flex;align-items:center;gap:8px}
.field > label .opt{font-size:12px;font-weight:600;color:var(--encre3);background:var(--sable);
  border-radius:100px;padding:2px 9px}
.field .help{font-size:13px;color:var(--encre3);margin-top:8px;line-height:1.45}
.field .err{font-size:13px;color:var(--stop);font-weight:600;margin-top:8px;
  display:flex;align-items:center;gap:7px;line-height:1.35}
.field .err:empty{display:none}
.field .err::before{content:"!";width:16px;height:16px;border-radius:100px;background:var(--stop);
  color:var(--blanc);font-size:12px;font-weight:800;display:grid;place-items:center;flex-shrink:0}

input[type=text],input[type=email],input[type=tel],input[type=date],input[type=number],select,textarea{
  font-family:var(--txt);font-size:16px;color:var(--encre);background:var(--blanc);
  border:1.6px solid var(--filet2);border-radius:var(--r-f);padding:0 16px;height:56px;width:100%;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
  transition:border-color var(--t1),box-shadow var(--t2) var(--e),background var(--t1)}
textarea{height:auto;min-height:118px;padding:15px 16px;resize:vertical;line-height:1.55}
input::placeholder,textarea::placeholder{color:#B0A399}
input:hover,select:hover,textarea:hover{border-color:var(--encre3)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--l);
  box-shadow:0 0 0 4px var(--l-w),inset 0 1px 0 rgba(255,255,255,.7)}
input.bad,select.bad,textarea.bad{border-color:var(--stop);background:var(--stop-wash)}
input.bad:focus,select.bad:focus{box-shadow:0 0 0 4px var(--stop-wash)}

select{appearance:none;-webkit-appearance:none;padding-right:44px;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2374675E' stroke-width='2.2' 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 15px center;background-size:19px}
input[type=date]{cursor:pointer}
input[type=number]{-moz-appearance:textfield}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{
  -webkit-appearance:none;margin:0}

/* champ avec pictogramme */
.field.ico-l > .wrapf{position:relative}
.field.ico-l input,.field.ico-l select{padding-left:48px}
.field.ico-l .fi{position:absolute;left:16px;top:50%;transform:translateY(-50%);
  width:20px;height:20px;color:var(--encre3);pointer-events:none;transition:color var(--t1)}
.field.ico-l .fi svg{width:20px;height:20px;display:block}
.field.ico-l:focus-within .fi{color:var(--l)}

/* compteur de caractères / suffixe */

.field.suf input{padding-right:58px}

/* segmenté */
.seg{display:flex;background:var(--sable);border-radius:100px;padding:4px;gap:4px;border:1px solid var(--filet)}
/* petits écrans : les quatre choix passent sur deux lignes au lieu de déborder */
@media(max-width:420px){.seg{flex-wrap:wrap;border-radius:var(--ray-3)}.seg label{flex:1 1 40%}.seg span{padding:10px 6px;font-size:14px}}
.seg label{flex:1;position:relative}
.seg input{position:absolute;opacity:0;width:0;height:0}
.seg span{display:block;text-align:center;padding:11px 8px;border-radius:100px;font-size:15px;
  font-weight:600;color:var(--encre2);cursor:pointer;transition:all var(--t1) var(--e);white-space:nowrap}
.seg input:checked + span{background:var(--blanc);color:var(--l-t);font-weight:700;
  box-shadow:0 1px 3px rgba(18,16,14,.08)}
.seg input:focus-visible + span{outline:3px solid var(--encre);outline-offset:2px}

/* dépôt de document */
.doc{border:1.6px dashed var(--filet2);border-radius:var(--r-f);background:var(--blanc);padding:18px 20px;
  display:flex;align-items:center;gap:16px;margin-bottom:11px;flex-wrap:wrap;
  transition:border-color var(--t1),background var(--t1),transform var(--t1) var(--e)}
.doc:hover{border-color:var(--l);transform:translateY(-1px)}
.doc .di{width:44px;height:44px;border-radius:var(--ray-1);background:var(--sable);display:grid;place-items:center;
  flex-shrink:0;color:var(--encre3);transition:background var(--t1),color var(--t1)}
.doc .di svg{width:21px;height:21px}

.doc.miss{border-color:var(--stop);background:var(--stop-wash)}
.doc.miss .di{color:var(--stop)}

/* pied de formulaire */
.fpied{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:6px}
.fpied .btn{min-width:180px;justify-content:center}
.fpied .note2{font-size:13px;color:var(--encre3);line-height:1.45;flex:1;min-width:200px}

/* panneau du héros : mêmes règles, échelle réduite */
.panneau .field{margin-bottom:12px}
.bf input,.bf select{padding-left:44px;height:56px}
.bf .ic{position:absolute;left:17px;top:28px;transform:translateY(-50%);width:11px;height:11px;
  border-radius:50%;pointer-events:none;z-index:2;box-shadow:0 0 0 3px var(--blanc)}
.bf .lien{position:absolute;left:22px;top:44px;bottom:-4px;width:1.5px;z-index:1;
  background:repeating-linear-gradient(var(--filet2) 0 3px,transparent 3px 7px)}

/* ==========================================================
   REPÉRAGE ET CONVIVIALITÉ
   ========================================================== */
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--encre);color:var(--creme);
  padding:14px 22px;border-radius:0 0 var(--r-f) 0;font-weight:700;font-size:15px;text-decoration:none}
.skip:focus{left:0}

/* fil d'Ariane */
.fil{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--encre3);margin-bottom:18px}
.fil a{color:var(--encre3);text-decoration:none}
.fil a:hover{color:var(--l-t)}
.fil .sep{opacity:.5}
.fil [aria-current]{color:var(--encre);font-weight:600}
.wash .fil a,.wash .fil{color:var(--encre2)}

/* menu déroulant par ligne */
.mega{position:relative}
.mega > button{background:none;border:0;font:inherit;font-size:15px;font-weight:500;color:var(--encre2);
  cursor:pointer;padding:5px 0;display:inline-flex;align-items:center;gap:6px;position:relative}
.mega > button::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;transform:rotate(45deg) translate(-1px,-1px);transition:transform var(--t2) var(--e)}
.mega[data-ouvert] > button{color:var(--encre)}
.mega[data-ouvert] > button::after{transform:rotate(-135deg) translate(-2px,-2px)}
.megapan{position:absolute;top:calc(100% + 14px);left:-24px;background:var(--blanc);border:1px solid var(--filet);
  border-radius:var(--r-c);padding:18px;width:min(680px,90vw);display:none;z-index:95;
  grid-template-columns:1fr 1fr;gap:0;box-shadow:var(--sh-3)}
.mega[data-ouvert] .megapan{display:grid}
.megalien{display:flex;gap:12px;align-items:center;padding:11px 14px;border-radius:var(--r-f);
  text-decoration:none;color:var(--encre);transition:background var(--t1)}
.megalien:hover{background:var(--l-w)}
.megalien i{width:10px;height:10px;border-radius:50%;flex-shrink:0;margin-top:6px}
.megalien > span:last-child{display:block;min-width:0}
.megalien .t{display:block;font-weight:700;font-size:15px;line-height:1.3;color:var(--encre)}
.megalien .d{display:block;font-size:13px;color:var(--encre3);margin-top:3px;line-height:1.35}
@media(max-width:960px){
  .mega > button{width:100%;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--filet)}
  .megapan{position:static;width:auto;border:0;padding:6px 0 14px;box-shadow:none;grid-template-columns:1fr;
    background:transparent;border-radius:0}
  .megalien{padding:11px 0}
}

/* barre d'action mobile */
.barreM{position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;gap:10px;padding:11px 16px
  calc(11px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--creme) 95%,transparent);
  backdrop-filter:blur(8px);border-top:1px solid var(--filet)}
.barreM .btn{flex:1;justify-content:center;padding:14px 18px}
.barreM .btn.tel{flex:0 0 auto;padding:14px 18px}
.barreM .btn{min-width:0;white-space:nowrap}
@media(max-width:360px){.barreM .btn,.barreM .btn.tel{padding:14px 12px;font-size:15px}}
@media(max-width:760px){.barreM{display:flex}body{padding-bottom:78px}}
/* cahier des charges 6.4 : pas de double barre fixe dans le calculateur */
@media(max-width:760px){html[data-route="/estimer"] .barreM{display:none}html[data-route="/estimer"] body{padding-bottom:0}}

/* retour en haut */
.haut{position:fixed;right:20px;bottom:20px;z-index:60;width:46px;height:46px;border-radius:100px;
  background:var(--blanc);border:1.5px solid var(--filet2);color:var(--encre);cursor:pointer;
  display:grid;place-items:center;opacity:0;pointer-events:none;
  transition:opacity var(--t2),transform var(--t2) var(--e),border-color var(--t1)}
.haut.on{opacity:1;pointer-events:auto}
.haut:hover{border-color:var(--l);color:var(--l-t);transform:translateY(-3px)}
.haut::after{content:"";width:11px;height:11px;border-left:2.4px solid currentColor;border-top:2.4px solid currentColor;
  transform:rotate(45deg) translate(2px,2px)}
@media(max-width:760px){.haut{bottom:92px;right:16px}}

/* bloc de liens connexes */
.connexes{border-top:1px solid var(--filet);padding-top:34px;margin-top:56px}
.connexes h4{font-size:13px;color:var(--encre3);margin-bottom:16px}
.connexes .liste{display:flex;flex-wrap:wrap;gap:9px}
.connexes a{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--filet2);border-radius:100px;
  padding:9px 16px;font-size:14px;text-decoration:none;color:var(--encre2);transition:all var(--t1) var(--e)}
.connexes a:hover{border-color:var(--l);color:var(--l-t);transform:translateY(-2px)}
.connexes a i{width:8px;height:8px;border-radius:50%;display:block;flex-shrink:0}

/* comparatif */
.comp{overflow-x:auto;border-radius:var(--r-c);border:1px solid var(--filet);background:var(--blanc);margin:24px 0}
.comp table{min-width:720px}
.comp th{background:transparent;padding:22px 18px;font-size:16px;font-weight:700;color:var(--encre);
  border-bottom:1px solid var(--filet)}
.comp th.moi{background:var(--l-w);color:var(--l-t);border-bottom:3px solid var(--l)}
.comp td{padding:17px 18px;line-height:1.45}
.comp td.moi{background:color-mix(in srgb,var(--l) 6%,transparent);color:var(--encre);font-weight:600}
.comp td:first-child{font-weight:700;color:var(--encre);white-space:nowrap}
.comp .yn{display:inline-flex;align-items:flex-start;gap:9px}
.comp .yn svg{width:17px;height:17px;flex-shrink:0;margin-top:2px}
.comp .ok svg{color:#1B7A4B}.comp .ko svg{color:#B4423B}
.comp tbody tr:hover{background:transparent}

/* zones */
.zones{display:grid;grid-template-columns:repeat(auto-fit,minmax(196px,1fr));gap:14px}

/* ancres de page */
.ancres{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 6px}
.ancres a{font-size:14px;font-weight:600;padding:8px 15px;border-radius:100px;background:var(--blanc);
  border:1.5px solid var(--filet);color:var(--encre2);text-decoration:none;transition:all var(--t1) var(--e)}
.ancres a:hover{border-color:var(--l);color:var(--l-t)}

/* FAQ par thème */
.faqth{margin-bottom:34px}
.faqth > h3{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.faqth > h3 i{width:10px;height:10px;border-radius:50%;background:var(--l);display:block;flex-shrink:0}

/* bloc d'aide */

/* réassurance compacte */
.reass{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:1px;background:var(--filet);
  border:1px solid var(--filet);border-radius:var(--r-c);overflow:hidden;margin:28px 0}
.reass > div{background:var(--blanc);padding:20px;display:flex;gap:12px;align-items:flex-start}
.reass svg{width:20px;height:20px;color:var(--l);flex-shrink:0;margin-top:2px}
.reass .t{font-weight:600;font-size:14px;color:var(--encre);line-height:1.3}
.reass .d{font-size:13px;color:var(--encre3);margin-top:4px;line-height:1.4}

@media print{
  header.nav,.barreM,.haut,.bandeau,footer{display:none!important}
  body{background:var(--blanc);font-size:11pt}
  .card,.tw{break-inside:avoid}
}

/* cartes de cas d'usage, en vectoriel */
.casC{display:block;text-decoration:none;color:var(--encre);border:1px solid var(--filet);
  border-radius:var(--r-c);overflow:hidden;background:var(--blanc);
  transition:transform var(--t2) var(--e),border-color var(--t2)}
.casC:hover{transform:translateY(-5px);border-color:var(--l)}
.casSc{display:block;position:relative;overflow:hidden;aspect-ratio:16/10;background:var(--sable)}
.casSc img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 900ms var(--e)}
.casC:hover .casSc img{transform:scale(1.05)}
.casSc .jeton{position:absolute;top:14px;left:14px;z-index:2}
.casBd{display:block;padding:20px 22px 22px}
.casT{display:block;font-weight:800;font-size:1.12rem;letter-spacing:-.025em;line-height:1.25}
.casD{display:block;font-size:14px;color:var(--encre3);margin-top:7px;line-height:1.5}
.casP{display:flex;align-items:center;gap:7px;font-weight:700;font-size:15px;color:var(--l-t);margin-top:14px}

/* ---------- APPLICATION ---------- */
.appSec{position:relative;overflow:hidden;isolation:isolate}
.appGrid{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
@media(max-width:960px){.appGrid{grid-template-columns:1fr;gap:32px}}
.stores{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.store{display:inline-flex;align-items:center;gap:12px;background:var(--encre);color:var(--creme);
  border-radius:var(--ray-2);padding:11px 20px;text-decoration:none;border:1.5px solid var(--encre);
  transition:transform var(--t2) var(--e),background var(--t2)}
.store:hover{transform:translateY(-3px);background:#2A241F}
.store svg{width:26px;height:26px;flex-shrink:0}
.store .sT{display:block;font-size:12px;opacity:.72;line-height:1.2;letter-spacing:.03em}
.store .sN{display:block;font-size:15px;font-weight:700;line-height:1.25;letter-spacing:-.02em}
.rythme4 .store{background:var(--blanc);color:var(--profond);border-color:var(--blanc)}
.rythme4 .store:hover{background:var(--profond-2)}
.rythme4 .store .sT{opacity:.7}
/* téléphone dessiné */
.phone{width:min(260px,72%);margin:0 auto;border-radius:34px;border:9px solid var(--encre);
  background:var(--blanc);overflow:hidden;position:relative;box-shadow:var(--sh-3)}
.rythme4 .phone{border-color:#2A1004;box-shadow:var(--sh-3)}
.phone .ph-st{background:var(--encre);color:var(--blanc);font-size:12px;padding:5px 16px 7px;display:flex;justify-content:space-between}
.phone .ph-bd{padding:16px 15px 20px}
.phone .ph-h{font-weight:800;font-size:15px;letter-spacing:-.025em;color:var(--encre);line-height:1.2}
.phone .ph-s{font-size:12px;color:var(--encre3);margin:4px 0 13px}
.phone .ph-f{border:1.5px solid var(--filet2);border-radius:var(--ray-1);padding:10px 12px;font-size:12px;
  color:var(--encre3);margin-bottom:8px;display:flex;align-items:center;gap:9px}
.phone .ph-f i{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.phone .ph-b{background:var(--l);color:var(--l-on);border-radius:100px;padding:11px;text-align:center;
  font-weight:700;font-size:13px;margin-top:4px}
.phone .ph-p{margin-top:14px;padding-top:12px;border-top:1px solid var(--filet);display:flex;
  justify-content:space-between;align-items:baseline}
.phone .ph-p b{font-size:20px;font-weight:800;letter-spacing:-.035em;color:var(--encre)}
.phone .ph-p span{font-size:12px;color:var(--encre3)}
/* lien discret dans le héros */

/* ---------- JALONS DU CALCULATEUR ---------- */
.jalons{display:flex;list-style:none;margin:0;padding:0;gap:0;align-items:center;overflow-x:auto;
  scrollbar-width:none;-ms-overflow-style:none}
.jalons::-webkit-scrollbar{display:none}
.jalons li{display:flex;align-items:center;gap:8px;flex:0 0 auto;padding-right:14px;position:relative}
.jalons li::after{content:"";width:22px;height:2px;background:var(--filet);border-radius:2px;margin-left:6px}
.jalons li:last-child::after{display:none}
.jalons .pj{width:26px;height:26px;border-radius:100px;display:grid;place-items:center;flex-shrink:0;
  font-size:12px;font-weight:800;background:var(--blanc);border:1.5px solid var(--filet2);color:var(--encre3);
  transition:all var(--t2) var(--e)}
.jalons .nj{font-size:13px;font-weight:600;color:var(--encre3);white-space:nowrap;transition:color var(--t2)}
.jalons li.actif .pj{background:var(--l);border-color:var(--l);color:var(--l-on);
  box-shadow:0 0 0 4px var(--l-w)}
.jalons li.actif .nj{color:var(--encre);font-weight:700}
.jalons li.fait .pj{background:var(--l-w);border-color:var(--l);color:var(--l-t)}
.jalons li.fait .nj{color:var(--l-t)}
.jalons li.fait::after{background:var(--l)}
@media(max-width:700px){.jalons .nj{display:none}.jalons li{padding-right:8px}.jalons li::after{width:14px}}

/* ---------- RÉCAPITULATIF MODIFIABLE ---------- */
.recapC{border:1px solid var(--filet);border-radius:var(--r-c);background:var(--blanc);overflow:hidden;margin-bottom:20px}
.recapH{background:var(--sable);padding:14px 20px;font-weight:700;font-size:15px;color:var(--encre);
  border-bottom:1px solid var(--filet)}
.recapL{display:flex;align-items:center;gap:14px;padding:13px 20px;border-bottom:1px solid var(--filet);font-size:15px}
.recapL:last-child{border-bottom:0}
.recapL .rk{width:110px;flex-shrink:0;color:var(--encre3);font-size:13px}
.recapL .rv2{flex:1;color:var(--encre);font-weight:600;min-width:0;word-break:break-word}
.recapL .rm{background:none;border:0;font:inherit;font-size:13px;color:var(--l-t);cursor:pointer;
  text-decoration:underline;text-underline-offset:3px;padding:4px 2px;flex-shrink:0}
.recapL .rm:hover{color:var(--encre)}
.recapL.total{background:var(--l-w);border-top:1.5px solid var(--l)}
.recapL.total .rv2{font-weight:800;font-size:16px;color:var(--l-t)}
@media(max-width:560px){.recapL{flex-wrap:wrap;gap:6px}.recapL .rk{width:100%}.recapL .rv2{width:100%}}

/* ---------- NAVIGATION : le bouton principal ouvre la ligne ---------- */
.simnav{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:32px;padding-top:26px;
  border-top:1px solid var(--filet)}
.simnav #next{order:1;min-width:190px;justify-content:center}
.simnav #prev{order:2}
.simnav .sp{order:3;flex:1}
.simnav #reset{order:4}
@media(max-width:560px){.simnav #next{width:100%}.simnav .sp{display:none}}

.est .hd .apd{font-size:15px;font-weight:700;opacity:.9;margin-top:10px;letter-spacing:.01em}

/* ---------- FORMULAIRE JOGGER ---------- */
.jIntro{background:var(--l-w);border:1.5px solid var(--l);border-radius:var(--r-c);padding:22px 26px;margin-bottom:22px}
.jIntro p{margin:0;font-size:16px;color:var(--encre2)}
.jIntro p strong{color:var(--encre)}

/* liste de contrôle */
.check{display:grid;gap:9px;margin:0 0 20px}
.checkL{display:flex;align-items:center;gap:12px;padding:11px 15px;border:1.5px solid var(--filet);
  border-radius:var(--r-f);background:var(--blanc);font-size:15px;transition:all var(--t1) var(--e)}
.checkL .cp{width:24px;height:24px;border-radius:100px;flex-shrink:0;display:grid;place-items:center;
  border:1.5px solid var(--filet2);color:var(--filet2);font-size:12px;font-weight:800;background:var(--blanc)}
.checkL .cn{flex:1;color:var(--encre2)}
.checkL .cs{font-size:13px;color:var(--encre3);white-space:nowrap}
.checkL.ok{border-color:#1B7A4B;background:var(--go-wash)}
.checkL.ok .cp{background:#1B7A4B;border-color:#1B7A4B;color:var(--blanc)}
.checkL.ok .cn{color:var(--encre);font-weight:600}
.checkL.ok .cs{color:#1B7A4B;font-weight:600}

/* dépôt de fichiers multiples */
.docM{border:1.6px dashed var(--filet2);border-radius:var(--r-f);background:var(--blanc);padding:18px 20px;
  margin-bottom:12px;transition:border-color var(--t1),background var(--t1)}
.docM:hover{border-color:var(--l)}
.docM.ok{border-style:solid;border-color:#1B7A4B;background:var(--go-wash)}
.docM.miss{border-color:var(--stop);background:var(--stop-wash)}
.docM .dh{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap}
.docM .di2{width:42px;height:42px;border-radius:var(--ray-1);background:var(--sable);display:grid;place-items:center;
  flex-shrink:0;color:var(--encre3)}
.docM .di2 svg{width:20px;height:20px}
.docM.ok .di2{background:#1B7A4B;color:var(--blanc)}
.docM .dg{flex:1;min-width:150px}
.docM .dn{font-weight:700;font-size:15px;color:var(--encre);line-height:1.3;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.docM .dd{font-size:13px;color:var(--encre3);margin-top:6px;line-height:1.45}
.docM .dl{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.docM .fich{display:inline-flex;align-items:center;gap:8px;background:var(--blanc);border:1px solid var(--filet2);
  border-radius:100px;padding:6px 8px 6px 13px;font-size:13px;color:var(--encre2);max-width:100%}
.docM .fich span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:150px}
.docM .fich button{background:none;border:0;cursor:pointer;color:var(--encre3);font-size:15px;line-height:1;
  padding:2px 5px;border-radius:100px}
.docM .fich button:hover{color:var(--stop);background:var(--stop-wash)}
.docM .derr{font-size:13px;color:var(--stop);font-weight:600;margin-top:9px}
.docM .derr:empty{display:none}
.vues{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.vues span{font-size:12px;padding:4px 10px;border-radius:100px;background:var(--sable);color:var(--encre3)}
.vues span.faite{background:var(--go-wash);color:#1B7A4B;font-weight:600}

/* équipement */
.equip{display:grid;grid-template-columns:repeat(auto-fit,minmax(142px,1fr));gap:10px;margin-top:8px}
.equipI{display:flex;align-items:center;gap:11px;padding:13px 15px;border:1.5px solid var(--filet2);
  border-radius:var(--r-f);background:var(--blanc);cursor:pointer;font-size:14px;transition:all var(--t1) var(--e)}
.equipI input{position:absolute;opacity:0;width:0;height:0}
.equipI .ei{width:32px;height:32px;border-radius:var(--ray-1);background:var(--sable);display:grid;place-items:center;
  flex-shrink:0;color:var(--encre3);transition:all var(--t1)}
.equipI .ei svg{width:17px;height:17px}
.equipI:hover{border-color:var(--encre3)}
.equipI:has(input:checked){border-color:var(--l);background:var(--l-w);font-weight:600;color:var(--l-t)}
.equipI:has(input:checked) .ei{background:var(--l);color:var(--l-on)}
.equipI:has(input:focus-visible){outline:3px solid var(--encre);outline-offset:2px}

/* bienvenue */
.bienv{text-align:center;padding:40px 24px}
.bienv .bi{width:84px;height:84px;border-radius:100px;background:var(--l-w);border:2px solid var(--l);
  display:grid;place-items:center;margin:0 auto 24px;color:var(--l-t)}
.bienv .bi svg{width:40px;height:40px}
.bienv h2{margin-bottom:12px}
.bienv p{margin:0 auto;max-width:44ch}

/* titres de page, échelle unique */
.h1p{font-size:clamp(2rem,5.6vw,3.3rem)}
.lede0{margin:0}
/* les sections d'en-tête n'ont jamais de fond alterné qui se répète */
section.tete + section.suite{padding-top:var(--sp-s)}

.tcent{text-align:center}
.grilleT td.n .kmi{display:block;font-size:12px;font-weight:600;color:var(--encre3);
  letter-spacing:.02em;margin-top:2px}
.grilleT td.best .kmi{color:var(--l-t);opacity:.8}

/* ---------- régime tarifaire ---------- */
.regime[hidden]{display:none}
.regime{background:var(--blanc);border:1px solid var(--filet);border-radius:var(--r-c);
  padding:20px 22px;margin-bottom:26px}
/* le profil suit désormais les cartes du besoin : il lui faut de l'air au-dessus */
.step .regime{margin-top:24px;margin-bottom:0}
.regT{font-weight:700;font-size:15px;color:var(--encre);margin-bottom:13px}
.regS{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:560px){.regS{grid-template-columns:1fr}}
.regO{position:relative;display:block;text-align:center;border:1.5px solid var(--filet2);
  border-radius:var(--r-f);background:var(--blanc);padding:16px 14px;cursor:pointer;
  transition:all var(--t1) var(--e)}
.regO input{position:absolute;opacity:0;width:0;height:0}
.regO .rt{display:block;font-weight:700;font-size:16px;color:var(--encre);line-height:1.25}

.regO:hover{border-color:var(--encre3)}
.regO:has(input:checked){border-color:var(--l);background:var(--l-w);box-shadow:0 0 0 3px var(--l-w)}
.regO:has(input:checked) .rt{color:var(--l-t)}

.regO:has(input:focus-visible){outline:3px solid var(--encre);outline-offset:2px}
.suiviR{font-size:12px;font-weight:600;color:var(--encre3);margin-top:3px}

.regT em{color:var(--stop);font-style:normal;font-weight:800;margin-left:2px}
.regime .err{display:block;margin-top:10px}
.regime.bad{border-color:var(--stop);background:var(--stop-wash)}

.alerteJ{margin:14px 0 0;padding:13px 15px;border-radius:var(--r-f);background:var(--stop-wash);
  border:1.5px solid var(--stop);color:var(--encre);font-size:13px;line-height:1.5;font-weight:600}
.alerteJ[hidden]{display:none}

/* nombre de Gros Bras dans le choix de portage */
.porteC .gb{display:inline-flex;align-items:center;gap:7px;margin-top:10px;font-size:13px;
  font-weight:700;color:var(--l-t);background:var(--l-w);border-radius:100px;padding:5px 14px}
.porteC .gb i{width:9px;height:9px;border-radius:50%;background:var(--l);display:block;flex-shrink:0}
.porteC .gb i.gb0{background:transparent;border:1.5px solid var(--filet2)}
.porteC:has(input:checked) .gb{background:var(--l);color:var(--l-on)}
.porteC:has(input:checked) .gb i{background:var(--l-on)}
.porteC:has(input:checked) .gb i.gb0{background:transparent;border-color:var(--l-on)}

/* ---------- étape Prestation : trois blocs ---------- */
.bloc3{background:var(--blanc);border:1px solid var(--filet);border-radius:var(--r-c);
  padding:20px 22px;margin-bottom:14px}
.bloc3[hidden]{display:none}
/* quand la liste des affaires est le seul bloc, elle perd son numero */
.bloc3.seul .b3n{display:none}
.bloc3.seul{border:0;background:transparent;padding:0;margin-bottom:0}
.b3h{display:flex;gap:13px;align-items:flex-start;margin-bottom:14px}
.b3n{width:26px;height:26px;border-radius:100px;background:var(--sable);color:var(--encre3);
  display:grid;place-items:center;font-weight:800;font-size:13px;flex-shrink:0;margin-top:1px}
.bloc3:focus-within .b3n{background:var(--l);color:var(--l-on)}
.b3t{display:block;font-weight:700;font-size:16px;color:var(--encre);line-height:1.25}
.b3d{display:block;font-size:13px;color:var(--encre3);margin-top:4px;line-height:1.45}
.b3v{margin-left:auto;font-weight:800;font-size:15px;color:var(--l-t);white-space:nowrap;
  background:var(--l-w);border-radius:100px;padding:5px 13px}
.b3v.off{background:var(--sable);color:var(--encre3)}

/* recherche d'objet */
.rech{position:relative;margin-bottom:12px}
.rech input{width:100%;height:52px;border:1.5px solid var(--filet2);border-radius:var(--r-f);
  background:var(--blanc);padding:0 16px 0 44px;font:inherit;font-size:16px;color:var(--encre);
  box-shadow:inset 0 1px 2px rgba(18,16,14,.05);transition:border-color var(--t1),box-shadow var(--t1)}
.rech::before{content:"";position:absolute;left:16px;top:50%;width:15px;height:15px;
  transform:translateY(-50%) rotate(-45deg);border:2px solid var(--encre3);border-radius:50%;
  border-bottom-color:transparent;pointer-events:none}
.rech input:focus{outline:none;border-color:var(--l);box-shadow:0 0 0 4px var(--l-w)}
.sugg{position:absolute;left:0;right:0;top:calc(100% + 6px);background:var(--blanc);
  border:1px solid var(--filet);border-radius:var(--r-f);z-index:40;overflow:hidden;
  box-shadow:var(--sh-3)}
.sugg[hidden]{display:none}
.sugg .sg{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;
  font:inherit;text-align:left;padding:11px 15px;cursor:pointer;border-bottom:1px solid var(--filet)}
.sugg .sg:last-child{border-bottom:0}
.sugg .sg:hover{background:var(--l-w)}
.sugg .se{font-size:20px;line-height:1;flex-shrink:0}
.sugg .sn{flex:1;font-size:15px;color:var(--encre)}
.sugg .sv{font-size:13px;color:var(--encre3);font-variant-numeric:tabular-nums}
.sugg .vide{padding:13px 15px;font-size:14px;color:var(--encre3)}

/* objets retenus */
.choisis{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.choisis:empty{display:none}
.ch{display:inline-flex;align-items:center;gap:8px;background:var(--l-w);border:1.5px solid var(--l);
  border-radius:100px;padding:5px 7px 5px 12px;font-size:14px}
.ch .che{font-size:15px;line-height:1}
.ch .chn{color:var(--l-t);font-weight:600;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ch b{min-width:16px;text-align:center;font-variant-numeric:tabular-nums;color:var(--encre)}
.ch .chm{width:22px;height:22px;border-radius:100px;border:1.5px solid var(--l);background:var(--blanc);
  color:var(--l-t);font:inherit;font-size:14px;line-height:1;cursor:pointer;display:grid;place-items:center}
.ch .chm:hover{background:var(--l);color:var(--l-on)}

/* champ avec unité */
.wrapf.unite{position:relative;display:block}
.wrapf.unite i{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-style:normal;
  font-size:15px;color:var(--encre3);pointer-events:none}
.wrapf.unite input{padding-right:46px}

.sansListe{margin-top:14px;padding:13px 16px;border-style:dashed}
#blocSans{display:none!important}  /* remplacée par les cartes de méthode */
.sansListe .t{font-size:15px}
.sansListe:has(input:checked){border-style:solid}

/* ---------- INVENTAIRE COMPACT ---------- */
.invTop{margin-bottom:14px}
.ongs{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.ong{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--filet2);
  background:var(--blanc);border-radius:100px;padding:9px 16px;font:inherit;font-size:14px;
  font-weight:600;color:var(--encre2);cursor:pointer;white-space:nowrap;transition:all var(--t1) var(--e)}
.ong:hover{border-color:var(--encre3)}
.ong.on{background:var(--l);border-color:var(--l);color:var(--l-on)}
.ong .oc{display:none;min-width:19px;height:19px;border-radius:100px;background:var(--l);color:var(--l-on);
  font-size:12px;font-weight:800;align-items:center;justify-content:center;padding:0 5px}
.ong.rempli .oc{display:inline-flex}
.ong.on .oc{background:var(--l-on);color:var(--l)}
/* grille d'objets, adaptative */
.room[hidden]{display:none}
.room .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}
.item{display:flex;align-items:center;gap:10px;background:var(--blanc);border:1px solid var(--filet);
  border-radius:var(--ray-1);padding:9px 11px;min-height:0;transition:border-color var(--t1)}
.item:hover{border-color:var(--filet2)}
.item .em{font-size:20px;line-height:1;flex-shrink:0}
.item .g{flex:1;min-width:0;font-size:14px;line-height:1.25;color:var(--encre);
  overflow:hidden;text-overflow:ellipsis}
.item .v{display:block;font-size:12px;color:var(--encre3);margin-top:1px}
.item .cnt{display:flex;align-items:center;gap:4px;flex-shrink:0}
.item .cnt button{width:26px;height:26px;border-radius:var(--ray-1);border:1.5px solid var(--filet2);
  background:var(--blanc);color:var(--encre2);font:inherit;font-size:14px;line-height:1;cursor:pointer;
  display:grid;place-items:center;transition:all var(--t1)}
.item .cnt button:hover{border-color:var(--l);color:var(--l-t)}
.item .cnt b{min-width:18px;text-align:center;font-variant-numeric:tabular-nums;font-size:14px}
.item .cnt.zero b{color:var(--encre3)}
.item:has(.cnt:not(.zero)){border-color:var(--l);background:var(--l-w)}
/* mobile : une colonne, sinon le nom de l'objet est écrasé par le compteur */
@media(max-width:560px){.room .grid{grid-template-columns:1fr}
 .item{padding:8px 9px;gap:7px}.item .g{font-size:13px}.item .cnt button{width:24px;height:24px}}

/* ---------- GRILLES DE REGROUPEMENT ---------- */
/* deux ou trois choix par ligne quand ils sont courts */
.choices.g2{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.choices.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.choices.g2 .choice,.choices.g3 .choice{margin:0}
@media(max-width:760px){.choices.g3{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.choices.g2,.choices.g3{grid-template-columns:1fr}}

/* trajet : les deux adresses côte à côte, la distance plus étroite */
.traj{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 150px;gap:12px;align-items:start}
.traj > *{min-width:0}
gmp-place-autocomplete,.gmpChamp{min-width:0;max-width:100%}
.traj .field{margin:0}
@media(max-width:760px){.traj{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}#blocKm{grid-column:1/-1;max-width:220px}}
@media(max-width:560px){.traj,.traj:has(#blocKm[hidden]){grid-template-columns:minmax(0,1fr)}#blocKm{max-width:none}}

/* accès : étage, portage et ascenseur sur une ligne */
.acc3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;align-items:start}
.acc3 .field{margin:0}
@media(max-width:700px){.acc3{grid-template-columns:1fr 1fr}.acc3 .field:last-child{grid-column:1/-1}}
@media(max-width:420px){.acc3{grid-template-columns:1fr}}

/* deux réglages côte à côte */
.duo2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.duo2 .field{margin:0}
@media(max-width:560px){.duo2{grid-template-columns:1fr}}

/* bascule oui/non, compacte, à la place d'une case pleine largeur */
.bascule{display:flex;align-items:center;gap:10px;height:52px;border:1.5px solid var(--filet2);
  border-radius:var(--r-f);background:var(--blanc);padding:0 14px;cursor:pointer;position:relative;
  transition:all var(--t1) var(--e)}
.bascule input{position:absolute;opacity:0;width:0;height:0}
.bascule .bs{width:40px;height:23px;border-radius:100px;background:var(--filet2);flex-shrink:0;
  position:relative;transition:background var(--t1) var(--e)}
.bascule .bs::after{content:"";position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;
  background:var(--blanc);transition:transform var(--t1) var(--e);box-shadow:0 1px 3px rgba(18,16,14,.3)}
.bascule:has(input:checked){border-color:var(--l);background:var(--l-w)}
.bascule:has(input:checked) .bs{background:var(--l)}
.bascule:has(input:checked) .bs::after{transform:translateX(17px)}
.bascule .bl{font-size:14px;color:var(--encre2);line-height:1.25}
.bascule:has(input:checked) .bl{color:var(--l-t);font-weight:600}
.bascule:has(input:focus-visible){outline:3px solid var(--encre);outline-offset:2px}

.invBas{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:14px;
  padding-top:13px;border-top:1px solid var(--filet)}
.invR{display:flex;align-items:baseline;gap:10px;flex:1;min-width:0}
.invR b{font-size:16px;font-weight:800;color:var(--l-t);white-space:nowrap}
.invR span{font-size:13px;color:var(--encre3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
#closeInv{flex:0 0 auto}
/* téléphone : total sur deux lignes, le bouton ne chevauche plus le texte (2026-11-07) */
@media(max-width:560px){
  .invBas{flex-wrap:nowrap;gap:12px}
  .invR{flex-direction:column;align-items:flex-start;gap:1px}
  .invR span{white-space:normal;line-height:1.35}
}

/* cinq typologies sur une ligne : jetons courts */
.choices.g5{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.choices.g5 .choice{margin:0;flex-direction:column;align-items:flex-start;padding:12px 13px;gap:6px}
.choices.g5 .choice .mark{margin:0}
.choices.g5 .choice .t{font-size:14px}
.choices.g5 .choice .d{font-size:12px;line-height:1.3}
@media(max-width:760px){.choices.g5{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.choices.g5{grid-template-columns:repeat(2,1fr)}}

/* ---------- EN-TÊTE COMPACT DU CALCULATEUR ---------- */
.teteS{background:var(--sable);border-bottom:1px solid var(--filet);padding:18px 0}
.teteL{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.teteL h1{font-size:1.45rem;font-weight:800;letter-spacing:-.03em;margin:0;line-height:1.1;white-space:nowrap}
.teteL .sp{flex:1;min-width:0}
.teteL .etape{font-size:13px;font-weight:700;color:var(--encre3);white-space:nowrap;
  background:var(--blanc);border:1px solid var(--filet);border-radius:100px;padding:6px 14px}
@media(max-width:560px){
 .teteS{padding:14px 0}
 .teteL{gap:9px}
 .teteL h1{font-size:1.2rem;width:100%}
 .teteL .sp{display:none}
 .teteL .etape{margin-left:auto}
}

.teteR{margin:7px 0 0;font-size:13px;line-height:1.45;color:var(--encre3);max-width:78ch}
.teteR strong{color:var(--encre2);font-weight:600}
.teteL .etape .tr{display:inline;color:var(--encre3);font-weight:500;margin-left:7px;
  padding-left:9px;border-left:1px solid var(--filet2)}
@media(max-width:560px){.teteR{font-size:13px}.teteL .etape .tr{display:none}}

/* articles des conditions de vente */
.artC{border-top:1px solid var(--filet);padding-top:20px;margin-top:22px}
.artC h3{display:flex;flex-wrap:wrap;align-items:baseline;gap:11px;font-size:1.05rem;margin:0 0 10px}
.artN{font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--l-t);
  background:var(--l-w);border-radius:100px;padding:4px 11px;white-space:nowrap}
.artC p{font-size:15px;line-height:1.62;color:var(--encre2);margin:0 0 11px}
.artC p:last-child{margin-bottom:0}
.lst{margin:0 0 12px;padding-left:20px;font-size:15px;line-height:1.62;color:var(--encre2)}
.lst li{margin-bottom:7px}

/* message d'erreur d'envoi */
.envErr{display:block;width:100%;margin:0 0 12px;padding:11px 15px;border-radius:var(--ray-1);
  background:var(--stop-wash);border:1px solid var(--stop);color:var(--stop);
  font-size:14px;line-height:1.5;font-weight:600}
.envErr[hidden]{display:none}

/* ---------- fenêtre vidéo ---------- */
.vbox{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:24px}
.vfond{position:absolute;inset:0;background:rgba(18,16,14,.86);backdrop-filter:blur(3px);
  animation:vfade 200ms var(--e)}
.vcadre{position:relative;width:min(1000px,100%);max-height:calc(100vh - 48px);
  border-radius:var(--r-c);overflow:hidden;background:#000;
  box-shadow:var(--sh-3);animation:vmonte 260ms var(--e)}
.vcadre video{display:block;width:100%;max-height:calc(100vh - 48px);background:#000}
.vclose{position:absolute;top:12px;right:12px;z-index:2;width:42px;height:42px;border-radius:100px;
  border:0;background:rgba(18,16,14,.66);color:var(--blanc);font-size:26px;line-height:1;cursor:pointer;
  display:grid;place-items:center;transition:background var(--t1) var(--e)}
.vclose:hover{background:rgba(18,16,14,.9)}
.vclose:focus-visible{outline:3px solid var(--blanc);outline-offset:2px}
@keyframes vfade{from{opacity:0}to{opacity:1}}
@keyframes vmonte{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:560px){.vbox{padding:12px}.vclose{top:8px;right:8px;width:38px;height:38px}}
@media(prefers-reduced-motion:reduce){.vfond,.vcadre{animation:none}}
/* le déclencheur est désormais un bouton */
button.play{border:0;font:inherit;cursor:pointer}

.vabsente{background:var(--blanc);padding:52px 28px;text-align:center;color:var(--encre2)}
.vabsente p{margin:0 0 12px;font-size:16px}
.vabsente p:last-child{margin:0}
.vabsente a{color:var(--l);font-weight:700}

.b3t .opt{font-style:normal;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--encre3);background:var(--sable);border-radius:100px;padding:3px 9px;margin-left:8px;
  vertical-align:middle}

.note.orga{margin-top:20px;background:var(--l-w);border-color:var(--l)}
.note.orga p{color:var(--l-t)}

/* ---------- objet décrit par le client ---------- */
.sugg .ajoutL{border-top:1px solid var(--filet);background:var(--l-w)}
.sugg .ajoutL .se{color:var(--l);font-weight:800}
.sugg .ajoutL .sn{color:var(--l-t);font-weight:600}
.zoneLibre{background:var(--sable);border:1.5px solid var(--l);border-radius:var(--r-c);
  padding:18px 20px;margin-bottom:12px}
.zoneLibre[hidden]{display:none}
.libT{font-weight:700;font-size:15px;margin-bottom:14px;color:var(--encre)}
.libG{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:10px;margin-bottom:6px}
.libG .field{margin:0}
@media(max-width:700px){.libG{grid-template-columns:1fr 1fr}}
@media(max-width:420px){.libG{grid-template-columns:1fr}}
.ch.libre{border-style:dashed}
.ch.libre .che{color:var(--l-t)}
.ch.libre .chn{max-width:250px}

/* ---------- champs d'adresse Google ---------- */
/* Le composant Google dessine lui-même un cadre noir (1px, coins de 3px) :
   on habille l'élément hôte comme les autres champs, et le champ interne
   n'a plus de bordure à lui (sinon deux cadres s'emboîtent). 2026-11-07 */
gmp-place-autocomplete, .gmpChamp{display:block;width:100%;min-height:56px;box-sizing:border-box;
  border:1.5px solid var(--filet2);border-radius:var(--app-r,var(--ray-2));background:var(--blanc);color:var(--encre);
  color-scheme:light;box-shadow:var(--app-ombre);font-family:var(--txt);font-size:16px;
  transition:border-color var(--t1),box-shadow var(--t2) var(--e)}
gmp-place-autocomplete:hover, .gmpChamp:hover{border-color:var(--encre3);
  box-shadow:0 2px 4px rgba(18,16,14,.06),0 8px 18px rgba(18,16,14,.07)}
gmp-place-autocomplete:focus-within, .gmpChamp:focus-within{border-color:var(--l);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--l) 18%,transparent)}
.gmpChamp::part(input), gmp-place-autocomplete::part(input){
  border:0;outline:none;background:transparent;box-shadow:none;font:inherit;font-size:16px;color:var(--encre)}
/* accueil : la pastille de couleur reste à gauche, devant le champ */
.bf .gmpChamp{padding-left:28px}

/* la distance calculée par Google n'est pas modifiable */
input.auto{background:var(--l-w);border-color:var(--l);font-weight:700;color:var(--l-t);
  cursor:default;caret-color:transparent;-moz-appearance:textfield}
input.auto::-webkit-outer-spin-button,input.auto::-webkit-inner-spin-button{
  -webkit-appearance:none;margin:0}

/* ---------- options avec compteur ---------- */
.field.etg[hidden]{display:none}
.optC{background:var(--blanc);border:1.5px solid var(--filet);border-radius:var(--r-c);
  padding:16px 18px;transition:border-color var(--t1) var(--e),background var(--t1) var(--e)}
.optC.on{border-color:var(--l);background:var(--l-w)}

.optC .cnt{display:inline-flex;align-items:center;gap:4px}
.optC .cnt button{width:34px;height:34px;border-radius:var(--ray-1);border:1.5px solid var(--filet);
  background:var(--sable);font-size:18px;line-height:1;color:var(--encre2);cursor:pointer;
  display:grid;place-items:center;transition:all var(--t1) var(--e)}
.optC .cnt button:hover{border-color:var(--l);color:var(--l);background:var(--blanc)}
.optC .cnt button:focus-visible{outline:2px solid var(--l);outline-offset:2px}
.optC .cnt b{min-width:30px;text-align:center;font-weight:800;font-size:16px;color:var(--encre)}

.acc3 .note.trot{grid-column:1/-1;margin:0}

.blocPark{background:var(--blanc);border:1.5px solid var(--filet);border-radius:var(--r-c);
  padding:18px 20px;margin-top:14px}
.blocPark .b3t{font-weight:700;font-size:15px;color:var(--encre)}
.blocPark .b3d{font-size:14px;color:var(--encre3);margin-top:4px}
/* stationnement au départ, puis à l'arrivée (2026-11-07) */
.parkLieu{margin-top:16px}
.parkLieu[hidden]{display:none}
.parkLieu + .parkLieu{padding-top:16px;border-top:1px solid var(--filet)}
.parkT{font-weight:700;font-size:15px;color:var(--encre);margin:0 0 10px;display:flex;align-items:center;gap:12px}
.parkLieu .choices{margin:0}
#parkArrChoix{margin-top:10px}
#parkArrChoix[hidden]{display:none}
.b3t .req{font-style:normal;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--l);background:var(--l-w);border-radius:100px;padding:3px 9px;margin-left:8px;vertical-align:middle}

/* ---------- escale ---------- */
.escC{margin-top:14px}
.escBloc{background:var(--sable);border:1.5px solid var(--l);border-radius:var(--r-c);
  padding:16px 18px;margin-top:10px}
.escBloc[hidden]{display:none}
/* minmax(0,…) et min-width:0 : sans eux, le champ d'adresse Google et les
   listes imposent leur largeur et débordent du cadre sur mobile (2026-11-07) */
.escG{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);gap:10px}
.escG > *{min-width:0}
.escG .field{margin:0}
.escG input,.escG select,.escG textarea,.escG gmp-place-autocomplete,.escG .wrapf{width:100%;max-width:100%;box-sizing:border-box}
.escG .f2{grid-column:span 1}
.escG .f4{grid-column:1/-1}
.escG label{font-size:13px;margin-bottom:5px}
.escG input,.escG select{height:46px}
.escG textarea{width:100%;border:1.5px solid var(--filet2);border-radius:var(--r-f);
  padding:10px 14px;font:inherit;font-size:15px;background:var(--blanc);resize:vertical;
  color:var(--encre);line-height:1.5;min-height:56px}
.escG textarea:focus{outline:none;border-color:var(--l);box-shadow:0 0 0 4px var(--l-w)}
@media(max-width:760px){.escG{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.escG .f2{grid-column:1/-1}}
@media(max-width:420px){.escG{grid-template-columns:minmax(0,1fr)}.escBloc{padding:14px 12px}}

/* ---------- confirmation de changement de formule ---------- */
.cbox{position:fixed;inset:0;z-index:210;display:grid;place-items:center;padding:20px}
.cfond{position:absolute;inset:0;background:rgba(18,16,14,.6);backdrop-filter:blur(2px)}
.ccadre{position:relative;background:var(--blanc);border-radius:var(--r-c);padding:28px;
  width:min(440px,100%);box-shadow:var(--sh-3);
  animation:cmonte 220ms var(--e)}
.ccadre h3{margin:0 0 10px;font-size:1.15rem;font-weight:800;letter-spacing:-.01em;color:var(--encre)}
.ccadre p{margin:0 0 22px;font-size:15px;line-height:1.6;color:var(--encre2)}
.crow{display:flex;gap:10px;flex-wrap:wrap}
.crow .btn,.crow .btn-3{flex:1;justify-content:center;min-width:130px}
@keyframes cmonte{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.ccadre{animation:none}}
@media(max-width:420px){.crow{flex-direction:column}.crow .btn,.crow .btn-3{width:100%}}

/* ---------- conseils avant réservation ---------- */
.conseils{background:var(--l-w);border:1.5px solid var(--l);border-radius:var(--r-c);
  padding:18px 20px;margin-top:24px}
.csT{display:flex;align-items:center;gap:10px;font-weight:800;font-size:15px;
  color:var(--l-t);margin-bottom:12px}
.csI{flex:0 0 auto;width:24px;height:24px;border-radius:100px;background:var(--l);color:var(--blanc);
  display:grid;place-items:center;font-size:15px;font-weight:800;line-height:1}
.conseils ul{margin:0;padding-left:20px}
.conseils li{font-size:15px;line-height:1.6;color:var(--encre2);margin-bottom:8px}
.conseils li:last-child{margin-bottom:0}
@media(max-width:560px){.conseils{padding:16px}}

.conseils.suiviC{margin-top:16px;padding:14px 16px}
.conseils.suiviC .csT{font-size:14px;margin-bottom:9px}
.conseils.suiviC .csI{width:20px;height:20px;font-size:13px}
.conseils.suiviC li{font-size:13px;line-height:1.55;margin-bottom:7px}
.conseils.suiviC ul{padding-left:17px}

/* ---------- choix pas encore ouvert ---------- */

.sDevis{background:var(--l-w);border-left:3px solid var(--l);border-radius:0 var(--ray-1) var(--ray-1) 0;
  padding:11px 14px;margin:12px 0 0;font-size:13px;line-height:1.55;color:var(--l-t)}
.sDevis[hidden]{display:none}
.sDevis strong{font-weight:800}

/* champs conservés pour leur valeur, jamais affichés */
.horsVue{display:none!important}

/* ---------- audit : consentement, accès, notes du récapitulatif ---------- */
.choice.consent{margin-top:18px;align-items:flex-start}
.choice.consent .t{font-weight:600;font-size:15px;line-height:1.5}
.choice.consent a{color:var(--l-t);text-decoration:underline;text-underline-offset:2px}
.acc3 .accInfo{grid-column:1/-1}
.note.recapN{margin-top:14px}
.note.recapN p+p{margin-top:6px}
/* ---------- avis clients, pages de conversion ---------- */
.avisC{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
.avisC .tmo{margin:0}
.avisC-w{margin-top:34px}
.avisC-w h3{margin:0}
@media(max-width:960px){.avisC{grid-template-columns:1fr}}

/* ---------- personnalisation de la proposition ---------- */
.persoZone{margin-top:8px}
.persoB{margin-top:16px}
.persoT{font-weight:800;font-size:15px;color:var(--encre);margin-bottom:10px}

.persoZone .choice{align-items:flex-start}

/* ---------- bloc « Votre prestation » ---------- */
.persoCards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.persoCard{text-align:left;background:var(--blanc);border:1.5px solid var(--filet);border-radius:var(--r-c);
  padding:14px 16px;cursor:pointer;display:flex;flex-direction:column;gap:3px;font:inherit;
  transition:border-color var(--t1) var(--e),background var(--t1) var(--e)}
.persoCard:hover:not(:disabled){border-color:var(--l)}
.persoCard.on{border-color:var(--l);background:var(--l-w)}
.persoCard.ko{opacity:.5;cursor:not-allowed}
.pcT{font-weight:800;font-size:15px;color:var(--encre)}
.pcD{font-size:13px;color:var(--encre3)}
.pcP{font-weight:800;font-size:15px;color:var(--l-t);margin-top:4px}

#persoBras{display:inline-flex;align-items:center;gap:6px}
#persoBras .pas{width:38px;height:38px;border-radius:var(--ray-1);border:1.5px solid var(--filet);background:var(--sable);
  font-size:18px;line-height:1;color:var(--encre2);cursor:pointer}
#persoBras .pas:hover{border-color:var(--l);color:var(--l);background:var(--blanc)}
#persoBras b{min-width:34px;text-align:center;font-weight:800;font-size:16px}
.aideC{margin-top:12px}
.aideC[hidden],.persoB[hidden],.persoNote[hidden]{display:none}
.persoNote{font-size:13px;margin:10px 0 0}
@media(max-width:560px){.persoCards{grid-template-columns:1fr}}

/* ---------- progression du parcours ---------- */
.etapesL{display:block}
.etL{display:grid;grid-template-columns:22px 1fr;gap:0 10px;padding:7px 0;border:0;align-items:start}
.etL .etP{width:20px;height:20px;border-radius:100px;border:1.5px solid var(--filet2);display:grid;
  place-items:center;font-size:12px;font-weight:800;color:var(--encre3);background:var(--blanc);margin-top:2px}
.etL .etT{font-size:14px;font-weight:600;color:var(--encre3)}
.etL .etD{grid-column:2;font-size:13px;color:var(--encre3);opacity:.85}
.etL.fait .etP{background:var(--l);border-color:var(--l);color:var(--blanc)}
.etL.fait .etT{color:var(--encre2)}
.etL.encours .etP{border-color:var(--l);color:var(--l)}
.etL.encours .etT{color:var(--encre);font-weight:800}
.etL.afaire .etP{opacity:.6}

/* ---------- la main-d'œuvre ---------- */
.moList{display:flex;flex-direction:column;gap:10px}
.moCarte{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;width:100%;text-align:left;
  background:var(--blanc);border:1.5px solid var(--filet);border-radius:var(--r-c);padding:16px 18px;
  font:inherit;cursor:pointer;transition:border-color var(--t1) var(--e),background var(--t1) var(--e)}
.moCarte:hover{border-color:var(--l)}
.moCarte.on{border-color:var(--l);background:var(--l-w)}
.moTxt{display:flex;flex-direction:column;gap:4px}
.moT{font-weight:800;font-size:15px;color:var(--encre)}
.moD{font-size:13px;color:var(--encre3);line-height:1.5}
.moPx{flex:0 0 auto;text-align:right;font-weight:800;font-size:15px;color:var(--l-t);white-space:nowrap}
.moPx .persoReco{display:block;margin:6px 0 0}
.moDet{margin-top:12px;padding:14px 16px;border:1.5px dashed var(--filet2);border-radius:var(--r-c);background:var(--sable)}
.moDet[hidden]{display:none}
.moLigne{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.moL{font-weight:700;font-size:15px;color:var(--encre)}
.moAide{font-size:13px;margin:10px 0 0}
@media(max-width:560px){.moCarte{flex-direction:column;gap:10px}.moPx{text-align:left}.moPx .persoReco{display:inline-block;margin:0 0 0 8px}}

/* ---------- avis cliquables ---------- */
a.tmo{display:block;text-decoration:none;color:inherit;position:relative;
  transition:border-color var(--t1) var(--e),transform var(--t1) var(--e),box-shadow var(--t1) var(--e)}
a.tmo:hover{border-color:var(--l);transform:translateY(-2px);box-shadow:0 10px 26px -14px rgba(18,16,14,.3)}
a.tmo:focus-visible{outline:2px solid var(--l);outline-offset:3px}
a.tmo .who{display:flex;align-items:center;gap:12px}
.tmoLien{margin-left:auto;font-size:13px;font-weight:700;color:var(--l-t);white-space:nowrap;opacity:0;
  transition:opacity var(--t1) var(--e)}
a.tmo:hover .tmoLien,a.tmo:focus-visible .tmoLien{opacity:1}
@media(max-width:560px){.tmoLien{opacity:1}}

/* ============================================================
   COUCHE « APPLICATION » (2026-11-06)
   Composants de formulaire façon application mobile : cibles
   tactiles de 48 px et plus, retour au toucher, champs à 16 px
   (pas de zoom automatique sur iPhone), cartes arrondies,
   interrupteurs et compteurs « natifs ». La coque du calculateur
   (en-tête, progression, barre du bas) est limitée à /estimer.
   DA conservée : crème, terracotta / orange, Inter.
   ============================================================ */
:root{
  --app-r:var(--ray-2); --app-r-l:var(--ray-3);
  --app-presse:.975;
}
html{-webkit-tap-highlight-color:transparent}
body{text-rendering:optimizeLegibility}
button,.btn,.choice,.regO,.bascule,.cnt button,.persoCard,.moCarte,summary{touch-action:manipulation}

/* ---------- Boutons : retour au toucher, focus net ---------- */
.btn:active{transform:scale(var(--app-presse));filter:brightness(.97)}
.btn:disabled,.btn[disabled]{opacity:.55;cursor:not-allowed;box-shadow:none;transform:none}

/* ---------- Champs ---------- */
.field > label{font-size:14px;font-weight:600;color:var(--encre);letter-spacing:-.005em}
input[type=text],input[type=email],input[type=tel],input[type=date],input[type=number],select,textarea{
  font-size:16px;border-radius:var(--app-r);border-width:1.5px;background-color:var(--blanc);box-shadow:var(--app-ombre)}
input:focus,select:focus,textarea:focus{border-color:var(--l);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--l) 18%,transparent)}
input::placeholder,textarea::placeholder{color:#9C8E83}
input[type=file]{font:inherit;font-size:15px;width:100%;padding:12px;border:1.5px dashed var(--filet2);
  border-radius:var(--app-r);background:var(--blanc);color:var(--encre2);cursor:pointer}
input[type=file]::file-selector-button{font:inherit;font-weight:700;font-size:14px;border:0;border-radius:var(--ray-1);
  padding:10px 16px;margin-right:12px;background:var(--l-w);color:var(--l-t);cursor:pointer}
.field .help{font-size:13px;line-height:1.45}

/* ---------- Cartes de choix (radio / case) ---------- */
.choice{border-radius:var(--app-r);border-width:1.5px;border-color:var(--filet);box-shadow:var(--app-ombre);
  padding:16px 18px;min-height:64px;gap:14px}
.choice:has(input:checked){border-width:2px;padding:15px 17px;box-shadow:var(--app-ombre-on)}
.choice:active{transform:scale(.985)}
.choice .t{font-size:16px;font-weight:700;letter-spacing:-.01em}
.choice .d{font-size:14px;margin-top:4px}
.choice .mark{width:24px;height:24px;border-width:2px}
.choice:has(input:checked) .mark{background:var(--l);border-color:var(--l)}
.choice:has(input:checked) .mark::after{background:var(--blanc);width:9px;height:9px}
.choice input[type=checkbox]:checked ~ .mark::after{width:12px;height:7px;border-radius:0;background:none;
  border-left:2.5px solid var(--blanc);border-bottom:2.5px solid var(--blanc);transform:translateY(-2px) rotate(-45deg)}
@media (hover:none){.choice:hover{transform:none;border-color:var(--filet)}
  .choice:has(input:checked):hover{border-color:var(--l)}}

/* ---------- Particulier / Professionnel : contrôle segmenté ---------- */
.regS{background:var(--sable);border-radius:calc(var(--app-r) + 4px);padding:4px;gap:4px}
.regO{border:0;border-radius:var(--app-r);background:transparent;min-height:48px;display:flex;
  align-items:center;justify-content:center;transition:background var(--t1),box-shadow var(--t1)}
.regO:hover{background:color-mix(in srgb,var(--blanc) 55%,transparent)}
.regO:has(input:checked){background:var(--blanc);box-shadow:var(--app-ombre-on)}
.regO:has(input:checked) .rt{color:var(--encre)}
@media(max-width:560px){.regS{grid-template-columns:1fr 1fr}}

/* ---------- Interrupteurs ---------- */
.bascule{border-radius:var(--app-r);border-color:var(--filet);box-shadow:var(--app-ombre);min-height:52px;height:auto;padding:10px 14px}
.bascule .bs{width:46px;height:28px}
.bascule .bs::after{width:22px;height:22px;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.bascule:has(input:checked) .bs::after{transform:translateX(18px)}

/* ---------- Compteurs − n + ---------- */
.cnt{gap:12px}
.cnt button{width:40px;height:40px;border:0;background:var(--l-w);color:var(--l-t);font-size:20px;font-weight:700;
  display:inline-grid;place-items:center;line-height:1}
.cnt button:hover{transform:none;background:color-mix(in srgb,var(--l) 18%,var(--blanc))}
.cnt button:active{transform:scale(.92)}
.cnt span,.cnt b{font-size:18px;min-width:26px}
.cptT{font-size:15px;line-height:1.3;font-weight:600}
.cptZone .help{font-size:13px;color:var(--encre3);line-height:1.45}
.cptL{padding:8px 0}
.item .cnt button{width:34px;height:34px;border:0;border-radius:var(--ray-1);background:var(--l-w);color:var(--l-t)}
.item{border-radius:var(--ray-2);border-color:var(--filet);box-shadow:var(--app-ombre);min-height:56px}

/* ---------- Blocs et cartes ---------- */
.bloc3,.cptZone,.blocPark,.fcard,.dureeBox,.conseils,.persoB,.recapC{border-radius:var(--app-r-l)}
.fcard{box-shadow:var(--app-ombre)}
.cptZone{border-color:var(--filet);box-shadow:var(--app-ombre)}
.persoCard,.moCarte{border-radius:var(--app-r);box-shadow:var(--app-ombre)}
.persoCard:active,.moCarte:active{transform:scale(.985)}
.avertPark{border-radius:var(--app-r)}
.chip{font-size:12px;padding:5px 12px}

/* ============================================================
   COQUE DU CALCULATEUR (/estimer)
   ============================================================ */
html[data-route="/estimer"] .teteS{position:relative}
.progApp{height:5px;border-radius:100px;background:color-mix(in srgb,var(--encre) 9%,transparent);
  overflow:hidden;margin-top:12px}
.progApp i{display:block;height:100%;width:0;border-radius:inherit;background:var(--l);
  transition:width var(--t2) var(--e)}
html[data-route="/estimer"] .qhead .no{font-size:13px}
html[data-route="/estimer"] .qhead h2{letter-spacing:-.035em}
html[data-route="/estimer"] .simnav .btn{border-radius:var(--app-r);min-height:54px;justify-content:center;font-size:16px}
html[data-route="/estimer"] .simnav #prev{background:var(--blanc);border:1.5px solid var(--filet);box-shadow:var(--app-ombre)}
html[data-route="/estimer"] .est{border-radius:var(--ray-3);border-width:1.5px;box-shadow:var(--app-ombre-on)}

@media(max-width:760px){
  /* en-tête compact, façon barre d'application */
  html[data-route="/estimer"] .teteS{padding:12px 0 14px}
  html[data-route="/estimer"] .teteL h1{font-size:1.1rem;width:auto}
  html[data-route="/estimer"] .teteL .jeton{padding:6px 12px;font-size:13px}
  html[data-route="/estimer"] .teteL .etape{display:none}  /* la barre de progression et l'en-tête d'étape suffisent */
  html[data-route="/estimer"] .teteR{display:none}
  html[data-route="/estimer"] .suite{padding-top:20px}
  /* titres d'étape à la taille d'une application */
  html[data-route="/estimer"] .qhead{margin-bottom:18px}
  html[data-route="/estimer"] .qhead h2{font-size:1.6rem;line-height:1.12;margin-bottom:6px}
  html[data-route="/estimer"] .qhead p{font-size:15px}
  html[data-route="/estimer"] .chips{margin:0 0 12px}
  /* barre du bas translucide */
  html[data-route="/estimer"] .simnav{background:color-mix(in srgb,var(--creme) 86%,transparent);
    -webkit-backdrop-filter:saturate(1.4) blur(8px);backdrop-filter:saturate(1.4) blur(8px);
    box-shadow:0 -8px 24px rgba(18,16,14,.06);border-top:1px solid color-mix(in srgb,var(--filet) 70%,transparent);
    margin-left:-20px;margin-right:-20px;padding:10px 20px calc(10px + env(safe-area-inset-bottom))}
  html[data-route="/estimer"] .simnav .btn{min-height:52px}
  /* cartes et blocs : marges intérieures régulières */
  html[data-route="/estimer"] .bloc3,html[data-route="/estimer"] .fcard,html[data-route="/estimer"] .blocPark,
  html[data-route="/estimer"] .persoB,html[data-route="/estimer"] .dureeBox{padding:18px 16px}
  html[data-route="/estimer"] .choices{gap:10px}
  html[data-route="/estimer"] .est .hd{padding:24px 20px}
  html[data-route="/estimer"] .est .lines2,html[data-route="/estimer"] .est .foot{padding-left:20px;padding-right:20px}
}

/* carte d'estimation : détail du tarif et note de confiance alignés sur la carte */
.est .detTarif{margin:14px 20px 0;border-radius:var(--ray-2);box-shadow:none}
.est .detTarif summary{padding:13px 16px;font-size:15px}
.est .detTarif .lines2{padding:0 16px 8px}
.est .confiance{margin:12px 20px 14px}
/* accordéons des services : même style que les autres cartes */
.persoOptsD{border-color:var(--filet);box-shadow:var(--app-ombre)}
.persoOptsD summary{padding:16px 18px}
.lourdsD{border:0;background:none;margin:0}
.lourdsD summary{padding:10px 0}

/* accès difficile : l'aide à droite de l'interrupteur, sur la même ligne */
.accDif{grid-column:1/-1}
.accDifL{display:flex;align-items:center;gap:12px}
.accDifL .bascule{flex:0 0 auto}
.accDifL .help{margin:0;flex:1;min-width:0}
html .acc3 .accDif{grid-column:1/-1}
.photosF{margin-top:18px}

/* ============================================================
   CALENDRIER ET HEURE (2026-11-07) — dessinés aux couleurs Jojo
   ============================================================ */
.dpW,.hpW{position:relative;display:block}
.dpW .dpAff,.hpW .hpAff{padding-left:48px;cursor:pointer}
.dpW .dpAff{caret-color:transparent}
.dpW.ouvert .dpAff,.hpW.ouvert .hpAff{border-color:var(--l);box-shadow:0 0 0 4px color-mix(in srgb,var(--l) 16%,transparent)}
.dpIc{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:22px;height:22px;color:var(--l-t);
  display:grid;place-items:center;cursor:pointer;z-index:1}
.dpIc svg{width:20px;height:20px}
.hpW.maj .hpAff{padding-right:128px}
.hpBadge{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;gap:5px;
  font-size:12px;font-weight:700;padding:5px 10px;border-radius:100px;background:var(--l-w);color:var(--l-t);
  border:1px solid color-mix(in srgb,var(--l) 30%,transparent);pointer-events:none;white-space:nowrap}
.hpBadge svg{width:13px;height:13px}
#majInfo.maj{color:var(--l-t);font-weight:600}
.jPop{position:absolute;z-index:1200;width:330px;max-width:calc(100vw - 24px);background:var(--blanc);
  border:1px solid var(--filet);border-radius:var(--ray-3);padding:14px;font-family:var(--txt);color:var(--encre);
  box-shadow:var(--sh-3);animation:jPopIn .16s var(--e)}
@keyframes jPopIn{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
.jPopH{display:flex;align-items:center;justify-content:space-between;margin:0 0 6px;font-weight:700;font-size:14px;color:var(--encre2)}
.jPopX{width:34px;height:34px;border:0;border-radius:var(--ray-1);background:var(--sable);color:var(--encre);display:grid;place-items:center;cursor:pointer}
.jPopX svg{width:16px;height:16px}
.dpTete{display:flex;align-items:center;justify-content:space-between;margin:4px 0 10px}
.dpMois{font-weight:800;font-size:16px;letter-spacing:-.01em;text-transform:capitalize}
.dpNav{width:38px;height:38px;border-radius:var(--ray-1);border:1.5px solid var(--filet);background:var(--blanc);color:var(--encre);
  display:grid;place-items:center;cursor:pointer;box-shadow:var(--app-ombre)}
.dpNav:hover:not(:disabled){border-color:var(--l);color:var(--l-t)}
.dpNav:disabled{opacity:.35;cursor:default;box-shadow:none}
.dpNav svg{width:18px;height:18px}
.dpGrille{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.dpJ{font-size:12px;font-weight:700;color:var(--encre3);text-align:center;padding:2px 0 6px;text-transform:uppercase;letter-spacing:.03em}
.dpD{aspect-ratio:1;min-height:38px;padding:0;border:0;border-radius:var(--ray-1);background:transparent;font:600 15px/1 var(--txt);
  color:var(--encre);cursor:pointer;transition:background var(--t1),color var(--t1),transform var(--t1)}
.dpD.we{color:var(--encre2)}
.dpD:hover:not(:disabled){background:var(--l-w);color:var(--l-t)}
.dpD:active:not(:disabled){transform:scale(.92)}
.dpD.auj{box-shadow:inset 0 0 0 1.5px var(--l);font-weight:800}
.dpD.on{background:var(--l-t);color:var(--blanc);box-shadow:0 4px 12px color-mix(in srgb,var(--l) 35%,transparent)}
.dpD:disabled{color:#CFC2B7;cursor:default}
.dpD:focus-visible,.hpC:focus-visible,.dpNav:focus-visible,.dpRac:focus-visible{outline:2px solid var(--encre);outline-offset:1px}
.dpPied{display:flex;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--filet)}
.dpRac{flex:1;min-height:42px;border-radius:100px;border:1.5px solid var(--filet);background:var(--blanc);font:600 14px var(--txt);
  color:var(--encre);cursor:pointer;box-shadow:var(--app-ombre)}
.dpRac:hover{border-color:var(--l);color:var(--l-t)}
.hpT{display:flex;justify-content:space-between;align-items:center;margin:6px 2px 8px;font-size:12px;font-weight:700;
  color:var(--encre3);text-transform:uppercase;letter-spacing:.04em}
.hpLeg{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--l-t)}
.hpLeg i{width:8px;height:8px;border-radius:50%;background:var(--l)}
.hpG{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.hpG.hpM{grid-template-columns:repeat(4,1fr)}
.hpC{position:relative;min-height:40px;padding:6px 0;border-radius:var(--ray-1);border:1.5px solid var(--filet);background:var(--blanc);
  font:600 14px/1.1 var(--txt);color:var(--encre);cursor:pointer;transition:border-color var(--t1),background var(--t1)}
.hpC:hover:not(:disabled){border-color:var(--l);color:var(--l-t)}
.hpC:disabled{opacity:.4;cursor:default}
.hpC.maj{background:var(--l-w);border-color:color-mix(in srgb,var(--l) 35%,var(--filet))}
.hpC.maj::after{content:"";position:absolute;top:5px;right:5px;width:6px;height:6px;border-radius:50%;background:var(--l)}
.hpC.on{background:var(--l-t);border-color:var(--l-t);color:var(--blanc);box-shadow:0 4px 12px color-mix(in srgb,var(--l) 30%,transparent)}
.hpC.on::after{background:var(--blanc)}
.hpC small{display:block;margin-top:3px;font-size:12px;font-weight:700;color:var(--l-t)}
.hpC.on small{color:var(--blanc)}
.hpInfo{margin:12px 2px 0;font-size:13px;line-height:1.4;color:var(--encre2)}
.hpInfo.maj{color:var(--l-t);font-weight:600}
.jVoile{position:fixed;inset:0;z-index:1150;background:rgba(18,16,14,.38);animation:jFondu .18s ease}
@keyframes jFondu{from{opacity:0}to{opacity:1}}
.jPop.feuille{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;max-width:none;max-height:88vh;overflow:auto;
  border-radius:var(--ray-3) var(--ray-3) 0 0;padding:16px 16px calc(18px + env(safe-area-inset-bottom));animation:jPopUp .22s var(--e)}
.jPop.feuille::before{content:"";display:block;width:42px;height:5px;border-radius:var(--ray-1);background:var(--filet2);margin:0 auto 10px}
.jPop.feuille .dpD{min-height:44px}
.jPop.feuille .hpC{min-height:46px}
@keyframes jPopUp{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
/* accueil : les champs gardent l'allure du module d'estimation */
.bf .dpW,.bf .hpW{flex:1;min-width:0}
.bf .dpIc{display:none}
.bf .hpW.maj .hpAff{padding-right:78px}
.bf .hpBm{display:none}

/* ============================================================
   ICÔNES ET FINITIONS (2026-11-07)
   ============================================================ */
.choice .ico{flex:0 0 auto;width:44px;height:44px;border-radius:var(--ray-2);display:grid;place-items:center;
  background:var(--l-w);color:var(--l-t);transition:background var(--t1),color var(--t1),transform var(--t1) var(--e)}
.choice .ico svg{width:23px;height:23px}
.choice:hover .ico{transform:scale(1.06)}
.choice:has(input:checked) .ico{background:var(--l);color:var(--l-on)}
.tIco{display:inline-grid;place-items:center;width:28px;height:28px;margin-right:9px;border-radius:var(--ray-1);
  background:var(--l-w);color:var(--l-t);vertical-align:middle;flex:0 0 auto}
.tIco svg{width:17px;height:17px}
.persoT,.quandT,.photosT,.blocPark .b3t{display:flex;align-items:center;flex-wrap:wrap}
.persoOptsD summary.persoT{display:flex}
@media(max-width:560px){.choice .ico{width:38px;height:38px;border-radius:var(--ray-1)}.choice .ico svg{width:20px;height:20px}}
/* ombres légères : boutons et champs du formulaire */
:root{--app-ombre:0 1px 2px rgba(18,16,14,.06),0 4px 12px rgba(18,16,14,.05);
  --app-ombre-on:0 3px 8px rgba(18,16,14,.08),0 12px 28px rgba(18,16,14,.08)}
.btn{box-shadow:0 2px 6px rgba(18,16,14,.08);transition:transform var(--t1) var(--e),box-shadow var(--t2) var(--e),background var(--t1),border-color var(--t1),filter var(--t1)}
.btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(18,16,14,.12)}
.btn-1{box-shadow:0 6px 18px color-mix(in srgb,var(--l) 30%,transparent),0 1px 2px rgba(18,16,14,.08)}
.btn-1:hover{box-shadow:0 10px 26px color-mix(in srgb,var(--l) 36%,transparent),0 2px 4px rgba(18,16,14,.08)}
.btn-2{background-color:color-mix(in srgb,var(--blanc) 70%,transparent)}
.nuit .btn-2,.rythme4 .btn-2{background-color:transparent;box-shadow:none}
input[type=text]:hover,input[type=email]:hover,input[type=tel]:hover,input[type=number]:hover,select:hover,textarea:hover{
  box-shadow:0 2px 4px rgba(18,16,14,.06),0 8px 18px rgba(18,16,14,.07)}
.gmpChamp::part(input),gmp-place-autocomplete::part(input){box-shadow:var(--app-ombre)}
.svcAutre{grid-column:1/-1;margin:0}
@media (prefers-reduced-motion:reduce){.btn:hover,.choice:hover .ico,.dpD:active{transform:none}.jPop,.jPop.feuille,.jVoile{animation:none}}

.gmpManuel{display:inline-block;margin:6px 0 0;padding:0;font-size:13px;color:var(--encre2)}
.gmpManuel:hover{color:var(--l-t)}

/* ---------- Proposition : la plus rapide / la moins chère ---------- */
.altRapide{display:flex;align-items:center;gap:14px;width:100%;margin:14px 0 0;padding:14px 16px;text-align:left;
  background:var(--blanc);border:1.5px solid var(--filet);border-radius:var(--app-r);box-shadow:var(--app-ombre);
  cursor:pointer;font:inherit;color:var(--encre)}
.altRapide:hover{border-color:var(--l);box-shadow:var(--app-ombre-on)}
.arIco{flex:0 0 auto;width:40px;height:40px;border-radius:var(--ray-1);background:var(--l-w);color:var(--l-t);display:grid;place-items:center}
.arIco svg{width:20px;height:20px}
.arTx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.arB{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--l-t)}
.altRapide .t{font-weight:700;font-size:15px;line-height:1.3}
.arD{font-size:13px;color:var(--encre2)}
.arP{flex:0 0 auto;text-align:right;display:flex;flex-direction:column;gap:2px}
.arP .pr{font-weight:800;font-size:16px}
.arE{font-size:12px;font-weight:600;color:var(--encre3)}
/* ---------- Récapitulatif : photos ---------- */
.recapPh{display:flex;flex-wrap:wrap;gap:10px}
.rph{display:flex;flex-direction:column;gap:4px;width:88px;font-size:12px;line-height:1.3;color:var(--encre2)}
.rph img{width:88px;height:66px;object-fit:cover;border-radius:var(--ray-1);border:1px solid var(--filet)}

/* ---------- Photos : trois emplacements avec légende ---------- */
.photosT{font-size:14px;font-weight:600;color:var(--encre);margin-bottom:4px}
.photosT .opt{margin-left:8px}
.photosF > .help{display:block;margin:0 0 4px}
.photoL{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) auto;gap:10px;align-items:center;margin-top:10px}
.photoL:not(.plein){grid-template-columns:minmax(0,1fr)}
.photoB{position:relative;display:flex;align-items:center;gap:12px;min-height:58px;padding:8px 14px 8px 8px;margin:0;
  border:1.5px dashed var(--filet2);border-radius:var(--app-r);background:var(--blanc);cursor:pointer;
  font-size:15px;font-weight:600;color:var(--encre2);min-width:0}
.photoB:focus-within{outline:2px solid var(--l);outline-offset:2px}
.photoL.plein .photoB{border-style:solid;border-color:var(--l)}
.photoA{flex:0 0 auto;width:42px;height:42px;border-radius:var(--ray-1);background:var(--l-w) center/cover no-repeat;
  color:var(--l-t);display:grid;place-items:center;font-size:22px;font-weight:700}
.photoN{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.photoI{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.photoLeg{min-width:0}
@media(max-width:560px){.photoL{grid-template-columns:minmax(0,1fr) auto}.photoL .photoLeg{grid-column:1/-1;grid-row:2}}
/* ---------- Proposition : matériel et services ---------- */
.matG{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.matC{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 15px;border:1.5px solid var(--filet);
  border-radius:100px;background:var(--blanc);font-size:15px;font-weight:600;color:var(--encre);cursor:pointer;box-shadow:var(--app-ombre)}
.matC input{width:18px;height:18px;margin:0;accent-color:var(--l)}
.matC:has(input:checked){border-color:var(--l);background:var(--l-w);color:var(--l-t)}
.matNote,.svcNote{margin:0 0 10px}
#persoOpts .choices{margin:0;padding:0 18px 18px}
.svcC{min-height:56px}
.svcSuite{margin:22px auto 0;max-width:46ch;padding:18px 20px;border:1.5px solid var(--l);border-radius:var(--app-r-l);
  background:var(--l-w);text-align:left}
.svcSuite p{margin:0 0 12px}
.svcSuite .svcT{font-weight:700;color:var(--l-t);margin-bottom:6px}
.svcSuite p:last-child{margin-bottom:0}
/* Services en plus hors prix : la mention se voit (2026-11-07) */
.persoOptsD .svcNote{color:var(--encre2);background:var(--l-w);border-radius:var(--ray-1);padding:10px 14px;margin:0 18px 12px}
.persoOptsD .svcNote strong{color:var(--l-t)}
.svcPrecis{grid-column:1/-1;margin:0}
.svcPrecis textarea{width:100%;box-sizing:border-box;border:1.5px solid var(--filet2);border-radius:var(--r-f);
  padding:10px 14px;font:inherit;font-size:15px;background:var(--blanc);resize:vertical;min-height:56px}
.svcPrecis textarea:focus{outline:none;border-color:var(--l);box-shadow:0 0 0 4px var(--l-w)}
.svcHors{display:block;margin-top:4px;font-size:13px;font-weight:600;color:var(--l-t)}

/* ---------- Carte de l'itinéraire (étape Trajet) ---------- */
.carteT{position:relative;margin:16px 0 20px;border-radius:var(--app-r-l);overflow:hidden;
  border:1.5px solid var(--filet);background:#eeeeee;box-shadow:var(--app-ombre)}
.carteF{width:100%;height:270px}
.carteT[data-etat="calcul"] .carteF{opacity:.72;transition:opacity var(--t1)}
.carteV{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:3;margin:0;
  max-width:calc(100% - 24px);width:max-content;padding:9px 15px;border-radius:100px;pointer-events:none;
  background:var(--blanc);color:var(--encre);font-size:14px;font-weight:600;line-height:1.35;
  box-shadow:var(--app-ombre-on);display:flex;align-items:center;gap:9px}
.carteT[data-etat="calcul"] .carteV::before{content:"";flex:0 0 auto;width:14px;height:14px;border-radius:50%;
  border:2.5px solid color-mix(in srgb,var(--l) 22%,transparent);border-top-color:#F4511E;animation:carteTourne .8s linear infinite}
.carteT[data-etat="erreur"] .carteV{border-radius:var(--ray-2);background:#FFF3EE;color:#A63208;
  border:1px solid color-mix(in srgb,var(--l) 35%,transparent)}
@keyframes carteTourne{to{transform:rotate(360deg)}}
.carteL{display:flex;flex-wrap:wrap;gap:8px 18px;padding:10px 14px;background:var(--blanc);
  border-top:1px solid var(--filet);font-size:13px;color:var(--encre2)}
.carteL span{display:inline-flex;align-items:center;gap:7px}
.carteL b{font-weight:600}
.carteL i{font-style:normal;flex:0 0 auto;width:20px;height:20px;border-radius:50%;box-sizing:border-box;
  display:inline-grid;place-items:center;font-size:12px;font-weight:800;color:var(--blanc)}
.carteL .pA{background:#C34118}
.carteL .pB{background:#A63208}
.carteL .pE{background:var(--blanc);color:#C34118;border:2px solid #F4511E}
/* pastilles sur la carte */
.carteP{position:absolute;transform:translate(-50%,-50%);box-sizing:border-box;width:32px;height:32px;border-radius:50%;
  display:grid;place-items:center;font:800 14px/1 "Inter",system-ui,sans-serif;color:var(--blanc);background:var(--l);
  border:3px solid var(--blanc);box-shadow:0 2px 8px rgba(18,16,14,.32);cursor:default;user-select:none}
.carteP-arrivee{background:#A63208}
.carteP-escale{width:28px;height:28px;font-size:13px;background:var(--blanc);color:#C34118;border-color:#F4511E}
@media(max-width:560px){.carteF{height:220px}.carteT{margin-top:14px}}

/* le mouvement se coupe pour qui le demande */
@media (prefers-reduced-motion:reduce){
  .btn:active,.choice:active,.cnt button:active,.persoCard:active,.moCarte:active{transform:none}
  .progApp i{transition:none}
  .carteT[data-etat="calcul"] .carteV::before{animation:none}
}

/* ============================================================
   LOT 1 PREMIUM (2026-11-07) — stabilité et accessibilité
   ============================================================ */
:root{--bord:#958779}            /* bordure de composant : 3,5:1 sur blanc, 3,3:1 sur crème */
/* Stabilité : le contenu est rendu en JS ; on réserve la place et on fixe le logo. */
#app:empty{min-height:100vh}
.logoimg{aspect-ratio:273/65;object-fit:contain}
.flogo{aspect-ratio:300/71;object-fit:contain}
/* Placeholder lisible (5,5:1 au lieu de 3,2:1) */
input::placeholder,textarea::placeholder{color:var(--encre3)}
/* Bordures des champs, des repères de choix et des interrupteurs à 3:1 minimum */
input[type=text],input[type=email],input[type=tel],input[type=date],input[type=number],select,textarea,
gmp-place-autocomplete,.gmpChamp{border-color:var(--bord)}
input[type=text]:hover,input[type=email]:hover,input[type=tel]:hover,input[type=number]:hover,select:hover,textarea:hover,
gmp-place-autocomplete:hover,.gmpChamp:hover{border-color:var(--encre2)}
input:focus,select:focus,textarea:focus{border-color:var(--l-t)}
.choice .mark{border-color:var(--bord)}
.bascule .bs{background:color-mix(in srgb,var(--bord) 55%,var(--blanc))}
.bascule:has(input:checked) .bs{background:var(--l-t)}
/* État choisi : orange foncé de la ligne, lisible même sur les lignes claires */
.choice:has(input:checked){border-color:var(--l-t)}
.choice:has(input:checked) .mark{background:var(--l-t);border-color:var(--l-t)}
.moCarte.on,.persoCard.on,.optC.on{border-color:var(--l-t)}
.matC:has(input:checked){border-color:var(--l-t)}
/* Focus clavier net sur les champs (le halo reste pour la souris) */
input:focus-visible,select:focus-visible,textarea:focus-visible,
gmp-place-autocomplete:focus-within{outline:2px solid var(--encre);outline-offset:2px}
.dpW .dpAff:focus-visible,.hpW .hpAff:focus-visible{outline:2px solid var(--encre);outline-offset:2px}
button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--encre);outline-offset:2px}
#dVal:focus{outline:none}
/* Le champ actif ne passe jamais sous les barres collantes */
html[data-route="/estimer"]{scroll-padding-top:96px;scroll-padding-bottom:110px}
/* Pastilles de la carte : texte blanc à 5:1 */
.carteP{background:#C34118}

/* ============================================================
   LOT 3 PREMIUM (2026-11-07) — mobile façon application
   ============================================================ */
/* Cartes de choix avec icône, sur mobile : texte sur toute la largeur,
   sélection marquée par la bordure ET une coche (pas seulement la couleur).
   La radio reste dans le code, invisible comme avant. */
@media(max-width:560px){
  .choice:has(.ico) .mark{display:none}
  .choice:has(.ico){padding-right:46px}
  .choice:has(.ico):has(input:checked){padding-right:45px}
  .choice:has(.ico):has(input:checked)::after{content:"";position:absolute;top:12px;right:12px;width:24px;height:24px;
    border-radius:50%;background:var(--l-t) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/14px no-repeat}
}
/* Un seul style de bouton − / + partout (inventaire, compteurs, Gros Bras, durée, objets décrits) */
.cnt button,.item .cnt button,.optC .cnt button,#persoBras .pas,.dureeCtl .pas{
  width:40px;height:40px;flex:0 0 40px;padding:0;border:0;border-radius:var(--ray-1);
  background:var(--l-w);color:var(--l-t);font-size:20px;font-weight:700;line-height:1;
  display:inline-grid;place-items:center;cursor:pointer;box-shadow:none;
  transition:background var(--t1),transform var(--t1) var(--e)}
.cnt button:hover,.item .cnt button:hover,#persoBras .pas:hover:not(:disabled),.dureeCtl .pas:hover:not(:disabled){
  background:color-mix(in srgb,var(--l) 20%,var(--blanc));color:var(--l-t);border-color:transparent}
.cnt button:active,.item .cnt button:active,#persoBras .pas:active,.dureeCtl .pas:active{transform:scale(.92)}
#persoBras .pas:disabled,.dureeCtl .pas:disabled{opacity:.4;cursor:not-allowed}
@media (pointer:coarse){.cnt button,.item .cnt button,.optC .cnt button,#persoBras .pas,.dureeCtl .pas{width:44px;height:44px;flex-basis:44px}}
/* La quantité se lit d'un coup d'œil ; zéro reste discret */
.cnt b,#brasVal{font-size:18px;font-weight:800;min-width:28px;text-align:center;color:var(--encre)}
.cnt.zero b{color:var(--encre3);font-weight:600}
/* Progression : sur ordinateur, l'en-tête dit déjà « Étape 2 sur 6 » */
@media(min-width:761px){html[data-route="/estimer"] .step .qhead .no{display:none}}
/* Résumé en puces : une seule ligne qui défile, le titre remonte */
@media(max-width:760px){
  html[data-route="/estimer"] .chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    margin-left:-16px;margin-right:-16px;padding:0 16px 2px}
  html[data-route="/estimer"] .chips::-webkit-scrollbar{display:none}
  html[data-route="/estimer"] .chips > *{flex:0 0 auto}
}
/* Barre du bas : libellé court sur petit écran. Elle reste toujours visible
   (2026-11-07) : la masquer pendant la saisie faisait disparaître « Continuer »
   tant que le champ gardait le focus. */
@media(max-width:420px){.lgTxt{display:none}}
/* Cibles tactiles : 44 px au doigt, sans changer l'aspect */
.recapL .rm,.etM,.ch .chm{position:relative}
.recapL .rm::after,.etM::after{content:"";position:absolute;inset:-10px -8px}
.ch .chm{width:24px;height:24px}
.ch .chm::after{content:"";position:absolute;inset:-10px}
#openInv,#closeInv,.btn-3{min-height:44px}
.jPopX{width:40px;height:40px}
.dpNav{width:40px;height:40px}
@media (pointer:coarse){.jPopX,.dpNav{width:44px;height:44px}.dpRac{min-height:44px}}

/* ============================================================
   LOT 4 PREMIUM (2026-11-07) — écrans du calculateur
   ============================================================ */
/* Champ d'adresse Google : plus de cadre intérieur */
gmp-place-autocomplete::part(input),.gmpChamp::part(input){background:transparent!important;border:0!important;
  box-shadow:none!important;outline:none!important;border-radius:0!important}
/* Coordonnées : carte « Votre demande » repliable */
.recapD > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.recapD > summary::-webkit-details-marker{display:none}
.recapD .rdTxt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.recapD .rdT{font-weight:800;font-size:16px;color:var(--encre)}
.recapD .rdL{font-size:14px;font-weight:600;color:var(--encre2);line-height:1.35}
.recapD .rdM{font-weight:800;font-size:18px;color:var(--l-t);white-space:nowrap}
.recapD .rdV{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--l-t);min-height:44px}
.recapD .rdV svg{width:18px;height:18px;transition:transform var(--t1)}
.recapD .rdV2{display:none}
.recapD[open] .rdV1{display:none}.recapD[open] .rdV2{display:inline}
.recapD[open] .rdV svg{transform:rotate(180deg)}
.recapD:not([open]) > summary{border-bottom:0}
@media(max-width:560px){.recapD .rdV{flex-basis:100%;min-height:32px}}
/* Proposition : sections repliables comme « Services en plus » */
.persoMatD > summary{list-style:none;cursor:pointer;padding:16px 18px;display:flex;align-items:center}
.persoMatD > summary::-webkit-details-marker{display:none}
.persoMatD[open] > summary{padding-bottom:6px}
.persoMatD .matNote,.persoMatD .matG{padding:0 18px}
.persoMatD .matG{padding-bottom:18px}
.persoMatD > summary::after,.persoOptsD > summary::after{content:"";margin-left:auto;width:10px;height:10px;
  border-right:2px solid var(--l-t);border-bottom:2px solid var(--l-t);transform:rotate(45deg);transition:transform var(--t1)}
.persoMatD[open] > summary::after,.persoOptsD[open] > summary::after{transform:rotate(225deg)}
.persoOptsD summary{list-style:none}.persoOptsD summary::-webkit-details-marker{display:none}
/* Inventaire : objets choisis mis en avant, onglets et total qui restent visibles */
.item:has(.cnt:not(.zero)){border-color:var(--l-t);background:var(--l-w)}
.invTop{position:sticky;top:73px;z-index:12;background:var(--creme);padding:8px 0 6px;margin-top:-8px}
.invBas{position:sticky;bottom:0;z-index:12;background:var(--blanc);border:1px solid var(--filet);
  border-radius:var(--ray-2);padding:12px 14px;box-shadow:var(--sh-2)}
@media(max-width:760px){
  .invTop{top:70px}
  html[data-route="/estimer"] .invBas{bottom:84px}
}
/* Accès : « Au départ » et « À l'arrivée » en vrais sous-titres */
.step[data-s="4"] .accTete{font-size:16px;font-weight:800;margin:6px 0 12px}
#accArr .accTete{margin-top:0}
/* Avis Google (ordre aléatoire) : un mot très long élargissait la colonne au-delà de l'écran */
.avisC > *{min-width:0}
.avisC p,.avisC .tmo{overflow-wrap:anywhere}
/* une seule flèche sur la carte « Votre demande » : celle du site */
.recapD .rdV svg{display:none}

/* ============================================================
   LOTS 5 ET 6 PREMIUM (2026-11-07) — mouvement, ordinateur, tablette
   ============================================================ */
@keyframes jPulse{0%{transform:scale(1)}40%{transform:scale(1.16)}100%{transform:scale(1)}}
.pulse{display:inline-block;animation:jPulse .24s var(--e)}
#sPrix.pulse{display:block}
.spin{display:inline-block;width:16px;height:16px;margin-right:10px;border-radius:50%;vertical-align:-3px;
  border:2.5px solid color-mix(in srgb,currentColor 30%,transparent);border-top-color:currentColor;animation:carteTourne .8s linear infinite}
@media (prefers-reduced-motion:reduce){.pulse{animation:none}.spin{animation:none}.step.on{animation:none}}
/* Colonne « Votre projet » : on garde ce qui est fait (avec « Modifier ») et l'étape en cours ;
   les étapes à venir sont déjà dans la barre de progression */
.etL.afaire{display:none}
/* Ordinateur : « Continuer » reste à portée sur les étapes longues */
@media(min-width:761px){
  html[data-route="/estimer"] .simnav{position:sticky;bottom:0;z-index:30;margin-top:24px;padding:14px 0;
    background:color-mix(in srgb,var(--creme) 94%,transparent);border-top:1px solid var(--filet)}
  /* le total de l'inventaire se pose au-dessus de la barre d'actions */
  html[data-route="/estimer"] .invBas{bottom:92px}
}
/* Tablette : le résumé passe en haut, replié comme sur téléphone */
@media(min-width:761px) and (max-width:1040px){
  html[data-route="/estimer"] .simside{order:-1}
  html .suivi:not(.ouvert) .suiviB{display:none}
  html .suiviH{cursor:pointer}
  html .suiviH::after{content:"Afficher";margin-left:auto;font-size:13px;font-weight:600;text-decoration:underline;letter-spacing:0;text-transform:none}
  html .suivi.ouvert .suiviH::after{content:"Masquer"}
}

/* Conseil « une personne de plus » (2026-11-07) : jamais bloquant, bien visible */
.cptConseil{margin:10px 0 0;padding:10px 12px;border-radius:var(--ray-1);background:#FFF6D6;border:1.5px solid #E0A100;
  color:#3A332D;font-size:14px;line-height:1.5}
.cptConseil[hidden]{display:none}
.note.renfortN{background:#FFF6D6;border:1.5px solid #E0A100;color:#3A332D}
.note.renfortN strong{color:#8A5A00}
.renfortA{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 0}