/* ============================================================
   commissaires-comptes.fr — famille V4-norme, habillage réservé
   le 2026-09-11 (registre-familles.json). Police Mozilla Text,
   teinte d'accent 170, préfixes cac- / mnd- / crt-.
   Tokens SÉMANTIQUES : jamais nommés par couleur.
   ============================================================ */

/* Police self-hostée — aucun appel Google Fonts (fiche d'habillage §Typographie) */
@font-face{
  font-family:'Mozilla Text';
  font-style:normal;
  font-weight:200 700;
  font-display:swap;
  src:url('/fonts/mozilla-text-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Mozilla Text';
  font-style:normal;
  font-weight:200 700;
  font-display:swap;
  src:url('/fonts/mozilla-text-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  /* Encre — bleu-nuit de rapport */
  --ink:        oklch(24% 0.035 255);
  --ink-2:      oklch(39% 0.028 255);
  --ink-3:      oklch(52% 0.020 255);
  /* Papier froid, jamais blanc pur */
  --paper:      oklch(98.5% 0.004 250);
  --surface:    oklch(96% 0.008 250);
  --surface-2:  oklch(92.8% 0.010 250);
  /* Accent NEUTRE de repère — teinte 170 réservée. Pas d'urgence fabriquée. */
  --accent:     oklch(50% 0.070 170);
  --accent-ink: oklch(99% 0.003 170);
  --accent-deep:oklch(38% 0.060 170);
  --accent-wash:oklch(95.5% 0.022 170);
  /* Filets */
  --line:       oklch(88% 0.010 250);
  --line-2:     oklch(80% 0.018 255);
  --field-line: oklch(50% 0.035 255);
  /* Rôle typo : grotesque néo-institutionnel, une seule police */
  --font: "Mozilla Text", system-ui, "Segoe UI", sans-serif;
  --maxw: 1200px;
  --r: 2px;
  /* Carte réelle (gen_map_svg) — rôles dérivés de la palette */
  --map-land:var(--surface-2); --map-land-hover:var(--surface);
  --map-line:var(--line-2); --map-region-line:var(--line);
  --map-com:var(--surface-2); --map-com-line:var(--paper);
  --map-in:var(--accent-wash); --map-page:var(--accent);
  --map-dot:var(--ink-2); --map-dot-page:var(--accent);
  --map-label:var(--ink); --map-muted:var(--ink-3); --map-focus:var(--accent-deep);
}

*{box-sizing:border-box}
html{overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);
  font-weight:400;line-height:1.55;font-optical-sizing:auto;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
input[type=range],input[type=checkbox],input[type=radio],progress{accent-color:var(--ink)}
img,svg,video{max-width:100%;display:block}
a{color:var(--accent-deep);text-decoration:underline;text-underline-offset:2px}
a:hover{color:var(--ink)}
.num{font-feature-settings:"tnum" 1,"lnum" 1}
.sr-only{position:absolute;width:1px;height:1px;max-width:1px;padding:0;margin:-1px;
  overflow:hidden;clip-path:inset(50%);border:0}

/* ---------- Ossature ---------- */
.cac-wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:28px}
.cac-wrap.mid{max-width:1040px}
.cac-wrap.narrow{max-width:880px}
.cac-section{padding-block:96px;position:relative}
.cac-section.tight{padding-block:56px}
.bg-paper{background:var(--paper)}
.bg-surface{background:var(--surface)}
.bg-ink{background:var(--ink);color:var(--paper)}
.bg-ink h1,.bg-ink h2,.bg-ink h3{color:var(--paper)}
.bg-ink a{color:var(--accent-wash)}
.bg-ink .cac-lede,.bg-ink p{color:oklch(88% 0.010 250)}

.cac-skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--paper);
  padding:10px 16px;z-index:200}
.cac-skip:focus{left:8px;top:8px}

/* Césure MANUELLE : en français, la césure automatique coupe mal et a déjà cassé
   un H1 (leçon V15, rappelée par le pack V4). On garde overflow-wrap pour les mots
   très longs, et la césure automatique n'est jamais activée. */
