/* LE FILS — variante C de la « Zone d'intervention » : « Ma commune est-elle couverte ? »
   Carte épurée (SVG inline généré par outils/carte-c.py, aucune requête tierce) + champ de recherche de commune.
   Chargé APRÈS accueil.css, uniquement sur zone-c.html. Préfixe : zc-.
   Contrastes sur noir (#000) : blanc 72 % ≈ 11:1, blanc 62 % ≈ 8:1, --la-clair #ff5a5a 6,86:1, blanc sur #BE0F10 6,4:1. */

.zc-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,580px);gap:64px;align-items:center}
.zc-side{max-width:540px;width:100%}

/* ---------- Recherche ---------- */
.zc-label{display:block;margin:0 0 14px;font:700 clamp(23px,2.5vw,30px)/1.1 'Bricolage Grotesque',sans-serif;letter-spacing:-.01em;color:#fff}
.zc-field{position:relative;display:flex;gap:10px}
.zc-input{flex:1 1 auto;min-width:0;height:56px;padding:0 22px;border-radius:40px;border:1.5px solid rgba(255,255,255,.4);background:rgba(255,255,255,.08);
  color:#fff;font:600 16px 'Plus Jakarta Sans',sans-serif;transition:border-color .2s,background .2s,box-shadow .2s}
.zc-input::placeholder{color:rgba(255,255,255,.62);font-weight:500}
.zc-input:hover{background:rgba(255,255,255,.11)}
.zc-input:focus{outline:none;border-color:var(--la-clair);background:rgba(255,255,255,.12);box-shadow:0 0 0 4px rgba(255,90,90,.28)}
.zc-go{flex:none;height:56px;padding:0 26px;border:0;border-radius:40px;background:var(--accent);color:#fff;font:700 15px 'Plus Jakarta Sans',sans-serif;cursor:pointer;
  transition:background .2s,transform .2s,box-shadow .25s}
.zc-go:hover{background:var(--accent-fonce);transform:translateY(-2px);box-shadow:0 12px 28px rgba(190,15,16,.4)}
.zc-go:focus-visible,.zc-essais button:focus-visible,.zc-call:focus-visible{outline:3px solid var(--la-clair-2);outline-offset:3px}
.zc-aide{margin:10px 0 0 8px;font-size:13.5px;line-height:1.5;color:rgba(255,255,255,.72)}
.zc-essais{margin:14px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13.5px;color:rgba(255,255,255,.72)}
.zc-essais button{height:36px;padding:0 15px;border-radius:30px;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;font:600 13.5px 'Plus Jakarta Sans',sans-serif;cursor:pointer;transition:background .2s,border-color .2s}
.zc-essais button:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.6)}

