/* Le Chauffagiste du Coin : sobre et lisible. Public Sans (police libre conçue pour les sites de service public, sans identité d'État),
   fond blanc, texte noir, filets gris, un seul bleu pour les actions. La couleur ne sert qu'à l'information (graphique des énergies, état RGE). */
:root {
  --fond: #ffffff; --fond-2: #f6f6f6; --encre: #161616; --encre-2: #3a3a3a; --encre-3: #666666;
  --trait: #dddddd; --trait-champ: #8a8a8a;
  --bleu: #1d4f8c; --bleu-fonce: #153b69; --bleu-doux: #eef3f9;
  --vert: #1e7b45; --rouge: #c0262d;
  --police: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --r: 4px;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fond); color: var(--encre); font: 400 1.0625rem/1.6 var(--police); font-variant-numeric: lining-nums; }
[hidden] { display: none !important; }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ico { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
img, svg { max-width: 100%; }
a { color: var(--bleu); text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { color: var(--bleu-fonce); text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--bleu); outline-offset: 2px; }
legend:focus, .merci:focus { outline: none; }
h1, h2, h3 { font-weight: 700; line-height: 1.2; letter-spacing: -.015em; margin: 0 0 .6em; }
h1 { font-size: clamp(1.85rem, 1.4rem + 1.9vw, 2.55rem); }
h2 { font-size: clamp(1.3rem, 1.18rem + .55vw, 1.55rem); }
h3 { font-size: 1.1rem; letter-spacing: -.005em; }
p { margin: 0 0 .8em; }
.large { max-width: 1140px; margin: 0 auto; padding: 0 16px; }
@media (min-width: 760px) { .large { padding: 0 24px; } }
.etroit { max-width: 820px; }
.aller-contenu { position: absolute; left: -999px; }
.aller-contenu:focus { left: 16px; top: 8px; z-index: 50; background: var(--fond); padding: .5rem .8rem; }
.note { font-size: .9rem; color: var(--encre-3); }
.chapeau { font-size: 1.15rem; color: var(--encre-2); max-width: 62ch; }
.facultatif { font-weight: 400; color: var(--encre-3); }
.source { display: flex; align-items: flex-start; gap: .45rem; margin: .2rem 0 0; font-size: .9rem; color: var(--encre-2); }
.source .ico { color: var(--vert); margin-top: .2rem; }

/* en-tête */
.entete { background: var(--fond); border-bottom: 1px solid var(--trait); position: sticky; top: 0; z-index: 30; }
.entete .large { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 68px; }
.marque { display: flex; align-items: center; gap: .6rem; text-decoration: none; color: var(--encre); }
.marque:hover { color: var(--encre); }
.logo { width: 34px; height: 34px; flex: none; }
.marque-nom { font-weight: 700; font-size: 1.1rem; letter-spacing: -.01em; line-height: 1; white-space: nowrap; }
.marque-nom b, .pied-marque b { font-weight: 700; color: inherit; }
.nav-large { display: none; align-items: center; gap: .1rem; }
.nav-large a { font-weight: 600; font-size: .95rem; color: var(--encre); text-decoration: none; padding: .55rem .75rem; border-radius: var(--r); white-space: nowrap; }
.nav-large a:hover { background: var(--fond-2); }
.nav-large a[aria-current] { box-shadow: inset 0 -2px 0 var(--bleu); border-radius: 0; }
.nav-large .nav-devis, .nav-mobile .nav-devis { background: var(--bleu); color: #fff; margin-left: .6rem; }
.nav-large .nav-devis:hover { background: var(--bleu-fonce); color: #fff; }
.nav-mobile > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: .55rem; font: 600 1rem var(--police);
  border: 1px solid var(--trait-champ); border-radius: var(--r); padding: .5rem .8rem; min-height: 44px; }
.nav-mobile > summary::-webkit-details-marker { display: none; }
.burger, .burger::before, .burger::after { display: block; width: 18px; height: 2px; background: var(--encre); position: relative; content: ""; }
.burger::before { position: absolute; top: -6px; } .burger::after { position: absolute; top: 6px; }
.nav-mobile[open] .burger { background: transparent; }
.nav-mobile[open] .burger::before { top: 0; transform: rotate(45deg); } .nav-mobile[open] .burger::after { top: 0; transform: rotate(-45deg); }
.nav-mobile nav { position: absolute; left: 0; right: 0; top: 100%; background: var(--fond); border-bottom: 1px solid var(--trait);
  display: flex; flex-direction: column; padding: .2rem 16px 1rem; }
.nav-mobile nav a { font-weight: 600; color: var(--encre); text-decoration: none; padding: .9rem .1rem; border-bottom: 1px solid var(--trait); }
.nav-mobile nav .nav-devis { margin: 1rem 0 0; border: 0; border-radius: var(--r); text-align: center; color: #fff; }
@media (min-width: 1000px) { .nav-large { display: flex; } .nav-mobile { display: none; } }

/* accueil */
.une { padding: 2.6rem 0 3rem; border-bottom: 1px solid var(--trait); }
.une-grille { display: grid; gap: 2rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .une-grille { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 3.5rem; align-items: start; } }
.une h1 { max-width: 15ch; }
.une .source { margin-top: 1rem; }
.une-cote { display: grid; gap: 1.2rem; }
.une-carte { border: 1px solid var(--trait); border-radius: var(--r); padding: 1.2rem 1.3rem; }
.une-carte-titre { font-weight: 700; font-size: 1.1rem; margin-bottom: .35rem; }
.bloc-large { padding: 2.6rem 0 1rem; }
.deps { list-style: none; padding: 0; margin: 0; display: grid; column-gap: 2.5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); border-top: 1px solid var(--trait); }
.deps li { border-bottom: 1px solid var(--trait); }
.deps a { display: grid; grid-template-columns: 2.4rem minmax(0, 1fr) auto; align-items: center; gap: .3rem .8rem; padding: .85rem .1rem; min-height: 56px; text-decoration: none; color: var(--encre); }
.deps a:hover .dep-nom { text-decoration: underline; text-underline-offset: .2em; }
.dep-code { font-weight: 600; color: var(--encre-3); font-variant-numeric: tabular-nums; }
.dep-nom { font-weight: 700; color: var(--bleu); overflow-wrap: anywhere; }
.dep-n { font-size: .92rem; color: var(--encre-2); text-align: right; white-space: nowrap; }
.deps-detail a { grid-template-columns: 2.4rem minmax(0, 1fr); padding: 1rem .1rem; }
.dep-chiffres { grid-column: 2; display: flex; flex-wrap: wrap; gap: .1rem 1.1rem; font-size: .92rem; color: var(--encre-2); }
.dep-chiffres b { color: var(--encre); font-weight: 600; }

/* recherche */
.recherche { position: relative; max-width: 580px; margin-top: 1.6rem; }
.recherche label { display: block; font-weight: 600; margin-bottom: .45rem; }
.recherche-champ { display: flex; }
.recherche input { flex: 1; min-width: 0; width: 100%; font: 400 1.0625rem var(--police); color: var(--encre); padding: .7rem .9rem; min-height: 52px;
  border: 1px solid var(--trait-champ); border-right: 0; border-radius: var(--r) 0 0 var(--r); background: var(--fond); }
.recherche input:focus { outline: 2px solid var(--bleu); outline-offset: -2px; }
.recherche button { border: 0; background: var(--bleu); color: #fff; font: 600 1rem var(--police); padding: 0 1.3rem; border-radius: 0 var(--r) var(--r) 0; cursor: pointer; }
.recherche button:hover { background: var(--bleu-fonce); }
.suggestions { list-style: none; margin: .25rem 0 0; padding: .25rem; position: absolute; left: 0; right: 0; z-index: 20; background: var(--fond);
  border: 1px solid var(--trait-champ); border-radius: var(--r); box-shadow: 0 6px 16px rgba(0, 0, 0, .08); }
.suggestions li { padding: .6rem .7rem; cursor: pointer; border-radius: 2px; }
.suggestions li[aria-selected], .suggestions li:hover { background: var(--fond-2); }
.suggestions span { color: var(--encre-3); font-size: .9rem; }
.suggestions small { display: block; color: var(--encre-3); font-size: .85rem; }

/* pages */
.tete { padding: 1.5rem 0 1.4rem; }
.ariane { font-size: .875rem; color: var(--encre-3); margin-bottom: 1.1rem; }
.ariane a { color: var(--encre-2); }
.deux-col { display: grid; gap: 2rem; padding-bottom: 3rem; }
.deux-col > * { min-width: 0; }
@media (min-width: 980px) { .deux-col { grid-template-columns: minmax(0, 1fr) 320px; gap: 3.5rem; align-items: start; } .cta-flux { display: none; } }
.bloc { border-top: 1px solid var(--trait); padding: 1.8rem 0 .8rem; }
.deux-col > div > .bloc:first-child, .photo + .bloc, .tete + .bloc { border-top: 0; padding-top: .2rem; }
.colonne { display: grid; gap: 1.2rem; align-content: start; }
.colonne .bloc { border: 1px solid var(--trait); border-radius: var(--r); padding: 1.15rem 1.2rem .6rem; }
.colonne .bloc h2 { font-size: 1.15rem; }
.critere { margin: 1rem 0 1.4rem; }
.btn, .btn-sec { display: inline-flex; align-items: center; justify-content: center; text-align: center; gap: .5rem; min-height: 48px; padding: .65rem 1.3rem; border-radius: var(--r);
  border: 1px solid transparent; font: 600 1rem var(--police); text-decoration: none; cursor: pointer; }
.btn { background: var(--bleu); color: #fff; }
.btn:hover { background: var(--bleu-fonce); color: #fff; }
.btn-sec { background: var(--fond); color: var(--bleu); border-color: var(--bleu); }
.btn-sec:hover { background: var(--bleu-doux); color: var(--bleu-fonce); }
.btn[disabled] { opacity: .6; cursor: wait; }
.btn-lien { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; padding: .4rem .1rem; border: 0; background: none; color: var(--bleu);
  font: 600 1rem var(--police); cursor: pointer; text-decoration: underline; text-underline-offset: .2em; text-decoration-thickness: 1px; }

/* filtres */
.filtres { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 1rem; }
.chip { font: 600 .9rem var(--police); border: 1px solid var(--trait-champ); background: var(--fond); color: var(--encre); border-radius: var(--r);
  padding: .35rem .75rem; min-height: 40px; cursor: pointer; }
.chip span { color: var(--encre-3); font-weight: 400; }
.chip:hover { border-color: var(--encre); }
.chip[aria-pressed=true] { background: var(--encre); border-color: var(--encre); color: #fff; }
.chip[aria-pressed=true] span { color: #c8c8c8; }

/* fiches entreprises : des lignes séparées par un filet */
.ents { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--trait); }
.ent { display: grid; gap: .85rem; padding: 1.15rem 0 1.2rem; border-bottom: 1px solid var(--trait); scroll-margin-top: 84px; }
@media (min-width: 700px) { .ent { grid-template-columns: minmax(0, 1fr) 210px; gap: 1.5rem; align-items: start; } }
.ent[hidden] { display: none; }
.ent h3 { margin: 0 0 .2rem; font-size: 1.12rem; overflow-wrap: anywhere; }
.ent-corps p { margin: 0; }
.ent-lieu { color: var(--encre-2); font-size: .97rem; }
.ent-lieu b { color: var(--encre); font-weight: 600; }
.ent-spe { margin-top: .35rem !important; font-size: .92rem; color: var(--encre-2); }
.ent-fin { display: flex; align-items: center; gap: .35rem; margin-top: .4rem !important; font-size: .85rem; color: var(--encre-3); }
.ent-fin .ico { width: 16px; height: 16px; color: var(--vert); }
.ent-act { display: grid; gap: .3rem; align-content: start; }
.act-tel { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 46px; padding: .5rem 1rem; border: 1px solid var(--bleu);
  border-radius: var(--r); color: var(--bleu); font-weight: 700; text-decoration: none; font-variant-numeric: tabular-nums; white-space: nowrap; }
.act-tel:hover { background: var(--bleu); color: #fff; }
.act-liens { display: flex; flex-wrap: wrap; gap: 0 1.1rem; }
.act-lien { display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; font-size: .92rem; }
.ent:target { background: var(--bleu-doux); box-shadow: -12px 0 0 var(--bleu-doux), 12px 0 0 var(--bleu-doux); }

/* signature : comment se chauffent les maisons (la seule couleur du site, parce qu'elle porte une information) */
.chauffage { margin: .4rem 0 1.1rem; }
.barre { display: flex; height: 16px; gap: 2px; border-radius: 2px; overflow: hidden; background: var(--trait); }
.seg { min-width: 3px; }
.legende { list-style: none; padding: 0; margin: .8rem 0 0; display: grid; gap: .3rem 1.4rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); }
.legende li { display: flex; align-items: center; gap: .5rem; font-size: .95rem; border-bottom: 1px solid var(--trait); padding: .25rem 0; }
.legende b { margin-left: auto; font-weight: 600; font-variant-numeric: tabular-nums; }
.pastille { width: 10px; height: 10px; border-radius: 2px; flex: none; }

/* encarts */
.cta-devis { background: var(--fond-2); border-radius: var(--r); padding: 1.2rem 1.25rem; display: grid; gap: .8rem; }
.cta-titre { font-weight: 700; font-size: 1.12rem; line-height: 1.3; margin: 0 0 .3rem; }
.cta-devis p { margin: 0; }
.cta-devis .btn { justify-self: start; }
.cta-flux .cta-devis { margin: 1.6rem 0; }
.large > .cta-devis, main > .cta-devis { margin: 2rem 0 3rem; }
@media (min-width: 700px) { .large > .cta-devis, main > .cta-devis { grid-template-columns: 1fr auto; align-items: center; padding: 1.5rem 1.6rem; } }
.encadre { border: 1px solid var(--trait); border-radius: var(--r); padding: 1rem 1.2rem; margin-bottom: 1.6rem; }
.encadre p { margin: 0; }
main.large.etroit > h2 { margin-top: 1.8rem; }

/* tableaux */
.table-defile { overflow-x: auto; margin: 0 0 .8rem; }
table { border-collapse: collapse; width: 100%; font-size: .97rem; }
th, td { text-align: left; padding: .6rem .5rem; border-bottom: 1px solid var(--trait); vertical-align: top; }
thead th { font-size: .85rem; font-weight: 600; color: var(--encre-2); border-bottom: 2px solid var(--encre); vertical-align: bottom; }
tbody th { font-weight: 600; }
.bareme { table-layout: fixed; margin: .1rem 0 .9rem; }
.bareme thead th:first-child, .bareme tbody th { width: 42%; }
.bareme thead th:not(:first-child), .bareme td { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bareme td { font-weight: 700; }
.bareme td.nul { font-weight: 400; color: var(--encre-3); }
.bareme .ligne-plafond th, .bareme .ligne-plafond td { font-weight: 400; color: var(--encre-2); font-size: .9rem; border-bottom: 0; }
.colonne .bareme { font-size: .93rem; }
.colonne .bareme th, .colonne .bareme td { padding: .5rem .2rem; }
.plafonds { table-layout: fixed; }
.plafonds thead th:first-child { width: 28%; }
.plafonds thead th:not(:first-child), .plafonds td { text-align: right; }
.plafonds td { font-variant-numeric: tabular-nums; white-space: nowrap; }
.plafonds .pl-plus th, .plafonds .pl-plus td { color: var(--encre-2); font-size: .92rem; }
.pl-court { display: none; }
.communes { list-style: none; padding: 0; margin: 0; columns: 3 200px; column-gap: 1.8rem; }
.communes li { display: flex; justify-content: space-between; gap: .5rem; padding: .35rem 0; border-bottom: 1px solid var(--trait); break-inside: avoid; }
.communes b { color: var(--encre-3); font-weight: 400; font-variant-numeric: tabular-nums; }
.voisines { list-style: none; padding: 0; margin: 0; }
.voisines li { display: flex; justify-content: space-between; gap: .5rem; padding: .45rem 0; border-bottom: 1px solid var(--trait); }
.voisines li:last-child { border-bottom: 0; }
.voisines span { color: var(--encre-3); font-size: .9rem; white-space: nowrap; }
.faq details { border-bottom: 1px solid var(--trait); padding: .8rem 0; }
.faq summary { font-weight: 600; cursor: pointer; }
.faq details p { margin: .5rem 0 0; color: var(--encre-2); }
.deroule { margin: 0 0 1rem; padding-left: 1.3rem; display: grid; gap: .45rem; }

/* simulateur et formulaires */
.sim-champs, .champs { display: grid; gap: 1rem; }
@media (min-width: 640px) { .sim-champs { grid-template-columns: repeat(3, 1fr); } .champs { grid-template-columns: repeat(2, 1fr); } }
.sim-champs label, .champs label, .texte, .champ-seul { display: flex; flex-direction: column; gap: .35rem; font-weight: 600; font-size: .95rem; }
input, select, textarea { font: 400 1.0625rem var(--police); color: var(--encre); }
.sim-champs input, .sim-champs select, .formulaire input:not([type=radio]):not([type=checkbox]), .formulaire select, .formulaire textarea {
  border: 1px solid var(--trait-champ); border-radius: var(--r); padding: .65rem .8rem; background: var(--fond); min-height: 48px; width: 100%; }
.formulaire input:focus, .formulaire select:focus, .formulaire textarea:focus, .sim-champs input:focus, .sim-champs select:focus { outline: 2px solid var(--bleu); outline-offset: -1px; border-color: var(--bleu); }
.formulaire textarea { min-height: 6rem; resize: vertical; }
.formulaire { display: grid; gap: 1.3rem; margin-bottom: 3rem; }
.formulaire fieldset { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: .9rem; }
.formulaire legend { font-weight: 700; font-size: 1.25rem; margin-bottom: .7rem; padding: 0; }
.consentement { display: flex; gap: .75rem; align-items: flex-start; border: 1px solid var(--trait); border-radius: var(--r); padding: .9rem 1rem; cursor: pointer; font-size: .95rem; }
.consentement input { width: 22px; height: 22px; accent-color: var(--bleu); flex: none; margin: .1rem 0 0; }
.pot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.formulaire .btn { justify-self: start; }
.retour { margin: 0; font-weight: 600; }
.retour:empty { display: none; }
.retour[data-etat=ok] { color: var(--vert); }
.retour[data-etat=erreur] { color: var(--rouge); }

/* devis : une question par écran */
.devis-form { max-width: 720px; }
.assist-tete { margin: 0 0 .4rem; }
.assist-etape { font-size: .9rem; font-weight: 600; color: var(--encre-2); margin: 0 0 .5rem; }
.assist-barre { height: 4px; background: var(--trait); border-radius: 2px; overflow: hidden; }
.assist-barre span { display: block; height: 100%; width: 0; background: var(--bleu); transition: width .25s ease; }
.assistant .etape:not(.active) { display: none; }
.formulaire .etape legend { font-size: clamp(1.35rem, 1.2rem + .7vw, 1.75rem); letter-spacing: -.015em; line-height: 1.25; margin-bottom: 1.1rem; }
.etape-aide { color: var(--encre-2); font-size: .95rem; margin: -.4rem 0 .2rem; }
.etape-erreur { margin: 0; color: var(--rouge); font-weight: 600; }
.tuiles { display: grid; gap: .6rem; grid-template-columns: 1fr; }
@media (min-width: 600px) { .tuiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tuiles-courtes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tuile { position: relative; display: flex; align-items: center; gap: .9rem; min-height: 64px; padding: .85rem 3rem .85rem 1rem;
  border: 1px solid var(--trait-champ); border-radius: var(--r); background: var(--fond); cursor: pointer; transition: border-color .12s, background-color .12s; }
.tuile input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
.tuile::after { content: ""; position: absolute; right: 1rem; top: 50%; width: 20px; height: 20px; margin-top: -10px; border: 1px solid var(--trait-champ); border-radius: 50%; background: var(--fond); }
.tuile:hover { border-color: var(--bleu); }
.tuile:has(input:focus-visible) { outline: 2px solid var(--bleu); outline-offset: 2px; }
.tuile:has(input:checked) { border-color: var(--bleu); box-shadow: inset 0 0 0 1px var(--bleu); background: var(--bleu-doux); }
.tuile:has(input:checked)::after { border: 6px solid var(--bleu); }
.tuile-txt { min-width: 0; max-width: 100%; }
.tuile-txt b { display: block; font-weight: 600; line-height: 1.3; -webkit-hyphens: auto; hyphens: auto; overflow-wrap: break-word; }
.tuile-txt small { display: block; margin-top: .15rem; font-size: .88rem; color: var(--encre-2); line-height: 1.35; }
.tuile-ico { width: 40px; height: 40px; flex: none; color: var(--bleu); }
.tuile-ico svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.tuiles-ico { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 700px) { .tuiles-ico { grid-template-columns: repeat(3, minmax(0, 1fr)); } .tuiles-ico.tuiles-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tuiles-ico .tuile { flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: .7rem; min-height: 138px; padding: 1rem 1rem 1.1rem; }
.tuiles-ico .tuile::after { top: 1rem; margin-top: 0; }
.tuiles-ico .tuile-ico { width: 44px; height: 44px; }
.tuiles-2 .tuile { min-height: 120px; }
.choix-communes { display: flex; flex-wrap: wrap; gap: .4rem; }
.choix-communes p { flex: 1 1 100%; margin: 0; font-weight: 600; font-size: .95rem; }
.assist-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: .4rem; }
.assist-nav .btn { margin-left: auto; min-width: 160px; }
.btn-envoi { min-width: 220px; }
.recap { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .8rem; margin: 0; padding: .8rem 1rem; background: var(--fond-2); border-radius: var(--r); font-size: .95rem; color: var(--encre-2); }
.recap b { color: var(--encre); font-weight: 600; }
.recap .btn-lien { min-height: 32px; font-size: .95rem; padding: 0; }
.merci { border: 1px solid var(--trait); border-radius: var(--r); padding: 1.6rem 1.5rem 1rem; }
.merci-ico { width: 40px; height: 40px; fill: none; stroke: var(--vert); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; margin-bottom: .6rem; }
.col-devis .photo img { aspect-ratio: 4 / 3; }

/* photos */
.photo { margin: 0 0 1.6rem; }
.photo img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--r); background: var(--fond-2); }
.photo-tete img { aspect-ratio: 16 / 7; }
.photo-bande img { aspect-ratio: 16 / 6; }
.photo-bande { margin-bottom: 1.1rem; }
.photo-une { margin: 0; }
.photo-une img { aspect-ratio: 4 / 3; }
.colonne .photo { margin: 0; }

/* barre « devis » fixe en bas de l'écran (téléphone et tablette) */
.barre-devis { position: fixed; left: 0; right: 0; bottom: 0; z-index: 25; display: flex; align-items: center; justify-content: space-between; gap: .8rem;
  background: var(--fond); border-top: 1px solid var(--trait-champ); padding: .55rem 16px calc(.55rem + env(safe-area-inset-bottom)); }
.barre-devis p { margin: 0; font-weight: 600; font-size: .95rem; line-height: 1.25; }
.barre-devis p span { display: block; font-weight: 400; font-size: .85rem; color: var(--encre-3); }
.barre-devis .btn { flex: none; min-height: 48px; padding: .6rem 1.1rem; }
body:has(.barre-devis) { padding-bottom: 72px; }
@media (min-width: 980px) { .barre-devis { display: none; } body:has(.barre-devis) { padding-bottom: 0; } }

/* pied */
.pied { background: var(--fond-2); border-top: 1px solid var(--trait); color: var(--encre-2); padding: 2.6rem 0 1.6rem; margin-top: 1rem; font-size: .95rem; }
.pied a { color: var(--encre); }
.pied h2 { font-size: .95rem; margin-bottom: .8rem; }
.pied ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.colonnes { display: grid; gap: 1.8rem; }
@media (min-width: 760px) { .colonnes { grid-template-columns: 1.4fr 1fr 1fr; } }
.pied-marque { display: flex; align-items: center; gap: .55rem; font-weight: 700; font-size: 1.05rem; color: var(--encre); }
.pied-bas { margin-top: 1.8rem; }
.pied-independant { border-top: 1px solid var(--trait); padding-top: 1.1rem; margin: 0 0 .5rem; color: var(--encre-2); }
.pied-source { margin: 0; }

/* téléphone */
@media (max-width: 640px) {
  .tete { padding: 1.1rem 0 1.1rem; }
  .chapeau { font-size: 1.08rem; }
  .une { padding: 1.7rem 0 2.2rem; }
  .bloc { padding-top: 1.5rem; }
  .photo-tete img, .photo-une img { aspect-ratio: 16 / 9; }
  .photo-bande img { aspect-ratio: 2 / 1; }
  .ent { gap: .75rem; }
  .act-tel { width: 100%; font-size: 1.05rem; }
  .deps a { padding: .8rem 0; }
  .communes { columns: 2; column-gap: 1rem; }
  .communes li { font-size: 1rem; }
  .cta-devis .btn, .formulaire .btn { justify-self: stretch; width: 100%; }
  .assist-nav .btn { min-width: 0; flex: 1 1 auto; width: auto; }
  .pl-long { display: none; } .pl-court { display: inline; }
  .plafonds { font-size: .95rem; }
  .plafonds th, .plafonds td { padding: .5rem .25rem; }
  .plafonds thead th { font-size: .8rem; }
  .plafonds thead th:first-child { width: 19%; }
  .table-cartes thead { display: none; }
  .table-cartes, .table-cartes tbody, .table-cartes tr, .table-cartes th, .table-cartes td { display: block; width: 100%; }
  .table-cartes tr { border-bottom: 1px solid var(--trait); padding: .7rem 0; }
  .table-cartes th, .table-cartes td { border: 0; padding: .1rem 0; }
  .table-cartes td::before { content: attr(data-label) " : "; color: var(--encre-3); }
  .filtres { flex-wrap: nowrap; overflow-x: auto; margin-right: -16px; padding-right: 16px; scrollbar-width: none; }
  .filtres::-webkit-scrollbar { display: none; }
  .chip { flex: none; }
  .tuiles-ico .tuile { min-height: 124px; padding: .9rem .85rem 1rem; }
  .tuiles-ico .tuile-txt small { font-size: .84rem; }
}
@media (max-width: 400px) {
  .marque-nom { font-size: 1rem; }
  .logo { width: 30px; height: 30px; }
}
@media (max-width: 360px) {
  .plafonds { font-size: .88rem; }
  .barre-devis p span { display: none; }
  .menu-txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .nav-mobile > summary { padding: .5rem .7rem; }
  .tuiles-ico .tuile { padding: .8rem .7rem .9rem; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }
/* questions à cases : « Continuer » seulement quand une case est cochée (le clic sur une case fait déjà avancer) */
.assistant:has(.etape.active .tuile):not(:has(.etape.active input:checked)) [data-suiv] { display: none; }

/* fiche pratique (page des aides) : modèle des fiches officielles, sans leur identité */
.maj { font-size: .9rem; color: var(--encre-3); margin: -.1rem 0 1rem; }
.fiche { display: grid; gap: 1.6rem; padding-bottom: 3.5rem; }
.fiche-corps { min-width: 0; }
@media (min-width: 980px) { .fiche { grid-template-columns: 220px minmax(0, 760px); gap: 4rem; } }
.sommaire details { border: 1px solid var(--trait); border-radius: var(--r); }
.sommaire summary { font-weight: 700; padding: .8rem 1rem; cursor: pointer; min-height: 44px; }
.sommaire ol { list-style: none; margin: 0; padding: 0 0 .5rem; }
.sommaire a { display: block; padding: .5rem 1rem; color: var(--encre); text-decoration: none; font-size: .95rem; line-height: 1.35; }
.sommaire a:hover { color: var(--bleu); text-decoration: underline; }
@media (min-width: 980px) {
  .sommaire { position: sticky; top: 92px; align-self: start; }
  .sommaire details { border: 0; }
  .sommaire summary { list-style: none; pointer-events: none; padding: 0 0 .7rem; min-height: 0; font-size: .85rem; color: var(--encre-2); }
  .sommaire summary::-webkit-details-marker { display: none; }
  .sommaire ol { border-left: 1px solid var(--trait); padding: 0; }
  .sommaire a { padding: .4rem 0 .4rem 1rem; margin-left: -1px; border-left: 2px solid transparent; }
  .sommaire a.actif { border-left-color: var(--bleu); color: var(--bleu); font-weight: 600; }
}
.retenir { border: 1px solid var(--encre); border-radius: var(--r); padding: 1.2rem 1.3rem .5rem; margin: 0 0 .6rem; }
.retenir h2 { font-size: 1.15rem; margin-bottom: .7rem; }
.retenir dl { margin: 0; }
.retenir dl > div { display: grid; gap: .1rem 1.2rem; padding: .65rem 0; border-top: 1px solid var(--trait); }
@media (min-width: 640px) { .retenir dl > div { grid-template-columns: 9rem minmax(0, 1fr); } }
.retenir dt { font-weight: 700; }
.retenir dd { margin: 0; color: var(--encre-2); }
.section-fiche { padding: 2.1rem 0 .6rem; border-top: 1px solid var(--trait); scroll-margin-top: 84px; }
.retenir + .section-fiche { border-top: 0; }
.section-fiche h2 { margin-bottom: .8rem; }
.section-fiche .plafonds, .section-fiche .bareme { margin-bottom: .8rem; }
.liste-fiche { margin: 0 0 1rem; padding-left: 1.2rem; display: grid; gap: .6rem; }
.liste-fiche b { font-weight: 600; }
.demarche { list-style: none; margin: .3rem 0 1rem; padding: 0; counter-reset: etape; }
.demarche li { counter-increment: etape; position: relative; padding: 0 0 1.3rem 3.1rem; color: var(--encre-2); }
.demarche li b { display: block; color: var(--encre); font-weight: 700; margin-bottom: .15rem; }
.demarche li::before { content: counter(etape); position: absolute; left: 0; top: -.15rem; width: 2.1rem; height: 2.1rem; display: grid; place-items: center;
  border: 1.5px solid var(--encre); border-radius: 50%; background: var(--fond); font-weight: 700; font-size: .95rem; color: var(--encre); }
.demarche li::after { content: ""; position: absolute; left: calc(1.05rem - .5px); top: 2.1rem; bottom: .2rem; border-left: 1px solid var(--trait-champ); }
.demarche li:last-child { padding-bottom: .4rem; }
.demarche li:last-child::after { display: none; }
.simulateur { border: 1px solid var(--trait); border-radius: var(--r); padding: 1.3rem 1.3rem 1.2rem; margin: .4rem 0 .8rem; display: grid; gap: 1rem; }
.simulateur .note { margin: -.4rem 0 0; }
.sim-resultat { border-top: 2px solid var(--encre); padding-top: .9rem; }
.sim-titre { font-weight: 700; font-size: 1.05rem; margin: 0 0 .4rem; }
.sim-resultat dl { margin: 0 0 .6rem; }
.sim-resultat dl > div { display: grid; gap: .1rem 1rem; padding: .5rem 0; border-bottom: 1px solid var(--trait); }
@media (min-width: 640px) { .sim-resultat dl > div { grid-template-columns: 13rem minmax(0, 1fr); align-items: baseline; } }
.sim-resultat dt { color: var(--encre-2); }
.sim-resultat dd { margin: 0; font-weight: 600; }
.sim-resultat .sim-montant { font-size: 1.4rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.sim-resultat .sim-nul { font-size: 1.05rem; }
.sim-resultat .note { margin: 0; }
.sim-erreur { margin: 0; color: var(--rouge); font-weight: 600; }
.tel-officiel { font-size: 1.35rem; font-weight: 700; font-variant-numeric: tabular-nums; margin: .2rem 0 .9rem; }
.tel-officiel a { color: var(--encre); text-decoration: none; }
.tel-officiel a:hover { text-decoration: underline; }
.tel-officiel span { display: block; font-size: .9rem; font-weight: 400; color: var(--encre-2); }
.sources { font-size: .95rem; color: var(--encre-2); }
.fin-fiche { border: 1px solid var(--trait); border-radius: var(--r); padding: 1.2rem 1.3rem; margin-top: 2rem; }
.fin-fiche p { margin: 0 0 .9rem; }
.fin-liens { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0 !important; }
@media (max-width: 640px) { .fin-liens a { flex: 1 1 100%; } .sommaire { margin-top: -.4rem; } }

/* zone couverte : carte des départements + cartes photo (accueil et /departements/) */
.zone { display: grid; gap: 1.6rem; }
@media (min-width: 900px) { .zone { grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 3rem; align-items: start; } .zone-carte { position: sticky; top: 92px; } }
.carte-zone { margin: 0; }
.carte-zone svg { display: block; width: 100%; height: auto; }
.carte-zone .ctx path { fill: #eeeeee; stroke: #ffffff; stroke-width: 1.5; stroke-linejoin: round; }
.carte-zone .cov path { fill: #d3e0ef; stroke: #ffffff; stroke-width: 2; stroke-linejoin: round; transition: fill .15s; }
.carte-zone .cov text { font: 700 23px var(--police); fill: var(--bleu-fonce); text-anchor: middle; dominant-baseline: central; pointer-events: none; transition: fill .15s; }
.carte-zone .cov a:hover path, .carte-zone .cov a.actif path { fill: var(--bleu); }
.carte-zone .cov a:hover text, .carte-zone .cov a.actif text { fill: #ffffff; }
.carte-zone figcaption { display: flex; align-items: center; gap: .5rem; margin-top: .6rem; font-size: .85rem; color: var(--encre-3); }
.carte-legende { width: 14px; height: 14px; flex: none; border-radius: 2px; background: #d3e0ef; }
@media (max-width: 899px) { .carte-zone svg { max-height: 400px; } }
.vignettes { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
.vignettes a { display: grid; grid-template-columns: 104px minmax(0, 1fr); align-items: center; gap: 1rem; padding: .5rem; border: 1px solid var(--trait); border-radius: var(--r); color: var(--encre); text-decoration: none; }
.vignettes img { display: block; width: 104px; height: 78px; object-fit: cover; border-radius: 2px; background: var(--fond-2); }
.vignettes a:hover, .vignettes a.actif, .deps-grandes a:hover, .deps-grandes a.actif { border-color: var(--bleu); box-shadow: inset 0 0 0 1px var(--bleu); }
.vignettes a:hover .dep-nom, .deps-grandes a:hover .dep-nom { text-decoration: underline; text-underline-offset: .2em; }
.dep-txt { display: grid; gap: .15rem; min-width: 0; }
.dep-txt .dep-n { text-align: left; }
.dep-nom .dep-code { margin-right: .3rem; }
.deps-grandes { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }
.deps-grandes a { display: flex; flex-direction: column; height: 100%; border: 1px solid var(--trait); border-radius: var(--r); overflow: hidden; color: var(--encre); text-decoration: none; }
.deps-grandes img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: var(--fond-2); }
.dep-carte-txt { display: grid; gap: .4rem; padding: .85rem 1rem 1rem; }
.deps-grandes .dep-nom { font-size: 1.1rem; }
.deps-grandes .dep-chiffres { grid-column: auto; display: grid; gap: .1rem; font-size: .92rem; }
@media (max-width: 640px) { .vignettes a { grid-template-columns: 88px minmax(0, 1fr); gap: .8rem; } .vignettes img { width: 88px; height: 66px; } }