html{hyphens:manual}
h1,h2,h3{line-height:1.18;font-weight:700;margin:0 0 .5em;overflow-wrap:break-word;hyphens:manual}
h1{font-size:clamp(27px,4vw,44px);letter-spacing:-.012em}
h2{font-size:clamp(25px,2.8vw,34px);letter-spacing:-.008em}
h3{font-size:clamp(18px,1.5vw,21px)}
p{margin:0 0 1.05em}
.cac-lede{font-size:clamp(17px,1.35vw,20px);color:var(--ink-2);font-weight:400}
.cac-kicker{font-size:13px;letter-spacing:.10em;text-transform:uppercase;font-weight:600;
  color:var(--accent-deep);margin:0 0 10px;display:flex;align-items:center;gap:10px}
.cac-kicker::after{content:"";height:2px;width:44px;background:var(--accent);display:block}

/* ---------- Bandeau + en-tête ---------- */
.cac-bandeau{background:var(--ink);color:oklch(86% 0.012 250);font-size:13px}
.cac-bandeau .cac-wrap{display:flex;flex-wrap:wrap;gap:8px 22px;justify-content:space-between;
  padding-block:9px}
.cac-bandeau a{color:var(--accent-wash)}

.cac-hdr{position:sticky;top:0;z-index:100;background:var(--paper);
  border-bottom:1px solid var(--line);transition:box-shadow .18s ease}
.cac-hdr.cac-is-solid{box-shadow:0 1px 0 var(--line),0 6px 22px oklch(24% 0.035 255 / .07)}
.cac-hdr .cac-wrap{display:flex;align-items:center;gap:20px;padding-block:14px}
.cac-mark{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);flex:0 1 auto;min-width:0}
.cac-mark b{font-size:18px;letter-spacing:-.01em;max-width:min(62vw,340px);overflow:hidden;text-overflow:ellipsis}
.cac-mark span{font-size:12px;color:var(--ink-3)}
.cac-nav{margin-left:auto}
.cac-nav>ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.cac-drop>button{font:inherit;font-size:15px;font-weight:500;color:var(--ink);background:none;
  border:0;padding:10px 14px;cursor:pointer;border-radius:var(--r)}
.cac-drop>button:hover{background:var(--surface)}
.cac-panel{position:absolute;top:100%;left:0;right:0;background:var(--paper);
  border-block:1px solid var(--line);padding:24px 0;display:none}
.cac-drop[data-open="1"] .cac-panel{display:block}
.cac-panel>ul{max-width:var(--maxw);margin-inline:auto;padding-inline:28px;list-style:none;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 32px}
.cac-panel a{display:flex;flex-direction:column;gap:2px;padding:10px 12px;text-decoration:none;
  color:var(--ink);border-radius:var(--r)}
.cac-panel a:hover{background:var(--surface)}
.cac-panel a small{color:var(--ink-3);font-size:12.5px}
.cac-burger{display:none;font:inherit;font-weight:600;background:none;border:1px solid var(--line-2);
  border-radius:var(--r);padding:9px 14px;cursor:pointer;color:var(--ink);margin-left:auto}

/* ---------- Boutons ---------- */
.cac-btn{display:inline-block;font:inherit;font-weight:600;font-size:16px;cursor:pointer;
  background:var(--accent);color:var(--accent-ink);border:1px solid var(--accent);
  border-radius:var(--r);padding:13px 24px;text-decoration:none;text-align:center}
.cac-btn:hover{background:var(--accent-deep);border-color:var(--accent-deep);color:var(--accent-ink)}
.cac-btn-ghost{background:transparent;color:var(--ink);border-color:var(--ink-3)}
.cac-btn-ghost:hover{background:var(--surface);color:var(--ink)}
.bg-ink .cac-btn{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.bg-ink .cac-btn-ghost{color:var(--paper);border-color:oklch(55% 0.020 250)}

/* ---------- Hero : mode A, titre pleine largeur puis bande formulaire ---------- */
.cac-hero{padding-block:40px 0;background:var(--paper)}
.cac-hero .cac-maj{font-size:13px;color:var(--ink-3);margin:0 0 14px}
.cac-hero h1{max-width:17ch}
.cac-hero .cac-lede{max-width:62ch}

/* Bande formulaire PLEINE LARGEUR (archétype réservé : form-fullwidth-band) */
.cac-bande{background:var(--surface);border-block:1px solid var(--line);padding-block:22px;
  margin-top:24px}
.cac-bande form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 18px;align-items:end}
.cac-bande .cac-f-full{grid-column:1/-1}
.cac-bande .cac-btn{width:100%}

