/* Socle du site de Léni. Les tokens --sc-* pilotent scrollcraft.css ; le reste est à nous.
   Ne pas restyler .sc-stage, .sc-copy ni les [data-sc-*] : c'est le mécanisme. */
@font-face{font-family:Anton;src:url(assets/fonts/Anton-Regular.ttf) format("truetype");font-display:swap}
@font-face{font-family:"Space Mono";src:url(assets/fonts/SpaceMono-Regular.ttf) format("truetype");font-display:swap}
@font-face{font-family:"DM Sans";src:url(assets/fonts/DMSans.ttf) format("truetype");font-weight:100 900;font-display:swap}

:root{
  --sc-canvas:#070709; --sc-surface:#0d0a14; --sc-ink:#ece7f5; --sc-ink-soft:#a79fb5;
  --sc-accent:#f2a8d0; --sc-accent-ink:#070709;
  --sc-font-display:Anton,Impact,"Arial Narrow",sans-serif;
  --sc-font-text:"DM Sans",system-ui,sans-serif;
  --font-mono:"Space Mono",ui-monospace,SFMono-Regular,monospace;
  --mute:#6b6177; --filet:#241c30; --filet-clair:#3a2f4d;
  --dot:167,159,181; --dot-accent:242,168,208;
  --ease:cubic-bezier(.23,1,.32,1);
}
body{background:var(--sc-canvas);color:var(--sc-ink);font-family:var(--sc-font-text);-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--sc-accent);color:var(--sc-accent-ink)}
h1,h2,h3,.display{font-family:var(--sc-font-display);font-weight:400;text-transform:uppercase;line-height:.9;letter-spacing:.005em;text-wrap:balance}
p{text-wrap:pretty}
a{color:inherit}
.accent{color:var(--sc-accent)}
.mono{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--sc-ink-soft)}
.mono--mute{color:var(--mute)}
.soft{color:var(--sc-ink-soft)}
.wrap{width:min(1200px,100% - 2*clamp(20px,6vw,80px));margin-inline:auto}
.measure{max-width:58ch}

/* fond de points statique (sections sans canvas) */
.dots-static{background-image:radial-gradient(rgba(var(--dot),.26) 1.2px,transparent 1.3px);background-size:30px 30px}

/* barre */
.bar{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:18px clamp(20px,3vw,32px);pointer-events:none;transition:background .25s}
.bar.is-scrolled{background:rgba(7,7,9,.96)}
.bar>*{pointer-events:auto}
.bar a{font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--sc-ink);text-decoration:none;padding:16px 14px;margin:-8px -14px;transition:color .16s}  /* zone cliquable large, dessin inchangé */
.bar a:hover{color:var(--sc-accent)}
.bar .bar__links{display:flex;gap:28px;align-items:center}
.bar .bar__cta{color:var(--sc-accent)}
.bar .bar__cta::after{content:" →" / ""}
@media (max-width:640px){.bar .bar__links a:not(.bar__cta){display:none}}
@media (max-width:480px){.bar{padding:14px 16px;gap:12px}.bar a{font-size:10px;letter-spacing:.14em;white-space:nowrap}}

/* boutons : une seule étiquette partout, « Réserver mon heure offerte » */
.btn{display:inline-block;font-family:var(--font-mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;padding:18px 28px;background:var(--sc-accent);color:var(--sc-accent-ink);text-decoration:none;border:1px solid var(--sc-accent);cursor:pointer;line-height:1;white-space:nowrap;transition:transform .14s var(--ease),background .14s;will-change:transform}
.btn:hover{background:#f7bfdd}
.btn:active{transform:scale(.97)}
.btn:focus-visible{outline:2px solid var(--sc-accent);outline-offset:4px}
.btn[data-sc-magnet]{transition:background .14s}  /* l'aimant écrit le transform à chaque frame */
.btn--ghost{background:transparent;color:var(--sc-ink);border-color:var(--sc-ink)}
.btn--ghost:hover{background:rgba(236,231,245,.08)}
.lien{display:inline-block;padding:12px 0;font-family:var(--font-mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--sc-ink);text-decoration:underline;text-decoration-color:var(--sc-accent);text-underline-offset:6px;text-decoration-thickness:1px}
.lien:hover{color:var(--sc-accent)}
.lien::after{content:" →" / ""}

/* carte éclairée (validée : « je kiffe, j'adore ») */
.spot{position:relative;border:1px solid var(--filet);background:var(--sc-surface);padding:clamp(28px,4vw,48px);overflow:hidden;isolation:isolate}
.spot::before{content:"";position:absolute;inset:0;background:radial-gradient(380px circle at var(--mx,-300px) var(--my,-300px),rgba(var(--dot-accent),.15),transparent 60%);pointer-events:none;opacity:0;transition:opacity .3s;z-index:-1}
.spot::after{content:"";position:absolute;inset:0;border:1px solid transparent;-webkit-mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;background:radial-gradient(260px circle at var(--mx,-300px) var(--my,-300px),var(--sc-accent),transparent 70%);pointer-events:none;opacity:0;transition:opacity .3s}
@media (hover:hover) and (pointer:fine){.spot:hover::before,.spot:hover::after{opacity:1}}

/* défilé des logos */
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marquee__track{display:flex;gap:clamp(56px,8vw,120px);width:max-content;align-items:center;animation:marquee 30s linear infinite}
.marquee__track img{height:clamp(34px,4vw,56px);width:auto;opacity:.92}
.marquee__track img.inv{filter:brightness(0) invert(1)}
.marquee:hover .marquee__track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}

/* pied de page */
.foot{display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;align-items:center;padding:28px clamp(20px,3vw,32px);font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}
.foot a{color:var(--sc-ink-soft);text-decoration:none}
.foot a:hover{color:var(--sc-accent)}
.foot nav{display:flex;gap:22px;flex-wrap:wrap}

/* utilitaires */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (prefers-reduced-motion:reduce){.marquee__track{animation:none;width:auto;flex-wrap:wrap;justify-content:center}}