/* Ecomap (ecomap.zkaw) 2026-11 redesign: light pages, forest green + sun yellow, DPE label colours on edges,
   slim top bar + theme tabs, sticky contents panel on long pages. System fonts only. */
:root{--ink:#17251f;--muted:#5a6a63;--line:#dfe6e1;--bg:#fbfcf9;--card:#fff;--green:#0f5c45;--green2:#16815f;--deep:#0a3a2c;--sun:#f6b400;--sunl:#fff6d9;--red:#c2410c;--blue:#1d4ed8;--r:6px;
--A:#009c6d;--B:#52b153;--C:#a5cc74;--D:#f4e70f;--E:#f0b50f;--F:#eb8235;--G:#d7221f;
--fh:"Avenir Next","Segoe UI Variable Display","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
--fb:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-padding-top:16px}
body{margin:0;font:16px/1.62 var(--fb);color:var(--ink);background:var(--bg)}
a{color:var(--green2);text-underline-offset:3px;text-decoration-thickness:1px}a:hover{color:var(--green)}
:focus-visible{outline:3px solid var(--sun);outline-offset:2px}
h1,h2,h3,h4{font-family:var(--fh);line-height:1.18;letter-spacing:-.005em;margin:0 0 .5em;font-weight:700}
h1{font-size:clamp(1.7rem,3.4vw,2.45rem);font-weight:800}h2{font-size:clamp(1.25rem,2.2vw,1.55rem);margin-top:0}h3{font-size:1.08rem}
p{margin:0 0 1em}small,.discret{color:var(--muted)}
.cadre{max-width:1180px;margin:0 auto;padding:0 20px}
.evitement{position:absolute;left:-999px}.evitement:focus{left:10px;top:10px;background:#fff;padding:8px;z-index:99}
/* slim top bar + theme tabs */
header.bandeau{background:#fff;color:var(--ink);border-bottom:1px solid var(--line)}
header.bandeau>.cadre{display:flex;align-items:center;gap:18px;min-height:56px}
.marque{display:flex;align-items:center;gap:9px;color:var(--deep);text-decoration:none;font:800 1.22rem var(--fh);letter-spacing:-.01em;white-space:nowrap}
.marque b{color:var(--green2);font-weight:800}.marque:hover{color:var(--deep)}.embleme{width:30px;height:30px;flex:none}
.recherche-haut{flex:1;max-width:380px;margin-left:auto}
.rubriques-barre{background:var(--green);color:#fff}
.rubriques-barre .cadre{display:flex}
.onglets{display:flex;gap:0;flex:1;overflow-x:auto;scrollbar-width:none}.onglets::-webkit-scrollbar{display:none}
.onglets a{color:#e3f1ea;text-decoration:none;padding:10px 14px 9px;font-weight:600;font-size:.93rem;white-space:nowrap;border-bottom:3px solid transparent}
.onglets a:hover{color:#fff;background:rgba(255,255,255,.08)}
.onglets a.actif{color:#fff;border-bottom-color:var(--sun)}
.onglets a.appel{margin-left:auto;background:var(--sun);color:#1b1500;font-weight:800;border-bottom:0;padding:10px 16px 12px}
.onglets a.appel:hover{background:#ffc62e;color:#1b1500}
@media(max-width:700px){header.bandeau>.cadre{flex-wrap:wrap;gap:8px 12px;padding-top:9px;padding-bottom:10px}.recherche-haut{flex-basis:100%;max-width:none;margin:0}.onglets a{padding:9px 11px 8px}}
/* search */
.recherche{position:relative}.recherche form{display:flex;background:#fff;border-radius:var(--r);overflow:hidden;border:1.5px solid #c9d5ce}
.recherche form:focus-within{border-color:var(--green2);box-shadow:0 0 0 3px rgba(22,129,95,.15)}
.recherche input{flex:1;border:0;padding:12px 14px;font:inherit;min-width:0;outline:none;color:var(--ink);background:transparent}
.recherche button{border:0;background:var(--green);color:#fff;font:700 .95rem var(--fb);padding:0 18px;cursor:pointer}
.recherche button:hover{background:var(--deep)}
.recherche-haut input{padding:8px 12px}.recherche-haut button{padding:0 14px}
.propositions{position:absolute;left:0;right:0;top:100%;margin:4px 0 0;padding:4px;list-style:none;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:0 14px 30px -12px rgba(10,58,44,.35);z-index:30;display:none;color:var(--ink)}
.propositions.actif{display:block}.propositions li{padding:9px 10px;border-radius:4px;cursor:pointer;display:flex;justify-content:space-between;gap:10px}
.propositions li small{white-space:nowrap}.propositions li.choisi,.propositions li:hover{background:#eef6f1}
/* hero / page head */
.une{background:#fff;color:var(--ink);padding:44px 0 46px;border-bottom:1px solid var(--line);position:relative}
.une:after,.entete:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:4px;background:linear-gradient(90deg,var(--A) 0 14.28%,var(--B) 0 28.57%,var(--C) 0 42.85%,var(--D) 0 57.14%,var(--E) 0 71.42%,var(--F) 0 85.71%,var(--G) 0)}
.une h1{color:var(--deep);max-width:820px}.une p.chapo{color:#33443f;font-size:1.12rem;max-width:760px}
.une .recherche{max-width:640px;margin-top:22px}.une .recherche input{padding:15px 16px;font-size:1.05rem}.une .recherche button{background:var(--sun);color:#1b1500}.une .recherche button:hover{background:#ffc62e}
.entete{background:#fff;border-bottom:1px solid var(--line);padding:22px 0 28px;position:relative}
.entete h1{color:var(--deep)}
.entete p.chapo{font-size:1.06rem;color:#33443f;max-width:860px;margin:0}
.ariane{font-size:.86rem;color:var(--muted);margin-bottom:12px;display:flex;flex-wrap:wrap;gap:6px}.ariane a{color:var(--muted)}
main{padding:28px 0 44px}
/* sections */
.bloc{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--green2);border-radius:var(--r);padding:22px 24px;margin:0 0 20px}
.bloc>h2{display:flex;align-items:center;gap:10px;color:var(--deep)}
.reperes{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0 0}
@media(max-width:820px){.reperes{grid-template-columns:repeat(2,1fr)}}
.repere{background:#fff;border:1px solid var(--line);border-top:4px solid var(--A);border-radius:var(--r);padding:12px 14px}
.repere:nth-child(7n+2){border-top-color:var(--B)}.repere:nth-child(7n+3){border-top-color:var(--D)}.repere:nth-child(7n+4){border-top-color:var(--F)}.repere:nth-child(7n+5){border-top-color:var(--C)}.repere:nth-child(7n+6){border-top-color:var(--E)}.repere:nth-child(7n){border-top-color:var(--G)}
.repere b{display:block;font:800 1.5rem var(--fh);color:var(--deep);font-variant-numeric:tabular-nums}.repere span{font-size:.86rem;color:var(--muted)}
.une .repere{background:#fff}.une .repere b{color:var(--deep)}.une .repere span{color:var(--muted)}
.deux-col{display:grid;grid-template-columns:1fr 1fr;gap:20px}.trois-col{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:820px){.deux-col,.trois-col{grid-template-columns:1fr}}
.fiche{display:block;background:#fff;border:1px solid var(--line);border-left:5px solid var(--A);border-radius:var(--r);padding:16px 18px;text-decoration:none;color:var(--ink)}
.fiche:nth-child(7n+2){border-left-color:var(--B)}.fiche:nth-child(7n+3){border-left-color:var(--C)}.fiche:nth-child(7n+4){border-left-color:var(--D)}.fiche:nth-child(7n+5){border-left-color:var(--E)}.fiche:nth-child(7n+6){border-left-color:var(--F)}.fiche:nth-child(7n){border-left-color:var(--G)}
a.fiche:hover{background:#f6faf7;color:var(--ink)}
.fiche h3{color:var(--green)}a.fiche:hover h3{text-decoration:underline;text-underline-offset:3px}
.fiche p:last-child{margin:0}
/* tables */
table{width:100%;border-collapse:collapse;font-size:.95rem}
th,td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:var(--deep);background:#eef5f0;border-bottom:2px solid var(--green2)}
tbody tr:hover>*{background:#fafcf7}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.defilant{overflow-x:auto;-webkit-overflow-scrolling:touch}
.remarque{font-size:.88rem;color:var(--muted)}
.encart{border-radius:var(--r);padding:14px 16px;margin:14px 0;font-size:.95rem;border:1px solid var(--line);border-left-width:5px}
.encart.info{background:#f0f8f3;border-color:#cfe6da;border-left-color:var(--A)}.encart.attention{background:var(--sunl);border-color:#f3dc9a;border-left-color:var(--E)}.encart.alerte{background:#fff2eb;border-color:#f7c9b3;border-left-color:var(--G)}
.encart p:last-child{margin:0}
/* charts */
.z314{display:flex;gap:4px;align-items:flex-end;height:150px;margin:8px 0 4px;border-bottom:2px solid var(--line)}
.z314 div{flex:1;background:var(--sun);border-radius:3px 3px 0 0;position:relative;min-height:2px}
.z314 div span{position:absolute;top:-19px;left:0;right:0;text-align:center;font-size:.72rem;color:var(--muted)}
.zeyv{display:flex;gap:4px}.zeyv span{flex:1;text-align:center;font-size:.75rem;color:var(--muted)}
.etiquette{display:grid;gap:5px;margin:8px 0}
.etiquette .ligne{display:grid;grid-template-columns:40px 1fr 64px;gap:8px;align-items:center;font-size:.9rem}
.etiquette .lib{font:800 .95rem var(--fh);color:#fff;text-align:left;padding:1px 0 1px 8px;clip-path:polygon(0 0,72% 0,100% 50%,72% 100%,0 100%)}
.etiquette .piste{background:#eef2ef;border-radius:2px;height:18px;overflow:hidden}.etiquette .piste i{display:block;height:100%}
.etiquette .val{text-align:right;font-variant-numeric:tabular-nums}
.cA{background:var(--A)}.cB{background:var(--B)}.cC{background:var(--C)}.cD{background:var(--D)}.cE{background:var(--E)}.cF{background:var(--F)}.cG{background:var(--G)}
.etiquette .cD,.etiquette .cC,.etiquette .cE{color:#222}
.pastille{display:inline-block;font-size:.78rem;font-weight:700;padding:2px 8px;border-radius:3px;background:#f1f4f2;border:1px solid var(--line);color:#33443f;margin:2px 4px 2px 0}
.pastille.vert{background:#e7f5ee;border-color:#cfe6da;color:var(--green)}
.artisan{border-top:1px solid var(--line);padding:11px 0}.artisan:first-of-type{border-top:0}
.artisan b{font-size:1rem}.artisan .details{font-size:.86rem;color:var(--muted)}
.volets{display:flex;gap:0;flex-wrap:wrap;margin-bottom:12px;border-bottom:2px solid var(--line)}
.volets button{border:0;border-bottom:3px solid transparent;margin-bottom:-2px;background:none;padding:8px 14px;font:600 .92rem var(--fb);cursor:pointer;color:var(--muted)}
.volets button:hover{color:var(--ink)}
.volets button[aria-selected=true]{color:var(--deep);border-bottom-color:var(--sun)}
.volet[hidden]{display:none}
.liens{columns:3 200px;column-gap:24px}.liens a{display:block;padding:3px 0;break-inside:avoid}
.bouton{display:inline-block;background:var(--sun);color:#1b1500;font-weight:800;text-decoration:none;padding:12px 18px;border-radius:var(--r);border:0;cursor:pointer;font-family:inherit;font-size:1rem}
.bouton:hover{color:#1b1500;background:#ffc62e}.bouton.secondaire{background:var(--green);color:#fff}.bouton.secondaire:hover{background:var(--deep)}
.calculette{display:grid;grid-template-columns:1fr 1fr;gap:22px}@media(max-width:820px){.calculette{grid-template-columns:1fr}}
.calculette label{display:block;font-weight:700;font-size:.92rem;margin:0 0 4px}.calculette .champ{margin-bottom:13px}
.calculette input,.calculette select,.chapo input,.chapo select,.chapo textarea{width:100%;font:inherit;padding:10px 12px;border:1.5px solid #c9d5ce;border-radius:var(--r);background:#fff;color:var(--ink)}
.calculette .champ small{display:block;color:var(--muted);font-size:.82rem;margin-top:3px}
.resultat{background:#f4f9f5;border-radius:var(--r);padding:16px 18px;border:1px solid var(--line);border-top:4px solid var(--sun)}
.resultat .chiffre{font:800 2rem var(--fh);color:var(--deep);font-variant-numeric:tabular-nums}
.resultat dl{display:grid;grid-template-columns:1fr auto;gap:6px 12px;margin:10px 0 0}.resultat dt{color:var(--muted)}.resultat dd{margin:0;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.chapo fieldset{border:0;padding:0;margin:0}.chapo .champ{margin-bottom:12px}.chapo label{font-weight:700;display:block;margin-bottom:4px}
.chapo [disabled]{background:#f1f3f2;color:#7a8783;cursor:not-allowed}
.questions details{border-top:1px solid var(--line);padding:12px 0}.questions summary{font-weight:700;cursor:pointer}
.questions details p{margin:.6em 0 0}
.sources{font-size:.85rem;color:var(--muted);border-top:1px dashed var(--line);margin-top:14px;padding-top:10px}
/* footer */
footer{background:var(--deep);color:#b9d1c7;padding:36px 0 22px;font-size:.92rem;border-top:4px solid var(--sun)}
footer a{color:#e6f2ec;text-decoration:none;display:block;padding:3px 0}footer a:hover{color:#fff;text-decoration:underline}
footer h4{color:var(--sun);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;margin:0 0 10px}
footer .marque{color:#fff}footer .marque b{color:var(--sun)}footer .marque:hover{color:#fff;text-decoration:none}
.pied-grille{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:24px}@media(max-width:820px){.pied-grille{grid-template-columns:1fr 1fr}}
.pied-bas{border-top:1px solid rgba(255,255,255,.12);margin-top:22px;padding-top:14px;display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;font-size:.84rem}
.renov-info{background:rgba(255,255,255,.06);border-left:4px solid var(--A);border-radius:4px;padding:12px 14px;margin-top:20px;font-size:.88rem}.renov-info a{display:inline;text-decoration:underline}
.pub{margin:18px 0;text-align:center}.pub small{display:block;font-size:.7rem;color:var(--muted)}
.rang{font-weight:800;color:var(--green)}
.triable th{cursor:pointer;user-select:none}.triable th[aria-sort]::after{content:" ↕";opacity:.5}
figure.graphique{margin:14px 0 6px}figure.graphique figcaption{font-size:.8rem;color:var(--muted);margin-top:6px}
.graphe-svg,.carte-svg{width:100%;height:auto;display:block;max-width:600px;font-family:var(--fb)}
.carte-svg{max-width:620px;margin:0 auto}
.graphe-svg text,.carte-svg text{font-size:11px;fill:#33443f}.graphe-svg .lib{text-anchor:middle}.graphe-svg .val{text-anchor:middle;font-size:10px;fill:#6c7a75}
.graphe-svg .gras{font-weight:800}.graphe-svg .axe-y{text-anchor:end}.graphe-svg .lib-d{text-anchor:end}.graphe-svg .lib-g{text-anchor:start;font-weight:700}.graphe-svg .val-p,.carte-svg .val-p{font-size:10.5px}
.carte-svg a:hover path,.carte-svg a:hover circle,.carte-svg a:focus circle{stroke:var(--deep);stroke-width:2}
.q0{fill:#fff3c4}.q1{fill:#ffd966}.q2{fill:#f4a900}.q3{fill:#e07b00}.q4{fill:#b34700}
.h0{fill:#fde7e3}.h1{fill:#f8b4a6}.h2{fill:#ef7f68}.h3{fill:#d7422c}.h4{fill:#9f1d10}
.w0{fill:#c9e3f6}.w1{fill:#a9d3f0}.w2{fill:#5fa8dc}.w3{fill:#2a73b8}.w4{fill:#123f7a}
blockquote.encart{margin:0}
/* sticky contents panel (filled by app.zqwa from the section headings; the column is reserved up front so nothing shifts) */
.sommaire{display:none}
@media(min-width:1100px){
 main>.cadre:has(>.bloc[id]~.bloc[id]~.bloc[id]~.bloc[id]){display:grid;grid-template-columns:minmax(0,1fr) 230px;column-gap:28px;align-items:start}
 main>.cadre:has(>.bloc[id]~.bloc[id]~.bloc[id]~.bloc[id])>:not(.sommaire){grid-column:1}
 main>.cadre:has(>.bloc[id]~.bloc[id]~.bloc[id]~.bloc[id])>.sommaire{display:block;grid-column:2;grid-row:1/span 40;position:sticky;top:18px;background:#fff;border:1px solid var(--line);border-top:4px solid var(--sun);border-radius:var(--r);padding:14px 16px;font-size:.9rem}
 .sommaire b{display:block;font:700 .78rem var(--fb);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:8px}
 .sommaire a{display:block;padding:5px 0 5px 10px;border-left:3px solid var(--line);color:var(--ink);text-decoration:none;line-height:1.3}
 .sommaire a:hover{border-left-color:var(--green2);color:var(--green)}
 .sommaire a.actif{border-left-color:var(--sun);font-weight:700;color:var(--deep)}
}
/* topic search box at the top of each section's main column (compact: the answer stays above the fold on phones) */
.chercher-theme{background:#fff;border:1px solid var(--line);border-left:5px solid var(--sun);border-radius:var(--r);padding:12px 16px;margin:0 0 20px;display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,440px);gap:8px 20px;align-items:center}
.chercher-theme-titre{margin:0;font:700 1.02rem/1.25 var(--fh);color:var(--deep)}
.chercher-theme-ligne{margin:2px 0 0;font-size:.88rem;line-height:1.4;color:var(--muted)}
.chercher-theme .recherche input{padding:9px 12px}
@media(max-width:760px){.chercher-theme{grid-template-columns:1fr;gap:6px;padding:10px 12px;margin-bottom:16px}.chercher-theme-ligne{font-size:.84rem}}

.calculette-zwc8{color:var(--muted);font-size:.9rem;margin:.4rem 0}.calculette-zlid{font-size:1.05rem;margin:.6rem 0 0}