/* Aimant secondaire — jamais à poids égal avec la conversion principale */
.cac-aimant{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:baseline;
  margin-top:18px;font-size:14.5px;color:var(--ink-2)}
.cac-aimant b{color:var(--ink)}

/* ---------- Formulaires ---------- */
label{display:block;font-size:14px;font-weight:600;margin-bottom:6px;color:var(--ink-2)}
input[type=text],input[type=email],input[type=tel],input[type=number],select,textarea{
  width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--paper);
  border:1px solid var(--field-line);border-radius:var(--r);padding:11px 13px}
textarea{min-height:104px;resize:vertical}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible{
  outline:2px solid var(--accent-deep);outline-offset:2px}
.cac-req{color:var(--accent-deep)}
.cac-f-row{display:grid;gap:14px 18px;margin-bottom:14px}
.cac-f-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cac-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cac-consent{display:flex;gap:10px;align-items:flex-start;margin:14px 0}
.cac-consent input{width:18px;height:18px;flex:0 0 auto;margin-top:2px}
.cac-consent label{font-weight:400;font-size:13.5px;color:var(--ink-2);margin:0}
.cac-note{font-size:14px;color:var(--ink-3);margin:-4px 0 14px}
.cac-rassure{font-size:13.5px;color:var(--ink-3);margin-top:12px}

/* ---------- Volet latéral ---------- */
.cac-volet-overlay{position:fixed;inset:0;background:oklch(24% 0.035 255 / .45);z-index:150}
.cac-volet{position:fixed;top:0;right:0;height:100dvh;width:min(560px,100vw);z-index:160;
  background:var(--paper);border-left:1px solid var(--line);overflow-y:auto;
  transform:translateX(100%);transition:transform .22s ease,visibility .22s;
  visibility:hidden}
.cac-volet[data-open="1"]{transform:translateX(0);visibility:visible}
.cac-volet-body{padding:28px 28px 44px}
.cac-volet-close{position:absolute;top:14px;right:16px;font:inherit;font-weight:600;
  background:none;border:1px solid var(--ink-3);border-radius:var(--r);cursor:pointer;
  min-height:44px;min-width:44px;padding:10px 16px}

/* ---------- Encadré « ce que dit le texte » — bordure épaisse ---------- */
.crt-loi{border:1px solid var(--line-2);border-left:6px solid var(--accent);
  background:var(--paper);padding:24px 26px;border-radius:var(--r);margin:28px 0}
.crt-loi h3{margin-top:0}
.crt-loi .crt-ref{font-size:13.5px;color:var(--ink-3);margin-bottom:0}

/* ---------- Fac-similé de document, CSS pur (trait V4 : zéro photo) ---------- */
.crt-facsim{background:var(--paper);border:1px solid var(--line-2);border-radius:var(--r);
  padding:26px 28px;position:relative;box-shadow:0 1px 0 var(--line),0 14px 30px oklch(24% 0.035 255 / .06)}
.crt-facsim .crt-fs-head{display:flex;justify-content:space-between;gap:16px;
  border-bottom:2px solid var(--ink);padding-bottom:10px;margin-bottom:18px;
  font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);font-weight:600}
.crt-facsim .crt-fs-titre{font-weight:700;font-size:17px;margin-bottom:14px;color:var(--ink)}
.crt-facsim .crt-fs-l{height:9px;background:var(--surface-2);border-radius:1px;margin-bottom:9px}
.crt-facsim .crt-fs-l.w90{width:90%}.crt-facsim .crt-fs-l.w75{width:75%}
.crt-facsim .crt-fs-l.w60{width:60%}.crt-facsim .crt-fs-l.w40{width:40%}
.crt-facsim .crt-fs-op{border:1px solid var(--line-2);border-left:4px solid var(--accent);
  padding:12px 14px;margin:16px 0;font-size:14.5px;color:var(--ink-2);background:var(--surface)}
