/* ============================================================================
   PostEx — Zones desservies. Hero clair + recherche interactive + radar.
   ========================================================================== */

.rt-kicker{font-family:var(--f-mono);font-size:.66rem;font-weight:700;
  letter-spacing:.28em;text-transform:uppercase;color:var(--brand);margin:0}

/* Header clair (page à fond blanc, comme l'accueil) */
.header:not(.is-scrolled){color:var(--t-hi)}
.header:not(.is-scrolled) .nav a{color:var(--t-mid)}
.header:not(.is-scrolled) .nav a:hover{color:var(--t-hi);background:rgba(15,23,42,.05)}
.header:not(.is-scrolled) .nav a.is-active{color:var(--brand)}
.header:not(.is-scrolled) .burger{color:var(--t-hi);box-shadow:inset 0 0 0 1px var(--line)}
.header:not(.is-scrolled) .btn--ghost{color:var(--t-hi);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.header:not(.is-scrolled) .btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--t-hi)}

/* ---------- HERO ---------- */
.zn-hero{background:#fff;text-align:center;
  padding:calc(var(--nav-h) + clamp(40px,7vh,76px)) var(--gut) clamp(36px,6vh,60px)}
.zn-hero__title{font-weight:700;letter-spacing:-.032em;
  font-size:clamp(2.2rem,5vw,4rem);line-height:1.04;color:var(--t-hi);
  max-width:20ch;margin:clamp(16px,2.6vh,22px) auto 0;text-wrap:balance}
.zn-hero__title mark{background:var(--amber);color:inherit;padding:0 .12em;border-radius:8px}
.zn-hero__sub{margin:clamp(14px,2.4vh,20px) auto 0;max-width:52ch;
  font-size:clamp(1rem,1.3vw,1.1rem);line-height:1.65;color:var(--t-mid)}

/* ---------- RECHERCHE ---------- */
.zn-search{max-width:620px;margin:clamp(24px,4vh,36px) auto 0}
.zn-search__box{display:flex;align-items:center;gap:10px;background:#fff;
  border-radius:999px;padding:8px 10px 8px 20px;
  box-shadow:0 2px 6px rgba(19,20,24,.06),0 22px 48px -20px rgba(19,20,24,.3),0 0 0 1.5px var(--line-2);
  transition:box-shadow .3s var(--ease)}
.zn-search__box:focus-within{box-shadow:0 2px 6px rgba(19,20,24,.06),0 26px 54px -22px rgba(19,20,24,.36),0 0 0 2.5px var(--brand)}
.zn-search__box svg{color:var(--brand);flex:none}
.zn-search__box input{flex:1;border:0;outline:0;background:none;font:inherit;
  font-size:1.02rem;color:var(--t-hi);min-width:0}
.zn-search__box input::placeholder{color:var(--t-lo)}
.zn-search__box button{flex:none;background:var(--ink);color:#fff;font-weight:700;font-size:.92rem;
  border-radius:999px;padding:.8em 1.5em;transition:background .25s,transform .25s var(--ease)}
.zn-search__box button:hover{background:var(--brand);transform:translateY(-1px)}
.zn-result{margin-top:14px;text-align:left;border-radius:16px;padding:16px 20px;
  font-size:.98rem;line-height:1.6;color:var(--t-hi);
  animation:znPop .4s var(--ease-spring) both}
.zn-result--ok{background:rgba(255,196,0,.16);box-shadow:inset 0 0 0 1.5px rgba(255,196,0,.6)}
.zn-result--info{background:var(--paper-3);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.zn-result a{font-weight:700;color:var(--brand);white-space:nowrap}
@keyframes znPop{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}

/* ---------- RADAR ---------- */
.zn-radar{padding:clamp(20px,3.4vh,34px) var(--gut) clamp(40px,6vh,64px);background:#fff}
.zn-radar__panel{max-width:1080px;margin-inline:auto;background:#101319;border-radius:clamp(18px,2.4vw,28px);
  padding:clamp(18px,3vw,34px);box-shadow:0 40px 80px -36px rgba(19,20,24,.55);overflow:hidden;position:relative}
.zn-radar__head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;
  margin-bottom:10px}
.zn-radar__k{margin:0;display:flex;align-items:center;gap:10px;
  font-family:var(--f-mono);font-weight:700;font-size:.64rem;letter-spacing:.24em;
  text-transform:uppercase;color:rgba(255,255,255,.7)}
.zn-live{width:8px;height:8px;border-radius:50%;background:var(--amber);
  animation:znLive 2s var(--ease) infinite}
@keyframes znLive{50%{box-shadow:0 0 0 7px rgba(255,196,0,.18)}}
.zn-radar__legend{margin:0;font-family:var(--f-mono);font-weight:700;font-size:.6rem;
  letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.5);
  display:flex;align-items:center;gap:8px}