.zc-listbox{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:30;margin:0;padding:6px;list-style:none;max-height:324px;overflow:auto;
  background:#151515;border:1px solid rgba(255,255,255,.25);border-radius:20px;box-shadow:0 28px 54px -14px rgba(0,0,0,.9)}
.zc-listbox li{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding:11px 16px;border-radius:13px;cursor:pointer;font-size:15.5px;font-weight:700;color:#fff}
.zc-listbox li .zc-nl{font-size:13.5px;font-weight:500;color:rgba(255,255,255,.72)}
.zc-listbox li[aria-selected="true"],.zc-listbox li:hover{background:var(--accent)}
.zc-listbox li[aria-selected="true"] .zc-nl,.zc-listbox li:hover .zc-nl{color:rgba(255,255,255,.92)}
.zc-listbox li.zc-vide{cursor:default;font-weight:500;color:rgba(255,255,255,.8)}
.zc-listbox li.zc-vide:hover{background:transparent}

/* ---------- Réponse ---------- */
.zc-answer{display:flex;gap:16px;align-items:flex-start;margin-top:24px;padding:22px 24px;min-height:214px;border-radius:22px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);border-left:5px solid rgba(255,255,255,.34);transition:background .4s,border-color .4s}
.zc-answer[data-etat="oui"]{background:rgba(255,90,90,.12);border-color:rgba(255,90,90,.45);border-left-color:var(--la-clair)}
.zc-answer[data-etat="limite"]{border-left-color:#fff;border-left-style:solid;background:rgba(255,255,255,.09)}
.zc-answer[data-etat="dehors"]{border-left-color:rgba(255,255,255,.6);background:rgba(255,255,255,.07)}
.zc-ico{flex:none;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff}
.zc-answer[data-etat="oui"] .zc-ico{background:var(--la-clair);color:var(--la-nuit)}
.zc-ico svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.zc-corps{min-width:0}
.zc-rep-txt{margin:0;font:700 clamp(19px,1.9vw,23px)/1.3 'Bricolage Grotesque',sans-serif;color:#fff;text-wrap:pretty}
.zc-answer[data-etat="idle"] .zc-rep-txt{font:500 16.5px/1.6 'Plus Jakarta Sans',sans-serif;color:rgba(255,255,255,.86)}
.zc-answer .zc-call{margin-top:18px}
.zc-call{display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border-radius:40px;background:var(--accent);color:var(--sur-accent,#fff);font-size:15px;font-weight:700;text-decoration:none;
  transition:background .2s,transform .2s,box-shadow .25s}
.zc-call:hover{background:var(--accent-fonce);transform:translateY(-2px);box-shadow:0 12px 28px rgba(190,15,16,.4)}
.zc-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.zc-answer.zc-flash{animation:zcFlash .9s var(--la-ease)}
@keyframes zcFlash{0%{transform:translateY(8px);opacity:.3}100%{transform:none;opacity:1}}

/* ---------- Carte ---------- */
.zc-map{margin:0}
.zc-frame{border-radius:30px;overflow:hidden;border:1px solid rgba(255,255,255,.14);
  background:radial-gradient(70% 55% at 36% 42%,rgba(255,90,90,.1),transparent 70%),rgba(255,255,255,.025)}
.zc-svg{display:block;width:100%;height:auto;--zc-s:1.8;--zc-fs:24px}
.zc-prov path{fill:rgba(255,255,255,.03);stroke:rgba(255,255,255,.17);stroke-width:calc(1px*var(--zc-s));stroke-linejoin:round}
.zc-bxl{fill:rgba(255,255,255,.17);stroke:rgba(255,255,255,.4);stroke-width:calc(1.2px*var(--zc-s));stroke-linejoin:round}
.zc-zf{fill:rgba(255,90,90,.15);stroke:none}
.zc-zl{fill:none;stroke:var(--la-clair);stroke-width:calc(2.3px*var(--zc-s));stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;
  filter:drop-shadow(0 0 7px rgba(255,90,90,.5))}
.zc-rep circle{fill:rgba(255,255,255,.55);r:calc(3px*var(--zc-s))}
.zc-rep.zc-in circle{fill:rgba(255,255,255,.9)}
.zc-rep.zc-off{display:none}
.zc-lab{font-family:'Plus Jakarta Sans',sans-serif;font-weight:600;font-size:var(--zc-fs);fill:rgba(255,255,255,.72);
  paint-order:stroke;stroke:rgba(0,0,0,.8);stroke-width:calc(3px*var(--zc-s));stroke-linejoin:round}
.zc-rep.zc-out .zc-lab{fill:rgba(255,255,255,.62)}
.zc-lab-bxl{fill:rgba(255,255,255,.9);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:calc(var(--zc-fs)*.82)}
.zc-hq-d{fill:var(--la-clair);stroke:#fff;stroke-width:calc(1.8px*var(--zc-s));r:calc(5.6px*var(--zc-s));transform-box:fill-box;transform-origin:center}
.zc-hq-p{fill:rgba(255,90,90,.25);stroke:var(--la-clair);stroke-width:calc(1px*var(--zc-s));r:calc(11px*var(--zc-s));transform-box:fill-box;transform-origin:center;opacity:0;
  animation:zcPulse 3.6s ease-out 2.4s infinite}
.zc-lab-hq{font-size:calc(var(--zc-fs)*1.08);font-weight:800;fill:#fff}
.zc-hq-t2{fill:var(--la-clair);font-weight:700;font-size:calc(var(--zc-fs)*.92)}
@keyframes zcPulse{0%{transform:scale(.5);opacity:.7}100%{transform:scale(1.9);opacity:0}}

/* le point de la commune cherchée */
.zc-pin-g{animation:zcPop .7s var(--la-spring) both}
@keyframes zcPop{0%{transform:scale(.2);opacity:0}100%{transform:scale(1);opacity:1}}
.zc-pin-halo{fill:rgba(255,255,255,.2);transform-box:fill-box;transform-origin:center;animation:zcPulse 2.6s ease-out .6s infinite}
.zc-pin-dot{fill:#fff;stroke:var(--accent);}
.zc-pin-line{fill:none;stroke:#fff;stroke-linecap:round}
.zc-lab-pin{fill:#fff;font-weight:800;stroke:rgba(0,0,0,.9)}
.zc-pin-arrow{fill:#fff;stroke:var(--accent);stroke-linejoin:round}

.zc-legende{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:14px;font-size:13px;line-height:1.4;color:rgba(255,255,255,.78)}
.zc-k{display:inline-block;vertical-align:-1px;margin-right:8px;flex:none}
.zc-k-zone{width:20px;height:11px;border-radius:6px;background:rgba(255,90,90,.35);border:2px solid var(--la-clair)}
.zc-k-hq{width:13px;height:13px;border-radius:50%;background:var(--la-clair);border:2px solid #fff;vertical-align:-2px}
.zc-k-rep{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.55)}

/* le tracé se dessine, puis la surface, puis les repères (classe .zc-hide posée par zone-c.js : sans JS tout est visible) */
.zc-zl{transition:stroke-dashoffset 2.8s var(--la-ease) .15s}
.zc-hide .zc-zl{stroke-dashoffset:1}
.zc-zf{transition:opacity 1.4s ease 1.5s}
.zc-hide .zc-zf{opacity:0}
.zc-bxl,.zc-prov{transition:opacity 1s ease}
.zc-hide .zc-bxl,.zc-hide .zc-prov{opacity:0}
.zc-rep,.zc-bxl-lab,.zc-lab-hq{transition:opacity .9s ease 2s}
.zc-hide .zc-rep,.zc-hide .zc-bxl-lab,.zc-hide .zc-lab-hq{opacity:0}
.zc-hq-d{transition:transform .8s var(--la-spring) 1.3s,opacity .5s ease 1.3s}
.zc-hide .zc-hq-d{transform:scale(.2);opacity:0}

/* ---------- Communes (texte HTML réel) ---------- */
.zc-communes{margin-top:76px;padding-top:44px;border-top:1px solid rgba(255,255,255,.14)}
.zc-h3{font-size:clamp(22px,2.4vw,28px);font-weight:700;margin-bottom:28px}
.zc-groupes{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:30px 38px}
.zc-g h4{margin:0 0 10px;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--la-clair)}
.zc-g p{margin:0;font-size:15.5px;line-height:1.7;color:rgba(255,255,255,.9)}
.zc-fin{display:flex;align-items:center;gap:20px 30px;flex-wrap:wrap;margin-top:52px}
.zc-fin p{margin:0;max-width:600px;font-size:18px;font-weight:600;line-height:1.5;color:#fff}

@media (max-width:1100px){
  .zc-grid{gap:44px}
  .zc-groupes{grid-template-columns:repeat(3,1fr)}
  .zc-g:first-child{grid-column:1/-1}
}
@media (max-width:900px){
  .zc-grid{grid-template-columns:minmax(0,1fr);gap:30px}
  .zc-side{max-width:none}
  .zc-map{max-width:640px;width:100%;margin:0 auto}
  .zc-answer{min-height:0}
  .zc-communes{margin-top:56px}
}
@media (max-width:640px){
  .zc-groupes{grid-template-columns:repeat(2,1fr);gap:26px 22px}
  .zc-g:first-child{grid-column:1/-1}
  .zc-field{flex-direction:column;gap:10px}
  .zc-go{width:100%}
  .zc-listbox{top:64px}
  .zc-answer{padding:18px 18px}
  .zc-ico{width:34px;height:34px}
  .zc-frame{border-radius:22px}
  .zc-fin .zc-call{width:100%;justify-content:center}
  .zc-answer .zc-call{width:100%;justify-content:center}
}

@media (prefers-reduced-motion:reduce){
  .zc-zl,.zc-zf,.zc-bxl,.zc-prov,.zc-rep,.zc-bxl-lab,.zc-lab-hq,.zc-hq-d,.zc-answer,.zc-input,.zc-go,.zc-call{transition:none!important}
  .zc-hq-p,.zc-pin-halo,.zc-pin-g,.zc-answer.zc-flash{animation:none!important}
  .zc-hq-p{opacity:0}
  .zc-hide .zc-zl{stroke-dashoffset:0!important}
  .zc-hide .zc-zf,.zc-hide .zc-bxl,.zc-hide .zc-prov,.zc-hide .zc-rep,.zc-hide .zc-bxl-lab,.zc-hide .zc-lab-hq,.zc-hide .zc-hq-d{opacity:1!important;transform:none!important}
}