.crt-facsim .crt-fs-stamp{position:absolute;right:22px;bottom:18px;border:2px solid var(--accent);
  color:var(--accent-deep);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  padding:6px 12px;transform:rotate(-6deg);border-radius:var(--r);opacity:.9}

/* ---------- Module signature : le calendrier du mandat (mnd-) ---------- */
.mnd-cal{border:1px solid var(--line-2);border-radius:var(--r);background:var(--paper);
  padding:26px 26px 30px}
.mnd-cal-head{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:space-between;
  align-items:baseline;margin-bottom:22px}
.mnd-cal-head p{margin:0;font-size:14px;color:var(--ink-3)}
.mnd-frise{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0;
  border-top:2px solid var(--ink);position:relative}
.mnd-ex{padding:16px 14px 18px;border-right:1px dashed var(--line-2);position:relative}
.mnd-ex:last-child{border-right:0}
.mnd-ex-n{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);
  font-weight:600;margin-bottom:8px}
.mnd-ex-t{font-weight:700;font-size:15px;margin-bottom:6px}
.mnd-ex p{font-size:13.5px;color:var(--ink-2);margin:0}
.mnd-ex[data-jalon="1"]::before{content:"";position:absolute;top:-2px;left:14px;width:26px;height:6px;
  background:var(--accent)}
.mnd-jalons{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr));gap:14px;
  margin-top:24px}
.mnd-jalon{border-left:3px solid var(--accent);padding:4px 0 4px 14px}
.mnd-jalon b{display:block;font-size:14.5px}
.mnd-jalon span{font-size:13.5px;color:var(--ink-2)}

/* ---------- Vérificateur d'obligation — SANS verdict ---------- */
.crt-verif{border:1px solid var(--line-2);border-radius:var(--r);padding:26px;background:var(--surface)}
.crt-verif-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.crt-verif-out{margin-top:20px;border-top:1px solid var(--line-2);padding-top:18px;
  font-size:14.5px;color:var(--ink-2)}
.crt-verif-out b{color:var(--ink)}

/* ---------- Tableau d'échéances : seul élément pleine laize ---------- */
.crt-tw{overflow-x:auto;margin:26px 0}
table{border-collapse:collapse;width:100%;font-size:15px}
caption{text-align:left;font-size:13.5px;color:var(--ink-3);padding-bottom:10px}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
thead th{background:var(--ink);color:var(--paper);font-size:13px;letter-spacing:.04em;
  text-transform:uppercase;border-bottom:0}
tbody tr:nth-child(even){background:var(--surface)}

/* ---------- Sommaires numérotés en marge gauche ---------- */
.crt-som{border-left:2px solid var(--accent);padding-left:20px;margin:0 0 34px}
.crt-som p{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);
  font-weight:600;margin:0 0 10px}
.crt-som ol{margin:0;padding-left:18px;font-size:15px}
.crt-som li{margin-bottom:7px}
.crt-som a{color:var(--ink-2)}

/* ---------- Cartes, étapes, preuve ---------- */
.cac-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(248px,100%),1fr));gap:18px}
.cac-cards a{display:flex;flex-direction:column;gap:7px;padding:22px;border:1px solid var(--line-2);
  border-radius:var(--r);text-decoration:none;color:var(--ink);background:var(--paper)}
.cac-cards a:hover{border-color:var(--accent);background:var(--accent-wash)}
.cac-cards strong{font-size:17px}
.cac-cards span{font-size:14.5px;color:var(--ink-2)}
.cac-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(215px,100%),1fr));gap:22px}
.cac-steps>div{border-top:2px solid var(--accent);padding-top:14px}
.cac-trust{display:flex;flex-wrap:wrap;gap:26px}
.cac-trust>div{flex:1 1 40%;min-width:0}
.cac-trust h3{margin-bottom:6px}
.cac-trust p{font-size:14.5px;color:var(--ink-2);margin:0}
.cac-rep{padding-left:20px}
.cac-rep li{margin-bottom:9px}

