/* Blinkit — Carte satellite Île-de-France (Leaflet + Esri World Imagery) */
.zones .zones-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:44px;align-items:stretch}
.zone-mapwrap{position:relative;border-radius:22px;overflow:hidden;background:#08110b;box-shadow:0 30px 70px -30px rgba(0,0,0,.7),inset 0 0 0 1px rgba(247,248,244,.12)}
.zone-mapwrap::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:400;border-radius:22px;box-shadow:inset 0 0 90px 20px rgba(6,14,9,.72)}
.sat-map{position:absolute;inset:0;width:100%;height:100%;background:#08110b;z-index:0}
.sat-map .leaflet-control-attribution{background:rgba(8,17,11,.55);color:rgba(255,255,255,.42);font-size:9px;padding:1px 6px}
.sat-map .leaflet-control-attribution a{color:rgba(255,255,255,.6)}
.sat-map .leaflet-control-zoom{border:0;margin:14px}
.sat-map .leaflet-control-zoom a{background:rgba(8,17,11,.82);color:#edf1ec;border-color:rgba(247,248,244,.14);backdrop-filter:blur(6px);width:30px;height:30px;line-height:30px}
.sat-map .leaflet-control-zoom a:hover{background:#1f9d3a;color:#fff}
.sat-label{background:transparent!important;border:0!important;box-shadow:none!important;color:rgba(255,255,255,.88)!important;font-family:var(--mono,monospace)!important;font-size:10px!important;letter-spacing:.18em;text-transform:uppercase;text-shadow:0 1px 8px rgba(0,0,0,.95),0 0 3px rgba(0,0,0,.95);white-space:nowrap}
.sat-label::before{display:none}
.sat-pulse{position:relative}
.sat-pulse::before,.sat-pulse::after{content:"";position:absolute;inset:0;border-radius:50%}
.sat-pulse::before{background:#2dd162;box-shadow:0 0 12px rgba(45,209,98,.9)}
@media (prefers-reduced-motion: no-preference){.sat-pulse::after{border:1.5px solid #2dd162;animation:satPulse 2.6s ease-out infinite}}
@keyframes satPulse{0%{transform:scale(1);opacity:.85}100%{transform:scale(3.6);opacity:0}}

/* Légende flottante */
.zone-legend{position:absolute;top:16px;left:16px;z-index:410;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.zone-legend .zl{display:flex;align-items:center;gap:8px;padding:7px 13px 7px 10px;border:1px solid rgba(247,248,244,.16);border-radius:999px;background:rgba(8,17,11,.62);backdrop-filter:blur(8px);color:rgba(247,248,244,.72);font-family:var(--mono,monospace);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:color .25s,border-color .25s,background .25s,transform .25s}
.zone-legend .zl i{width:8px;height:8px;border-radius:50%;background:rgba(45,209,98,.35);border:1px solid rgba(45,209,98,.75);transition:background .25s,box-shadow .25s}
.zone-legend .zl:hover,.zone-legend .zl.on{color:#f7f8f4;border-color:rgba(45,209,98,.6);background:rgba(15,42,24,.78);transform:translateX(3px)}
.zone-legend .zl:hover i,.zone-legend .zl.on i{background:#2dd162;box-shadow:0 0 10px rgba(45,209,98,.85)}

/* Bandeau bas de carte */
.zone-mapfoot{position:absolute;left:0;right:0;bottom:0;z-index:410;display:flex;justify-content:space-between;gap:14px;padding:14px 18px 16px;font-family:var(--mono,monospace);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(247,248,244,.62);background:linear-gradient(transparent,rgba(6,14,9,.85));pointer-events:none}

/* Panneau droit */
.zone-panel{display:flex;flex-direction:column;gap:22px}
.zones .zone-list{border-top:1px solid rgba(247,248,244,.14)}
.zones .zone-item{position:relative;border-top:0;border-bottom:1px solid rgba(247,248,244,.14);padding:22px 18px 22px 54px;grid-template-columns:1fr auto;transition:background .35s,padding-left .35s}
.zones .zone-item::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:#2dd162;transform:scaleY(0);transform-origin:50% 0;transition:transform .4s cubic-bezier(.22,1,.36,1)}
.zones .zone-item .zn{position:absolute;left:16px;top:24px;font-family:var(--mono,monospace);font-size:11px;letter-spacing:.1em;color:rgba(247,248,244,.35);transition:color .3s}
.zones .zone-item:last-child{border-bottom:1px solid rgba(247,248,244,.14)}
.zones .zone-item.zi-active{background:linear-gradient(90deg,rgba(31,157,58,.16),transparent);padding-left:62px}
.zones .zone-item.zi-active::before{transform:scaleY(1)}
.zones .zone-item.zi-active .zn{color:#2dd162}
@media (max-width:900px){.zones .zones-grid{grid-template-columns:1fr;gap:26px}.zone-mapwrap{min-height:340px}.sat-map{position:relative;min-height:340px}}
@media (max-width:720px){.zone-legend{top:12px;left:12px}.zone-legend .zl{font-size:9.5px;padding:6px 11px 6px 9px}}