.zn-radar__legend i{width:9px;height:9px;border-radius:50%;display:inline-block}
.zn-radar__legend i.lu{background:var(--amber)}
.zn-radar__legend i.gr{background:#fff;opacity:.75}
.zn-radar__svg{width:100%;height:auto;display:block}
.zn-rings circle{fill:none;stroke:rgba(255,255,255,.09);stroke-width:1.5;stroke-dasharray:2 7}
.zn-ringlabels text{fill:rgba(255,255,255,.38);font-family:var(--f-mono);font-weight:700;
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;text-anchor:middle}
.zn-dot circle{fill:var(--amber)}
.zn-dot text{fill:rgba(255,255,255,.82);font-family:var(--f-sans);font-weight:600;font-size:13.5px}
.zn-dot--gr circle{fill:rgba(255,255,255,.75)}
.zn-dot--gr text{fill:rgba(255,255,255,.45)}
.zn-dot--hq circle{fill:var(--amber)}
.zn-dot--hq text{fill:#fff;font-weight:700}
.zn-dot--hq .pulse{fill:none;stroke:var(--amber);stroke-width:1.5;
  animation:znPulse 2.6s var(--ease) infinite;transform-origin:center;transform-box:fill-box}
@keyframes znPulse{from{transform:scale(.6);opacity:1}to{transform:scale(2.4);opacity:0}}
@media (max-width:640px){
  .zn-dot text{font-size:17px}
  .zn-ringlabels text{font-size:13px}
}

/* ---------- CANTONS ---------- */
.zn-cantons{margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.zn-cantons li{list-style:none;display:flex;align-items:center;gap:11px;
  background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:14px 16px;
  font-weight:600;font-size:.94rem;color:var(--t-hi);
  transition:transform .3s var(--ease),border-color .3s,box-shadow .3s}
.zn-cantons li:hover{transform:translateY(-2px);border-color:rgba(255,196,0,.7);
  box-shadow:0 12px 26px -14px rgba(19,20,24,.2)}
.zn-cantons li svg{width:15px;height:15px;color:var(--brand);flex:none}
.zn-cantons li span{flex:1}
.zn-cantons li b{font-family:var(--f-mono);font-size:.6rem;font-weight:700;
  letter-spacing:.14em;color:var(--t-lo)}

/* ---------- GRANDE RÉGION ---------- */
.zn-gr{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:820px){.zn-gr{grid-template-columns:1fr}}
.zn-gr__col{background:var(--paper-2);border:1px solid var(--line);border-radius:18px;padding:22px 24px}
.zn-gr__col h3{font-weight:700;font-size:1.15rem;letter-spacing:-.015em;color:var(--t-hi);
  padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:12px}
.zn-gr__col ul{margin:0;padding:0}
.zn-gr__col li{list-style:none;display:flex;align-items:center;gap:9px;
  color:var(--t-mid);font-size:.94rem;padding:5px 0}
.zn-gr__col li svg{width:12px;height:12px;color:var(--brand);flex:none}
.zn-gr__more{font-style:italic;color:var(--t-lo) !important}

/* ---------- CTA ---------- */
.zn-cta{text-align:center}
.zn-cta .lead{margin:16px auto 0;max-width:44ch}
.zn-cta__row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}

@media (prefers-reduced-motion:reduce){
  .zn-live,.zn-dot--hq .pulse{animation:none}
  .zn-result{animation:none}
  .zn-cantons li{transition:none}
}