/* ---------- Reprise de conversion ---------- */
.cac-reprise{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center;justify-content:space-between;
  border-block:1px solid var(--line-2);padding:22px 0;margin:0}
.cac-reprise p{margin:0;font-size:16px;color:var(--ink-2);flex:1 1 380px}

/* ---------- FAQ ---------- */
.cac-faq details{border-bottom:1px solid var(--line);padding:4px 0}
.cac-faq summary{cursor:pointer;font-weight:600;font-size:17px;padding:16px 0;list-style:none;
  display:flex;justify-content:space-between;gap:16px;align-items:center}
.cac-faq summary::-webkit-details-marker{display:none}
.cac-faq summary::after{content:"+";color:var(--accent-deep);font-weight:700;font-size:21px;flex:0 0 auto}
.cac-faq details[open] summary::after{content:"–"}
.cac-faq .cac-a{padding:0 0 18px;color:var(--ink-2);max-width:74ch}

/* ---------- Carte ---------- */
.cac-carte{max-width:560px;margin-inline:auto}
.cac-carte svg{width:100%;height:auto}

/* ---------- Coupe ---------- */
.cac-coupe{border:0;border-top:1px solid var(--line);margin:0;
  background:linear-gradient(90deg,var(--accent) 0 var(--x,20%),transparent var(--x,20%));
  height:2px;border-top:0}

/* ---------- Pied de page ---------- */
.cac-ft{background:var(--ink);color:oklch(86% 0.012 250);padding-block:56px 34px;margin-top:0}
.cac-ft h3{color:var(--paper);font-size:15px;margin-bottom:12px}
.cac-ft a{color:oklch(88% 0.012 250);text-decoration:none}
.cac-ft a:hover{color:var(--accent-wash);text-decoration:underline}
.cac-ft-cols{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:34px}
.cac-ft ul{list-style:none;margin:0;padding:0;font-size:14.5px}
.cac-ft li{margin-bottom:8px}
.cac-ft p{font-size:14.5px}
.cac-foot-sources{border-top:1px solid oklch(38% 0.028 255);margin-top:34px;padding-top:22px;
  font-size:13px;color:oklch(76% 0.014 250)}
.cac-ft-end{font-size:13px;color:oklch(70% 0.014 250);margin:14px 0 0}
.cac-crumb ol{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:22px 0 0;
  font-size:13.5px;color:var(--ink-3)}
.cac-crumb li+li::before{content:"›";margin-right:8px;color:var(--line-2)}
.cac-crumb a{color:var(--ink-3)}
.cac-maj-date{font-size:13.5px;color:var(--ink-3);border-top:1px solid var(--line);padding-top:16px}
.cac-blog-index{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(290px,100%),1fr));gap:20px}
.cac-blog-index a{display:flex;flex-direction:column;gap:8px;padding:24px;border:1px solid var(--line-2);
  border-radius:var(--r);text-decoration:none;color:var(--ink);background:var(--paper)}
.cac-blog-index a:hover{border-color:var(--accent);background:var(--accent-wash)}
.cac-blog-index strong{font-size:17.5px;line-height:1.3}
.cac-blog-index span{font-size:14.5px;color:var(--ink-2)}

/* ============================================================
   Adaptations — la bande formulaire et la frise sont les deux
   points de rupture réels de cette famille.
   ============================================================ */
