@font-face{font-family:'Inter';font-style:normal;font-weight:400 600;font-display:swap;src:url(/assets/fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 600;font-display:swap;src:url(/assets/fonts/inter-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/poppins-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/poppins-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/poppins-700-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/poppins-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* ---------- Mon EHPAD — feuille de style (inlinée dans la page, aucune requête bloquante) ---------- */
:root{
  /* --- marque : identique dans les deux thèmes --- */
  --bl:#2548FF;--co:#FF6347;--r:1.5rem;--r2:1rem;
  --bl-t:#2548FF;       /* le bleu quand il sert de couleur de TEXTE (aplats : --bl) */
  /* --- surfaces et textes : c'est tout ce que le thème sombre redéfinit --- */
  --pg:#fff;            /* fond de page */
  --surf:#fff;          /* cartes, panneaux, champs */
  --bg:#F8F9FA;         /* surface secondaire */
  --ink:#0f172a;--txt2:#334155;--mut:#475569;--mut2:#64748b;
  --bd:#e2e8f0;--bd2:#f1f5f9;--bd-bl:#dbe3ff;
  /* teintes d'état et couleurs de texte associées */
  --ti-bl:#eef2ff;--ti-bl2:#f6f8ff;--ti-co2:#fff6f4;--bd-co:#ffc9bd;--ti-ve:#e8f6f0;--ti-or:#fdf3e2;--ti-ro:#fdebee;
  --ti-gr:#f1f5f9;--ti-seg:#eef1f5;
  --sur-ve:#0b6b4a;--sur-or:#a35d00;--sur-ro:#a11b30;--sur-bl:#1e3a8a;--sur-co:#b8321a;
  --bd-bl2:#c7d2fe;
  --vert:#0f8a5f;--orange:#e08a00;--rouge:#d1344b;--ve-btn:#0b6b4a;
  --om:15,23,42;        /* base des ombres */
  --om0:0,0,0;
  --carte:grayscale(0%) contrast(100%);   /* filtre appliqué au fond de carte */
  --tb-h:0px;           /* hauteur de la barre de défilement, posée par le script quand elle est là */
  color-scheme:light;
}
/* ================= THÈME SOMBRE =================
   Un seul bloc : on ne redéfinit que des variables. Aucune règle de mise en page
   n'est dupliquée, donc rien ne peut diverger entre les deux thèmes.
   Le bleu et le corail de la marque ne changent pas ; seuls les fonds, les textes
   et les teintes d'état sont réaccordés pour rester lisibles sur fond sombre. */
[data-theme="dark"]{
  --pg:#0d1117;         /* fond de page */
  --surf:#161b25;       /* cartes, panneaux, champs */
  --bg:#1b2230;         /* surface secondaire */
  --ink:#e8edf5;--txt2:#c3ccda;--mut:#a3aec0;--mut2:#8b97ab;
  --bd:#2c3545;--bd2:#232b39;--bd-bl:#2f3d6b;
  /* teintes d'état : mêmes rôles, assombries — le texte associé est éclairci */
  --ti-bl:#1a2340;--ti-bl2:#171f36;--ti-co2:#31201c;--bd-co:#7c4a3c;--ti-ve:#11291f;--ti-or:#2b2113;--ti-ro:#2e1820;
  --ti-gr:#1f2634;--ti-seg:#1f2634;
  --bl-t:#8ba4ff;       /* le bleu de marque n'a que 2,8:1 sur fond sombre — éclairci pour le texte */
  --sur-ve:#5fd3a3;--sur-or:#e8b25c;--sur-ro:#f08a9c;--sur-bl:#9db4ff;--sur-co:#ff9b86;
  --bd-bl2:#39477a;
  /* les trois couleurs de reste à charge : éclaircies pour tenir le contraste */
  --vert:#3fbf8c;--orange:#f0a93a;--rouge:#f2647c;--ve-btn:#16785a;
  --om:0,0,0;--om0:0,0,0;
  --carte:brightness(.78) contrast(1.08) saturate(.85) hue-rotate(175deg) invert(1);
  color-scheme:dark;
}

/* #total-card est un aplat bleu dans les deux thèmes : ce qui s'y pose doit rester clair. */
[data-theme="dark"] #total-card{--surf:#fff;--ink:#0f172a;--mut:#475569;--bd:#e2e8f0;--ti-bl:#eef2ff;--bl-t:#2548FF}

/* Le fond de carte de l'IGN est une image : on ne peut pas le recolorer, on l'inverse. */
[data-theme="dark"] .leaflet-tile-pane{filter:var(--carte)}
[data-theme="dark"] .leaflet-control-zoom a{background:var(--surf);color:var(--ink);border-color:var(--bd)}
[data-theme="dark"] .leaflet-control-attribution{background:rgba(22,27,37,.85);color:var(--mut2)}
[data-theme="dark"] .leaflet-control-attribution a{color:var(--sur-bl)}
[data-theme="dark"] .me-lbl{background:var(--surf);color:var(--ink);border-color:var(--bd)}

/* Champs de formulaire : le navigateur ne suit pas toujours color-scheme sur les selects. */
[data-theme="dark"] input,[data-theme="dark"] select,[data-theme="dark"] textarea{
  background-color:var(--surf);color:var(--ink);border-color:var(--bd)}
[data-theme="dark"] ::placeholder{color:var(--mut2);opacity:1}

/* L'impression reste toujours claire : on n'imprime pas du blanc sur du noir. */
@media print{
  :root,[data-theme="dark"]{
    --pg:#fff;--surf:#fff;--bg:#F8F9FA;--ink:#0f172a;--txt2:#334155;--mut:#475569;--mut2:#64748b;
    --bd:#e2e8f0;--bd2:#f1f5f9;--bd-bl:#dbe3ff;
    --ti-bl:#eef2ff;--ti-bl2:#f6f8ff;--ti-ve:#e8f6f0;--ti-or:#fdf3e2;--ti-ro:#fdebee;
    --ti-gr:#f1f5f9;--ti-seg:#eef1f5;
    --sur-ve:#0b6b4a;--sur-or:#a35d00;--sur-ro:#a11b30;--sur-bl:#1e3a8a;
    --vert:#0f8a5f;--orange:#e08a00;--rouge:#d1344b;--om:15,23,42;--om0:0,0,0;--bl-t:#2548FF;
    color-scheme:light}
  [data-theme="dark"] .leaflet-tile-pane{filter:none}
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{background:var(--pg);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);line-height:1.55;font-size:16px}
img{max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,h4{font-family:Poppins,Inter,sans-serif;font-weight:700;line-height:1.15;letter-spacing:-.02em}
em.bl,em.co{font-style:italic;font-weight:700}
em.bl{color:var(--bl-t)}em.co{color:var(--co)}
.skip{position:absolute;left:-9999px;top:0;background:var(--surf);color:var(--bl-t);padding:.7rem 1rem;border-radius:0 0 .8rem 0;font-weight:600;z-index:3000}
.skip:focus{left:0}
main{display:flex;flex-direction:column;gap:3rem}
@media (max-width:640px){main{gap:2.2rem}}
#layout{--pad:1.25rem;max-width:min(1180px,100%);margin:0 auto;padding:2.5rem var(--pad) 5rem;display:flex;flex-direction:column;gap:3rem;overflow-x:clip}

/* en-tête */
h1{font-size:clamp(1.7rem,5.2vw,3.6rem);text-wrap:balance;letter-spacing:-.012em}
/* les italiques penchent : sans ce recul elles butent sur le mot suivant */
h1 em{margin-right:.09em}
/* la seconde ligne du titre est décalée, comme une reprise de souffle */
.h1-l2{display:inline-block;margin-left:clamp(.5rem,3vw,2.6rem)}
.h1-pro{font-size:clamp(1.5rem,3.9vw,2.6rem)}
.sub{margin-top:1rem;color:var(--mut);font-size:clamp(1rem,1.6vw,1.2rem)}
/* le chapô occupe toute la largeur : deux phrases, deux lignes, sans césure mal placée */
.sub2{font-size:clamp(.95rem,1.35vw,1.08rem)}
/* le titre à gauche, les repères de service à sa droite — ils ne passent dessous que faute de place */
.head-row{display:flex;flex-wrap:wrap;gap:1rem 2rem;justify-content:space-between;align-items:flex-start}
/* sous 34rem le titre passerait à trois lignes : la colonne de repères descend d’elle-même */
.head-row>div:first-child{flex:1 1 34rem;min-width:min(100%,34rem)}
.head-side{flex:0 0 auto;max-width:24rem;display:flex;flex-direction:column;align-items:flex-end;gap:.5rem;font-size:.85rem;color:var(--mut)}
.head-side a{font-weight:500;text-decoration:none}
/* le bouton de thème vit aussi dans l'en-tête statique : accessible sans avoir à défiler */
/* Aligné à droite explicitement : sur l'accueil, le parent .head-side le tirait
   déjà de ce côté, ce qui masquait l'absence de règle ici. Les pages annexes,
   elles, n'ont pas ce parent — le bouton de thème y partait à gauche. */
.head-act{display:flex;align-items:center;justify-content:flex-end;gap:.6rem}
/* Le bouton de thème est le dernier élément de la ligne, donc le plus à droite,
   sur l'accueil comme sur les pages annexes. L'ordre visuel seul change :
   l'ordre de tabulation suit le document, où le bouton vient en premier. */
.head-act .tb-icon{order:2}
.head-act .tb-icon{width:32px;height:32px}
.head-act .tb-icon svg{width:.95rem;height:.95rem}
.head-side a:hover{color:var(--bl-t);text-decoration:underline;text-underline-offset:4px}
.perf{color:var(--mut2);font-size:.75rem}
.nav{margin-top:1.5rem;display:flex;flex-wrap:wrap;gap:.4rem 1.5rem;font-size:.9rem;font-weight:500;color:var(--mut)}
.nav a{text-decoration:none}
.nav a:hover{color:var(--bl-t)}

/* gap:0 — sinon l'espace du flex s'ajoute à celui du texte et « La situation de  votre
   parent » se retrouve avec un trou. Seule la pastille numérotée est écartée. */
/* Un titre sans pastille reste un bloc de texte ordinaire : ni flex ni grille, qui
   feraient de chaque nœud un item séparé et supprimeraient les espaces entre le
   texte nu et les <em> — « Parcourirsans calculer ». */
h2{font-size:clamp(1.5rem,3.4vw,2.25rem);line-height:1.2}
/* Un titre numéroté prend deux colonnes : la pastille, puis TOUT le texte dans une
   seule cellule — ses espaces internes sont donc préservés, et ses lignes suivantes
   s'alignent sur la première au lieu de repartir sous la pastille. */
h2:has(.n){display:grid;grid-template-columns:auto minmax(0,1fr);gap:.7rem;align-items:center}
h2 .t{min-width:0}
/* Pas de décalage en rem : la taille du titre varie avec la largeur (clamp), donc
   une valeur fixe ne peut être juste qu'à une seule largeur. C'est la grille qui
   aligne, et la pastille garde sa taille propre. */
h2 .n{width:2.4rem;height:2.4rem;flex:0 0 auto;border-radius:999px;background:var(--bl);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:1.05rem}
/* Repli pour un navigateur sans :has() — le titre reste lisible, la pastille sur sa ligne. */
@supports not selector(:has(*)){ h2 .n{margin-right:.7rem;vertical-align:-.5rem} }
h3{font-size:1.05rem}
.s-head{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between}
.s-head-r{display:flex;align-items:center;gap:1rem}
.s-int{margin-top:.6rem;color:var(--mut);font-size:.95rem;max-width:80ch}
.s-sub{margin-top:1.6rem;font-weight:600;font-size:.95rem}
.prio-fld{margin-top:2.2rem}
.s-sub span{color:var(--mut2);font-weight:400}
.s-priv{margin-top:1rem;font-size:.8rem;color:var(--mut2)}
.s-foot{margin-top:1.2rem;font-size:.8rem;color:var(--mut)}
.h3b{margin-top:2rem;font-size:1.15rem}

/* bande 1 */
#bande-situation{background:var(--bg);border:1px solid var(--bd2);border-radius:var(--r);padding:1.6rem;box-shadow:0 10px 15px -3px rgba(var(--om0),.05)}
#bande-situation.pro{border-color:rgba(255,99,71,.4)}
.mode-note{margin-top:.8rem;font-size:.9rem;color:var(--mut)}
.grid4{margin-top:1.4rem;display:grid;gap:.9rem;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
/* Chaque critère de recherche occupe sa propre surface : sans elle, les quatre
   champs flottaient dans le même bandeau blanc et rien ne les séparait. */
.grid4 .fld,.grid3 .fld{background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r2);
  padding:.9rem .9rem 1rem;transition:transform .16s ease-out,box-shadow .16s ease-out,border-color .16s ease-out}
.grid4 .fld label,.grid3 .fld label{color:var(--ink);font-size:.88rem;
  /* deux lignes réservées : sans elles, un libellé long décale son champ vers le
     bas et la rangée se lit en escalier. Aucun libellé ne dépasse deux lignes
     entre 700 et 1 440 px — la réserve couvre donc toutes les largeurs. */
  line-height:1.25;min-height:2.5em;display:flex;align-items:flex-start}
.grid4 .fld .fld-h,.grid3 .fld .fld-h{margin-top:.45rem}
/* Le relief au survol : décalage, ombre et 1 % d'agrandissement. Jamais de
   rotation — elle désalignerait la grille et flouterait le texte des champs. */
@media (hover:hover){
  .grid4 .fld:hover,.grid3 .fld:hover{transform:translateY(-3px) scale(1.01);
    box-shadow:0 10px 24px rgba(37,72,255,.13);border-color:var(--bl-t)}
  .grid4 .fld:hover label,.grid3 .fld:hover label{color:var(--bl-t)}
}
/* Dès qu'on saisit, plus aucun mouvement : le champ ne doit pas flotter sous le
   curseur. Le z-index garde la liste des communes au-dessus des cellules voisines,
   qu'un transform ferait passer devant elle. */
.grid4 .fld:focus-within,.grid3 .fld:focus-within{transform:none;z-index:20;
  border-color:var(--bl-t);box-shadow:0 6px 18px rgba(37,72,255,.10)}
.grid4 .fld:focus-within label,.grid3 .fld:focus-within label{color:var(--bl-t)}
@media (prefers-reduced-motion:reduce){
  .grid4 .fld,.grid3 .fld{transition:none}
  .grid4 .fld:hover,.grid3 .fld:hover{transform:none}
}
.grid3{margin-top:.8rem;display:grid;gap:.9rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.fld{position:relative;min-width:0}
.fld label{font-size:.85rem;font-weight:600;color:var(--mut);display:block}
input,select{width:100%;border:1.5px solid var(--bd);border-radius:var(--r2);background:var(--surf);padding:.7rem .9rem;font:inherit;font-size:1rem;color:inherit;margin-top:.3rem}
select{cursor:pointer;-webkit-appearance:none;appearance:none;
  /* la flèche est dessinée en fond à 18 px du bord : sans cette gouttière, le
     libellé le plus long passe dessous et se coupe en plein mot */
  padding-right:2.4rem;font-size:.94rem;text-overflow:ellipsis;background-image:linear-gradient(45deg,transparent 50%,var(--mut2) 50%),linear-gradient(135deg,var(--mut2) 50%,transparent 50%);background-position:calc(100% - 18px) 55%,calc(100% - 13px) 55%;background-size:5px 5px;background-repeat:no-repeat}
input:focus,select:focus,button:focus-visible,summary:focus-visible{outline:none;border-color:var(--bl-t);box-shadow:0 0 0 4px rgba(37,72,255,.14)}
.in-eur{position:relative;margin-top:.3rem}
.in-eur span{position:absolute;right:.8rem;top:50%;transform:translateY(-50%);color:var(--mut2);font-size:.9rem}  /* -25 % compensait l'ancienne marge du champ ; sans elle, c'est -50 % qui centre */
.in-eur input{padding-right:3.4rem;margin-top:0}
.fld-h{font-size:.75rem;color:var(--mut2);margin-top:.3rem;line-height:1.35}
.fld-ok{font-size:.78rem;color:var(--bl-t);font-weight:600;min-height:1.1rem;margin-top:.2rem}
.dd{position:absolute;z-index:1200;left:0;right:0;top:100%;max-height:14rem;overflow:auto;background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r2);box-shadow:0 10px 25px rgba(var(--om),.12)}
.dd button{display:block;width:100%;text-align:left;padding:.55rem .9rem;border:0;background:none;font:inherit;font-size:.9rem;cursor:pointer}
.dd button:hover{background:var(--ti-bl)}
.muted{color:var(--mut2)}

.seg{display:flex;background:var(--ti-seg);border-radius:999px;padding:4px;gap:2px;margin-top:.3rem}
.seg button{flex:1 1 0;min-width:0;border:0;background:none;font:inherit;font-size:.8rem;font-weight:600;color:var(--mut);padding:.55rem .3rem;min-height:36px;border-radius:999px;cursor:pointer;transition:background .18s,color .18s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.seg button.on{background:var(--bl);color:#fff;box-shadow:0 4px 12px rgba(37,72,255,.28)}
.seg-mode button.on{background:var(--co);box-shadow:0 4px 12px rgba(255,99,71,.32)}
.seg-mode{min-width:14.5rem}
.seg4 button{font-size:.72rem;padding:.5rem .25rem;white-space:normal;line-height:1.15;min-height:38px}
.lien{border:0;background:none;font:inherit;font-size:.78rem;color:var(--mut2);text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.lien:hover{color:var(--co)}

.gir-box{margin-top:1rem;background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r2);padding:1rem}
.gir-q{margin-top:.6rem;display:grid;gap:.4rem}
.gir-q label{display:flex;gap:.5rem;align-items:flex-start;font-size:.88rem}
.gir-q input{width:auto;margin:.25rem 0 0}

.filtres{margin-top:1.4rem;background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r2)}
.filtres summary{cursor:pointer;padding:.8rem 1rem;font-weight:600;font-size:.9rem;list-style:none}
.filtres summary::-webkit-details-marker{display:none}
.filtres summary::after{content:'▾';float:right;color:var(--bl-t)}
.filtres-in{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;padding:0 1rem 1rem}
.filtres-in label{display:flex;gap:.45rem;align-items:center;font-size:.85rem}
.filtres-in input{width:auto;margin:0}

/* bande 2 */
.vide{margin-top:1.4rem;background:var(--bg);border:1px dashed var(--bd);border-radius:var(--r);padding:2.5rem 1.2rem;text-align:center}
.v-t{font-family:Poppins,Inter,sans-serif;font-weight:600;font-size:1.2rem}
.v-s{color:var(--mut2);font-size:.9rem;margin-top:.5rem;max-width:60ch;margin-inline:auto}
#total-card{margin-top:1.4rem;background:var(--bl);color:#fff;border-radius:var(--r);padding:1.8rem;position:relative;overflow:hidden;box-shadow:0 25px 50px -12px rgba(37,72,255,.3)}
#total-card::before{content:'';position:absolute;right:-4rem;top:-4rem;width:18rem;height:18rem;border-radius:999px;background:rgba(255,255,255,.1)}
#total-card::after{content:'';position:absolute;left:-3rem;bottom:-5rem;width:14rem;height:14rem;border-radius:999px;background:rgba(255,99,71,.22)}
#total-card>*{position:relative;z-index:1}
.t-l{font-size:.95rem;color:rgba(255,255,255,.85)}
.t-m{font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:clamp(2.4rem,7vw,4rem);line-height:1;margin-top:.5rem;letter-spacing:-.03em}
.t-s{margin-top:.8rem;color:rgba(255,255,255,.92);font-size:1rem;max-width:70ch}
.t-r{margin-top:.7rem;color:rgba(255,255,255,.75);font-size:.85rem;max-width:80ch}
.t-d{margin-top:.9rem;color:rgba(255,255,255,.82);font-size:.75rem;max-width:80ch}

.map-wrap{position:relative;margin-top:1.2rem;border:1px solid var(--bd2);border-radius:var(--r);overflow:hidden;box-shadow:0 10px 15px -3px rgba(var(--om0),.05)}
.zone-btn{position:absolute;left:50%;top:.7rem;transform:translateX(-50%);z-index:800;border:0;border-radius:999px;background:var(--surf);color:var(--bl-t);font:inherit;font-size:.82rem;font-weight:600;padding:.5rem 1.1rem;cursor:pointer;box-shadow:0 4px 14px rgba(var(--om),.25);min-height:36px}
.zone-btn:hover{background:var(--ti-bl)}
#map{height:min(62vh,520px);width:100%;background:var(--ti-seg)}
.tile-warn{padding:.6rem 1rem;font-size:.78rem;color:var(--sur-or);background:var(--ti-or);border-top:1px solid var(--bd2)}
.legende{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;padding:.7rem 1rem;font-size:.78rem;color:var(--mut);background:var(--surf);border-top:1px solid var(--bd2)}
.legende i{display:inline-block;width:.65rem;height:.65rem;border-radius:999px;margin-right:.35rem;vertical-align:-1px}
.legende i.depart{background:var(--surf);border:3px solid var(--bl)}
.legende i.groupe{width:1.15rem;height:1.15rem;background:var(--bl);color:#fff;font:600 .62rem Inter,sans-serif;text-align:center;line-height:1.15rem;box-shadow:0 0 0 3px rgba(37,72,255,.22);vertical-align:-3px;margin-right:.5rem}
.me-lbl{background:var(--surf);border:1.5px solid var(--bl);color:var(--bl-t);font-weight:700;font-size:.72rem;border-radius:999px;padding:1px 7px;box-shadow:0 2px 6px rgba(var(--om),.15)}
.me-lbl::before{display:none}
.leaflet-container{font:inherit}

/* regroupements : couleur neutre, pour ne pas entrer en conflit avec le code couleur du reste à charge */
.marker-cluster-small,.marker-cluster-medium,.marker-cluster-large{background:rgba(37,72,255,.22)}
.marker-cluster-small div,.marker-cluster-medium div,.marker-cluster-large div{background:#2548FF;color:#fff}
.marker-cluster div{font:600 12px Inter,sans-serif}
.contexte{margin-top:1rem;background:var(--bg);border:1px solid var(--bd2);border-radius:var(--r2);padding:1rem;font-size:.9rem}
.contexte .muted{font-size:.82rem;margin-top:.4rem}
.liste-head{margin-top:1.4rem;display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;font-size:.85rem;font-weight:600;color:var(--mut)}
.liste-head select{width:auto;margin:0}
.btn{border:0;border-radius:999px;background:var(--co);color:#fff;font:inherit;font-weight:600;font-size:.9rem;padding:.75rem 1.4rem;cursor:pointer;box-shadow:0 10px 15px -3px rgba(255,99,71,.3)}
.btn:hover{filter:brightness(1.08)}
.btn:active{transform:scale(.98)}
.btn-sec{margin-left:auto;border:1.5px solid var(--bd);border-radius:999px;background:var(--surf);font:inherit;font-size:.82rem;font-weight:600;padding:.5rem 1rem;cursor:pointer}
.btn-sec:hover{border-color:var(--bl-t);color:var(--bl-t)}

.liste{margin-top:1rem;display:grid;gap:.9rem;align-items:start;grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.item{background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r);padding:1.1rem;box-shadow:0 4px 12px rgba(var(--om),.05);break-inside:avoid}
.item.sansprix{opacity:.8}
.item.vise{border-color:var(--co);box-shadow:0 0 0 3px rgba(255,99,71,.18),0 4px 12px rgba(var(--om),.05)}
.item-h{display:flex;gap:.8rem;justify-content:space-between;align-items:flex-start}
.item-h h3{font-size:1rem;line-height:1.3}
.item-h .muted{font-size:.78rem;margin-top:.25rem}
.item-m{font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:1.35rem;white-space:nowrap;text-align:right}
.item-m small{font-size:.7rem;font-weight:600;display:block;color:var(--mut2)}
.badges{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.7rem}
.badge{display:inline-flex;align-items:center;padding:.18rem .6rem;border-radius:999px;font-size:.7rem;font-weight:600}
.b-vert{background:var(--ti-ve);color:var(--sur-ve)}.b-orange{background:var(--ti-or);color:var(--sur-or)}.b-rouge{background:var(--ti-ro);color:var(--sur-ro)}
.b-bleu{background:var(--ti-bl);color:var(--bl-t)}.b-gris{background:var(--ti-gr);color:var(--mut2)}.b-slate{background:var(--ti-gr);color:var(--txt2)}
.b-coral{background:var(--co);color:#fff;box-shadow:0 4px 12px rgba(255,99,71,.3)}
.det{margin-top:.8rem;border-top:1px solid var(--bd2);padding-top:.6rem}
.bloc-plus{margin-top:2rem}
.bloc-plus>summary{cursor:pointer;list-style:none;padding:.7rem 0;font-size:.95rem;display:flex;flex-wrap:wrap;align-items:baseline;gap:.1rem .4rem}
.bloc-plus>summary::-webkit-details-marker{display:none}
.bloc-plus>summary::before{content:'▸';color:var(--bl-t);transition:transform .18s;display:inline-block}
.bloc-plus[open]>summary::before{transform:rotate(90deg)}
.bloc-plus>summary span{color:var(--mut);font-weight:400}
.bloc-plus[open]>summary{margin-bottom:.4rem}
.det summary{cursor:pointer;font-size:.82rem;font-weight:600;color:var(--bl-t);list-style:none}
.det summary::-webkit-details-marker{display:none}
.det summary::after{content:' ▾'}
.det-in{margin-top:.7rem}
/* Ligne libellé / valeur (29/09/2026) : grille à deux colonnes, valeur toujours alignée à droite.
   La précision (.ln-d) passe sous la valeur au lieu de former une troisième colonne, et une valeur
   longue (accueil spécialisé) revient à la ligne : plus de défilement horizontal dans la fiche. */
.ln{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:1rem;align-items:baseline;font-size:.82rem;padding:.25rem 0;border-bottom:1px dashed var(--bd2)}
.ln span{color:var(--mut)}
.ln>b{white-space:nowrap;text-align:right}
.ln>.ln-d{grid-column:1/-1;text-align:right}
.ln-offre{grid-template-columns:auto minmax(0,1fr)}
.ln-offre>b{white-space:normal;overflow-wrap:anywhere}
.ln.moins b{color:var(--vert)}
.ln.tot{border-bottom:0;border-top:1.5px solid var(--ink);margin-top:.3rem;padding-top:.45rem;font-size:.95rem}
.warn{margin-top:.5rem;font-size:.78rem;color:var(--sur-or);background:var(--ti-or);border-radius:.6rem;padding:.4rem .6rem}
.att{margin-top:.7rem;font-size:.78rem;line-height:1.5;color:var(--sur-or);background:var(--ti-or);border-radius:.6rem;padding:.5rem .7rem}
.att a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.scenario{margin-top:.8rem;background:var(--bg);border-radius:.8rem;padding:.7rem .8rem;font-size:.82rem}
.scenario b{font-size:.85rem}
.chips{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.7rem}
.chip{background:var(--ti-gr);color:var(--mut);border-radius:999px;padding:.15rem .55rem;font-size:.7rem}
.chip-warn{background:var(--ti-or);color:var(--sur-or)}
.src{margin-top:.7rem;font-size:.72rem;color:var(--mut2);line-height:1.45}
.liens{margin-top:.5rem;display:flex;flex-wrap:wrap;gap:.2rem .9rem;font-size:.72rem}
.liens a{color:var(--bl-t);text-decoration:underline;text-underline-offset:3px}
.item-f{margin-top:.8rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.mini{border:1.5px solid var(--bd);background:var(--surf);border-radius:999px;font:inherit;font-size:.75rem;font-weight:600;padding:.32rem .8rem;cursor:pointer}
.mini:hover{border-color:var(--bl-t);color:var(--bl-t)}
.finess{font-size:.68rem;color:var(--mut2)}

.cmp-wrap{margin-top:1.4rem;background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r);padding:1.1rem;box-shadow:0 4px 12px rgba(var(--om),.05)}
.cmp-scroll{overflow-x:auto;margin-top:.7rem}
.cmp{width:100%;border-collapse:collapse;font-size:.82rem;min-width:520px}
.cmp th{text-align:left;color:var(--mut);font-weight:600;padding:.4rem .6rem;border-bottom:1px solid var(--bd2);vertical-align:top;width:11rem}
.cmp td{padding:.4rem .6rem;border-bottom:1px solid var(--bd2);vertical-align:top}
.x{border:0;background:none;color:var(--mut2);cursor:pointer;font-size:1.2rem;line-height:1;min-width:34px;min-height:34px}
.x:hover{color:var(--co)}

/* bande 3 */
.route-wrap{margin-top:1.4rem;background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r);padding:1.4rem;box-shadow:0 10px 15px -3px rgba(var(--om0),.05)}
#route{display:grid;gap:1rem}
.step{background:var(--bg);border:1px solid var(--bd2);border-radius:var(--r2);padding:1.1rem;break-inside:avoid}
.step-h{display:flex;align-items:center;gap:.7rem}
.step-h .n{width:2rem;height:2rem;flex:0 0 auto;border-radius:999px;background:var(--co);color:#fff;display:grid;place-items:center;font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:.9rem}
.step h3{font-size:1rem}
.quand{margin-top:.5rem;font-size:.84rem;font-weight:600;color:var(--bl-t)}
.step-g{margin-top:.8rem;display:grid;gap:.8rem 2rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.step-g .lbl{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:var(--mut2)}
.step-g ol,.step-g ul{margin-top:.35rem;padding-left:1.1rem;font-size:.85rem;color:var(--txt2);display:grid;gap:.25rem}
.step-g ul{list-style:none;padding-left:0}
.step-g ul li::before{content:'• ';color:var(--co)}
.piege{margin-top:.8rem;background:rgba(255,99,71,.1);color:var(--sur-co);border-radius:.7rem;padding:.6rem .8rem;font-size:.82rem}

/* bande 4 / 5 / 6 */
.src-grid{margin-top:1rem;display:grid;gap:.9rem;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.src-card{background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r);padding:1.1rem}
.src-card h3{font-size:.95rem}
.src-card p{margin-top:.4rem;font-size:.82rem;color:var(--mut)}
.src-l{font-size:.75rem;color:var(--mut)}
.src-l a{color:var(--bl-t);text-decoration:underline;text-underline-offset:3px}
.src-n{font-size:.75rem;color:var(--sur-or)}
.non-sim{margin-top:.8rem;display:grid;gap:.6rem;list-style:none}
.non-sim li{font-size:.85rem;color:var(--mut);background:var(--bg);border-radius:var(--r2);padding:.7rem .9rem}
.faq{margin-top:1.2rem;display:grid;gap:.8rem}
.faq details{background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r);padding:1.1rem}
.faq summary{cursor:pointer;font-family:Poppins,Inter,sans-serif;font-weight:600;font-size:1rem;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'▾';color:var(--bl-t)}
.faq p{margin-top:.7rem;font-size:.9rem;color:var(--mut)}
.guides{margin-top:1.2rem;display:grid;gap:.9rem;grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.g-card{background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r);padding:1.1rem;text-decoration:none;box-shadow:0 4px 12px rgba(var(--om),.05);display:block}
.g-card:hover{background:var(--bg)}
.g-card b{font-family:Poppins,Inter,sans-serif}
.g-card span{display:block;margin-top:.35rem;font-size:.85rem;color:var(--mut)}

#site-footer{border-top:1px solid var(--bd);background:var(--bg);border-radius:var(--r) var(--r) 0 0;margin:0 calc(-1 * var(--pad)) -5rem;padding:2rem var(--pad);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center}
#site-footer nav{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;font-size:.85rem;font-weight:500;color:var(--mut)}
#site-footer a{text-decoration:none}
#site-footer a:hover{color:var(--bl-t)}
#site-footer p{font-size:.75rem;color:var(--mut2)}

#consent-banner{position:fixed;inset:auto 0 0 0;z-index:2000;padding:1rem}
.cb{max-width:48rem;margin:0 auto;background:var(--surf);border:1px solid var(--bd);border-radius:var(--r);box-shadow:0 25px 50px -12px rgba(var(--om),.25);padding:1.2rem;display:flex;flex-wrap:wrap;gap:1rem;align-items:center}
.cb p{flex:1 1 20rem;font-size:.85rem;color:var(--txt2)}
.cb a{color:var(--bl-t);text-decoration:underline}
.cb-b{display:flex;flex-direction:column;gap:.5rem;align-items:center}

/* fiches secondaires (méthodologie, mentions, qui sommes-nous) */
.page{max-width:52rem}
.page h2{margin-top:2rem;font-size:1.5rem}
.page h3{margin-top:1.4rem;font-size:1.05rem}
.page p,.page li{margin-top:.7rem;color:var(--txt2);font-size:.95rem}
.page ul,.page ol{padding-left:1.2rem}
.page a{color:var(--bl-t);text-decoration:underline;text-underline-offset:3px}
.fil{font-size:.8rem;color:var(--mut2)}
.fil a{color:var(--mut);text-decoration:none}

/* ---------- v2 : actions de la carte de synthèse ---------- */
.t-a{margin-top:1.1rem;display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.btn-w{border:0;border-radius:999px;background:var(--surf);color:var(--bl-t);font:inherit;font-weight:600;font-size:.85rem;padding:.6rem 1.1rem;cursor:pointer;box-shadow:0 4px 12px rgba(var(--om),.18)}
.btn-w:hover{background:var(--ti-bl)}
#total-card .btn-sec{margin-left:0;background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
#total-card .btn-sec:hover{background:rgba(255,255,255,.12);color:#fff;border-color:#fff}
.t-share{margin-top:.7rem;font-size:.82rem;color:#fff;background:rgba(255,255,255,.16);border-radius:.7rem;padding:.5rem .8rem;max-width:60ch}

/* ---------- v2 : évolution du prix ---------- */
.prix-box{margin-top:.8rem;background:var(--surf);border:1px solid var(--bd2);border-radius:.8rem;padding:.7rem .8rem}
.prix-h{display:flex;align-items:center;gap:.7rem;font-size:.85rem;flex-wrap:wrap}
.spark{width:132px;height:34px;flex:0 0 auto}
.prix-h b{font-family:Poppins,Inter,sans-serif;font-size:1rem}
.vert{color:var(--vert)}
.rouge{color:var(--rouge)}
.prix-s{margin-top:.4rem;font-size:.78rem;color:var(--mut)}
.prix-n{margin-top:.25rem;font-size:.72rem;color:var(--mut2)}

/* ---------- v2 : places qui se libèrent ---------- */
.dispo-box{margin-top:.8rem;background:var(--ti-bl);border-radius:.8rem;padding:.7rem .8rem;font-size:.82rem}
.dispo-box b{font-size:.85rem}
.dispo-box p{margin-top:.35rem;color:var(--txt2)}
.dispo-box .muted{font-size:.74rem;margin-top:.4rem}

/* ---------- v2 : participation de la famille ---------- */
.fam-box{margin-top:.8rem;background:rgba(255,99,71,.08);border-radius:.8rem;padding:.7rem .8rem}
.fam-box>b{font-size:.85rem}
.fam-box .ln{border-bottom-color:rgba(255,99,71,.25)}
.fam-box .ln.tot{border-top-color:var(--co)}
.fam-box .muted{font-size:.72rem;margin-top:.5rem;line-height:1.45}

/* ---------- v2 : questions de visite ---------- */
.chk{margin-top:.8rem;background:var(--surf);border:1px solid var(--bd2);border-radius:.8rem;padding:.6rem .8rem}
.chk summary{cursor:pointer;font-size:.82rem;font-weight:600;color:var(--bl-t);list-style:none}
.chk summary::-webkit-details-marker{display:none}
.chk summary::after{content:' \25BE'}
.chk ul{margin-top:.5rem;padding-left:1.1rem;font-size:.82rem;color:var(--txt2);display:grid;gap:.25rem}

/* ---------- v2 : table d'inflation ---------- */
.infl-wrap{margin-top:.8rem;overflow-x:auto}
.infl{border-collapse:collapse;font-size:.85rem;min-width:18rem}
.infl caption{text-align:left;font-size:.78rem;color:var(--mut2);padding-bottom:.4rem}
.infl th,.infl td{text-align:left;padding:.35rem .9rem .35rem 0;border-bottom:1px solid var(--bd2)}
.infl th{color:var(--mut);font-weight:600}
.infl td:last-child{font-variant-numeric:tabular-nums}

/* ---------- v2 : infobulle de la carte ---------- */
.pop{min-width:15rem;max-width:20rem}
.pop-h{font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:.95rem;line-height:1.25}
.pop-s{font-size:.75rem;color:var(--mut2);margin-top:.15rem}
.pop-m{font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:1.25rem;margin-top:.4rem}
.pop .mini{margin-top:.7rem}
.leaflet-popup-content{margin:.9rem 1rem}


/* ---------- survol : un léger relief, rien de plus ----------
   Seules `transform` et `box-shadow` sont animées : le navigateur les traite sur
   le compositeur, sans recalculer la mise en page. Aucune animation sur les cartes
   de résultat, qui peuvent être nombreuses et se redessinent à chaque filtre. */
.item,.step,.src-card,.non-sim li,.f-faits div,.prix-box,.dispo-box,.fam-box{
  transition:transform .16s ease-out,box-shadow .16s ease-out,border-color .16s ease-out}
.item:hover,.step:hover,.src-card:hover,.non-sim li:hover,.f-faits div:hover,
.prix-box:hover,.dispo-box:hover,.fam-box:hover{
  transform:translateY(-2px);box-shadow:0 8px 20px rgba(var(--om),.08);border-color:var(--bd)}
.src-card:hover,.item:hover{border-color:var(--bd-bl2)}
/* un lien-carte réagit un peu plus franchement : c'est cliquable */
.lien-pro,.mini2,.btn-f,.chips-actifs button{transition:transform .14s ease-out,box-shadow .14s ease-out,border-color .14s ease-out,background .14s ease-out,color .14s ease-out}
.lien-pro:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(37,72,255,.12)}
.mini2:hover,.btn-f:hover{transform:translateY(-1px)}
@media (prefers-reduced-motion:reduce){
  .item,.step,.src-card,.non-sim li,.f-faits div,.prix-box,.dispo-box,.fam-box,
  .lien-pro,.mini2,.btn-f,.chips-actifs button{transition:none}
  .item:hover,.step:hover,.src-card:hover,.non-sim li:hover,.f-faits div:hover,
  .prix-box:hover,.dispo-box:hover,.fam-box:hover,.lien-pro:hover,.mini2:hover,.btn-f:hover{transform:none}
}
/* sur écran tactile, le survol n'existe pas : on n'y laisse aucun état collant */
@media (hover:none){
  .item:hover,.step:hover,.src-card:hover,.non-sim li:hover,.f-faits div:hover,
  .prix-box:hover,.dispo-box:hover,.fam-box:hover,.lien-pro:hover,.mini2:hover,.btn-f:hover{
    transform:none}
  .item:hover,.src-card:hover{box-shadow:0 4px 12px rgba(var(--om),.05)}
}

/* ================= ESPACE DE COMPARAISON (liste + fiche) ================= */
/* L'en-tête ne change plus de taille quand les résultats apparaissent (29/09/2026) :
   titre réduit, sous-titre masqué et marge resserrée faisaient sauter toute la page
   pendant la saisie du code postal — le champ glissait sous le doigt. */
body.fige{overflow:hidden}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* synthèse compacte */
.t-row{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:flex-start}
.t-det{margin-top:.9rem}
.t-det summary{cursor:pointer;font-size:.8rem;color:rgba(255,255,255,.8);list-style:none;padding:.45rem 0;min-height:34px;display:flex;align-items:center;gap:.3rem}
.t-det summary::-webkit-details-marker{display:none}
.t-det summary::after{content:' ▾'}
.t-det summary:hover{color:#fff}
#total-card{padding:1.4rem 1.6rem}
.t-m{font-size:clamp(2rem,5.5vw,3.1rem)}

/* grille à deux colonnes */
.atelier{margin-top:1.2rem;display:grid;gap:1.2rem;grid-template-columns:minmax(0,1fr);min-width:0}
.col-liste{min-width:0}
@media (min-width:1040px){
  .atelier{grid-template-columns:minmax(0,1fr) minmax(380px,42%);align-items:start}
  /* hauteur fixe : basculer de la carte à la fiche ne fait jamais bouger la page */
  .col-detail{position:sticky;top:.8rem;height:calc(100vh - 1.6rem);display:flex;flex-direction:column}
  .col-detail .pan{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
  .col-detail .map-wrap{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;margin-top:0}
  #map{flex:1 1 auto;min-height:0;height:auto}
  #pan-fiche{overflow:auto;background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r);box-shadow:0 10px 15px -3px rgba(var(--om0),.05)}
  .col-liste{min-width:0}
}

/* barre de liste */
.barre{position:sticky;top:var(--tb-h,0px);z-index:900;background:var(--surf);border-bottom:1px solid var(--bd2);padding:.5rem 0;display:flex;flex-wrap:wrap;gap:.5rem .8rem;align-items:center;justify-content:space-between}
.barre-n{font-weight:600;font-size:.9rem}
.barre-r{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin-left:auto}
.barre select{width:auto;margin:0;padding:.4rem 2rem .4rem .6rem;font-size:.82rem;border-radius:999px}
.seg-vue{margin-top:0;padding:3px;flex:0 0 auto}
/* ces deux boutons se dimensionnent sur leur texte : ils ne sont pas la variable
   d'ajustement de la barre, sinon « Carte » se coupe en « Ca… » dès que la place manque */
.seg-vue button{flex:0 0 auto;font-size:.78rem;padding:.45rem .9rem;min-height:34px;overflow:visible;text-overflow:clip}
.btn-f{border:1.5px solid var(--bd);background:var(--surf);border-radius:999px;font:inherit;font-size:.82rem;font-weight:600;padding:.45rem 1rem;cursor:pointer;display:inline-flex;gap:.4rem;align-items:center;min-height:36px}
.btn-f:hover{border-color:var(--bl-t);color:var(--bl-t)}
.btn-f span{background:var(--bl);color:#fff;border-radius:999px;font-size:.7rem;padding:0 .4rem;min-width:1.1rem;text-align:center}
.btn-f.on{background:var(--co);border-color:var(--co);color:#fff}
.btn-f.on span{background:var(--surf);color:var(--co)}
.chips-actifs{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.6rem}
.chips-actifs button{border:1px solid var(--bd);background:var(--bg);border-radius:999px;font:inherit;font-size:.75rem;padding:.3rem .7rem;cursor:pointer;color:var(--mut);min-height:32px}
.chips-actifs button:hover{border-color:var(--co);color:var(--co)}
.liste-pied{margin-top:.9rem;display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.liste-pied .btn-sec{margin-left:0}

/* cartes de résultat compactes */
.liste{margin-top:.8rem;display:grid;gap:.6rem;grid-template-columns:1fr}
.res{position:relative;display:grid;grid-template-columns:1fr auto;gap:.2rem 1rem;background:var(--surf);border:1px solid var(--bd2);border-left:4px solid transparent;border-radius:var(--r2);padding:.8rem .9rem;cursor:pointer;transition:transform .16s ease-out,border-color .15s,box-shadow .15s,background .15s;break-inside:avoid}
/* L'ancienne consigne excluait toute animation ici. `transform` et `box-shadow`
   étant composées sans recalcul de mise en page, et la liste étant paginée par
   quinze, le coût est nul. Le relief reste gris : le bleu est réservé à la
   sélection, qui a son propre état juste en dessous. */
.res:hover,.res.survol{border-color:var(--bd);background:var(--bg)}
@media (hover:hover){
  .res:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(var(--om),.10);border-color:var(--mut2)}
  .res:hover .res-n{color:var(--ink)}
}
/* `.survol` vient du pointeur posé sur la carte, pas sur cette ligne : on change
   la couleur, jamais la position — rien ne doit bouger là où personne ne pointe. */
@media (prefers-reduced-motion:reduce){ .res:hover{transform:none} }
.res:focus-visible{outline:none;border-color:var(--bl-t);box-shadow:0 0 0 3px rgba(37,72,255,.16)}
.res[aria-current="true"]{border-color:var(--bl-t);border-left-color:var(--bl-t);background:var(--ti-bl2);box-shadow:0 4px 14px rgba(37,72,255,.12)}
@media (hover:hover){
  .res[aria-current="true"]:hover{border-color:var(--bl-t);box-shadow:0 10px 24px rgba(37,72,255,.18)}
}
.res-n{font-family:Poppins,Inter,sans-serif;font-weight:600;font-size:.98rem;line-height:1.25;grid-column:1}
.res-l{grid-column:1;font-size:.78rem;color:var(--mut2);margin-top:.1rem}
.res-m{grid-column:2;grid-row:1 / span 2;text-align:right;white-space:nowrap}
.res-m b{display:block;font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:1.3rem;line-height:1.1;letter-spacing:-.02em}
.res-m small{display:block;font-size:.68rem;color:var(--mut2);margin-top:.1rem}
.res-m .tarif{display:block;font-size:.72rem;color:var(--mut2);margin-top:.25rem;white-space:normal}
/* réserve portée par un montant : elle doit se lire avec lui, pas ailleurs */
.res-m .t-reserve{color:var(--sur-or);font-style:italic;margin-top:.1rem}
/* option de partage : posée SOUS les boutons, jamais dans leur rangée flex —
   un texte multiligne y étirerait les boutons voisins sur toute sa hauteur. */
.share-opt{display:flex;gap:.5rem;align-items:center;margin-top:.8rem;
  font-size:.78rem;line-height:1.3;color:rgba(255,255,255,.82);cursor:pointer}
.share-opt input{flex:0 0 auto;width:1rem;height:1rem;margin:0;padding:0;border:0;accent-color:#fff;cursor:pointer}  /* input{width:100%} est global : sans width:auto la case occupe toute la ligne */
.share-opt:hover{color:#fff}
@media (max-width:560px){.share-opt{align-items:flex-start}.share-opt input{margin-top:.15rem}}
.res-b{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.5rem;align-items:center}
.res-b .badge{font-size:.68rem;padding:.12rem .5rem}
.res-act{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.55rem;align-items:center}
.mini2{border:1.5px solid var(--bd);background:var(--surf);border-radius:999px;font:inherit;font-size:.74rem;font-weight:600;padding:.34rem .75rem;cursor:pointer;color:var(--mut);display:inline-flex;gap:.3rem;align-items:center;min-height:36px;flex:0 0 auto;white-space:nowrap}
.mini2:hover{border-color:var(--bl-t);color:var(--bl-t)}
.mini2.on{background:var(--bl);border-color:var(--bl-t);color:#fff}
.mini2.fav.on{background:var(--co);border-color:var(--co)}
.res-pourquoi{grid-column:1 / -1;margin-top:.5rem;font-size:.75rem;color:var(--sur-ve);background:var(--ti-ve);border-radius:.5rem;padding:.35rem .6rem}
.res.sansprix .res-m b{color:var(--mut2);font-size:.9rem}

/* fiche de détail */
.fiche{padding:1.1rem}
.f-top{display:flex;justify-content:space-between;gap:.8rem;align-items:flex-start}
.f-top h3{font-size:1.15rem;line-height:1.25}
.f-close{border:0;background:none;font-size:1.4rem;line-height:1;color:var(--mut2);cursor:pointer;padding:.1rem .3rem;min-height:32px}
.f-close:hover{color:var(--co)}
.f-loc{font-size:.8rem;color:var(--mut2);margin-top:.2rem}
.f-prix{margin-top:.9rem;background:var(--bg);border-radius:var(--r2);padding:.9rem 1rem}
.f-prix .gros{font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:2rem;line-height:1;letter-spacing:-.02em}
.f-prix .lib{font-size:.78rem;color:var(--mut);margin-top:.25rem}
.f-prix .ctx{font-size:.78rem;color:var(--mut);margin-top:.5rem}
.f-faits{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.6rem;margin-top:.9rem}
.f-faits div{background:var(--surf);border:1px solid var(--bd2);border-radius:.7rem;padding:.5rem .7rem}
.f-faits span{display:block;font-size:.84rem;font-weight:700;color:var(--ink);line-height:1.25}
.f-faits b{display:block;font-size:.78rem;font-weight:500;color:var(--txt2);margin-top:.15rem;line-height:1.3}
.f-cta{margin-top:.9rem;display:flex;flex-wrap:wrap;gap:.5rem}
.f-cta .btn{font-size:.85rem;padding:.6rem 1.1rem}
/* Onglets de la fiche (29/09/2026) : sélecteur segmenté à angles légèrement arrondis, pas de pastilles.
   Le fond gris du rail et le relief de l'onglet actif disent « ce sont des boutons » ; les quatre
   onglets se partagent la largeur, sans défilement horizontal (un onglet caché n'est pas vu). */
.f-onglets{display:flex;gap:.25rem;margin-top:1rem;padding:.25rem;background:var(--ti-seg);border:1px solid var(--bd);border-radius:10px}
.f-onglets button{flex:1 1 auto;border:1px solid transparent;background:none;font:inherit;font-size:.85rem;font-weight:600;color:var(--txt2);
  padding:.5rem .6rem;cursor:pointer;border-radius:7px;min-height:40px;line-height:1.2;text-align:center;
  transition:background .2s,color .2s,border-color .2s,box-shadow .2s}
/* survol : le fond s'éclaircit, sans prendre le bleu réservé à l'onglet actif */
.f-onglets button:hover{background:color-mix(in srgb,var(--surf) 55%,transparent);color:var(--ink);border-color:var(--bd)}
.f-onglets button[aria-selected="true"]:hover{background:var(--surf);color:var(--bl-t)}
.f-onglets button:focus-visible{outline:2px solid var(--bl-t);outline-offset:1px}
.f-onglets button[aria-selected="true"]{background:var(--surf);color:var(--bl-t);border-color:var(--bd-bl2);
  box-shadow:0 1px 3px rgba(15,23,42,.12),inset 0 -3px 0 var(--bl-t)}
@media (max-width:480px){.f-onglets{gap:.15rem;padding:.2rem}.f-onglets button{padding:.45rem .3rem;font-size:.78rem}}
.f-panneau{padding-top:.8rem}
.f-panneau .ln{font-size:.85rem}
.f-panneau h4{font-size:.85rem;margin-top:1rem;color:var(--mut)}
.f-src{margin-top:1rem;font-size:.72rem;color:var(--mut2);line-height:1.45;border-top:1px solid var(--bd2);padding-top:.6rem}
/* ---------- fiche : la lecture d'un néophyte ----------
   Chaque montant est suivi d'une phrase courte qui dit d'où il vient. */
.f-t1{font-size:.75rem!important;text-transform:uppercase;letter-spacing:.05em;color:var(--mut2)!important;margin-top:1.3rem!important;padding-bottom:.3rem;border-bottom:1px solid var(--bd2)}
.f-t1:first-child{margin-top:.2rem!important}
.f-note{font-size:.78rem;color:var(--mut);line-height:1.5;margin:.15rem 0 .7rem;padding-left:.1rem}
.f-note a{color:var(--bl-t)}
.q-app{list-style:none;margin:.5rem 0 0;display:grid;gap:.35rem}
.q-app li{font-size:.82rem;line-height:1.45;padding-left:1rem;position:relative}
.q-app li::before{content:'—';position:absolute;left:0;color:var(--mut2)}
.q-tel{margin-top:.7rem}
.q-tel a{display:inline-block;background:var(--ti-bl);color:var(--bl-t);border-radius:999px;padding:.4rem .9rem;font-size:.82rem;font-weight:600;text-decoration:none}
.f-hyp{margin-top:.7rem}
.f-hyp summary{font-size:.8rem;color:var(--mut);font-weight:600;cursor:pointer;list-style:none;padding:.35rem 0}
.f-hyp summary::-webkit-details-marker{display:none}
.f-hyp summary::after{content:' ▾'}
.f-resume{font-size:.88rem;line-height:1.5;background:var(--bg);border-left:3px solid var(--bl);border-radius:.5rem;padding:.6rem .8rem;margin-bottom:.9rem}
.ln.sstot{border-top:1px solid var(--bd2);margin-top:.2rem;padding-top:.45rem}

/* panneau de filtres et comparaison */
.drawer,.cmp-drawer{position:fixed;inset:0;z-index:2500;background:rgba(var(--om),.35);display:flex;justify-content:flex-end}
.cmp-drawer{align-items:flex-end;justify-content:center}
.drawer-in{background:var(--surf);width:min(26rem,100%);height:100%;display:flex;flex-direction:column;box-shadow:-10px 0 30px rgba(var(--om),.2);animation:glisse .18s ease-out}
.cmp-in{background:var(--surf);width:min(64rem,100%);max-height:88vh;border-radius:var(--r) var(--r) 0 0;display:flex;flex-direction:column;box-shadow:0 -10px 30px rgba(var(--om),.2);animation:monte .2s ease-out}
@keyframes glisse{from{transform:translateX(100%)}to{transform:none}}
@keyframes monte{from{transform:translateY(100%)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.drawer-in,.cmp-in{animation:none}}
.drawer-h{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.2rem;border-bottom:1px solid var(--bd2)}
.drawer-h h3{font-size:1.05rem}
.cmp-h-r{display:flex;gap:1rem;align-items:center}
.drawer-b{flex:1 1 auto;overflow:auto;padding:1rem 1.2rem}
.drawer-f{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.9rem 1.2rem;border-top:1px solid var(--bd2)}
.q-lbl{font-weight:600;font-size:.88rem;margin-top:1.2rem}
.q-lbl:first-child{margin-top:0}
.chk-l{display:flex;gap:.5rem;align-items:flex-start;font-size:.86rem;margin-top:.5rem;cursor:pointer;min-height:32px;padding:.15rem 0}
.chk-l input{width:auto;margin:.15rem 0 0}

/* barre de comparaison */
.cmp-barre{position:fixed;left:50%;transform:translateX(-50%);bottom:1rem;z-index:2000;background:var(--ink);color:#fff;border-radius:999px;padding:.6rem .7rem .6rem 1.2rem;display:flex;gap:1rem;align-items:center;box-shadow:0 12px 28px rgba(var(--om),.3);font-size:.88rem;max-width:calc(100% - 2rem)}
.cmp-barre .lien{color:rgba(255,255,255,.7)}
.cmp-barre .lien:hover{color:#fff}
.cmp-barre .btn{background:var(--co);padding:.5rem 1.1rem;font-size:.85rem}
.cmp-b{display:flex;gap:.8rem;align-items:center}
.cmp-scroll{flex:1 1 auto;overflow:auto;padding:0 1.2rem 1rem}
.cmp th{position:sticky;left:0;background:var(--surf);z-index:1}

/* ================= BARRE DE DÉFILEMENT =================
   Apparaît quand on descend, disparaît en haut de page. Elle n'anime que
   `transform` et `opacity` : le navigateur les traite sur le compositeur,
   sans recalculer la mise en page à chaque pixel de défilement. */
.topbar{position:fixed;top:0;left:0;right:0;z-index:2400;
  background:color-mix(in srgb,var(--pg) 88%,transparent);
  -webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--bd2);
  transform:translateY(-100%);opacity:0;pointer-events:none;
  /* `visibility` sort aussi la barre du parcours au clavier tant qu'elle est cachée */
  visibility:hidden;
  transition:transform .28s cubic-bezier(.22,.61,.36,1),opacity .2s ease-out,visibility 0s linear .28s}
.topbar.on{transform:none;opacity:1;pointer-events:auto;visibility:visible;transition-delay:0s,0s,0s}
@supports not (backdrop-filter:blur(1px)){.topbar{background:var(--pg)}}
.topbar-in{max-width:min(1180px,100%);margin:0 auto;padding:.55rem 1.25rem;
  display:flex;align-items:center;gap:1rem;justify-content:space-between}
.tb-logo{font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:1rem;letter-spacing:-.02em;
  text-decoration:none;color:var(--ink);white-space:nowrap}
.tb-logo span{color:var(--bl-t);font-style:italic}
/* « .fr » : le nom du site en entier, pour qu'il se retienne (30/09/2026) */
.tb-logo .tld,.logo .tld{font-weight:700;color:inherit;font-style:normal}
.tb-r{display:flex;align-items:center;gap:.5rem;margin-left:auto}

/* les commandes : même grammaire que le reste du site, en plus compact */
.tb-btn,.tb-icon{border:1.5px solid var(--bd);background:var(--surf);color:var(--ink);
  font:inherit;font-size:.82rem;font-weight:600;border-radius:999px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:.35rem;
  transition:border-color .15s,color .15s,background .15s,transform .15s}
.tb-btn{padding:.45rem .9rem;min-height:38px}
.tb-icon{width:38px;height:38px;padding:0;line-height:1}
.tb-icon svg{width:1.05rem;height:1.05rem;display:block}
/* une seule icône à la fois — spécificité alignée sur « .tb-icon svg » ci-dessus */
.tb-icon .ico-soleil{display:none}
[data-theme="dark"] .tb-icon .ico-lune{display:none}
[data-theme="dark"] .tb-icon .ico-soleil{display:block}
.tb-btn:hover,.tb-icon:hover{border-color:var(--bl-t);color:var(--bl-t);transform:translateY(-1px)}
.tb-btn svg{width:.7rem;height:.7rem;transition:transform .2s}
.tb-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
/* Ambre, et non corail : le corail est réservé à l'action principale du site.
   Deux boutons pleins de même teinte se disputeraient le regard. */
.tb-avis{background:var(--orange);color:#fff;border:0;border-radius:999px;font:inherit;font-size:.85rem;
  font-weight:600;padding:.6rem 1.1rem;min-height:38px;display:inline-flex;align-items:center;
  text-decoration:none;white-space:nowrap;box-shadow:0 4px 14px rgba(224,138,0,.3);
  transition:transform .15s,box-shadow .15s}
.tb-avis:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(224,138,0,.42)}
/* Dans la navigation d'accueil, même couleur mais en pastille discrète : cette
   rangée est une liste de liens, pas une barre d'actions. */
.nav-avis{background:var(--ti-or);color:var(--sur-or);border-radius:999px;
  padding:.15rem .7rem;font-weight:600}
.nav .nav-avis:hover,.nav-avis:hover{background:var(--sur-or);color:#fff}
@media (hover:none){.tb-avis:hover{transform:none}}
@media (prefers-reduced-motion:reduce){.tb-avis{transition:none}.tb-avis:hover{transform:none}}
/* Sous 860 px, la barre ne peut plus porter les deux boutons sans tronquer ses
   libellés : celui-ci s'efface, et « Vos retours » reste dans le menu Naviguer. */
@media (max-width:860px){.tb-avis{display:none}}
.tb-cta{background:var(--co);color:#fff;border:0;border-radius:999px;font:inherit;font-size:.85rem;
  font-weight:600;padding:.6rem 1.2rem;min-height:38px;display:inline-flex;align-items:center;
  text-decoration:none;white-space:nowrap;box-shadow:0 4px 14px rgba(255,99,71,.32);
  transition:transform .15s,box-shadow .15s}
.tb-cta:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(255,99,71,.42)}

/* le menu « Naviguer » */
.tb-nav-wrap{position:relative}
.tb-menu{position:absolute;right:0;top:calc(100% + .5rem);min-width:15rem;background:var(--surf);
  border:1px solid var(--bd);border-radius:var(--r2);box-shadow:0 16px 40px rgba(var(--om),.16);
  padding:.4rem;display:grid;gap:1px;z-index:10}
.tb-menu a{display:block;padding:.55rem .7rem;border-radius:.6rem;font-size:.85rem;
  text-decoration:none;color:var(--txt2)}
.tb-menu a:hover,.tb-menu a:focus-visible{background:var(--ti-bl);color:var(--bl-t);outline:none}
.tb-menu hr{border:0;border-top:1px solid var(--bd2);margin:.3rem .4rem}

/* le liseré de progression : une seule transformation, aucune reprise de mise en page */
.tb-prog{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:transparent;overflow:hidden}
.tb-prog i{display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,var(--bl),var(--co));will-change:transform}

@media (max-width:720px){
  .topbar-in{padding:.5rem 1rem;gap:.5rem}
  .tb-cta{padding:.55rem .9rem;font-size:.8rem}
  .tb-btn span{display:none}          /* « Naviguer » devient une simple flèche */
  .tb-btn{padding:.45rem .6rem}
  .tb-menu{position:fixed;left:1rem;right:1rem;top:auto;min-width:0}
}
@media (max-width:420px){.tb-logo{font-size:.9rem}}
/* avec « .fr », la barre déborde sous 380 px : logo et espacements resserrés (30/09/2026) */
@media (max-width:380px){.tb-logo{font-size:.8rem}.topbar-in{padding:.5rem .75rem;gap:.35rem}.tb-r{gap:.3rem}.tb-cta{padding:.5rem .7rem}.tb-btn{padding:.4rem .45rem}}
@media (prefers-reduced-motion:reduce){
  .topbar{transition:opacity .15s linear}
  .topbar,.topbar.on{transform:none}
  .tb-btn:hover,.tb-icon:hover,.tb-cta:hover{transform:none}
}
@media print{.topbar{display:none!important}}

/* ================= MODE PROFESSIONNEL ================= */
/* entrée discrète dans l'en-tête : une proposition, pas un choix imposé */
.lien-pro{display:block;text-align:right;font-size:.78rem;line-height:1.35;color:var(--mut2);text-decoration:none;border:1px solid var(--bd);border-radius:var(--r2);padding:.45rem .8rem;background:var(--surf)}
.lien-pro b{display:block;color:var(--bl-t);font-weight:600;font-size:.84rem}
.lien-pro b::after{content:' →';font-weight:400}
.lien-pro:hover{border-color:var(--bl-t);text-decoration:none}
.lien-pro:hover b{text-decoration:underline;text-underline-offset:3px}

/* bandeau de contexte, affiché uniquement en mode professionnel */
.pro-bandeau{margin-top:1.2rem;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;background:var(--ti-bl2);border:1px solid var(--bd-bl);border-left:4px solid var(--bl);border-radius:var(--r2);padding:1rem 1.2rem}
.pro-b-t{min-width:0;flex:1 1 26rem}
.pro-b-h{font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--bl-t)}
.pro-b-s{margin-top:.3rem;font-size:.92rem;color:var(--txt2);max-width:70ch}
.pro-b-a{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.pro-b-a .btn-w{box-shadow:0 2px 8px rgba(37,72,255,.18)}

/* identifiant national, visible seulement quand un professionnel travaille */
/* Le numéro reste un lien, pas un bouton : il agit hors de la page. */
/* Le complément à financer se lit avec le budget, pas trois écrans plus bas. */
.f-manque{margin-top:.7rem;padding:.6rem .8rem;border-radius:var(--r2);
  background:var(--ti-or);color:var(--sur-or);font-size:.86rem;line-height:1.4}
.f-manque b{font-size:1rem}
.f-dispo-l{margin-top:.6rem;font-size:.82rem;color:var(--mut)}
/* précision attachée à une ligne de calcul : elle se lit avec elle, pas ailleurs */
.ln-d{display:block;font-style:normal;font-size:.72rem;color:var(--mut2);font-weight:400;margin-top:.1rem}
.f-lien-fin{margin-top:.3rem}
/* le segment « pour qui » vit dans l'en-tête de bande : sans largeur minimale,
   ses libellés y sont rognés (« Moi-mê… ») */
.fld-pq{min-width:16rem}
.fld-pq .seg button{white-space:nowrap}
.res-tel{color:var(--bl-t);border-color:var(--bd-bl2,var(--bd));text-decoration:none;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.res-tel:hover{background:var(--ti-bl);border-color:var(--bl-t)}
.res-fin{font-size:.68rem;color:var(--mut2);font-variant-numeric:tabular-nums;letter-spacing:.02em;white-space:nowrap;margin-left:auto;cursor:help}
.res-dem{grid-column:1 / -1;margin-top:.45rem;font-size:.75rem;color:var(--sur-bl);background:var(--ti-bl);border-radius:.5rem;padding:.35rem .6rem}
.res-dem b{font-weight:600}

/* ce qui est vérifiable, dans la fiche : jamais un score opaque */
.compat{list-style:none;margin-top:.5rem;display:grid;gap:.3rem}
.compat li{font-size:.82rem;display:flex;gap:.5rem;align-items:flex-start;line-height:1.4}
.compat li i{flex:0 0 1rem;font-style:normal;font-weight:700;text-align:center;color:var(--mut2)}
.compat li.oui i{color:var(--vert)}
.compat li.non i{color:var(--rouge)}
.compat li.inc{color:var(--mut)}
.dem-t .non{color:var(--mut2)}

/* liste de démarches */
.dem-t{width:100%;border-collapse:collapse;font-size:.85rem}
.dem-t th,.dem-t td{padding:.55rem .6rem;border-bottom:1px solid var(--bd2);text-align:left;vertical-align:top}
.dem-t th{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--mut2);font-weight:600;white-space:nowrap}
.dem-t .num{text-align:right}
.dem-t td.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.dem-t .dem-e{font-weight:600;line-height:1.3}
.dem-t .dem-f{display:block;font-size:.7rem;color:var(--mut2);font-weight:400;margin-top:.1rem}
.dem-s{width:100%;min-width:11rem;margin:0;padding:.4rem 1.9rem .4rem .6rem;font-size:.8rem;border-radius:.6rem}
.dem-n{width:100%;min-width:11rem;margin:.35rem 0 0;padding:.4rem .6rem;font-size:.8rem;border-radius:.6rem}
.dem-t td.dem-x{text-align:right;white-space:nowrap}
.dem-t a[href^="tel:"],.dem-t .finess{white-space:nowrap}
.dem-t .x{font-size:1.1rem;line-height:1;color:var(--mut2)}
.cmp-f-r{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}

/* mes recherches */
.dossiers{margin-top:1.2rem;display:grid;gap:.5rem}
.dossiers .dos{border:1px solid var(--bd2);border-radius:var(--r2);padding:.7rem .8rem;display:flex;gap:.6rem;justify-content:space-between;align-items:flex-start}
.dossiers .dos-n{font-weight:600;font-size:.9rem;line-height:1.25}
.dossiers .dos-m{font-size:.72rem;color:var(--mut2);margin-top:.15rem}
.dossiers .dos-a{display:flex;flex-direction:column;gap:.3rem;align-items:flex-end;flex:0 0 auto}
.dossiers .dos-a button{min-height:32px}
.dossiers .vide{font-size:.85rem;color:var(--mut2)}

@media (max-width:720px){
  .pro-bandeau{padding:.9rem 1rem}
  .pro-b-a{width:100%}
  .pro-b-a .btn-w{flex:1 1 auto}
  /* le tableau des démarches devient une pile de fiches : plus de défilement latéral */
  .dem-t,.dem-t tbody,.dem-t tr,.dem-t td{display:block;width:100%}
  .dem-t thead{display:none}
  .dem-t tr{border:1px solid var(--bd2);border-radius:var(--r2);padding:.7rem .8rem;margin-bottom:.6rem}
  .dem-t td{border:0;padding:.15rem 0;text-align:left}
  .dem-t td.num{text-align:left}
  .dem-t td[data-l]::before{content:attr(data-l) ' : ';font-size:.72rem;color:var(--mut2)}
}

/* ---------- mobile : la fiche devient un panneau glissant ---------- */
@media (max-width:1039px){
  .col-detail{display:contents}
  .res{grid-template-columns:minmax(0,1fr) auto}
  .res-m{max-width:42vw}
  #pan-carte{order:-1}
  .atelier{display:flex;flex-direction:column}
  .atelier[data-vue="fiche"] #pan-carte{display:none}
  #map{height:min(48vh,420px)}
  #pan-fiche{position:fixed;left:0;right:0;bottom:0;z-index:2200;background:var(--surf);border-radius:1.1rem 1.1rem 0 0;box-shadow:0 -10px 30px rgba(var(--om),.25);max-height:92vh;height:42vh;display:flex;flex-direction:column;transition:height .22s ease-out}
  #pan-fiche.plein{height:92vh}
  #pan-fiche .fiche{overflow:auto;flex:1 1 auto;-webkit-overflow-scrolling:touch}
  .sheet-poignee{flex:0 0 auto;height:1.6rem;display:grid;place-items:center;cursor:grab;touch-action:none}
  .sheet-poignee::before{content:'';width:2.6rem;height:.28rem;border-radius:999px;background:var(--bd)}
  body.sheet .cmp-barre{display:none}
  @media (prefers-reduced-motion:reduce){#pan-fiche{transition:none}}
}
@media (min-width:1040px){.sheet-poignee{display:none}}

@media (max-width:640px){
  #layout{--pad:1rem;padding:1.6rem var(--pad) 4rem;gap:2.2rem}
  #bande-situation{padding:1.1rem}
  .head-side{align-items:flex-start;max-width:none}
  .lien-pro{text-align:left;align-self:stretch}
  .item-m{font-size:1.15rem}
}

/* ---------- impression : bandes 2 et 3 seulement ---------- */
@media print{
  @page{margin:12mm}
  body{background:var(--surf)}
  #bande-situation,#vide,#route-vide,.perf,.pro-bandeau,.lien-pro,#bande-sources,#bande-faq,#bande-guides,#bande-explorer,#site-footer,#consent-banner,.print-hide,.tile-warn,.legende,.t-a,.t-share,.infl-wrap,.res-act,.f-cta,.f-onglets,.sheet-poignee{display:none!important}
  #layout{max-width:none;padding:0;gap:1rem}
  #total-card{background:#2548FF!important;color:#fff!important;-webkit-print-color-adjust:exact;print-color-adjust:exact;box-shadow:none}
  .map-wrap{box-shadow:none}
  #map{height:110mm}
  .liste{grid-template-columns:1fr 1fr}
  .atelier{display:block}
  .col-detail{position:static;max-height:none}
  #pan-fiche{position:static;height:auto;max-height:none;box-shadow:none;border:1px solid #ddd;border-radius:0;margin-top:8mm}
  #pan-fiche[hidden]{display:none}
  .f-panneau{display:block!important}
  .barre{display:none!important}
  .prix-box,.dispo-box,.fam-box{break-inside:avoid}
  .chk[open] ul{display:grid}
  .item,.step,.cmp-wrap{box-shadow:none;border:1px solid #ddd;break-inside:avoid}
  .det[open] .det-in{display:block}
  a{text-decoration:none;color:inherit}
}

/* Le survol d'une carte reprend l'accent de sa section : bleu là où le titre
   l'est, corail dans « Parcourir sans calculer ». Sans cela toutes les cartes
   du site réagissaient du même gris, et rien ne rattachait la carte survolée
   à la bande où elle se trouve. La teinte reste très pâle : c'est un repère
   de survol, pas une sélection. */
.g-card{transition:background .16s ease-out,border-color .16s ease-out,box-shadow .16s ease-out}
#bande-guides .g-card:hover,#bande-sources .g-card:hover,
#bande-sources .non-sim li:hover,.src-card:hover{
  background:var(--ti-bl2);border-color:var(--bd-bl2);box-shadow:0 6px 16px rgba(37,72,255,.10)}
#bande-explorer .g-card:hover{
  background:var(--ti-co2);border-color:var(--bd-co);box-shadow:0 6px 16px rgba(255,99,71,.12)}
@media (prefers-reduced-motion:reduce){.g-card{transition:none}}

/* Bouton « Comparer vos devis ». Vert profond : distinct de l'ambre de « Vos
   retours » et du corail de l'action principale, et 6,6:1 sous du blanc. */
.nav-devis,.tb-devis{background:var(--ve-btn);color:#fff;border-radius:999px;font-weight:600;
  text-decoration:none;white-space:nowrap;transition:transform .14s ease-out,box-shadow .14s ease-out,filter .14s}
.nav-devis{padding:.2rem .8rem;box-shadow:0 2px 8px rgba(11,107,74,.28)}
.nav .nav-devis:hover,.nav-devis:hover,.tb-devis:hover{color:#fff;filter:brightness(1.12);
  transform:translateY(-1px);box-shadow:0 6px 16px rgba(11,107,74,.38)}
.tb-devis{padding:.5rem 1rem;font-size:.85rem;box-shadow:0 4px 14px rgba(11,107,74,.26)}
.tb-menu a.menu-devis{color:var(--ve-btn);font-weight:600}
@media (max-width:1180px){.tb-devis{display:none}}
@media (hover:none){.nav-devis:hover,.tb-devis:hover{transform:none}}
@media (prefers-reduced-motion:reduce){.nav-devis,.tb-devis{transition:none}
  .nav-devis:hover,.tb-devis:hover{transform:none}}

/* ---------- Interrupteur du mode sombre ----------
   Texte « Sombre » + curseur : l'état se lit sans survol ni infobulle.
   « button. » en tête : l'emporte sur .head-act .tb-icon et .top-in .tb-icon (seo.css).
   Contraste curseur / piste ≥ 3:1 dans les deux thèmes (WCAG 1.4.11). */
button.tb-icon.tb-sw{width:auto;height:34px;padding:0 .3rem 0 .75rem;display:inline-flex;align-items:center;
  gap:.5rem;border-radius:999px;font-family:inherit;font-size:.8rem;font-weight:600;white-space:nowrap;flex:0 0 auto}
button.tb-sw .sw-piste{position:relative;flex:0 0 auto;width:36px;height:20px;border-radius:999px;background:var(--mut);transition:background .2s}
button.tb-sw .sw-pouce{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;
  color:#0f172a;display:grid;place-items:center;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .2s}
button.tb-sw .sw-pouce svg{width:10px;height:10px}
button.tb-sw .ico-lune{display:none}
button.tb-sw .ico-soleil{display:block}
[data-theme="dark"] button.tb-sw .sw-piste{background:var(--bl-t)}
[data-theme="dark"] button.tb-sw .sw-pouce{transform:translateX(16px);background:var(--pg);color:var(--ink)}
[data-theme="dark"] button.tb-sw .ico-lune{display:block}
[data-theme="dark"] button.tb-sw .ico-soleil{display:none}
@media (prefers-reduced-motion:reduce){button.tb-sw .sw-piste,button.tb-sw .sw-pouce{transition:none}}

/* ---------- Barre de défilement sur téléphone : rien ne dépasse de l'écran ---------- */
@media (max-width:720px){
  .topbar button.tb-sw .sw-txt{display:none}
  .topbar button.tb-icon.tb-sw{padding:0 .3rem}
}
@media (max-width:480px){
  .tb-cta-plus{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
}

/* ---------- Refonte de l'accueil, lot 1 (29/09/2026) ----------
   Portée limitée à l'accueil (#bande-situation, en-tête, résultats) : site.css sert aussi
   les pages de contenu, qui ne doivent pas bouger. */
.sub-devis{margin-top:.5rem;font-size:.95rem;color:var(--mut)}
.sub-devis a{color:var(--bl-t);font-weight:600;text-underline-offset:3px}
.lien-pro{text-align:right;font-size:.85rem;font-weight:600;color:var(--bl-t);border:0;background:none;padding:0}
.lien-pro::after{content:' →';font-weight:400}
@media (max-width:640px){
  .head-side{flex-direction:row;flex-wrap:wrap;align-items:center;gap:.4rem 1rem}
  .lien-pro{text-align:left;align-self:auto}
}
/* Formulaire : trois questions, lisibles par un lecteur de 60 ans et plus. */
#bande-situation .grid-q{grid-template-columns:repeat(2,minmax(0,1fr))}
#bande-situation .grid-q .fld-gir{grid-column:1 / -1}
#bande-situation .grid4 .fld label,#bande-situation .grid3 .fld label,#bande-situation .fld-gir legend{font-size:1.06rem;line-height:1.3}
#bande-situation .grid4 .fld label,#bande-situation .grid3 .fld label{min-height:0}
#bande-situation .fld-h{font-size:.94rem;line-height:1.4;color:var(--mut)}
#bande-situation input,#bande-situation select{font-size:1.06rem;min-height:48px}
#bande-situation .seg button{font-size:.94rem;min-height:44px}
.fld-gir{margin:0}
.fld-gir legend{float:left;width:100%;padding:0;font-weight:600;color:var(--ink)}
.fld-gir legend+*{clear:both}
#gir-calc{margin-top:.7rem;display:grid;gap:.5rem;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr))}
#bande-situation #gir-calc label{display:flex;align-items:center;gap:.6rem;min-height:48px;padding:.55rem .8rem;border:1.5px solid var(--bd);border-radius:var(--r2);background:var(--surf);font-size:1rem;font-weight:500;color:var(--ink);cursor:pointer}
#bande-situation #gir-calc label:has(input:checked){border-color:var(--bl-t);background:var(--ti-bl)}
#gir-calc input{width:1.25rem;height:1.25rem;min-height:0;margin:0;flex:0 0 auto;accent-color:var(--bl)}
.gir-notif{margin-top:.7rem}
.gir-notif summary{cursor:pointer;font-size:.94rem;color:var(--bl-t);font-weight:600;min-height:44px;display:flex;align-items:center}
.gir-notif .seg{max-width:26rem}
@media (max-width:640px){
  #bande-situation .grid-q{grid-template-columns:minmax(0,1fr)}
  #gir-calc{grid-template-columns:minmax(0,1fr)}
}
/* Résultat : ce qui manque, dit sur chaque carte. */
.res-m .manque{display:block;margin-top:.3rem;font-size:.86rem;font-weight:700;white-space:normal}
.res-m .manque.ok{color:var(--sur-ve)}
/* Mobile : la liste d'abord ; la carte s'ouvre sur demande. */
.carte-mob{display:none}
@media (max-width:1039px){
  .seg-vue{display:none}
  .carte-mob{display:inline-flex;align-items:center}
  .carte-mob[aria-pressed="true"]{border-color:var(--bl-t);color:var(--bl-t)}
  .atelier:not(.carte-on) #pan-carte{display:none}
}
/* Résultat : trois repères (le moins cher, le plus proche, le prix courant) au lieu d'une
   fourchette qui se lisait comme une incertitude. Cliquer une tuile ouvre la fiche. */
#res-chiffre.tuiles{font-family:inherit;font-size:1rem;font-weight:400;letter-spacing:0;line-height:1.35;margin-top:.7rem}
.t-tuiles{display:grid;gap:.7rem;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));max-width:56rem}
.t-tuile{display:flex;flex-direction:column;gap:.2rem;text-align:left;font:inherit;color:#fff;background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.3);border-radius:14px;padding:.8rem 1rem;min-width:0}
/* survol : contour blanc net et fond qui s'éclaire en fondu (29/09/2026) */
button.t-tuile{cursor:pointer;transition:background .35s ease,border-color .35s ease,box-shadow .35s ease,transform .35s ease}
button.t-tuile:hover,button.t-tuile:focus-visible{background:rgba(255,255,255,.26);border-color:#fff;
  box-shadow:0 0 0 1px #fff,0 0 22px rgba(255,255,255,.45),0 10px 24px rgba(10,20,90,.25);transform:translateY(-2px);outline:none}
button.t-tuile:active{transform:translateY(0);background:rgba(255,255,255,.32)}
@media (prefers-reduced-motion:reduce){button.t-tuile{transition:none}button.t-tuile:hover,button.t-tuile:focus-visible{transform:none}}
.t-tl{font-size:.9rem;color:rgba(255,255,255,.88)}
.t-tuile b{font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:clamp(1.6rem,3.2vw,2.2rem);line-height:1.1;letter-spacing:-.02em}
.t-tuile b small{font-size:.5em;font-weight:600;letter-spacing:0;margin-left:.15em}
.t-ts{font-size:.85rem;color:rgba(255,255,255,.85);overflow-wrap:anywhere}
@media (max-width:640px){.t-tuile{padding:.65rem .85rem}}
/* la colonne du texte peut rétrécir : sans min-width:0, la grille des tuiles imposait sa
   largeur « tout sur une ligne » et débordait de l'encadré sur mobile */
.t-row>div:first-child{min-width:0;flex:1 1 20rem}
@media (max-width:640px){.t-tuiles{grid-template-columns:minmax(0,1fr)}}
/* ---------- Lexique (29/09/2026) ----------
   Mot du lexique : soulignement pointillé discret (un fond coloré serait pris pour de la
   publicité), bulle de définition au survol ou au focus clavier, clic vers /lexique/#terme. */
html body a.lx{color:inherit;text-decoration:underline dotted;text-decoration-thickness:1.5px;text-decoration-color:var(--bl-t);text-underline-offset:.22em;position:relative}
html body a.lx:hover{color:var(--bl-t)}
a.lx::after{content:attr(data-def);position:absolute;left:0;bottom:calc(100% + 8px);z-index:60;width:max-content;max-width:min(19rem,78vw);
  padding:.55rem .75rem;border-radius:10px;background:var(--ink);color:var(--surf);font:400 .86rem/1.4 Inter,system-ui,sans-serif;
  letter-spacing:0;text-align:left;white-space:normal;box-shadow:0 10px 24px rgba(0,0,0,.22);opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .12s ease-out}
@media (hover:hover){a.lx:hover::after{opacity:1;visibility:visible}}
/* Bulle placée par script (30/09/2026) : fixée à l'écran, jamais coupée par un panneau qui défile,
   décalée pour rester dans la fenêtre et retournée sous le mot s'il n'y a pas de place au-dessus.
   Sans script, la bulle en CSS ci-dessus sert de repli. */
html.lx-js a.lx::after{display:none}
.lx-bulle{position:fixed;left:0;top:0;z-index:3000;width:max-content;max-width:min(19rem,calc(100vw - 16px));padding:.55rem .75rem;border-radius:10px;
  background:var(--ink);color:var(--surf);font:400 .86rem/1.4 Inter,system-ui,sans-serif;letter-spacing:0;text-align:left;white-space:normal;
  box-shadow:0 10px 24px rgba(0,0,0,.22);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s ease-out}
.lx-bulle.on{opacity:1;visibility:visible}
@media (prefers-reduced-motion:reduce){.lx-bulle{transition:none}}
@media print{.lx-bulle{display:none}}
a.lx:focus-visible::after{opacity:1;visibility:visible}
@media (prefers-reduced-motion:reduce){a.lx::after{transition:none}}
@media print{a.lx{text-decoration:none}a.lx::after{display:none}}
/* page lexique */
.lx-nav p{font-size:.95rem}
.lx-alpha{list-style:none;padding:0;margin:.4rem 0 0;display:grid;gap:.35rem}
.lx-alpha b{display:inline-block;min-width:1.4rem;color:var(--bl-t)}
.lx-terme{padding:1rem 0 .9rem;border-top:1px solid var(--bd2);scroll-margin-top:5rem}
.lx-terme h3{font-size:1.12rem;margin:0 0 .3rem}
.lx-terme p{margin:.3rem 0}
.lx-pv{color:var(--txt2)}
.lx-src,.lx-prud{font-size:.86rem;color:var(--mut)}
.lx-terme:target{background:var(--ti-bl);border-radius:12px;padding:1rem;border-top-color:transparent}

/* garde-fou : la fiche ne défile jamais horizontalement (une information cachée à droite est une information perdue) */
#fiche,#pan-fiche .fiche{overflow-x:hidden}

/* Fiche simplifiée (29/09/2026) : hypothèse de calcul en étiquette, à côté du montant */
.f-hypo{display:inline-flex;align-items:center;gap:.4rem;margin-top:.45rem;font-size:.76rem;font-weight:600;color:var(--sur-or);background:var(--ti-or);border-radius:6px;padding:.2rem .55rem}
.lien-b{border:0;background:none;padding:0;font:inherit;font-weight:700;color:var(--bl-t);text-decoration:underline;cursor:pointer}
.f-hyp summary{font-size:.76rem}

/* Vignette des cartes de résultats (30/09/2026) : photo à gauche du nom, crédit sur l'image.
   Badges et boutons restent alignés sur la colonne du texte. */
.res.avec-ph{grid-template-columns:120px minmax(0,1fr) auto;column-gap:1rem}
.res.avec-ph .res-ph{grid-column:1;grid-row:1 / span 3;align-self:start}
.res.avec-ph .res-n,.res.avec-ph .res-l{grid-column:2}
.res.avec-ph .res-m{grid-column:3}
.res.avec-ph .res-b,.res.avec-ph .res-act,.res.avec-ph .res-pourquoi,.res.avec-ph .res-dem{grid-column:2 / -1}
.res-ph{width:120px;display:flex;flex-direction:column;gap:.3rem}
.res-ph-img{position:relative;display:block;width:120px;height:96px;border-radius:10px;overflow:hidden;background:var(--bg)}
.res-ph-img img{display:block;width:100%;height:100%;object-fit:cover}
.res-ph-img small{position:absolute;left:0;right:0;bottom:0;font-size:.56rem;line-height:1.3;color:#fff;
  background:linear-gradient(transparent,rgba(0,0,0,.72));padding:.7rem .35rem .15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.res-ph-vide{display:grid;place-items:center;color:var(--mut2);background:var(--ti-gr);border:1px dashed var(--bd)}
.res-ph-vide svg{width:40px;height:40px;opacity:.7}
.res-gest{font-size:.64rem;line-height:1.25;color:var(--mut);text-align:center;text-decoration:underline dotted;text-underline-offset:.18em}
.res-gest:hover{color:var(--bl-t)}
@media (max-width:640px){
  /* mobile : le montant passe sous le nom, à côté de la vignette ; le nom garde toute la largeur */
  .res.avec-ph{grid-template-columns:84px minmax(0,1fr);column-gap:.7rem}
  .res.avec-ph .res-m{grid-column:2;grid-row:auto;text-align:left;max-width:none;margin-top:.35rem}
  .res.avec-ph .res-ph{grid-row:1 / span 3}
  .res-ph,.res-ph-img{width:84px}.res-ph-img{height:68px}
  .res-ph-img small{font-size:.5rem;white-space:normal;overflow:visible;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .res-gest{font-size:.6rem}
}
@media print{.res-ph{display:none}.res.avec-ph{grid-template-columns:1fr auto}.res.avec-ph .res-n,.res.avec-ph .res-l,.res.avec-ph .res-b{grid-column:1}.res.avec-ph .res-m{grid-column:2}}

/* Guidage des champs clés (30/09/2026) : le champ à remplir « respire » (liseret et halo bleus,
   2,6 s par cycle) jusqu'à ce qu'on clique dedans ; une coche verte ronde confirme la saisie. */
@keyframes respire{
  0%,100%{border-color:rgba(37,72,255,.35);box-shadow:0 0 0 0 rgba(37,72,255,0)}
  50%{border-color:var(--bl-t);box-shadow:0 0 0 4px rgba(37,72,255,.16),0 0 18px rgba(37,72,255,.28)}
}
input.guide{animation:respire 2.6s ease-in-out infinite}
input.guide:focus{animation:none}
@media (prefers-reduced-motion:reduce){
  input.guide{animation:none;border-color:var(--bl-t);box-shadow:0 0 0 3px rgba(37,72,255,.14)}
}
.coche-ok{position:absolute;width:26px;height:26px;margin-top:-13px;pointer-events:none;z-index:5;
  animation:coche-vie 1.05s ease-out forwards}
.coche-ok svg{display:block;width:100%;height:100%}
.coche-ok circle{fill:#12a150}
.coche-ok path{fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:16;stroke-dashoffset:16;animation:coche-trait .3s .12s ease-out forwards}
@keyframes coche-vie{
  0%{opacity:0;transform:scale(.4)}
  18%{opacity:1;transform:scale(1.15)}
  30%{transform:scale(1)}
  70%{opacity:1;transform:scale(1)}
  100%{opacity:0;transform:scale(.85)}
}
@keyframes coche-trait{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){
  .coche-ok{animation:coche-fondu 1s linear forwards}.coche-ok path{animation:none;stroke-dashoffset:0}
  @keyframes coche-fondu{0%,70%{opacity:1}100%{opacity:0}}
}

/* Bloc de réassurance (06/10/2026) : pied de page et sous les résultats. Horizontal sur ordinateur,
   empilé et centré sur mobile ; couleurs du thème, donc clair et sombre. */
.reassur{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1rem;width:100%}
.reassur:not(.reassur-res){padding-bottom:1.1rem;border-bottom:1px solid var(--bd)}
#liste:empty~.reassur-res{display:none}
.reassur .re-badge{display:inline-flex;align-items:center;gap:.6rem;padding:.55rem .9rem .55rem .6rem;border:1px solid var(--bd);
  border-radius:12px;background:var(--surf);color:var(--ink);text-decoration:none;line-height:1.2;
  transition:border-color .2s,box-shadow .2s,transform .2s}
.reassur .re-badge:hover{color:var(--ink);border-color:var(--bl-t);box-shadow:0 6px 16px rgba(37,72,255,.12);transform:translateY(-1px)}
.reassur .re-badge:focus-visible{outline:2px solid var(--bl-t);outline-offset:2px}
.re-ico{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;flex:0 0 auto}
.re-ico svg{width:20px;height:20px}
.re-tp .re-ico{background:#00b67a;color:#fff}
.re-dg .re-ico{background:var(--ti-bl);color:var(--bl-t)}
.re-txt b{display:block;font-size:.84rem;font-weight:700}
.re-txt small{display:block;font-size:.72rem;color:var(--mut);margin-top:.1rem}
.re-eng{display:flex;flex-wrap:wrap;gap:.3rem .9rem;margin:0 0 0 auto;font-size:.8rem;font-weight:700;color:var(--ink)}
.re-eng span{display:inline-flex;align-items:center;gap:.35rem}
.re-eng span::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--co)}
.reassur-res{margin-top:1.2rem;padding:1rem;border:1px dashed var(--bd);border-radius:var(--r2);background:var(--bg)}
@media (max-width:640px){
  .reassur{flex-direction:column;align-items:stretch;text-align:left}
  .reassur .re-badge{justify-content:flex-start}
  .re-eng{margin:0;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.reassur .re-badge{transition:none}.reassur .re-badge:hover{transform:none}}
@media print{.reassur{display:none}}

/* ---------- Styles propres aux pages de contenu (villes, départements, fiches, guides) ---------- */
.wrap{--pad:1.25rem;max-width:min(1080px,100%);margin:0 auto;padding:1.5rem var(--pad) 4rem;overflow-x:clip;display:block;gap:0}
@media (max-width:640px){.wrap{--pad:1rem}}

/* en-tête commun */
.top{border-bottom:1px solid var(--bd2);background:var(--surf)}
.top-in{max-width:min(1080px,100%);margin:0 auto;padding:.8rem 1.25rem;display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;align-items:center}
.logo{font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:1rem;text-decoration:none;letter-spacing:-.02em}
.logo span{color:var(--bl)}
.top nav{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;font-size:.85rem;font-weight:500;color:var(--mut);margin-left:auto}
.top nav a{text-decoration:none}
.top nav a:hover{color:var(--bl)}

/* fil d'Ariane */
.fil-ariane{font-size:.78rem;color:var(--mut2);margin-bottom:1rem;display:flex;flex-wrap:wrap;gap:.3rem}
.fil-ariane a{color:var(--mut);text-decoration:none}
.fil-ariane a:hover{color:var(--bl);text-decoration:underline;text-underline-offset:3px}
.fil-ariane span[aria-current]{color:var(--ink)}

/* titres de page */
.p-h1{font-size:clamp(1.6rem,4vw,2.5rem)}
.p-sub{margin-top:.6rem;color:var(--mut);font-size:1rem;max-width:70ch}
.p-maj{margin-top:.5rem;font-size:.75rem;color:var(--mut2)}
.wrap h2{font-size:clamp(1.25rem,2.6vw,1.6rem);margin-top:2.2rem}
.wrap h2 .n{display:none}
.wrap h3{font-size:1.02rem;margin-top:1.2rem}
.wrap p{margin-top:.7rem;color:var(--txt2)}
.wrap section>p:first-child{margin-top:.8rem}
.wrap ul,.wrap ol{margin-top:.7rem;padding-left:1.2rem;color:var(--txt2)}
.wrap li{margin-top:.3rem}
.wrap a{color:var(--bl);text-decoration:underline;text-underline-offset:3px}
.wrap .cta-b,.wrap .cta-s,.wrap .lien-c,.wrap .puces a,.wrap .tbl a,.wrap .kpi a{text-decoration:none}
.wrap .cta-b{color:#fff}
.wrap .cta-s,.wrap .lien-c,.wrap .puces a{color:var(--ink)}
.wrap .lien-c:hover,.wrap .puces a:hover,.wrap .cta-s:hover{color:var(--bl)}
.wrap .tbl a:hover{text-decoration:underline}
.wrap section{margin-top:2.2rem}
.wrap section>h2:first-child{margin-top:0}

/* chiffres clés */
.kpis{margin-top:1.4rem;display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.kpi{background:var(--bg);border:1px solid var(--bd2);border-radius:var(--r2);padding:.9rem 1rem}
.kpi b{display:block;font-family:Poppins,Inter,sans-serif;font-size:1.5rem;line-height:1.1;letter-spacing:-.02em}
.kpi span{display:block;margin-top:.3rem;font-size:.78rem;color:var(--mut)}
.kpi.bl b{color:var(--bl)}

/* appel à l'action */
.cta{margin-top:1.4rem;display:flex;flex-wrap:wrap;gap:.7rem;align-items:center}
.cta-b{display:inline-block;border:0;border-radius:999px;background:var(--co);color:#fff;font:inherit;font-weight:600;font-size:.95rem;padding:.8rem 1.5rem;text-decoration:none;box-shadow:0 10px 15px -3px rgba(255,99,71,.3)}
.cta-b:hover{filter:brightness(1.08);color:#fff}
.cta-s{display:inline-block;border:1.5px solid var(--bd);border-radius:999px;background:var(--surf);font-size:.9rem;font-weight:600;padding:.7rem 1.2rem;text-decoration:none;color:var(--ink)}
.cta-s:hover{border-color:var(--bl);color:var(--bl)}
.cta-n{font-size:.78rem;color:var(--mut2);flex-basis:100%}

/* tableau d'établissements — devient une liste de cartes sur mobile */
.tbl-wrap{margin-top:1rem;overflow-x:auto}
table.tbl{width:100%;border-collapse:collapse;font-size:.88rem}
.tbl caption{text-align:left;font-size:.78rem;color:var(--mut2);padding-bottom:.5rem}
.tbl th{text-align:left;font-weight:600;color:var(--mut);padding:.5rem .6rem;border-bottom:1.5px solid var(--bd);white-space:nowrap}
.tbl td{padding:.55rem .6rem;border-bottom:1px solid var(--bd2);vertical-align:top}
.tbl td.num,.tbl th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl tr:hover td{background:var(--bg)}
.tbl a{font-weight:600;text-decoration:none}
.tbl a:hover{text-decoration:underline}
.oui{color:var(--vert);font-weight:600}
.non{color:var(--mut2)}
@media (max-width:720px){
  .tbl,.tbl tbody,.tbl tr,.tbl td{display:block;width:100%}
  .tbl caption{display:block;width:100%;text-align:left}
  .tbl thead{position:absolute;left:-9999px}
  .tbl tr{background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r2);padding:.8rem;margin-top:.7rem}
  .tbl td{border:0;padding:.15rem 0;display:flex;justify-content:space-between;gap:1rem;text-align:right}
  .tbl td::before{content:attr(data-l);color:var(--mut);font-size:.78rem;text-align:left;flex:0 0 auto}
  .tbl td:first-child{display:block;text-align:left;font-size:1rem;margin-bottom:.3rem}
  .tbl td:first-child::before{display:none}
  .tbl tr:hover td{background:transparent}
}

/* fiche établissement */
.f-head{margin-top:1.2rem;background:var(--bg);border:1px solid var(--bd2);border-radius:var(--r);padding:1.2rem}
.f-grid{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));margin-top:.4rem}
.f-grid div b{display:block;font-family:Poppins,Inter,sans-serif;font-size:1.15rem}
.f-grid div span{display:block;font-size:.75rem;color:var(--mut);margin-top:.15rem}
.f-adr{margin-top:.9rem;font-size:.88rem;color:var(--mut)}
.f-adr a{font-weight:600}

/* encadrés */
.note{margin-top:1rem;background:var(--ti-bl);border-radius:var(--r2);padding:.8rem 1rem;font-size:.88rem;color:var(--txt2)}
.note b{color:var(--ink)}
.att{margin-top:1rem;background:var(--ti-or);border-radius:var(--r2);padding:.8rem 1rem;font-size:.85rem;color:var(--sur-or)}
.def{margin-top:.8rem;font-size:.85rem;color:var(--mut);background:var(--surf);border-left:3px solid var(--bl);padding:.5rem .8rem}

/* liens de maillage */
.liens-grid{margin-top:1rem;display:grid;gap:.6rem;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
/* déroulé en étapes numérotées : une étape = un paragraphe, jamais plus */
.wrap ol.etapes{margin-top:1rem;padding-left:0;list-style:none;counter-reset:et;display:grid;gap:.7rem}
.wrap ol.etapes li{counter-increment:et;background:var(--bg);border-radius:var(--r2);padding:.8rem 1rem .8rem 3rem;position:relative;font-size:.9rem}
.wrap ol.etapes li::before{content:counter(et);position:absolute;left:.8rem;top:.8rem;width:1.6rem;height:1.6rem;border-radius:999px;background:var(--bl);color:#fff;display:grid;place-items:center;font-size:.8rem;font-weight:700}
.lien-c{display:block;background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r2);padding:.7rem .9rem;text-decoration:none;font-size:.88rem}
.lien-c:hover{background:var(--bg);border-color:var(--bl)}
/* même relief léger que sur le calculateur : transform et ombre seulement */
.kpi,.lien-c,.tbl-wrap,.src-bloc{transition:transform .16s ease-out,box-shadow .16s ease-out,border-color .16s ease-out}
.kpi:hover,.lien-c:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(var(--om),.08)}
.wrap ol.etapes li{transition:transform .16s ease-out,box-shadow .16s ease-out}
.wrap ol.etapes li:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(var(--om),.08)}
@media (prefers-reduced-motion:reduce){.kpi,.lien-c,.wrap ol.etapes li{transition:none}
  .kpi:hover,.lien-c:hover,.wrap ol.etapes li:hover{transform:none}}
@media (hover:none){.kpi:hover,.lien-c:hover,.wrap ol.etapes li:hover{transform:none;box-shadow:none}}
.lien-c b{display:block;font-weight:600}
.lien-c span{display:block;font-size:.75rem;color:var(--mut2);margin-top:.15rem}
.puces{margin-top:.8rem;display:flex;flex-wrap:wrap;gap:.4rem}
.puces a{display:inline-block;background:var(--surf);border:1px solid var(--bd2);border-radius:999px;padding:.3rem .8rem;font-size:.82rem;text-decoration:none;color:var(--txt2)}
.puces a:hover{border-color:var(--bl);color:var(--bl)}

/* questions fréquentes */
.qa{margin-top:1rem;display:grid;gap:.6rem}
.qa details{background:var(--surf);border:1px solid var(--bd2);border-radius:var(--r2);padding:.9rem 1.1rem}
.qa summary{cursor:pointer;font-weight:600;font-size:.95rem;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:'▾';color:var(--bl)}
.qa p{font-size:.9rem}

/* sources */
.src-bloc{margin-top:2rem;border-top:1px solid var(--bd2);padding-top:1rem;font-size:.8rem;color:var(--mut)}
.src-bloc b{color:var(--mut)}
.src-bloc a{color:var(--mut)}

/* pied de page commun */
.foot{border-top:1px solid var(--bd);background:var(--bg)}
.foot-in{max-width:min(1080px,100%);margin:0 auto;padding:1.8rem 1.25rem;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center}
.foot nav{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;font-size:.85rem;color:var(--mut)}
.foot a{text-decoration:none;color:inherit}
.foot a:hover{color:var(--bl)}
.foot p{font-size:.75rem;color:var(--mut2)}

/* en-tête des pages de contenu : le bouton de thème s'aligne à droite de la navigation.
   La règle .top-in d'origine (largeur, marges, retour à la ligne) n'est pas retouchée. */
.top-in .tb-icon{width:32px;height:32px;flex:0 0 auto;margin-left:auto}
.top-in .tb-icon svg{width:.95rem;height:.95rem}
@media (max-width:720px){.top-in .tb-icon{margin-left:0}}

/* Ancres (#population, #unites-specialisees…) : le titre ne passe pas sous l’en-tête collant (29/09/2026) */
main section[id]{scroll-margin-top:5rem}