/* ============================================================================
   SKY Z — charte V2 « Transmission depuis l'Abri 07 » appliquée à tout le site (17/09/2026).
   Chargée APRÈS site.css : elle redéfinit les jetons de couleur et de typo, la navigation,
   les boutons, les cadres et le pied de page. Les gabarits des pages ne changent pas.
   ============================================================================ */
:root{
  --bg:#0b0d0e;--bg-2:#080a0b;--surface:#111415;--surface-2:#181c1e;
  --line:#262c2f;--line-strong:#3a4247;
  --text:#c9c3b6;--text-strong:#efe9dc;--muted:#8b9196;
  --amber:#f2b21b;--amber-2:#ffcf4d;--signal:#f2b21b;
  --red:#e5372f;--red-2:#ff6a5c;--green:#7ee081;--cyan:#7fd6cf;--warn:#f6b41e;
  --font-display:"Barlow Condensed","Arial Narrow",Impact,sans-serif;
  --shadow:0 20px 50px rgba(0,0,0,.5);
}
/* fond : plus de halo froid, une trame cartographique discrète */
body::before{background:
  linear-gradient(rgba(239,233,220,.035) 1px,transparent 1px),
  linear-gradient(90deg,rgba(239,233,220,.035) 1px,transparent 1px);
  background-size:120px 120px;mask-image:linear-gradient(180deg,#000 0,transparent 55vh);-webkit-mask-image:linear-gradient(180deg,#000 0,transparent 55vh)}
.grain::after{box-shadow:inset 0 0 160px 30px rgba(0,0,0,.75)}

/* typographie */
h1,h2,h3,h4{font-weight:700;letter-spacing:-.01em;line-height:.92}
h1{text-shadow:0 8px 30px rgba(0,0,0,.6);font-size:clamp(44px,6vw,86px)}
h2{font-size:clamp(32px,4vw,56px)}
.kicker{color:var(--amber);display:flex;align-items:center;gap:12px;letter-spacing:.22em}
.kicker::before{content:"";width:34px;height:1px;background:var(--amber);flex:none}
.kicker .accent{color:var(--amber)}

/* navigation */
.nav{background:rgba(11,13,14,.9);border-bottom-color:var(--line)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text-strong)}
.brand img{display:none}
.brand::before{content:"☣";color:var(--amber);font-size:22px;line-height:1;font-family:"Segoe UI Symbol","Noto Sans Symbols2","Apple Symbols",sans-serif}
.brand::after{content:"SKY Z";font-family:var(--font-display);font-weight:700;font-size:26px;letter-spacing:.02em;line-height:1}
.nav-links a{font-weight:500;font-size:11.5px;letter-spacing:.16em;color:var(--text)}
.nav-links a::after{box-shadow:none;bottom:4px;height:1px}
.nav-links a:hover,.nav-links a.is-active{color:var(--amber-2)}
.nav-toggle{background:transparent;border-color:var(--line-strong)}

/* boutons : angles découpés, capitales condensées */
.btn{font-family:var(--font-display);font-weight:700;font-size:17px;letter-spacing:.06em;text-transform:uppercase;border-radius:0;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.btn-primary{background:var(--amber);border-color:var(--amber);color:#1a1300}
.btn-primary:hover{background:var(--amber-2);border-color:var(--amber-2);color:#1a1300;box-shadow:none}
.btn-secondary{background:rgba(11,13,14,.7);border-color:var(--text);color:var(--text-strong)}
.btn-secondary:hover{border-color:var(--amber);color:var(--amber-2);background:rgba(11,13,14,.85)}
.btn-ghost,.btn-xs{font-family:var(--font-mono);font-weight:500;letter-spacing:.12em;font-size:11px;clip-path:none}
.btn-danger{border-color:rgba(229,55,47,.5);color:var(--red-2)}

/* cadres, étiquettes, formulaires */
.frame{background:var(--surface);border-color:var(--line);box-shadow:none}
.frame-amber{border-color:rgba(242,178,27,.35)}
.tag{border-color:var(--line-strong);color:var(--text)}
.tag-amber{border-color:rgba(242,178,27,.5);color:var(--amber);background:rgba(242,178,27,.08)}
.tag-red{border-color:rgba(229,55,47,.55);color:var(--red-2);background:rgba(229,55,47,.08)}
input,select,textarea{background:#0e1113!important;border-color:var(--line-strong)!important;color:var(--text-strong)!important;border-radius:0!important}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(242,178,27,.3)!important;border-color:var(--amber)!important}
a{color:var(--amber-2)}
.telebar{background:var(--bg-2)}
.telebar li b{color:var(--amber)}
.telebar .signal i{background:var(--amber)}
.flash{border-left:3px solid var(--amber);background:var(--surface)}
.flash.ok{border-left-color:var(--green)}
.section-head{border-bottom-color:var(--line)}
.page-head{border-bottom-color:var(--line)}
hr{border-color:var(--line)}

/* pied de page : signature V2 */
.footer{border-top:1px solid var(--line);background:var(--bg-2)}
.footer .brand img{display:none}
.footer .brand::after{content:"SKY Z — Survie. Infection. Trahison."}
.footer-links a{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.footer-links a:hover{color:var(--amber-2)}
::selection{background:rgba(242,178,27,.35);color:#fff}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#2b3541;border-radius:8px;border:2px solid var(--bg)}::-webkit-scrollbar-track{background:transparent}

/* bandeau illustré en tête de chaque section (skyz_bandeaux.py, 20/09/2026) */
.bandeau{position:relative;height:clamp(200px,34vh,420px);overflow:hidden;background:var(--bg-2);border-bottom:1px solid var(--line)}
.bandeau img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%;filter:saturate(.9) contrast(1.06) brightness(1.08);animation:bandeau-zoom 18s ease-out forwards}
.bandeau-voile{position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,13,14,.38) 0,rgba(11,13,14,0) 30%,rgba(11,13,14,.12) 65%,var(--bg) 100%)}
.bandeau-voile::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(180deg,transparent 0 3px,rgba(0,0,0,.12) 3px 4px);mix-blend-mode:multiply;pointer-events:none}
.bandeau-legende{position:absolute;left:var(--gutter,24px);bottom:18px;margin:0;font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--amber);display:flex;align-items:center;gap:10px;text-shadow:0 2px 10px rgba(0,0,0,.8)}
.bandeau-legende .dot{width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 12px var(--red);animation:bandeau-bat 1.6s infinite}
.bandeau + .container.page,.bandeau + .flashes + .container.page{padding-top:36px}
@keyframes bandeau-zoom{from{transform:scale(1.04)}to{transform:scale(1)}}
@keyframes bandeau-bat{0%,100%{opacity:1}50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.bandeau img,.bandeau-legende .dot{animation:none}}
@media (max-width:700px){.bandeau{height:180px}}

/* ============================================================================
   SKY Z — couche V3 (30/09/2026) : le système de l'accueil étendu à toutes les pages.
   Même charte (noir, os, ambre, Barlow Condensed, JetBrains Mono). Rien d'inventé : boutons, menu, lisibilité,
   repères, mobile. Chargée en fin de v2.css, donc après site.css et v2.
   ============================================================================ */
:root{--coupe:12px;--sortie:cubic-bezier(.16,1,.3,1)}
html{color-scheme:dark;scrollbar-color:var(--line-strong) var(--bg);caret-color:var(--amber);scroll-padding-top:calc(var(--nav-h,72px) + 12px)}
::selection{background:var(--amber);color:#1a1300}
a,button,summary,[role=button]{touch-action:manipulation}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.skip{font-family:var(--font-display);font-weight:700;font-size:16px;letter-spacing:.06em;color:#1a1300;padding:12px 18px}
.skip:focus{left:var(--gutter,24px);top:10px}

/* ---------- boutons : coin coupé dessiné par deux calques (bordure puis fond), focus jamais découpé ---------- */
.btn{--fond:transparent;--bord:var(--line-strong)}
.btn:not(.btn-ghost):not(.btn-xs){position:relative;isolation:isolate;clip-path:none;background:none!important;border-color:transparent!important;box-shadow:none!important;
  -webkit-backdrop-filter:none;backdrop-filter:none;transition:color .2s var(--ease),transform .2s var(--sortie)}
.btn:not(.btn-ghost):not(.btn-xs)::before,.btn:not(.btn-ghost):not(.btn-xs)::after{content:"";position:absolute;z-index:-1;pointer-events:none;
  clip-path:polygon(0 0,calc(100% - var(--coupe)) 0,100% var(--coupe),100% 100%,var(--coupe) 100%,0 calc(100% - var(--coupe)));transition:background .2s var(--ease)}
.btn:not(.btn-ghost):not(.btn-xs)::before{inset:0;background:var(--bord)}
.btn:not(.btn-ghost):not(.btn-xs)::after{inset:1px;background:var(--fond)}
.btn:not(.btn-ghost):not(.btn-xs):hover{transform:translateY(-1px)}
.btn:not(.btn-ghost):not(.btn-xs):active{transform:translateY(1px);transition-duration:60ms}
.btn:focus-visible{outline-offset:4px}
.btn-primary{--fond:var(--amber);--bord:var(--amber);color:#1a1300}
.btn-primary:hover{--fond:var(--amber-2);--bord:var(--amber-2);color:#1a1300}
.btn-primary:active{--fond:#d99a0c;--bord:#d99a0c}
.btn-secondary{--fond:rgba(11,13,14,.82);--bord:var(--text);color:var(--text-strong)}
.btn-secondary:hover{--bord:var(--amber);color:var(--amber-2)}
.btn-danger{--fond:rgba(229,55,47,.08);--bord:rgba(229,55,47,.6);color:var(--red-2)}
.btn-danger:hover{--fond:rgba(229,55,47,.2);--bord:var(--red);color:#fff}
.btn-sm{--coupe:9px}
.btn-ghost{font-family:var(--font-display);font-weight:600;font-size:15px;letter-spacing:.06em;color:var(--text)}
.btn-ghost:hover{color:var(--amber-2)}
.btn[aria-disabled="true"],.btn:disabled{opacity:.5;cursor:not-allowed}

/* ---------- menu : lisible, moins dense ---------- */
.nav{background:rgba(11,13,14,.95);-webkit-backdrop-filter:none;backdrop-filter:none}
.nav-links a{font-family:var(--font-display);font-weight:600;font-size:15.5px;letter-spacing:.06em;color:var(--text);padding:0 10px}
.nav-links a::after{left:10px;right:10px;bottom:5px;height:1px;transition:transform .45s var(--sortie)}
.nav-links a:hover{color:var(--text-strong)}
.nav-links a.is-active{color:var(--amber-2)}
.nav-actions .who{font-size:11.5px}
.nav-etat{font-size:12px}
@media (max-width:1180px){.nav-links a{font-size:14.5px;padding:0 8px}.nav-links a::after{left:8px;right:8px}}
@media (max-width:1000px){
  .nav.is-open .nav-links{background:rgba(11,13,14,.98)}
  .nav.is-open .nav-links a{height:52px;font-size:19px;padding:0 2px}
  .nav-toggle{width:46px;height:42px;background:rgba(11,13,14,.6)}
  .nav-toggle:hover{border-color:var(--amber)}
}

/* ---------- étiquettes au-dessus des titres : une seule ligne qui se replie proprement ---------- */
.kicker{display:block;line-height:1.6}
.kicker::before{display:inline-block;vertical-align:middle;margin:-2px 12px 0 0}
.kicker .accent{display:inline}

/* ---------- lisibilité : petits textes, mesure ---------- */
.tag{font-size:11px}
.footer-links a{font-size:11.5px}
.bandeau-legende{font-size:11.5px;letter-spacing:.18em}
.bandeau-legende .dot{animation-duration:3.2s}
.page p,.page li{text-wrap:pretty}
h1,h2,h3{text-wrap:balance}

/* ---------- pied de page : la signature se replie sur petit écran (elle débordait de 11 px) ---------- */
.footer .brand{max-width:100%}
.footer .brand::after{white-space:normal;font-size:clamp(18px,5vw,26px)}

/* ---------- mobile : plus de débordement horizontal, boutons accessibles ---------- */
@media (max-width:1000px){
  .es-tops[style]{grid-template-columns:1fr!important}
}
.section-head{flex-wrap:wrap}
.section-head>*{min-width:0}
.section-head .note{white-space:normal}
@media (max-width:640px){.stats .frame[style]{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
.es-tops>*,.grid>*,.cards>*{min-width:0}
@media (max-width:640px){
  .btn{font-size:15px;padding:0 18px}
  .btn-sm{font-size:14px}
  .btn-ghost{font-size:14px}
  table.board{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .hero-cta .btn,.page-head .btn{min-height:48px}
}
@media (prefers-reduced-motion:reduce){
  .btn,.btn::before,.btn::after,.nav-links a::after{transition:none!important}
  .btn:hover,.btn:active{transform:none!important}
}

/* ---------- guide : confort de lecture des chapitres (les règles en ligne des pages viennent après : préfixe .gd-layout) ---------- */
.container.page :is(h3,h4) + :is(p,ul,ol,div.g-do,div.p-do){margin-top:10px}
.gd-layout .gd-main :is(p,li){max-width:72ch}
.gd-layout .gd-main h3{line-height:1.02}
.gd-layout .gd-main h2 + h3{margin-top:14px}
.gd-layout .p-etape{grid-template-columns:52px minmax(0,1fr);gap:18px;padding:22px 0}
.gd-layout .p-etape .n{font-size:28px;padding-top:0;line-height:.95}
.gd-layout :is(.p-do,.p-non,.g-do,.g-tip){padding:12px 16px;border-left-width:2px}
.gd-layout :is(.p-do,.p-non,.g-do,.g-tip) > b:first-child{font-size:11.5px;letter-spacing:.14em;margin-bottom:6px}
.gd-layout .gd-side a{font-size:14.5px;padding:7px 10px;transition:color .2s var(--ease),background .2s var(--ease)}
.gd-layout .gd-side a.on{color:var(--amber-2)}
.gd-layout .gd-side h4{font-size:11.5px;margin-top:18px}
.gd-layout .gd-pn a{padding:18px 20px;font-family:var(--font-display);font-weight:700;font-size:22px;letter-spacing:.02em;text-transform:uppercase;color:var(--text-strong);line-height:1.05;transition:border-color .2s var(--ease),transform .2s var(--sortie)}
.gd-layout .gd-pn a:hover{transform:translateY(-2px);color:var(--amber-2)}
.gd-layout .gd-pn small{font-weight:400;font-size:11.5px;text-transform:uppercase;margin-bottom:8px}
.gd-card{transition:border-color .2s var(--ease),transform .2s var(--sortie)}
.gd-card:hover{transform:translateY(-2px)}
.gd-card .n,.gd-card .t{font-size:11.5px}
@media (max-width:640px){.gd-layout .p-etape{grid-template-columns:36px minmax(0,1fr);gap:12px}.gd-layout .p-etape .n{font-size:22px}.gd-layout .gd-pn{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.gd-card:hover,.gd-layout .gd-pn a:hover{transform:none}}

/* ---------- étiquettes : seul le repère « // » reste en capitales espacées, la suite se lit en casse normale ---------- */
.kicker{text-transform:none;letter-spacing:.04em;font-size:12.5px}
.kicker .accent{text-transform:uppercase;letter-spacing:.2em}

/* ---------- boutique : fiches produit plus lisibles ---------- */
.container.page .bq-tbl th{font-family:var(--font-body);font-weight:500;font-size:14px;letter-spacing:0;text-transform:none;color:var(--muted);width:38%}
.container.page .bq-tbl td{line-height:1.5}
.container.page .bq-mono{font-size:13.5px;letter-spacing:0}
.container.page .bq-achat .gros{font-family:var(--font-display);font-weight:700;font-size:40px;letter-spacing:.01em}
.bq-carte{transition:border-color .2s var(--ease),transform .2s var(--sortie)}
.bq-carte:hover{transform:translateY(-2px)}
@media (prefers-reduced-motion:reduce){.bq-carte:hover{transform:none}}