/* ░░░░░░░░ 56k Studio — FAMILY CHROME (partagé app / lu / erp) ░░░░░░░░
   Source de vérité du chrome commun : header + nav + menu mobile + boutons
   + footer + grain. Reproduit le chrome de la référence app.56k.studio.
   Charte v2.0 : Swiss Industrial Print rose · radius 0 · plat (zéro ombre)
   · accent UNIQUE rose · Geist (corps) + Redaction 35 700 (éditorial)
   + JetBrains Mono (technique / télémétrie).
   Namespacé `sk-` → ZÉRO collision avec le CSS existant de chaque page.
   Seuls le hero et le contenu diffèrent d'une landing à l'autre.            */

/* ——— Fonts (portable : chaque repo sert /fonts/) ——— */
@font-face{font-family:'Geist';src:url('/fonts/geist-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Geist';src:url('/fonts/geist-500.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Geist';src:url('/fonts/geist-600.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Geist';src:url('/fonts/geist-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Redaction35';src:url('/fonts/redaction-35-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('/fonts/jetbrains-mono-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('/fonts/jetbrains-mono-500.woff2') format('woff2');font-weight:500;font-display:swap}

/* ——— Tokens famille (isolés : --sk-*) ——— */
:root{
  --sk-ink:#121212;
  --sk-ink-light:#272728;
  --sk-pink:#FFB3FF;
  --sk-pink-light:#FFD4FF;
  --sk-paper:#FFFFFF;
  --sk-bone:#F7F7F7;
  --sk-gray:#9C9C9C;
  --sk-maxw:1280px;
  --sk-pad:clamp(20px,5vw,48px);
  --sk-bw:2px;
  --sk-ease:cubic-bezier(.16,1,.3,1);
  --sk-dur:200ms;
  --sk-dur-entry:700ms;
  --sk-body:'Geist','Helvetica Neue',Arial,sans-serif;
  --sk-disp:'Redaction35',Georgia,'Times New Roman',serif;
  --sk-mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
}

/* ——— Grain papier fin (overlay fixe, identique partout) ——— */
.sk-grain{position:fixed;inset:0;z-index:100;pointer-events:none;opacity:.035;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.6' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:240px 240px}

/* ——— Boutons famille (carré, 2px, plat) ——— */
.sk-btn{display:inline-flex;align-items:center;gap:.7em;font-family:var(--sk-body);font-weight:500;
  font-size:1rem;letter-spacing:-.01em;line-height:1;padding:13px 24px;border:var(--sk-bw) solid var(--sk-ink);
  cursor:pointer;background:transparent;color:var(--sk-ink);text-decoration:none;
  transition:background-color var(--sk-dur) var(--sk-ease),color var(--sk-dur) var(--sk-ease),transform var(--sk-dur) var(--sk-ease)}
.sk-btn--solid{background:var(--sk-ink);color:var(--sk-paper)}
.sk-btn--solid:hover{background:var(--sk-ink-light)}
.sk-btn--ghost{background:transparent;color:var(--sk-ink)}
.sk-btn--ghost:hover{background:var(--sk-bone)}
.sk-btn--accent{background:var(--sk-pink);color:var(--sk-ink)}
.sk-btn--accent:hover{background:var(--sk-pink-light)}
.sk-btn--lg{padding:16px 28px;font-size:1.0625rem}
.sk-btn--block{width:100%;justify-content:center}
/* flèche NUE (pas de carré autour — trop chargé) */
.sk-btn__ico{display:inline-flex;align-items:center;justify-content:center;font-size:1.05em;line-height:1;transition:transform var(--sk-dur) var(--sk-ease)}
.sk-btn:hover .sk-btn__ico{transform:translateX(4px)}
.sk-btn:active{transform:scale(.98)}

/* ░░ HEADER / NAV ░░ (plat, fixé, bordure au scroll) */
.sk-nav{position:fixed;top:0;left:0;right:0;z-index:30;background:var(--sk-paper);
  border-bottom:var(--sk-bw) solid transparent;transition:border-color var(--sk-dur) var(--sk-ease)}
.sk-nav.sk-scrolled{border-bottom-color:var(--sk-ink)}
.sk-nav__inner{max-width:var(--sk-maxw);margin:0 auto;padding:14px var(--sk-pad);display:flex;align-items:center;gap:24px}
.sk-nav__brand{display:flex;align-items:center;color:var(--sk-ink)}
.sk-nav__logo{height:26px;width:auto;color:var(--sk-ink);display:block}
.sk-nav__tag{font-family:var(--sk-mono);font-size:.6875rem;font-weight:400;text-transform:uppercase;
  letter-spacing:.06em;color:var(--sk-ink);opacity:.6;margin-left:16px;white-space:nowrap}
.sk-nav__links{display:flex;gap:28px;margin-left:auto;font-family:var(--sk-body);font-size:.9375rem;font-weight:500;color:var(--sk-ink)}
.sk-nav__links a{position:relative;padding:4px 0;color:var(--sk-ink);text-decoration:none}
.sk-nav__links a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--sk-pink);transition:width var(--sk-dur) var(--sk-ease)}
.sk-nav__links a:hover::after{width:100%}
.sk-nav__links a.sk-on::after{width:100%}            /* indicateur de page courante */
.sk-nav__cta{padding:10px 18px;font-size:.9375rem}
.sk-burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;margin-left:auto}
.sk-burger span{width:24px;height:2px;background:var(--sk-ink);transition:transform var(--sk-dur) var(--sk-ease),opacity var(--sk-dur)}
.sk-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.sk-burger[aria-expanded="true"] span:nth-child(2){transform:translateY(0) rotate(-45deg)}

/* ░░ MENU MOBILE ░░ */
.sk-menu{position:fixed;inset:0;z-index:29;background:var(--sk-paper);border-bottom:var(--sk-bw) solid var(--sk-ink);
  transform:translateY(-100%);transition:transform var(--sk-dur-entry) var(--sk-ease);
  display:flex;align-items:center;justify-content:center}
.sk-menu.sk-open{transform:translateY(0)}
.sk-menu__links{display:flex;flex-direction:column;gap:6px;text-align:center}
.sk-menu__links a{font-family:var(--sk-disp);font-weight:700;font-size:2rem;padding:8px;color:var(--sk-ink);line-height:1.1;text-decoration:none}
.sk-menu__links a span{font-family:var(--sk-mono);font-weight:400;font-size:.8125rem;margin-right:.4em;opacity:.6}
.sk-menu__links .sk-btn{font-family:var(--sk-body);font-size:1rem;justify-content:center;margin-top:18px}

/* ░░ FOOTER ░░ (fond ink, texte blanc, logo blanc) */
.sk-foot{background:var(--sk-ink);color:var(--sk-paper);padding-block:clamp(48px,6vw,72px) 0;border-top:var(--sk-bw) solid var(--sk-ink)}
.sk-foot__grid{max-width:var(--sk-maxw);margin:0 auto;padding-inline:var(--sk-pad);
  display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px}
.sk-foot__logo{height:30px;margin-bottom:18px;color:var(--sk-paper);display:block}
.sk-foot__brand p{color:var(--sk-paper);opacity:.7;font-size:.875rem;line-height:1.6;max-width:42ch}
.sk-foot__col{display:flex;flex-direction:column;gap:10px;font-family:var(--sk-body);font-size:.875rem;color:var(--sk-paper)}
.sk-foot__lab{font-family:var(--sk-mono);text-transform:uppercase;letter-spacing:.08em;font-size:.6875rem;color:var(--sk-paper);opacity:.55;margin-bottom:4px}
.sk-foot__col a{color:var(--sk-paper);opacity:.85;text-decoration:none;transition:opacity var(--sk-dur)}
.sk-foot__col a:hover{opacity:1;box-shadow:inset 0 -.1em 0 var(--sk-pink)}
/* note légale / transparence (optionnelle, ex. mention dispositif LU) */
.sk-foot__note{max-width:var(--sk-maxw);margin:40px auto 0;padding:16px var(--sk-pad) 0;
  font-family:var(--sk-body);font-size:.75rem;line-height:1.6;color:var(--sk-paper);opacity:.55;
  border-top:1px solid rgba(255,255,255,.12)}
.sk-foot__note b{opacity:.85;font-weight:600}
/* barre technique footer — signature industrielle (télémétrie mono) identique partout */
.sk-foot__tech{max-width:var(--sk-maxw);margin:40px auto 0;padding:14px var(--sk-pad);
  border-top:1px solid rgba(255,255,255,.18);
  display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
  font-family:var(--sk-mono);font-size:.6875rem;text-transform:uppercase;letter-spacing:.08em;color:var(--sk-paper);opacity:.7}
.sk-foot__tech .sk-dot{display:inline-block;width:7px;height:7px;background:var(--sk-pink);margin-right:.6em;vertical-align:middle}
.sk-foot__base{max-width:var(--sk-maxw);margin:0 auto;padding:14px var(--sk-pad) 26px;
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
  font-family:var(--sk-mono);font-size:.6875rem;letter-spacing:.06em;color:var(--sk-paper);opacity:.55}

/* ——— Responsive chrome ——— */
@media(max-width:980px){.sk-nav__tag{display:none}}
@media(max-width:860px){
  .sk-nav__links,.sk-nav__cta{display:none}
  .sk-burger{display:flex}
}
@media(max-width:760px){
  .sk-foot__grid{grid-template-columns:1fr;gap:30px}
  .sk-foot__tech,.sk-foot__base{flex-direction:column;align-items:flex-start;gap:8px}
}
@media(prefers-reduced-motion:reduce){
  .sk-nav,.sk-menu,.sk-btn,.sk-btn__ico,.sk-burger span{transition:none}
}

/* ░░ BANDEAU CONSENTEMENT (Consent Mode v2) — injecté par family.js ░░
   Plat, 2px, radius 0, accent rose. Cohérent charte v2.0. */
.sk-consent{position:fixed;left:0;right:0;bottom:0;z-index:120;background:var(--sk-paper);
  border-top:var(--sk-bw) solid var(--sk-ink);transform:translateY(100%);
  transition:transform var(--sk-dur-entry) var(--sk-ease)}
.sk-consent.sk-on{transform:translateY(0)}
.sk-consent__inner{max-width:var(--sk-maxw);margin:0 auto;padding:18px var(--sk-pad);
  display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.sk-consent__txt{flex:1 1 420px;font-family:var(--sk-body);font-size:.875rem;line-height:1.5;
  color:var(--sk-ink-light);margin:0}
.sk-consent__txt b{color:var(--sk-ink);font-weight:600}
.sk-consent__txt a{color:var(--sk-ink);text-decoration:underline;text-underline-offset:2px}
.sk-consent__actions{display:flex;gap:12px;flex-shrink:0}
.sk-consent__actions .sk-btn{padding:11px 20px;font-size:.9375rem}
@media(max-width:620px){
  .sk-consent__inner{gap:14px}
  .sk-consent__actions{width:100%}
  .sk-consent__actions .sk-btn{flex:1;justify-content:center}
}
@media(prefers-reduced-motion:reduce){.sk-consent{transition:none}}