@media (max-width:980px){
  .cac-bande form{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cac-ft-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .crt-verif-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mnd-frise{grid-auto-flow:row;grid-auto-columns:auto;border-top:0}
  .mnd-ex{border-right:0;border-top:2px solid var(--ink)}
}
@media (max-width:760px){
  .cac-mark span{display:none}
  .cac-hero{padding-block:22px 0}
  .cac-hero .cac-maj{display:none}
  .cac-burger{display:block}
  .cac-nav{position:absolute;top:100%;left:0;right:0;background:var(--paper);
    border-bottom:1px solid var(--line);display:none;margin-left:0}
  .cac-nav[data-open="1"]{display:block}
  .cac-nav>ul{flex-direction:column;padding:14px 28px 22px;gap:2px}
  .cac-panel{position:static;border:0;padding:0 0 10px;display:block}
  .cac-panel>ul{grid-template-columns:1fr;padding-inline:0}
  .cac-drop>button{width:100%;text-align:left}
  .cac-section{padding-block:64px}
  .cac-hero{padding-block:48px 0}
  .cac-bande form{grid-template-columns:1fr}
  .crt-verif-grid{grid-template-columns:1fr}
  .cac-ft-cols{grid-template-columns:1fr}
  .cac-trust>div{flex:1 1 100%}
  .cac-reprise{flex-direction:column;align-items:flex-start}
}
@media (max-width:420px){
  .cac-wrap{padding-inline:18px}
  .cac-panel>ul{padding-inline:0}
  .crt-facsim{padding:20px 18px}
  .mnd-cal{padding:20px 18px 24px}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* Référence légale citée sans lien : le permalien n'a pas été vérifié à la main.
   Se distingue d'un lien (pas de couleur d'accent, pas de soulignement) tout en
   restant repérable comme une référence. */
.crt-src{border-bottom:1px dotted var(--line-2);color:var(--ink-2)}
.cac-verif-sit{font-size:15px;color:var(--ink-2)}
.cac-verif-limite{font-size:14px;color:var(--ink-2);border-top:1px solid var(--line);
  padding-top:14px;margin-top:16px}

/* Temps de lecture d'un article, calculé sur le texte réel par le générateur. */
.cac-temps{font-size:13px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;
  color:var(--ink-3);margin:0 0 14px}

/* Reprise HTML des libellés de la carte : le générateur les retire du SVG sous
   12 px de rendu, ils doivent rester lisibles et accessibles à côté d'elle. */
.cac-villes{font-size:14.5px;color:var(--ink-2);margin-top:18px}
.cac-attrib{font-size:12.5px;color:var(--ink-3);margin:6px 0 0}

/* Bloc CSS minimal à coller dans theme.css du site — généré par gen_kit_components.py.
   cac est déjà substitué par le préfixe du site dans le fichier livré ; ce gabarit
   reste en clair ici pour qu'on sache ce qui a été injecté. */

/* --- en-tête (data-hdr) --- */
/* .cac-is-solid est ajoutée quand la page a défilé au-delà du seuil — l'état est
   TOUJOURS correct dès le premier rendu (les 3 variantes du générateur synchronisent
   immédiatement, jamais seulement au prochain scroll). Adapter le rendu visuel à la
   direction du site : */
[data-hdr] { transition: background-color .2s ease, box-shadow .2s ease; }
[data-hdr].cac-is-solid { /* ex. background:var(--paper); box-shadow:0 1px 0 var(--line); */ }

/* --- callbar mobile (data-mbar) --- */
:root { --cac-callbar-h: 64px; } /* repli no-JS, écrasé en direct par le générateur */
[data-mbar] { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; }
/* Exemple d'usage — à poser sur le bouton d'envoi du hero pour ne jamais être recouvert :
   .hero-submit { margin-bottom: var(--cac-callbar-h); } */

/* --- volet latéral (data-drawer) --- */
[data-drawer] {
  position: fixed; inset: 0 0 0 auto; width: min(468px, 100vw); z-index: 90;
  transform: translateX(101%); transition: transform .28s ease; overflow-y: auto;
}
[data-drawer].cac-is-open { transform: translateX(0); }
[data-drawer-scrim] {
  position: fixed; inset: 0; z-index: 85; opacity: 0; pointer-events: none;
  transition: opacity .22s ease; background: oklch(0.22 0.03 250 / .5);
}
/* :has() plutôt qu'une classe posée en plus par le JS sur le scrim — un point de moins à
   maintenir en cohérence entre script et CSS. */
body:has([data-drawer].cac-is-open) [data-drawer-scrim] { opacity: 1; pointer-events: auto; }

/* verrouillage du scroll body pendant que le volet est ouvert */
html.cac-scroll-locked { overflow: hidden; }
html.cac-scroll-locked body { position: fixed; left: 0; right: 0; width: 100%; }

/* --- simulateur (data-sim) --- */
[data-sim-result] { font-variant-numeric: tabular-nums; }
