/* Hero round v6 kit (Mason, 2026-10-17). One kit under all three directions so only the idea changes.
   Type: Big Shoulders Display light 300 for heads, heavy 800 for the hero line (decision 2026-10-16), Hanken Grotesk body.
   Five sizes only. Pink is the button and nothing else. One curve: cubic-bezier(.3,0,.1,1). */
:root{--ink:#060507;--ink2:#0d0b0e;--cream:#EBDED0;--soft:#cfc3b5;--stone:#9A938A;--line:rgba(235,222,208,.16);--pink:#FF2D78;
  --d:'Big Shoulders Display',Impact,'Arial Narrow',sans-serif;--b:'Hanken Grotesk',system-ui,-apple-system,sans-serif;
  --ease:cubic-bezier(.3,0,.1,1);--gx:max(20px,4vw);
  --s-hero:clamp(58px,9.4vw,152px);--s-head:clamp(34px,4.4vw,64px);--s-body:clamp(16px,1.25vw,19px);--s-lab:13px;--s-fine:12px;color-scheme:dark}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--ink)}
body{background:var(--ink);color:var(--cream);font-family:var(--b);font-size:var(--s-body);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.bar{position:fixed;z-index:50;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:22px var(--gx);pointer-events:none}
.bar>*{pointer-events:auto}
.wm{font-family:var(--d);font-weight:800;font-size:22px;letter-spacing:-.01em;text-transform:uppercase;line-height:1}
.nav{display:flex;align-items:center;gap:26px;font-size:15px;font-weight:600}
.nav a.l{opacity:.82;transition:opacity .24s var(--ease)}.nav a.l:hover{opacity:1}
.go{display:inline-flex;align-items:center;gap:10px;background:var(--pink);color:var(--ink);font-weight:700;font-size:16px;padding:15px 22px;border-radius:4px;transition:transform .24s var(--ease)}
.go:hover{transform:translateY(-2px)}
.nav .go{font-size:14px;padding:10px 15px}
.menu{display:none;border:1px solid var(--line);border-radius:999px;padding:8px 15px;font-size:14px;font-weight:600;background:rgba(6,5,7,.4);backdrop-filter:blur(6px)}
.meta{position:fixed;z-index:40;left:0;right:0;bottom:0;display:flex;justify-content:space-between;gap:16px;padding:16px var(--gx);font-size:var(--s-fine);color:var(--stone);pointer-events:none}
.meta i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#81FF28;margin-right:8px;vertical-align:1px}
.hero-line{font-family:var(--d);font-weight:800;font-size:var(--s-hero);line-height:.86;letter-spacing:-.018em;text-wrap:balance}
.head{font-family:var(--d);font-weight:300;font-size:var(--s-head);line-height:.98;letter-spacing:-.01em;text-wrap:balance}
.lab{font-size:var(--s-lab);color:var(--stone);font-weight:600;letter-spacing:.02em}
.fine{font-size:var(--s-fine);color:var(--stone)}
.lead{color:var(--soft);max-width:34em}
.who{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:var(--s-lab);color:var(--soft);font-weight:600}
.who span{white-space:nowrap}
.against{font-family:var(--d);font-weight:300;font-size:var(--s-head);line-height:1;color:var(--stone)}
.five{display:grid;gap:22px;align-content:start}
@media (max-width:760px){
  .nav a.l,.nav .go{display:none}.menu{display:block}.bar{padding:16px 16px}.wm{font-size:20px}
  .meta{padding:12px 16px}.meta .m3{display:none}
  :root{--gx:16px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
