/* Relevage Eaux — direction « clarté » — CSS manuel, aucune dépendance externe */
@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/inter-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/inter-latin-700-normal.woff2) format("woff2")}

:root{
  --blanc:#FFFFFF; --noir:#191919; --gris:#5F5E5B; --filet:#E9E9E7; --beige:#F7F7F5;
  --bleu:#0075DE; --bleu-f:#0063bd; --bleu-clair:#E7F3FF;
  --wrap:1120px; --r:8px; --r-lg:12px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--blanc);color:var(--noir);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:16px;line-height:1.6;font-weight:400}
img,svg{max-width:100%;height:auto;display:block}
a{color:var(--bleu);text-decoration:none}
h1,h2,h3,h4{margin:0;color:var(--noir);font-weight:700;letter-spacing:-.02em}
/* Typographie v2 (brief v4 §3) : H1 40/28 · H2 28/24 · H3 20/18 */
h1{font-size:clamp(28px,3.2vw,40px);line-height:1.12;overflow-wrap:break-word;hyphens:manual;text-wrap:balance}
h2{font-size:clamp(24px,2.6vw,28px);line-height:1.15;margin-bottom:24px}
h3{font-size:20px;line-height:1.25}
p{margin:0 0 1em;max-width:72ch}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.sec{padding:36px 0}            /* ~72 px entre sections (A1) */
.sec--alt{background:var(--beige)}
.sec--p48{padding:48px 0}        /* déroulement, marques (A3/A4) */
.sec--cta{padding:24px 0}        /* CTA final resserré (A5) */
.muted{color:var(--gris)}
.sm{font-size:.95rem}
.lead{font-size:1.25rem;color:var(--noir)}
mark{background:var(--bleu-clair);color:inherit;padding:0 .12em;border-radius:4px}

/* boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:48px;padding:0 22px;
  border-radius:var(--r);border:1.5px solid transparent;font-weight:600;font-size:1rem;cursor:pointer;
  text-decoration:none;white-space:normal;text-align:center;max-width:100%;transition:background .15s,border-color .15s}
.btn .ic{flex:0 0 auto}
.btn--lg{height:56px;font-size:1.05rem;padding:0 26px}
.btn--p{background:var(--bleu);color:#fff;border-color:var(--bleu)}
.btn--p:hover{background:var(--bleu-f);border-color:var(--bleu-f)}
.btn--s{background:#fff;color:var(--noir);border-color:var(--noir)}
.btn--s:hover{background:var(--noir);color:#fff}
.btn--o{background:#fff;color:var(--noir);border-color:var(--noir)}
.btn--o:hover{border-color:var(--bleu);color:var(--bleu)}
.lnk{color:var(--bleu);text-decoration:underline;text-underline-offset:3px;font-weight:500;display:inline-flex;align-items:center;gap:6px}
.lnk .arr{transition:transform .15s}
.lnk:hover .arr{transform:translateX(3px)}

/* header */
.hd{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid var(--filet)}
.hd__in{height:64px;display:flex;align-items:center;gap:24px;flex-wrap:nowrap}
.logo{font-weight:700;font-size:18px;color:var(--noir);letter-spacing:-.02em;white-space:nowrap;flex:0 0 auto}
.menu{display:flex;align-items:center;gap:32px;margin-left:8px;flex-wrap:nowrap}
.menu a{color:var(--noir);font-weight:500;font-size:15px;white-space:nowrap;text-decoration:none}
.menu a:hover{color:var(--bleu)}
/* sous-menu Conseils — CSS pur (hover + focus clavier) */
.hasmenu{position:relative;display:flex;align-items:center}
.mtop{display:inline-flex;align-items:center;gap:4px}
.mtop .caret{transition:transform .15s}
.submenu{display:none;position:absolute;top:100%;left:0;margin-top:8px;flex-direction:column;
  background:#fff;border:1px solid var(--filet);border-radius:10px;padding:8px;min-width:180px;z-index:50}
.submenu a{padding:9px 10px;border-radius:6px;font-size:15px}
.submenu::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.hasmenu:hover .submenu,.hasmenu:focus-within .submenu{display:flex}
.hasmenu:hover .caret,.hasmenu:focus-within .caret{transform:rotate(180deg)}
.hd__r{margin-left:auto;display:flex;align-items:center;gap:14px;flex:0 0 auto}
.tel{display:inline-flex;align-items:center;gap:7px;color:var(--noir);font-weight:700;font-size:15px;white-space:nowrap}
.tel:hover{color:var(--bleu)}
.hd .btn--p{height:36px;padding:0 14px;font-size:15px;white-space:nowrap}
.burger{display:none;background:none;border:0;padding:6px;cursor:pointer}
@media(max-width:1120px){.menu{gap:20px}.menu a{font-size:14px}}

/* hero */
.hero{padding:48px 0}
.hero__in{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.hero .sub{font-size:19px;color:var(--gris);max-width:46ch;margin:18px 0 0}
.acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:30px}
.acts small{font-weight:400;color:var(--gris)}
.hero__media{background:#fff;border:1px solid var(--filet);border-radius:var(--r-lg);padding:20px;min-width:0}
.hero__media>svg{width:100%;height:auto;display:block}
.hero__cap{font-size:14px;color:var(--gris);margin:10px 2px 0;text-align:center}
.hero__txt{min-width:0}
/* anti grid-blowout : les enfants de grille peuvent rétrécir sous leur contenu */
.hero__in>*,.needs>*,.presta-grid>*,.steps>*,.guides>*,.proof>*,.zone>*,.fgrid>*,.acts>*,.mobar>*{min-width:0}

/* besoins */
.needs{display:flex;background:var(--beige);border:1px solid var(--filet);border-radius:var(--r-lg);overflow:hidden}
.need{flex:1;display:flex;align-items:center;justify-content:space-between;gap:10px;height:64px;padding:0 18px;
  border-right:1px solid var(--filet);color:var(--noir);text-decoration:none}
.need:last-child{border-right:0}
.need:hover{background:#fff}
.need__t{display:flex;align-items:center;justify-content:space-between;width:100%;font-weight:700;font-size:17px;color:var(--noir)}
.need__t .arr{color:var(--bleu);flex:0 0 auto}

/* prestations */
.presta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.presta{display:flex;flex-direction:column;gap:0;height:100%}
.presta__img img{width:100%;height:160px;object-fit:cover;border-radius:var(--r-lg);border:1px solid var(--filet)}
.presta__b{padding-top:18px;display:flex;flex-direction:column;gap:10px;flex:1}
.presta h3{font-size:19px;line-height:1.25;min-height:calc(19px * 1.25 * 2)}  /* réserve 2 lignes, pas de coupure */
.presta__b p{color:var(--noir);font-size:16px;line-height:1.55;margin:0}
.presta__b p a{color:var(--bleu);text-decoration:underline;text-underline-offset:2px}
.presta .btn{margin-top:auto;align-self:flex-start}

/* étapes */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.step__h{display:flex;align-items:flex-start;gap:12px;margin-bottom:8px;min-height:calc(18px * 1.25 * 2)}  /* 2 lignes réservées → paragraphes alignés */
.step__n{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;
  background:var(--bleu);color:#fff;font-weight:700;font-size:16px}
.step h3{margin:0;font-size:18px;line-height:1.25}
.step p{color:var(--gris);font-size:16px;margin:0}

/* preuves */
.proof{display:grid;grid-template-columns:1.25fr 1fr;gap:28px;align-items:start}
.proof__card{margin:0;border:1px solid var(--filet);border-radius:var(--r-lg);overflow:hidden;background:#fff}
.proof__card img{width:100%;height:220px;object-fit:cover}
.proof__card figcaption{padding:20px}
.proof__card h3{margin-bottom:8px}
.proof__card p{color:var(--gris);margin:0}
.proof__side{display:flex;flex-direction:column;gap:16px;align-self:stretch;justify-content:space-between}
.proof__side .panel{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center}
.panel{background:#fff;border:1px solid var(--filet);border-radius:var(--r-lg);padding:20px}
.panel h3{font-size:1.05rem;margin-bottom:6px}
.panel p{color:var(--gris);margin:0;font-size:.98rem}

/* zone */
.zone{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.deps{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 14px}
.dep{display:inline-flex;align-items:center;border:1px solid var(--filet);border-radius:999px;padding:9px 16px;
  font-weight:600;font-size:.95rem;color:var(--noir);background:#fff}
a.dep:hover{border-color:var(--bleu);color:var(--bleu)}
.dep--soft{color:var(--gris)}
/* Carte de zone : jamais recadrée, vraies proportions, max ~480px ordinateur, pleine largeur mobile. */
.zone__map img{width:100%;max-width:480px;height:auto;object-fit:contain;border-radius:var(--r-lg);border:1px solid var(--filet)}

/* marques */
.brands{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.brand{display:inline-flex;align-items:center;border:1px solid var(--filet);border-radius:999px;padding:9px 16px;font-weight:600;color:var(--noir);background:#fff;font-size:.95rem;text-decoration:none}
a.brand:hover{border-color:var(--bleu);color:var(--bleu)}

/* guides */
.guides{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:18px}
.guide{display:flex;flex-direction:column;gap:4px;padding:20px;border:1px solid var(--filet);border-radius:var(--r-lg);color:var(--noir);background:#fff}
.guide:hover{border-color:var(--bleu)}
.guide__t{font-weight:700}
.guide__s{color:var(--gris);font-size:.92rem}

/* cta final */
.final{background:var(--beige);border:1px solid var(--filet);border-radius:var(--r-lg);padding:clamp(28px,4vw,48px);
  display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
.final h2{margin:0}
.final p{margin:.4em 0 0}

/* footer */
.ft{background:var(--beige);border-top:1px solid var(--filet);padding:24px 0 96px}
.fgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.fcol h4{font-size:1rem;margin-bottom:12px}
.fcol a{display:block;color:var(--gris);margin-bottom:8px;font-size:.96rem}
.fcol a:hover{color:var(--bleu)}
.fident{color:var(--gris);font-size:.95rem;margin:28px 0 0}
.legal{color:var(--gris);font-size:.9rem;border-top:1px solid var(--filet);padding-top:16px;margin-top:28px}

/* barre mobile */
.mobar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:none;grid-template-columns:1fr 1fr;gap:10px;
  height:60px;align-items:center;background:#fff;border-top:1px solid var(--filet);padding:0 12px}
.mobar .btn{width:100%;height:44px}

/* responsive */
@media(max-width:960px){
  .hero__in{grid-template-columns:1fr;gap:32px}
  .presta-grid,.steps,.guides{grid-template-columns:repeat(2,1fr)}
  .needs{grid-template-columns:1fr 1fr}
  .need{border-right:0;border-bottom:1px solid var(--filet)}
  .proof,.zone{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  body{font-size:16px;padding-bottom:60px}
  h1{font-size:28px;line-height:1.14}
  h2{font-size:24px}
  h3{font-size:18px}
  .hero .sub{font-size:17px}
  .menu a{padding:12px 0;font-size:16px}
  .dep,.brand{min-height:44px}
  .need{min-height:48px}
  .guide{min-height:48px}
  .hd__in{height:56px;gap:12px}
  .menu{display:none;position:absolute;top:56px;left:0;right:0;background:#fff;border-bottom:1px solid var(--filet);
    flex-direction:column;gap:0;padding:8px 24px 16px}
  .menu.open{display:flex}
  .menu a{padding:10px 0;border-bottom:1px solid var(--filet)}
  .hd__r .tel span{display:none}
  .hd__r .btn--p{display:none}
  .burger{display:inline-flex}
  .presta-grid,.steps,.guides,.needs,.fgrid{grid-template-columns:1fr}
  .need{border-bottom:1px solid var(--filet)}
  .acts{gap:12px}
  .acts .btn{width:100%;white-space:normal;height:auto;min-height:48px;padding:12px 18px;line-height:1.3}
  .acts .btn small{white-space:normal}
  .acts .lnk{width:100%;justify-content:center}
  .mobar{display:grid}
  .final{flex-direction:column;align-items:stretch}
  .final .acts .btn{width:100%}
}

/* ===== v4 : overrides mobile (densité, besoins, sous-menu) ===== */
@media(max-width:760px){
  .sec{padding:24px 0}
  .sec--p48{padding:32px 0}
  .sec--cta{padding:20px 0}
  .ft{padding:24px 0 84px}
  .needs{flex-direction:column}
  .need{flex:none;height:52px;border-right:0;border-bottom:1px solid var(--filet)}
  .need:last-child{border-bottom:0}
  .acts{gap:16px}
  .hasmenu{flex-direction:column;align-items:stretch;width:100%}
  .mtop{padding:12px 0;justify-content:space-between}
  .submenu{display:flex;position:static;margin:0;border:0;border-radius:0;padding:0 0 8px 16px;min-width:0}
  .submenu a{padding:10px 0}
}

/* ===== v5 : reset mobile étapes/cartes (hauteur naturelle) ===== */
@media(max-width:760px){
  .step__h{min-height:0}
  .presta h3{min-height:0}
}

/* ===================================================================== */
/* AJOUTS page Dépannage (gabarit prestation F2) — mêmes règles « clarté » */
/* Composants réutilisés tels quels : header, hero, steps, proof, zone,   */
/* final, footer, barre mobile. Ajouts ci-dessous : fil d'Ariane, délai    */
/* hero, symptômes, explication, fiche preuve, FAQ.                        */
/* ===================================================================== */

/* fil d'Ariane */
.breadcrumb{border-bottom:1px solid var(--filet)}
.breadcrumb .wrap{padding-top:12px;padding-bottom:12px;font-size:14px;color:var(--gris)}
.breadcrumb a{color:var(--gris);text-decoration:none}
.breadcrumb a:hover{color:var(--bleu)}
.breadcrumb .sep{margin:0 8px;color:var(--filet)}
.breadcrumb [aria-current="page"]{color:var(--noir);font-weight:600}

/* délai sous le sous-titre du hero */
.hero__delai{font-size:17px;color:var(--gris);margin:12px 0 0;max-width:52ch}

/* B. symptômes — 7 cartes compactes (4 + 3), même hauteur, sans bouton interne */
.symptoms{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.symptoms>*{min-width:0}
.symp{display:flex;flex-direction:column;gap:10px;background:var(--beige);border:1px solid var(--filet);
  border-radius:var(--r-lg);padding:18px;height:100%}
.symp__t{font-weight:700;font-size:17px;line-height:1.3;color:var(--noir)}
.symp__ok{display:inline-flex;align-items:center;gap:7px;color:var(--gris);font-size:.95rem;font-weight:500}
.symp__ok .chk{flex:0 0 auto}
.symp__lnk{margin-top:auto;font-size:.95rem}
.symptoms__cta{display:flex;justify-content:center;margin-top:28px}

/* C. ce qu'on fait — texte + cadre photo */
.explain{display:grid;grid-template-columns:1.25fr 1fr;gap:28px;align-items:start}
.explain>*{min-width:0}
.explain__txt p{color:var(--noir);font-size:1rem;line-height:1.6;max-width:62ch}
.explain__txt p a{color:var(--bleu);text-decoration:underline;text-underline-offset:2px}
.explain__media img{width:100%;height:220px;object-fit:cover;border-radius:var(--r-lg);border:1px solid var(--filet)}

/* E. fiche preuve — 4 champs clé / valeur */
.fiche{margin:0;display:flex;flex-direction:column;gap:10px}
.fiche__row{display:flex;gap:8px;align-items:baseline}
.fiche dt{flex:0 0 96px;color:var(--gris);font-size:.95rem;font-weight:600}
.fiche dd{margin:0;color:var(--noir);font-size:.98rem}

/* G. FAQ — accordéon CSS pur (details/summary) */
.faq{border-top:1px solid var(--filet)}
.qa{border-bottom:1px solid var(--filet)}
.qa summary{list-style:none;cursor:pointer;padding:18px 36px 18px 0;position:relative;
  font-weight:600;font-size:16px;color:var(--noir)}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"";position:absolute;right:6px;top:50%;width:11px;height:11px;
  border-right:2px solid var(--gris);border-bottom:2px solid var(--gris);
  transform:translateY(-70%) rotate(45deg);transition:transform .15s}
.qa[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.qa summary:hover{color:var(--bleu)}
.qa p{color:var(--gris);margin:0 0 18px;max-width:72ch}

/* responsive — page Dépannage */
@media(max-width:960px){
  .symptoms{grid-template-columns:repeat(2,1fr)}
  .explain{grid-template-columns:1fr}
}
@media(max-width:760px){
  .symptoms{grid-template-columns:1fr}
  .symptoms__cta .btn{width:100%}
  .hero__delai{font-size:16px}
  .fiche dt{flex-basis:84px}
  .qa summary{font-size:16px}
}

/* ===================================================================== */
/* TEMPLATE RÉDACTIONNEL (.redac) — contenu saisi dans l'éditeur WordPress */
/* (bloc 4). Mêmes règles « clarté » : pas d'emoji, pas de dégradé, pas    */
/* d'ombre. Une seule couleur hors palette : rouge d'alerte sobre,         */
/* réservé aux encadrés « risque » (documentée dans design-system).        */
/* ===================================================================== */
:root{--alerte:#B42318; --alerte-bg:#FEF3F2; --alerte-bd:#FECDCA}

.redac{max-width:760px}
.redac>h2{font-size:clamp(24px,2.6vw,28px);margin:40px 0 16px}
.redac>h2:first-child{margin-top:0}
.redac h3{font-size:20px;margin:22px 0 10px}
.redac p{color:var(--noir);font-size:1rem;line-height:1.7;margin:0 0 16px;max-width:72ch}
.redac a{color:var(--bleu);text-decoration:underline;text-underline-offset:2px}
.redac>ul,.redac>ol{margin:0 0 16px;padding-left:22px}
.redac>ul{list-style:disc}
.redac>ol{list-style:decimal}
.redac>ul>li,.redac>ol>li{margin:0 0 8px;line-height:1.6}
.redac .redac-note{font-size:.85rem;color:var(--gris);line-height:1.6;border-top:1px solid var(--filet);padding-top:16px;margin-top:28px}

/* alerte (risque) */
.redac .redac-alerte{background:var(--alerte-bg);border:1px solid var(--alerte-bd);
  border-left:4px solid var(--alerte);border-radius:var(--r);padding:4px 16px;margin:0 0 20px}
.redac .redac-alerte p{margin:12px 0}
.redac .redac-alerte strong{color:var(--alerte)}

/* encadré (info / norme) */
.redac .redac-encadre{background:var(--beige);border:1px solid var(--filet);border-left:4px solid var(--bleu);
  border-radius:var(--r);padding:4px 18px;margin:0 0 20px}
.redac .redac-encadre p{margin:12px 0}

/* étapes numérotées */
.redac ol.redac-etapes{list-style:none;counter-reset:et;padding:0;margin:0 0 20px}
.redac ol.redac-etapes>li{counter-increment:et;position:relative;padding:4px 0 4px 48px;margin:0 0 16px;line-height:1.6}
.redac ol.redac-etapes>li::before{content:counter(et);position:absolute;left:0;top:0;width:32px;height:32px;
  border-radius:50%;background:var(--bleu);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:15px}
.redac ol.redac-etapes>li strong{display:block;margin-bottom:2px}

/* causes : cartes Diagnostic / Solution */
.redac ul.redac-causes{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:0 0 20px;padding:0;list-style:none}
.redac ul.redac-causes>li{border:1px solid var(--filet);border-radius:var(--r-lg);padding:16px;background:#fff;margin:0}
.redac ul.redac-causes h3{font-size:17px;margin:0 0 8px}
.redac ul.redac-causes p{font-size:.95rem;margin:0 0 8px}
.redac ul.redac-causes p:last-child{margin:0}
.redac ul.redac-causes .lbl{font-weight:700;color:var(--gris)}

/* tableau (défilement horizontal mobile) */
.redac .redac-tableau{overflow-x:auto;margin:0 0 20px;border:1px solid var(--filet);border-radius:var(--r-lg)}
.redac table{border-collapse:collapse;width:100%;min-width:520px;font-size:1rem}
.redac th,.redac td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--filet)}
.redac thead th{background:var(--beige);font-weight:700}
.redac tbody tr:last-child td{border-bottom:0}

/* CTA rédactionnel */
.redac .redac-cta{background:var(--beige);border:1px solid var(--filet);border-radius:var(--r-lg);
  padding:20px;margin:24px 0;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.redac .redac-cta p{margin:0;font-weight:600;max-width:none}

@media(max-width:760px){
  .redac ul.redac-causes{grid-template-columns:1fr}
  .redac .redac-cta{flex-direction:column;align-items:stretch}
  .redac .redac-cta .btn{width:100%}
}

/* ===================================================================== */
/* AJOUTS gabarit pages locales F3 (IDF / Paris / département)            */
/* Composants réutilisés tels quels : header, hero, breadcrumb, .deps,    */
/* .steps, .proof/.fiche, .faq/.qa, .redac, footer, barre mobile, boutons.*/
/* Ajouts ci-dessous : carte hero, cartes prestations locales, 8 zones,   */
/* zones voisines, encart garantie dans le déroulement.                   */
/* ===================================================================== */

/* carte (image fixe) dans le média du hero */
.hero__media--carte{padding:8px}
.hero__media--carte .carte{width:100%;height:auto;display:block;border-radius:8px}

/* BLOC 3 — « Ce qu'on fait chez vous » : 4 cartes courtes */
.locpresta-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.locpresta-grid>*{min-width:0}
.locpresta{display:flex;flex-direction:column;gap:6px;padding:18px;border:1px solid var(--filet);
  border-radius:var(--r-lg);background:#fff;color:var(--noir);text-decoration:none}
.locpresta:hover{border-color:var(--bleu)}
.locpresta__t{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:17px}
.locpresta__t .arr{color:var(--bleu);flex:0 0 auto}
.locpresta__d{color:var(--gris);font-size:.95rem}
.loc-syndic{margin:18px 0 0;color:var(--noir)}
.loc-syndic a{color:var(--bleu);text-decoration:underline;text-underline-offset:2px}

/* BLOC 2 bis — les 8 zones (IDF) */
.zgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.zgrid>*{min-width:0}
.zcard{display:flex;flex-direction:column;gap:6px;padding:16px;border:1px solid var(--filet);
  border-radius:var(--r-lg);background:#fff}
.zcard__h{display:flex;align-items:center;gap:10px}
.zcard__n{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:26px;
  padding:0 8px;border-radius:999px;background:var(--bleu-clair);color:var(--bleu-f);font-weight:700;font-size:14px}
.zcard h3{font-size:17px;line-height:1.2}
.zcard__c{color:var(--noir);font-size:.9rem;margin:0}
.zcard__p{color:var(--gris);font-size:.9rem;margin:0}
.zcard .lnk{margin-top:auto;font-size:.92rem}

/* BLOC 8 — zones voisines (Paris / département) */
.zvgrid{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 14px}
.zvcard{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--filet);
  border-radius:999px;background:#fff;color:var(--noir);text-decoration:none}
.zvcard:hover{border-color:var(--bleu)}
.zvcard__n{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:22px;padding:0 6px;
  border-radius:999px;background:var(--bleu-clair);color:var(--bleu-f);font-weight:700;font-size:13px}
.zvcard__t{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:.95rem}
.zvcard__t .arr{color:var(--bleu);flex:0 0 auto}
#zones-voisines .wrap>p a{color:var(--bleu);text-decoration:underline;text-underline-offset:2px}

/* BLOC 5 — encart garantie sous le déroulement (gabarit F3) */
.guarantee{margin:20px 0 0;background:var(--beige);border:1px solid var(--filet);border-left:4px solid var(--bleu);
  border-radius:var(--r);padding:16px 18px;max-width:760px}
.guarantee h3{font-size:1.05rem;margin:0 0 6px}
.guarantee p{color:var(--gris);margin:0;font-size:.98rem}

/* preuve en colonne seule (la garantie n'est plus à côté en F3) */
.proof--solo{grid-template-columns:1fr;max-width:620px}

/* responsive F3 */
@media(max-width:960px){
  .locpresta-grid,.zgrid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .locpresta-grid,.zgrid{grid-template-columns:1fr}
}

/* ===================================================================== */
/* AJOUTS gabarit pages Prix F4 (catégorie + article)                    */
/* Réutilise : header, hero, steps, .guarantee, faq, redac, footer, btns.*/
/* ===================================================================== */

/* conteneur étroit pour l'article */
.wrap--narrow{max-width:760px}

/* encadré « Chez Relevage Eaux » (hero) et encadré tarif (article) */
.prix-encadre{background:var(--bleu-clair);border:1px solid #cfe5fb;border-radius:var(--r-lg);
  padding:14px 16px;margin:18px 0 0}
.prix-encadre p{margin:0;color:var(--noir);font-size:1rem}
.prix-encadre strong{color:var(--bleu-f)}
.prix-encadre--box{margin:0;padding:20px 22px}
.prix-encadre--box h2{font-size:1.15rem;margin:0 0 12px}
.et__list{margin:0 0 16px;padding-left:20px}
.et__list li{margin:0 0 8px;line-height:1.5;color:var(--noir)}
.et__gar{margin:12px 0 0;color:var(--gris);font-size:.92rem}

/* en-tête d'article */
.art-head{padding-bottom:8px}
.art__meta{margin:10px 0 0;color:var(--gris);font-size:.875rem}
.sec--tight{padding:16px 0}

/* articles de la catégorie */
.artgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.artgrid>*{min-width:0}
.artcard{display:flex;flex-direction:column;gap:8px;padding:20px;border:1px solid var(--filet);
  border-radius:var(--r-lg);background:#fff;color:var(--noir);text-decoration:none}
.artcard:hover{border-color:var(--bleu)}
.artcard__t{font-weight:700;font-size:1.02rem;line-height:1.3}
.artcard__s{color:var(--gris);font-size:.95rem;flex:1}
.artcard .lnk{font-size:.95rem}

/* pour aller plus loin (article) */
.plgrid{display:flex;flex-wrap:wrap;gap:12px 28px}
.plgrid .lnk{font-size:1rem}

/* barre mobile variante devis */
.mobar--devis .btn--p{flex:2}
.mobar--devis .btn--o{flex:1}

@media(max-width:960px){ .artgrid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:760px){ .artgrid{grid-template-columns:1fr} }

/* ===== v2 gabarit (squelette) : étiquette de module ===== */
.mod-label{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.03em;
  color:#5F5E5B;background:#F1F1EF;border:1px dashed #C7C7C2;border-radius:999px;
  padding:4px 12px;margin:0 0 16px}
.art-head .mod-label,.sec--tight .mod-label{margin-bottom:12px}

/* ===================================================================== */
/* AJOUTS gabarit Article F5 (structure) — corps + colonne latérale       */
/* ===================================================================== */
.art-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:40px;padding-top:24px;padding-bottom:16px;align-items:start}
.art-col{min-width:0}
.art-sec{margin:0 0 28px}
.art-head{margin:0 0 20px}
.art-head h1{margin:0}
.art__meta{margin:10px 0 0;color:var(--gris);font-size:.875rem}

/* réponse courte (module sobre) */
.answer-box{background:var(--beige);border:1px solid var(--filet);border-left:4px solid var(--bleu);
  border-radius:var(--r);padding:16px 18px}
.answer-box p{margin:0;color:var(--noir)}

/* encart pro (après la première réponse) */
.pro-box{background:#fff;border:1px solid var(--filet);border-radius:var(--r-lg);padding:20px}
.pro-box>p{margin:0 0 14px}
.pro-box .acts{margin-top:0}

/* CTA final léger */
.cta-light{border-top:1px solid var(--filet);padding-top:16px}
.cta-light p{margin:0;color:var(--noir)}
.cta-light a{color:var(--bleu);text-decoration:underline;text-underline-offset:2px}

/* colonne latérale collante */
.art-aside{position:sticky;top:84px;display:flex;flex-direction:column;gap:20px;min-width:0}
.aside-card{border:1px solid var(--filet);border-radius:var(--r-lg);background:#fff;padding:16px 18px}
.aside-card h3{font-size:1.02rem;margin:0 0 10px}
.toc{list-style:none;margin:0;padding:0}
.toc li{margin:0 0 8px}
.toc a{color:var(--noir);text-decoration:none;border-left:2px solid var(--filet);padding-left:10px;display:block}
.toc a:hover{color:var(--bleu);border-left-color:var(--bleu)}
.aside-call .tel--aside{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:1.05rem;color:var(--noir);margin-top:4px}
.aside-call .tel--aside:hover{color:var(--bleu)}
.rel-list{display:flex;flex-direction:column}
.aside-rel{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 0;
  border-bottom:1px solid var(--filet);color:var(--noir);text-decoration:none;font-size:.95rem}
.aside-rel:last-child{border-bottom:0}
.aside-rel:hover{color:var(--bleu)}
.aside-rel .arr{color:var(--bleu);flex:0 0 auto}

@media(max-width:960px){
  .art-layout{grid-template-columns:1fr}
  .art-aside{position:static;order:2}
}

/* ===== v2 : emplacements d'images facultatifs (cadre gris, ratio fixe) ===== */
/* Si le champ image est vide, le gabarit ne rend RIEN (pas de cadre) : la page se resserre. */
.imgph{position:relative;display:flex;align-items:center;justify-content:center;
  background:#F1F1EF;border:1px dashed #C7C7C2;border-radius:var(--r-lg);overflow:hidden;margin:0}
.imgph--16x9{aspect-ratio:16/9}
.imgph--4x3{aspect-ratio:4/3}
.imgph--sq{aspect-ratio:1/1}
.imgph__tag{font-size:12px;font-weight:700;letter-spacing:.03em;color:#8A8A85;text-align:center;padding:0 10px}
figure.imgph{margin:18px 0}
figure.imgph figcaption{position:absolute;left:0;right:0;bottom:0;background:rgba(255,255,255,.82);
  color:var(--gris);font-size:.85rem;padding:6px 10px;text-align:center}
/* vignette d'article lié */
.aside-rel--img{align-items:center;gap:12px}
.rel-thumb{flex:0 0 64px;width:64px;border-radius:8px}
.rel-thumb .imgph__tag{font-size:10px}
.aside-rel--img .rel-txt{flex:1}

/* ===================================================================== */
/* AJOUTS gabarit Hub F6 (page catégorie)                                */
/* ===================================================================== */
/* sélecteur de symptômes : accès rapide, sans image, scan immédiat */
.symp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.symp-grid>*{min-width:0}
.symp-pick{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;
  background:#fff;border:1px solid var(--filet);border-radius:var(--r);color:var(--noir);
  text-decoration:none;font-weight:600}
.symp-pick:hover{border-color:var(--bleu);color:var(--bleu)}
.symp-pick .arr{color:var(--bleu);flex:0 0 auto}

/* grille d'articles de la catégorie (vignette = image à la une, facultative) */
.hubgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.hubgrid>*{min-width:0}
.hubcard{display:flex;flex-direction:column;border:1px solid var(--filet);border-radius:var(--r-lg);
  background:#fff;overflow:hidden;color:var(--noir);text-decoration:none}
.hubcard:hover{border-color:var(--bleu)}
.hubcard__img{display:block;width:100%;border:0;border-radius:0}
.hubcard__b{display:flex;flex-direction:column;gap:8px;padding:18px}
.hubcard__t{font-weight:700;font-size:1.02rem;line-height:1.3}
.hubcard__s{color:var(--gris);font-size:.95rem;flex:1}
.hubcard .lnk{font-size:.95rem}

/* appel discret du hub */
.hub-call p{margin:0;color:var(--noir)}
.hub-call a{color:var(--bleu);text-decoration:underline;text-underline-offset:2px}

@media(max-width:960px){ .symp-grid,.hubgrid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:620px){ .symp-grid,.hubgrid{grid-template-columns:1fr} }

/* ===== v2 hub : groupes de boutons (si > 12 articles) ===== */
.symp-groups{display:flex;flex-direction:column;gap:28px}
.symp-group__t{font-size:1.05rem;margin:0 0 12px;color:var(--noir)}

/* ===== v2 marques : cartes marques (mère) + logo près du H1 (fiche) ===== */
.mq-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.mq-grid>*{min-width:0}
.mq-card{display:flex;flex-direction:column;gap:12px;border:1px solid var(--filet);border-radius:var(--r-lg);
  background:#fff;padding:20px;height:100%}
.mq-card__h{display:flex;align-items:center;gap:12px}
.mq-logo{flex:0 0 44px;width:44px;border-radius:8px}
.mq-logo .imgph__tag{font-size:9px}
.mq-card__h h3{font-size:1.1rem;margin:0}
.mq-lbl{display:block;font-size:.8rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--gris);margin:0 0 4px}
.mq-pros ul,.mq-cons ul{margin:0;padding-left:18px}
.mq-pros li,.mq-cons li{font-size:.92rem;color:var(--noir);margin:0 0 4px;line-height:1.4}
.mq-cons li{color:var(--gris)}
.mq-card__lnk{margin-top:auto}
/* logo à côté du H1 (fiche) */
.fiche-title{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.h1-logo{display:inline-flex;align-items:center;height:56px;padding:6px 12px;border:1px solid var(--filet);border-radius:8px;background:#fff}
.h1-logo img{height:100%;width:auto;max-width:180px;object-fit:contain}
.fiche-title h1{margin:0}

@media(max-width:960px){ .mq-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:620px){ .mq-grid{grid-template-columns:1fr} }

/* ===== v3 marques : 4 colonnes, cartes même taille, « Lire la suite », vignette logo ===== */
.mq-grid{grid-template-columns:repeat(4,1fr)}
.mq-card{height:100%}
.mq-card__pts{display:flex;flex-direction:column;gap:12px}
.mq-more{margin-top:2px}
.mq-more>summary{list-style:none;cursor:pointer;color:var(--bleu);text-decoration:underline;
  text-underline-offset:3px;font-weight:500;font-size:.92rem}
.mq-more>summary::-webkit-details-marker{display:none}
.mq-more[open]>summary{margin-bottom:8px}
.mq-more__b{display:flex;flex-direction:column;gap:10px}
/* points forts/faibles sur la fiche */
.fiche-points{display:grid;grid-template-columns:1fr 1fr;gap:20px;border:1px solid var(--filet);
  border-radius:var(--r-lg);padding:16px 18px;background:#fff}
.fiche-points ul{margin:0;padding-left:18px}
.fiche-points li{font-size:1rem;margin:0 0 4px;line-height:1.45}
.fiche-points .mq-cons li{color:var(--gris)}
/* vignette logo dans « Autres marques » */
.aside-rel--logo{align-items:center;gap:10px}
.rel-logo{flex:0 0 28px;width:28px;border-radius:6px}
.rel-logo .imgph__tag{font-size:8px}
.aside-rel--logo .rel-txt{flex:1}

@media(max-width:1120px){ .mq-grid{grid-template-columns:repeat(3,1fr)} }
@media(max-width:860px){ .mq-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:620px){ .mq-grid{grid-template-columns:1fr} .fiche-points{grid-template-columns:1fr} }

/* ===== v4 marques : commande discrète de dépliage + bouton « Voir la fiche » ===== */
.mq-toggle{list-style:none;cursor:pointer;color:var(--gris);font-size:.85rem;font-weight:600;
  display:inline-flex;align-items:center;gap:5px;padding:2px 0;width:max-content}
.mq-toggle::-webkit-details-marker{display:none}
.mq-toggle:hover{color:var(--bleu)}
.mq-toggle .caret{transition:transform .15s}
.mq-more[open] .mq-toggle .caret{transform:rotate(180deg)}
.mq-more .t-open{display:none}
.mq-more[open] .t-closed{display:none}
.mq-more[open] .t-open{display:inline}
.mq-more[open]{margin-top:2px}
/* bouton « Voir la fiche » : secondaire, fin, toujours en bas */
.mq-btn{height:40px;font-size:.95rem;padding:0 18px;margin-top:auto;align-self:flex-start}

/* ===================================================================== */
/* Gabarit F9 — pages d'action Devis / Contact (formulaires)             */
/* ===================================================================== */
.wrap--form{max-width:880px}
[hidden]{display:none!important}   /* l'attribut hidden prime sur display:flex des formulaires */
.btn--block{display:flex;width:100%}
.req{color:#B42318;font-weight:700}
.opt{color:var(--gris);font-weight:400;font-size:.9em}

/* layout devis : formulaire + aside */
.devis-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:32px;align-items:start}
.devis-main{min-width:0}
.devis-main h1{margin:0 0 6px}
.devis-main .lead{margin:0 0 22px}

/* champs */
.form{display:flex;flex-direction:column;gap:16px}
.form__h{font-size:1.15rem;margin:0}
.fld{display:flex;flex-direction:column;gap:6px}
.fld label{font-weight:600;font-size:.98rem}
.fld__help{font-size:.85rem;color:var(--gris)}
.fld input,.fld textarea{font:inherit;font-size:1rem;color:var(--noir);background:#fff;
  border:1px solid var(--filet);border-radius:var(--r);padding:12px 14px;width:100%;min-height:48px}
.fld textarea{min-height:auto;resize:vertical}
.fld input:focus,.fld textarea:focus{outline:2px solid var(--bleu);outline-offset:1px;border-color:var(--bleu)}
.err{color:#B42318;font-size:.9rem;margin:0}
.has-error input,.has-error textarea{border-color:#B42318}
.has-error input:focus,.has-error textarea:focus{outline-color:#B42318}

/* besoin : gros boutons cliquables (radios) */
.need-field{border:0;padding:0;margin:0;min-width:0}
.need-field legend{font-weight:600;font-size:.98rem;margin:0 0 8px;padding:0}
.need-grid{display:flex;flex-wrap:wrap;gap:10px}
.need-opt{position:relative;flex:1 1 94px;display:flex;align-items:center;justify-content:center;text-align:center;
  min-height:58px;padding:10px 5px;border:1.5px solid var(--filet);border-radius:var(--r-lg);
  background:#fff;cursor:pointer;font-weight:600;font-size:.82rem;line-height:1.2}
.need-opt input{position:absolute;opacity:0;inset:0;cursor:pointer}
.need-opt:hover{border-color:var(--bleu)}
.need-opt.is-sel{border-color:var(--bleu);background:var(--bleu-clair);color:var(--bleu-f)}
.need-field.has-error .need-opt{border-color:#B42318}

/* notes sous le bouton */
.form__note{font-size:.9rem;color:var(--gris);margin:4px 0 0}
.form__rgpd{font-size:.85rem;color:var(--gris);margin:0}
.form__rgpd a{color:var(--bleu);text-decoration:underline;text-underline-offset:2px}

/* confirmation */
.form-ok{background:var(--bleu-clair);border:1px solid #cfe5fb;border-radius:var(--r-lg);padding:24px}
.form-ok h2{margin:0 0 6px;font-size:1.3rem}

/* honeypot */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* aside devis */
.devis-aside .aside-card{display:flex;flex-direction:column;gap:12px}
.aside-card__t{font-size:1.05rem;margin:0 0 4px}

/* contact : 3 cartes */
.contact-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0 0 28px}
.contact-cards>*{min-width:0}
.contact-card{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:18px;
  border:1px solid var(--filet);border-radius:var(--r-lg);background:#fff;color:var(--noir);text-decoration:none}
.contact-card:hover{border-color:var(--bleu)}
.contact-card .ic{color:var(--bleu);margin-bottom:4px}
.contact-card__t{font-weight:700}
.contact-card__v{color:var(--gris);font-size:.95rem}
.contact-devis{margin:24px 0 0}
.contact-devis a{color:var(--bleu);text-decoration:underline;text-underline-offset:2px}
.contact-infos{margin:8px 0 0}

@media(max-width:860px){
  .devis-layout{grid-template-columns:1fr}
  .need-grid{grid-template-columns:repeat(3,1fr)}
  .contact-cards{grid-template-columns:1fr}
}
@media(max-width:560px){ .need-grid{grid-template-columns:repeat(2,1fr)} }

/* ===================================================================== */
/* Gabarit F10 — pages système (mentions légales / confidentialité)      */
/* ===================================================================== */
.wrap--read{max-width:760px}
.maj{color:var(--gris);font-size:.95rem;margin:4px 0 24px}
/* sommaire */
.sys-toc{background:var(--beige);border:1px solid var(--filet);border-radius:var(--r-lg);padding:16px 20px;margin:0 0 28px}
.sys-toc ul{list-style:none;margin:0;padding:0;columns:2;column-gap:28px}
.sys-toc li{margin:0 0 8px;break-inside:avoid}
.sys-toc a{color:var(--bleu);text-decoration:none;text-underline-offset:2px}
.sys-toc a:hover{text-decoration:underline}
/* corps en colonne de lecture */
.sys-body h2{font-size:clamp(22px,2.2vw,24px);margin:28px 0 10px;scroll-margin-top:84px}
.sys-body h2:first-child{margin-top:0}
.sys-body p{max-width:none}
/* ligne de contact en bas */
.sys-contact{margin:32px 0 0;padding-top:16px;border-top:1px solid var(--filet);color:var(--noir)}
.sys-contact a{color:var(--bleu);text-decoration:underline;text-underline-offset:2px}
@media(max-width:560px){ .sys-toc ul{columns:1} }

/* ===================================================================== */
/* GABARITS FINAUX — CSS commun : scoping accueil + corrections + mobile  */
/* ===================================================================== */

/* Typographie de l'accueil (seule divergence conservée : H1 44 / H2 40 / H3 ~19) */
.is-accueil h1{font-size:clamp(30px,3.2vw,44px);line-height:1.1}
.is-accueil h2{font-size:clamp(30px,3.4vw,40px);line-height:1.1;margin-bottom:28px}
.is-accueil h3{font-size:1.18rem}
@media(max-width:760px){ .is-accueil h1{font-size:30px} .is-accueil h2{font-size:28px} }

/* Corr 1 (49e69b93) — bouton dans le contenu principal : texte lisible (btn prime sur .redac a) */
.redac a.btn{text-decoration:none}
.redac a.btn--p{color:#fff}
.redac a.btn--p:hover{color:#fff}
.redac a.btn--s,.redac a.btn--o{color:var(--noir)}
.redac a.btn--s:hover{color:#fff}

/* Corr 2+3 (9843961a) — cartes marques : dépliage dans la même liste, sans « (suite) », */
/* une seule carte s'allonge (align-items:start), closed = même hauteur (min-height). */
.mq-grid{align-items:start}
.mq-card{min-height:268px}
.hide-extra{display:none}
.mq-card.open .hide-extra{display:list-item}
.mq-toggle{appearance:none;background:none;border:0;padding:4px 0;margin:0;cursor:pointer;
  color:var(--gris);font:inherit;font-size:.85rem;font-weight:600;display:inline-flex;align-items:center;gap:5px;width:max-content}
.mq-toggle:hover{color:var(--bleu)}
.mq-toggle .caret{transition:transform .15s}
.mq-card.open .mq-toggle .caret{transform:rotate(180deg)}
.mq-toggle .t-open{display:none}
.mq-card.open .mq-toggle .t-closed{display:none}
.mq-card.open .mq-toggle .t-open{display:inline}

/* Corr 6 — Devis « Votre besoin ? » : 5 boutons sur une ligne (jamais « Autre » seul en pleine largeur) */
.need-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.need-opt{flex:none}
@media(max-width:860px){ .need-grid{grid-template-columns:repeat(3,1fr)} }
@media(max-width:560px){ .need-grid{grid-template-columns:repeat(2,1fr)} }   /* 2 colonnes conservées jusqu'à 340 px */

/* Corr 7 — encadré « Pas envie de remplir ? » : texte des boutons sur une ligne */
.devis-aside .btn--block{white-space:nowrap;justify-content:flex-start;gap:8px}

/* Mobile (≤760) : cibles tactiles, barre basse visible, pas de débordement horizontal */
@media(max-width:760px){
  .mobar{display:grid}
  body{padding-bottom:64px}
  .sys-toc a,.toc a,.aside-rel,.plgrid .lnk,.symp-pick,.need-opt{min-height:44px;display:flex;align-items:center}
  .sys-toc a,.toc a{align-items:center}
  .contact-cards{grid-template-columns:1fr}
  .devis-layout{grid-template-columns:1fr}
  .art-layout{grid-template-columns:1fr}
  .art-aside{position:static}
}

/* ===================================================================== */
/* ANCIEN CONTENU — rendu « clarté » des classes héritées (brief §9.2).   */
/* Les textes des articles ne sont jamais modifiés ; seul le style change.*/
/* Aucune couleur hors palette, aucune ombre, jamais d'orange.            */
/* ===================================================================== */

/* image à la une de l'article */
.art-hero{margin:0 0 8px}
.art-hero img{width:100%;height:auto;display:block;border-radius:var(--r-lg);border:1px solid var(--filet)}

/* conteneur de corps d'article hérité */
.article-body>*:first-child{margin-top:0}
.article-body h2{margin:36px 0 12px}
.article-body h3{margin:24px 0 8px}
.article-body p,.article-body ul,.article-body ol{margin:0 0 16px;max-width:72ch}
.article-body img{max-width:100%;height:auto;border-radius:var(--r-lg);border:1px solid var(--filet)}
.article-body a{color:var(--bleu);text-decoration:underline;text-underline-offset:3px}
h2.hnum,h3.hnum{scroll-margin-top:80px}

/* boutons hérités → couleurs « clarté » (jamais d'orange) */
.btn-lg{height:52px;padding:0 24px;font-size:17px}
.btn-orange,.btn-blue{background:var(--bleu);color:#fff;border-color:var(--bleu)}
.btn-orange:hover,.btn-blue:hover{background:var(--bleu-f);border-color:var(--bleu-f);color:#fff}
.btn-outline,.btn-outline-blue{background:#fff;color:var(--noir);border-color:var(--noir)}
.btn-outline:hover,.btn-outline-blue:hover{border-color:var(--bleu);color:var(--bleu)}

/* alertes héritées → filets colorés, dans la palette */
.alert-box{display:flex;gap:12px;align-items:flex-start;padding:16px 18px;margin:0 0 20px;
  background:var(--beige);border:1px solid var(--filet);border-left:4px solid var(--gris);border-radius:var(--r)}
.alert-box .alert-icon{flex:0 0 auto;font-weight:700}
.alert-box p{margin:0 0 8px}.alert-box p:last-child{margin:0}
.alert-danger,.alert-warning{background:var(--alerte-bg);border-color:var(--alerte-bd);border-left-color:var(--alerte)}
.alert-info,.alert-tip{background:var(--bleu-clair);border-color:#CFE6FF;border-left-color:var(--bleu)}

/* TL;DR hérité */
.tldr-box{background:var(--bleu-clair);border:1px solid #CFE6FF;border-radius:var(--r-lg);padding:20px 22px;margin:0 0 24px}
.tldr-box--compact{padding:14px 16px}
.tldr-title,.tldr-box h3{margin:0 0 8px;font-size:18px}
.tldr-box p,.tldr-box ul{margin:0 0 8px}.tldr-box p:last-child,.tldr-box ul:last-child{margin:0}

/* étapes de diagnostic héritées */
.diag-steps{border:1px solid var(--filet);border-radius:var(--r-lg);padding:20px;margin:0 0 24px;background:#fff}
.diag-steps>h3{margin:0 0 14px}
.diag-step{display:flex;gap:14px;align-items:flex-start;padding:12px 0;border-top:1px solid var(--filet)}
.diag-step:first-of-type{border-top:0;padding-top:0}
.ds-num{flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:var(--bleu);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}
.ds-content strong{display:block;margin-bottom:2px}

/* fiches cause héritées */
.cause-card{border:1px solid var(--filet);border-radius:var(--r-lg);padding:20px 22px;margin:0 0 16px;background:#fff}
.cause-header{display:flex;gap:12px;align-items:center;margin:0 0 10px}
.cause-header h3{margin:0;font-size:19px}
.cause-num{flex:0 0 auto;width:30px;height:30px;border-radius:50%;background:var(--bleu);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px}
/* v5 point 2 : tous les ronds numérotés du même bleu (plus de noir/gris par variante) */
.cause-num-elec,.cause-num-meca,.cause-num-hydro{background:var(--bleu)}
.cause-diag,.cause-solution{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--filet)}
.cause-diag strong,.cause-solution strong{color:var(--noir)}

/* maillage interne hérité */
.internal-links{margin:28px 0 8px}
.internal-links>h3{margin:0 0 14px}
.il-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.il-link{display:flex;align-items:center;gap:10px;padding:14px 16px;border:1px solid var(--filet);border-radius:var(--r-lg);
  background:#fff;color:var(--noir);text-decoration:none}
.il-link:hover{border-color:var(--bleu);color:var(--bleu)}
.il-icon{flex:0 0 auto}
.il-type{margin-left:auto;font-size:12px;color:var(--gris);border:1px solid var(--filet);border-radius:20px;padding:2px 10px}
.il-title{font-weight:700;margin:0 0 10px}

/* CTA hérités */
.cta-inline{background:var(--beige);border:1px solid var(--filet);border-radius:var(--r-lg);padding:22px 24px;margin:0 0 24px;text-align:center}
.cta-inline h3{margin:0 0 6px}
.cta-btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:12px}
.cta-info{color:var(--gris);font-size:14px}

/* tableaux de prix hérités */
.table-wrapper{overflow-x:auto;margin:0 0 20px;border:1px solid var(--filet);border-radius:var(--r-lg)}
.price-table{width:100%;border-collapse:collapse;font-size:1rem}
.price-table th,.price-table td{padding:12px 14px;border-bottom:1px solid var(--filet);text-align:left}
.price-table thead th{background:var(--beige);font-weight:700}
.price-table tr:last-child td{border-bottom:0}

/* intitulés de section hérités */
.section-label{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.02em;color:var(--bleu);margin:0 0 6px;text-transform:none}
.section-title{font-size:28px;margin:0 0 8px}
.section-desc{color:var(--gris);max-width:72ch;margin:0 0 20px}

/* grilles « problèmes » héritées */
.problems,.problem-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:0 0 24px}
.problem-item{border:1px solid var(--filet);border-radius:var(--r-lg);padding:16px 18px;background:#fff}

/* grilles de services héritées (accueil ancien) */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0 0 24px}
.service-card{border:1px solid var(--filet);border-radius:var(--r-lg);padding:20px;background:#fff}
.service-icon,.service-icon-blue,.service-icon-orange,.service-icon-green{width:44px;height:44px;color:var(--bleu);margin:0 0 10px}
.service-icon svg,.service-card svg{width:44px;height:44px;color:var(--bleu)}

/* mentions / légal hérités */
.legal-list{margin:0 0 16px;padding-left:20px}
.legal-list li{margin:0 0 6px}
.legal-contact{background:var(--beige);border:1px solid var(--filet);border-radius:var(--r-lg);padding:16px 18px;margin:0 0 16px}
.re-legal-page{max-width:760px}
.footer-note,.article-disclaimer{color:var(--gris);font-size:14px;margin:16px 0 0}

/* divers hérités */
.block-eeat{border:1px solid var(--filet);border-radius:var(--r-lg);padding:16px 18px;margin:0 0 20px;background:var(--beige)}
.grid-modules,.grid-item{margin:0 0 16px}
.devis-separator{border:0;border-top:1px solid var(--filet);margin:20px 0}
.devis-tel-alt{color:var(--gris);font-size:14px}
.wp-block-heading{scroll-margin-top:80px}

@media(max-width:760px){
  .il-grid,.problems,.problem-grid,.services-grid{grid-template-columns:1fr}
}

/* Hub : titre de groupe (au-delà de 12 boutons) */
.hub-group{font-size:18px;margin:24px 0 12px}
.hub-group:first-child{margin-top:0}

/* Colonne « Autres marques » (fiche marque) */
.autres-mq{display:flex;flex-direction:column;gap:8px}
.autre-mq{display:flex;align-items:center;gap:10px;padding:8px;border:1px solid var(--filet);border-radius:var(--r);color:var(--noir);text-decoration:none}
.autre-mq:hover{border-color:var(--bleu);color:var(--bleu)}
.autre-mq__logo{flex:0 0 auto;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--beige);border-radius:6px;overflow:hidden;font-size:11px;color:var(--gris)}
.autre-mq__logo img{width:100%;height:100%;object-fit:contain}

/* Listes de liens (404, recherche) */
.link-list{columns:2;column-gap:32px;margin:0 0 20px;padding-left:18px}
.link-list li{margin:0 0 6px;break-inside:avoid}
.list-item{padding:14px 0;border-bottom:1px solid var(--filet)}
.list-item h2{font-size:20px;margin:0 0 4px}
/* Lien « Gérer les cookies » */
.consent-manage{background:none;border:0;color:var(--gris);text-decoration:underline;cursor:pointer;font:inherit;padding:0;margin-left:8px}
/* Décalage de la bulle chatbot au-dessus de la barre mobile (brief §10.7, ~70px) */
@media(max-width:760px){ .has-chatbot [class*="chat-widget"],.has-chatbot [id*="sacha"]{bottom:74px !important} }
/* Formulaires : confirmation + erreurs */
.form-confirm{background:var(--bleu-clair);border:1px solid #CFE6FF;border-radius:var(--r-lg);padding:18px 20px;margin:0 0 16px}
.err{color:var(--alerte);font-size:14px;margin:4px 0 0}
.err--global{margin:12px 0}
.full-width{width:100%;margin-bottom:8px}
@media(max-width:760px){ .link-list{columns:1} }

/* Filet de sécurité : classes héritées qui, normalement, n'apparaissent pas dans le rendu
   (la FAQ est extraite puis re-rendue en .qa ; js-tel est un lien ; form-field = ancien CF7 ignoré).
   Styles défensifs au cas où un contenu non standard les laisserait visibles. */
.faq-container{border-top:1px solid var(--filet);margin:0 0 24px}
.faq-item{border-bottom:1px solid var(--filet);padding:4px 0}
.faq-q{display:flex;width:100%;justify-content:space-between;gap:12px;background:none;border:0;cursor:pointer;
  font:inherit;font-weight:700;text-align:left;color:var(--noir);padding:16px 0}
.faq-chevron{flex:0 0 auto;color:var(--bleu)}
.faq-a{color:var(--gris);padding:0 0 16px;max-width:72ch}
.form-field{margin:0 0 14px}

/* ===================================================================== */
/* CORRECTIONS v1 — points 2 et 10 (boutons, colonnes, tailles, arrondis) */
/* ===================================================================== */

/* P2 — js-tel ne doit jamais écraser la couleur d'un bouton */
a.js-tel:not([class*="btn"]){color:var(--noir);font-weight:700;text-decoration:none}
a.js-tel:not([class*="btn"]):hover{color:var(--bleu)}
.btn-orange,.btn-blue,a.btn-orange,a.btn-blue{background:var(--bleu);color:#fff;border-color:var(--bleu)}
.btn-orange:hover,.btn-blue:hover,a.btn-orange:hover,a.btn-blue:hover{background:var(--bleu-f);border-color:var(--bleu-f);color:#fff}
.btn-outline,.btn-outline-blue,a.btn-outline,a.btn-outline-blue{background:#fff;color:var(--noir);border-color:var(--noir)}

/* P10a — Diagnostic / Solution : étiquette à gauche, texte qui coule (plus de colonnes) */
.cause-diag,.cause-solution{display:block;gap:0;align-items:stretch;padding:12px 0 12px 16px;border-top:1px solid var(--filet);border-left:3px solid var(--bleu-clair)}
.cause-card .cause-diag>strong:first-child,.cause-card .cause-solution>strong:first-child{color:var(--noir)}

/* P10b — Alertes : icône + étiquette en ligne, texte qui coule */
.alert-box{display:block;gap:0;align-items:stretch}
.alert-box .alert-icon{display:inline;margin-right:6px}
.alert-box>div{display:inline}
.alert-box>div>strong{display:inline}

/* P10c — Une seule taille pour le texte courant (18px / 16px mobile), partout */
.redac p,.redac li,.redac dd,.article-body p,.article-body li,.article-body dd,
.qa p,.faq-a,.faq-a p,.cause-card p,.cause-diag,.cause-solution,.ds-content,.ds-content p,
.tldr-box p,.tldr-box li,.alert-box,.alert-box p,.cta-inline p,.price-table th,.price-table td,
.step p,.presta__b p,.internal-links,.il-link{font-size:1rem;line-height:1.6}

/* P10d — Sommaire plus petit et serré, colonne discrète */
.toc,.sys-toc,.sys-toc ul{font-size:.88rem;line-height:1.35}
.toc li,.sys-toc li{margin:0 0 4px}

/* P10e — Un seul arrondi pour les blocs et cartes (12px = --r-lg) ; les boutons gardent 8px */
.alert-box,.tldr-box,.diag-steps,.cause-card,.il-link,.price-table,.table-wrapper,
.cta-inline,.problem-item,.service-card,.legal-contact,.block-eeat,.answer-box,.pro-box,.cta-light{border-radius:var(--r-lg)}

/* ===================================================================== */
/* P11 — Sommaire qui suit la lecture (barre mobile + aside collée)       */
/* ===================================================================== */
@media(min-width:1024px){
  .art-aside{position:sticky;top:76px;align-self:start;max-height:calc(100vh - 92px);overflow:auto}
  .toc{counter-reset:toc;list-style:none;padding:0;margin:0}
  .toc li{counter-increment:toc;margin:0 0 6px}
  .toc li a{display:inline-flex;gap:6px}
  .toc li a::before{content:counter(toc) ".";color:var(--gris);font-variant-numeric:tabular-nums}
  .toc a.is-active,.sys-toc a.is-active{color:var(--bleu);font-weight:700}
  .toc a.is-active::before{color:var(--bleu)}
  .toc-bar{display:none !important}
}
@media(max-width:1023px){
  /* barre pleine largeur ; les gouttières gauche/droite viennent du padding interne (= gouttière du site, 24px) */
  .toc-bar{position:sticky;top:56px;z-index:30;background:#fff;border-bottom:1px solid var(--filet)}
  .toc-bar[hidden]{display:none}
  .toc-bar__toggle{display:flex;align-items:center;gap:8px;width:100%;height:44px;padding:0 24px;background:none;border:0;cursor:pointer;font:inherit;text-align:left;color:var(--noir)}
  .toc-bar__label{font-weight:700;flex:0 0 auto}
  .toc-bar__current{color:var(--gris);font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
  .toc-bar__caret{flex:0 0 auto;transition:transform .15s}
  .toc-bar.open .toc-bar__caret{transform:rotate(180deg)}
  .toc-bar__list{display:none;border-top:1px solid var(--filet);max-height:60vh;overflow:auto;padding:8px 24px 12px}
  .toc-bar.open .toc-bar__list{display:block}
  .toc-bar__list ol{counter-reset:tb;margin:0;padding:0;list-style:none}
  .toc-bar__list li{counter-increment:tb;margin:0 0 8px}
  .toc-bar__list a{display:inline-flex;gap:6px;min-height:0}
  .toc-bar__list a::before{content:counter(tb) ".";color:var(--gris)}
  .toc-bar__list a.is-active{color:var(--bleu);font-weight:700}
  /* la carte sommaire de l'aside et le sommaire système sont remplacés par la barre sur mobile */
  .aside-card--toc,.sys-toc{display:none}
}

/* Conteneur hérité de certaines descriptions de catégorie */
.article-wrapper>*:first-child{margin-top:0}
.article-wrapper h2{margin:36px 0 12px}
.article-wrapper h3{margin:24px 0 8px}
.article-wrapper p,.article-wrapper ul,.article-wrapper ol{margin:0 0 16px;max-width:72ch}

/* P11 v2 — si le contenu numérote déjà ses titres (hnum), le sommaire ne rajoute pas de numéro */
.toc.toc--prenum li a::before{content:none}
.toc-bar__list.toc--prenum a::before{content:none}
.toc-bar__list.toc--prenum{counter-reset:none}

/* ===================================================================== */
/* v5 point 9 — bloc de fin unifié (encadré clair « clarté », arrondi unique) */
.end-cta{background:var(--beige);border:1px solid var(--filet);border-radius:var(--r-lg);
  padding:clamp(22px,3vw,32px);text-align:center}
.end-cta>p{margin:0 auto 16px;color:var(--noir);max-width:54ch}
.end-cta .acts{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.end-cta__rappel{margin:14px 0 0}
.end-cta__rappel a{color:var(--bleu);text-decoration:underline;text-underline-offset:2px}
@media(max-width:560px){ .end-cta .acts .btn{width:100%} }

/* v5 point 6 — pictos de remplacement des emojis de l'ancien contenu (mask SVG, survit à wp_kses_post) */
.ce-ico{display:inline-block;width:1.05em;height:1.05em;vertical-align:-.15em;margin-right:.35em;
  background-color:var(--bleu);-webkit-mask:center/contain no-repeat;mask:center/contain no-repeat}
.ce-warn{background-color:var(--alerte)}
.ce-bolt{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 2 4 14h6l-1 8 9-12h-6z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 2 4 14h6l-1 8 9-12h-6z'/%3E%3C/svg%3E")}
.ce-warn{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 1 21h22z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 1 21h22z'/%3E%3C/svg%3E")}
.ce-phone{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.24 11 11 0 0 0 3.4.55 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11 11 0 0 0 .55 3.4 1 1 0 0 1-.25 1z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.24 11 11 0 0 0 3.4.55 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11 11 0 0 0 .55 3.4 1 1 0 0 1-.25 1z'/%3E%3C/svg%3E")}
.ce-info{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 15h-2v-6h2zm0-8h-2V7h2z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 15h-2v-6h2zm0-8h-2V7h2z'/%3E%3C/svg%3E")}
