/* Product Garage · site styles */
:root{
  --oil:#171512; --ink:#0d0c0a; --steel:#2B2824; --steel2:#211e1b; --chalk:#F3EEE5; --paper:#FBF8F2;
  --concrete:#8F8A80; --mute:#A9A294; --mute-d:#5E5850; --red:#D23A22; --red-d:#B3301B;
  --line:rgba(243,238,229,.12); --line-d:rgba(23,21,18,.14);
  --disp:"Melodrama","Instrument Serif","Times New Roman",serif;
  --body:"Switzer","Hanken Grotesk","Helvetica Neue",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --gut:clamp(20px,4vw,56px);
  --ease:cubic-bezier(.2,.8,.2,1); --ease-io:cubic-bezier(.7,0,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--oil);color-scheme:dark}
[id]{scroll-margin-top:110px}
a,button,summary,label,input,textarea{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto !important}
body{margin:0;background:var(--oil);color:var(--chalk);font:400 17px/1.55 var(--body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit}
h1,h2,h3,h4,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
::selection{background:var(--red);color:#fff}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:12px;top:-60px;z-index:300;background:var(--chalk);color:var(--oil);padding:10px 14px;text-decoration:none}
.skip:focus{top:12px}

.w{width:100%;max-width:1440px;margin:0 auto;padding:0 var(--gut)}
.disp{font-family:var(--disp);font-weight:400;letter-spacing:-.018em;line-height:.92}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;line-height:1.5}
.eb{display:inline-flex;align-items:center;gap:12px;font:500 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.eb::before{content:"";width:18px;height:1px;background:var(--red)}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(210,58,34,.55)}70%,100%{box-shadow:0 0 0 9px rgba(210,58,34,0)}}
.h1{font-size:clamp(54px,8.6vw,152px)}
.h2{font-size:clamp(44px,6.2vw,108px)}
.h3{font-size:clamp(30px,3vw,46px);line-height:1}
.lede{font-size:clamp(18px,1.45vw,22px);line-height:1.5;color:#D9D2C6;max-width:34em}
.lt .lede,.lt .muted{color:var(--mute-d)}
.muted{color:var(--mute)}
.red{color:var(--red)}
em.it{font-style:italic;color:var(--red)}
p{text-wrap:pretty}
h1,h2{text-wrap:balance}

/* split text */
.ln{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.ln>span{display:inline-block;will-change:transform}

/* sections */
.sec{position:relative;padding:clamp(96px,12vw,180px) 0;overflow:hidden}
.lt{background:var(--chalk);color:var(--oil)}
.dk{background:var(--oil)}
.ink{background:var(--ink)}
.rd{background:var(--red);color:#fff}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-2%)}60%{transform:translate(-2%,-4%)}80%{transform:translate(4%,2%)}100%{transform:translate(0,0)}}
.sec>.w{position:relative;z-index:2}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:clamp(48px,6vw,88px)}
.head .eb{margin-bottom:24px}
.rule{height:1px;background:var(--line)}
.lt .rule{background:var(--line-d)}

/* ========== header ========== */
.hdr{position:fixed;left:0;right:0;top:0;z-index:90;transition:background .5s var(--ease),border-color .5s,transform .6s var(--ease);border-bottom:1px solid transparent}
.hdr.on{background:rgba(18,16,14,.72);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);border-color:var(--line)}
.hdr.hide{transform:translateY(-100%)}
.hdr .w{display:flex;align-items:center;justify-content:space-between;gap:24px;height:84px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;font:600 17px/1 var(--body);letter-spacing:-.01em;white-space:nowrap}
.logo svg{flex:none;width:30px;height:30px;transition:transform .6s var(--ease)}
.logo:hover svg{transform:translateY(-3px) rotate(-4deg)}
.logo .door{transition:transform .6s var(--ease);transform-origin:50% 0}
.logo:hover .door{transform:scaleY(.25)}
.nav{display:flex;gap:2px}
.nav a{position:relative;padding:12px 13px;font-size:14.5px;font-weight:500;text-decoration:none;color:#CFC8BB;transition:color .25s}
.nav a:hover,.nav a[aria-current]{color:var(--chalk)}
.nav a::after{content:"";position:absolute;left:13px;right:13px;bottom:6px;height:1px;background:var(--red);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.nav a:hover::after,.nav a[aria-current]::after{transform:scaleX(1);transform-origin:left}
.pg-about-menu{position:relative;align-self:center}
.pg-about-menu>summary{list-style:none;display:flex;align-items:center;gap:8px;padding:12px 13px;cursor:pointer;color:#CFC8BB;font-size:14.5px;font-weight:500;transition:color .25s}
.pg-about-menu>summary::-webkit-details-marker,.pg-about-drawer>summary::-webkit-details-marker{display:none}
.pg-about-menu>summary:hover,.pg-about-menu[open]>summary,.pg-about-menu>summary[aria-current]{color:var(--chalk)}
.pg-about-menu>summary:focus-visible,.pg-about-drawer>summary:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.pg-about-menu .pg-chevron,.pg-about-drawer .pg-chevron{display:inline-block;width:7px;height:7px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s}
.pg-about-menu[open] .pg-chevron,.pg-about-drawer[open] .pg-chevron{transform:translateY(2px) rotate(225deg)}
.pg-about-menu-panel{position:absolute;top:100%;right:0;min-width:285px;padding:10px;background:var(--ink);border:1px solid var(--line);box-shadow:0 18px 45px rgba(0,0,0,.26)}
.nav .pg-about-menu-panel a{display:block;padding:13px 15px;color:var(--chalk);white-space:nowrap}
.nav .pg-about-menu-panel a::after{display:none}
.nav .pg-about-menu-panel a:hover,.nav .pg-about-menu-panel a[aria-current]{background:rgba(243,238,229,.08)}
.hdr[data-tone=light] .pg-about-menu>summary{color:#5a544b}
.hdr[data-tone=light] .pg-about-menu>summary:hover,.hdr[data-tone=light] .pg-about-menu[open]>summary,.hdr[data-tone=light] .pg-about-menu>summary[aria-current]{color:var(--oil)}
.hdr[data-tone=red] .pg-about-menu>summary{color:#F6DCD5}
.hdr[data-tone=red] .pg-about-menu>summary:hover,.hdr[data-tone=red] .pg-about-menu[open]>summary{color:#fff}
.hdr[data-tone] .nav .pg-about-menu-panel a{color:#F3EEE5}
.hdr[data-tone] .nav .pg-about-menu-panel a:hover,.hdr[data-tone] .nav .pg-about-menu-panel a[aria-current]{color:#fff}
.pg-about-drawer>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;font:400 clamp(40px,10vw,64px)/1.05 var(--disp);padding:6px 0;border-bottom:1px solid var(--line);cursor:pointer}
.pg-about-drawer-links{padding:8px 0 16px 18px}
.drawer nav .pg-about-drawer-links a{font:500 clamp(20px,5vw,28px)/1.2 var(--body);padding:10px 0;color:var(--chalk)}
.drawer.open{overflow-y:auto}
.hdr-r{display:flex;align-items:center;gap:10px}
.tog{display:inline-flex;align-items:center;gap:9px;height:44px;padding:0 14px;border:1px solid rgba(243,238,229,.18);background:transparent;border-radius:2px;cursor:pointer;font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#CFC8BB;transition:border-color .25s,color .25s,background .25s}
.tog:hover{border-color:var(--chalk);color:var(--chalk)}
.tog[aria-pressed=true]{border-color:var(--red);color:var(--chalk)}
.bars{display:flex;gap:2px;align-items:flex-end;height:12px}
.bars i{width:2px;height:3px;background:currentColor;transition:height .3s}
.tog[aria-pressed=true] .bars i{animation:eq 1s ease-in-out infinite}
.tog[aria-pressed=true] .bars i:nth-child(2){animation-delay:-.35s}
.tog[aria-pressed=true] .bars i:nth-child(3){animation-delay:-.7s}
@keyframes eq{0%,100%{height:3px}50%{height:12px}}
.menu{display:none}
.drawer{position:fixed;inset:0;z-index:85;overscroll-behavior:contain;background:var(--ink);padding:120px var(--gut) 40px;display:flex;flex-direction:column;justify-content:space-between;clip-path:inset(0 0 100% 0);transition:clip-path .7s var(--ease-io);visibility:hidden}
.drawer.open{clip-path:inset(0 0 0 0);visibility:visible}
.drawer nav a{display:block;font:400 clamp(40px,10vw,64px)/1.05 var(--disp);text-decoration:none;padding:6px 0;border-bottom:1px solid var(--line)}

/* ========== buttons ========== */
.btn{--bg:var(--red);--fg:#fff;--hv:var(--chalk);--hf:var(--oil);position:relative;display:inline-flex;align-items:center;gap:14px;height:56px;padding:0 26px;background:var(--bg);color:var(--fg);border:0;border-radius:2px;font:600 15.5px/1 var(--body);letter-spacing:-.005em;text-decoration:none;cursor:pointer;overflow:hidden;isolation:isolate;white-space:nowrap;transition:color .5s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--hv);transform:translateY(102%);border-radius:50% 50% 0 0/40% 40% 0 0;transition:transform .6s var(--ease-io),border-radius .6s var(--ease-io)}
.btn:hover{color:var(--hf)}
.btn:hover::before{transform:translateY(0);border-radius:0}
.btn:active{transform:scale(.98) !important}
.btn .ar{display:inline-grid;place-items:center;width:20px;height:20px;overflow:hidden}
.btn .ar span{display:block;transition:transform .5s var(--ease)}
.btn:hover .ar span{animation:arr .6s var(--ease)}
@keyframes arr{0%{transform:translateX(0)}49%{transform:translateX(120%)}50%{transform:translateX(-120%)}100%{transform:translateX(0)}}
.btn.chalk{--bg:var(--chalk);--fg:var(--oil);--hv:var(--red);--hf:#fff}
.btn.oil{--bg:var(--oil);--fg:var(--chalk);--hv:var(--chalk);--hf:var(--oil)}
.btn.sm{height:44px;padding:0 18px;font-size:14px}
.tl{position:relative;display:inline-flex;align-items:center;gap:10px;font-weight:600;text-decoration:none;padding-bottom:4px}
.tl::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;opacity:.35}
.tl::before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--red);transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.tl:hover::before{transform:scaleX(1);transform-origin:left}
.cta-row{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.cta-row .note{font-size:15px;color:var(--mute);max-width:15em;line-height:1.4}

/* ========== cursor ========== */

/* ========== transitions ========== */
.shut{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;pointer-events:none}
.shut i{flex:1;background:#1c1916;border-bottom:1px solid #2a2622;box-shadow:inset 0 -6px 10px rgba(0,0,0,.35);transform:scaleY(0);transform-origin:top}
.shut.cover{pointer-events:auto}
.shut.cover i{transform:scaleY(1)}
html.arriving .shut i{transform:scaleY(1)}

/* preloader */
.pre{position:fixed;inset:0;z-index:210;background:var(--ink);display:none;flex-direction:column;justify-content:flex-end;padding:var(--gut)}
html.preload .pre{display:flex}
.pre .ct{font:400 clamp(90px,18vw,300px)/.8 var(--disp);letter-spacing:-.04em}
.pre .row{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
.pre .bar{height:1px;background:var(--line);margin-top:24px}
.pre .bar i{display:block;height:1px;width:0;background:var(--red)}

/* ========== hero (home, 3D corridor) ========== */
.hero3d{position:relative;height:420vh;background:#0c0b0a}
.hero3d .stick{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.gl{position:absolute;inset:0;width:100%;height:100%}
.hero3d .shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(12,11,10,.78) 0%,rgba(12,11,10,.35) 42%,rgba(12,11,10,0) 64%),linear-gradient(0deg,rgba(12,11,10,.55),rgba(12,11,10,0) 30%)}
.hcopy{position:absolute;left:0;right:0;bottom:clamp(40px,8vh,96px);z-index:3}
.hcopy .eb{margin-bottom:28px}
.hcopy .h1{max-width:13.5ch;font-size:clamp(54px,7.4vw,132px)}
.hcopy .lede{margin:30px 0 36px;max-width:31em}
.rail{position:absolute;right:var(--gut);top:50%;transform:translateY(-50%);z-index:4;display:flex;flex-direction:column;gap:22px;align-items:flex-end}
.rail span{display:flex;align-items:center;gap:14px;font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:rgba(243,238,229,.38);transition:color .4s}
.rail span::before{content:"";width:0;height:1px;background:var(--red);transition:width .5s var(--ease)}
.rail span.on{color:var(--chalk)}
.rail span.on::before{width:28px}
@keyframes cue{0%{transform:scaleY(0)}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.story{position:absolute;left:var(--gut);top:50%;z-index:3;width:min(460px,86vw);transform:translateY(-50%);pointer-events:none}
.story .card{position:absolute;left:0;top:0;transform:translateY(-50%);width:100%;padding:30px 30px 32px;background:rgba(243,238,229,.94);color:var(--oil);border-radius:2px;box-shadow:0 40px 80px -30px rgba(0,0,0,.8);opacity:0;visibility:hidden}
.story .card .mono{font-size:10.5px;color:var(--red);margin-bottom:16px;display:flex;justify-content:space-between}
.story .card .mono b{font-weight:500;color:var(--mute-d)}
.story .card .disp{font-size:34px;line-height:1.02}
.story .card ul{margin-top:18px;border-top:1px solid var(--line-d)}
.story .card li{display:flex;gap:14px;padding:11px 0;border-bottom:1px solid var(--line-d);font-size:16px}
.story .card li b{font:500 11px/1.9 var(--mono);color:var(--mute-d)}
.story .card li.pick{font-weight:600}.story .card li.pick b{color:var(--red)}
.story .card .strike{position:relative;display:inline-block}
.story .card .strike::after{content:"";position:absolute;left:-3px;right:-3px;top:55%;height:2px;background:var(--red);transform:scaleX(var(--s,0));transform-origin:left;transition:transform .8s var(--ease-io)}
.story .card .obj{margin-top:18px;padding-top:14px;border-top:1px solid var(--line-d);font-size:15px;color:var(--mute-d)}
.story .stamp{position:absolute;right:22px;bottom:-22px;padding:9px 14px;border:3px solid var(--red);color:var(--red);background:var(--paper);font:500 14px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;transform:rotate(-8deg)}
.nogl .hero3d{height:auto}
.nogl .hero3d .stick{position:relative;height:auto;min-height:92vh;background:radial-gradient(80% 70% at 70% 40%,#3a2d22,#0c0b0a 70%)}
.nogl .story,.nogl .rail,.nogl .cue{display:none}

/* marquee */
.proof{position:relative;z-index:2;background:var(--ink);border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:26px 0}
.mq{display:flex;width:max-content;animation:mq 42s linear infinite}
.mq>div{display:flex;align-items:center;gap:44px;padding-right:44px;white-space:nowrap;font:400 clamp(26px,2.6vw,40px)/1 var(--disp);letter-spacing:-.01em}
.mq>div .sl{font:500 12px var(--mono);color:var(--red)}
.mq>div .mono{color:var(--mute)}
.proof:hover .mq{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}

/* ========== page hero (bay) ========== */
.bay{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;background:#0c0b0a;overflow:hidden}
.bay .gl{z-index:0}
.bay .shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(12,11,10,.86),rgba(12,11,10,.4) 50%,rgba(12,11,10,.05) 75%),linear-gradient(0deg,rgba(12,11,10,.8),rgba(12,11,10,0) 45%)}
.bay .w{position:relative;z-index:2;padding-top:160px;padding-bottom:clamp(56px,9vh,110px)}
.bay .eb{margin-bottom:28px}
.bay .h1{max-width:15ch;font-size:clamp(50px,6.6vw,120px)}
.bay .lede{margin-top:28px}
.bay .after{margin-top:40px}
.nogl .bay{background:radial-gradient(70% 70% at 75% 40%,#3a2d22,#0c0b0a 70%)}

/* ========== steps (how it works) ========== */
.steps{border-top:1px solid var(--line-d)}
.step{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,6fr) minmax(0,3fr);gap:32px;align-items:center;padding:clamp(28px,3.4vw,48px) 0;border-bottom:1px solid var(--line-d)}
.step .n{font:400 clamp(90px,12vw,210px)/.78 var(--disp);letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1px rgba(23,21,18,.35);background:linear-gradient(90deg,var(--red) 0 50%,transparent 50% 100%) 100% 0/200% 100% no-repeat;-webkit-background-clip:text;background-clip:text;transition:background-position 1s var(--ease-io),-webkit-text-stroke-color .6s}
.step.on .n{background-position:0 0;-webkit-text-stroke-color:var(--red)}
.step h3{font:400 clamp(34px,3.6vw,58px)/1 var(--disp);letter-spacing:-.015em}
.step p{font-size:18px;color:var(--mute-d);line-height:1.5}

/* ========== get list ========== */
.get li{display:grid;grid-template-columns:120px minmax(0,1fr);gap:24px;align-items:baseline;padding:clamp(26px,3vw,40px) 0;border-bottom:1px solid var(--line)}
.get li:first-child{border-top:1px solid var(--line)}
.get .mono{color:var(--red)}
.get p{font:400 clamp(34px,4.6vw,76px)/1 var(--disp);letter-spacing:-.02em;transition:transform .6s var(--ease),color .4s}
.get li:hover p{transform:translateX(18px)}
.get li:hover p em{color:var(--red)}
.get p em{font-style:italic;transition:color .4s}

/* ========== next room ========== */
.next{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(40px,6vw,100px);align-items:center}
.date{font:400 clamp(110px,14.5vw,250px)/.8 var(--disp);letter-spacing:-.05em;white-space:nowrap}
.date em{font-style:italic;color:var(--red)}
.next .meta{margin:28px 0 22px;color:var(--mute-d)}
.next .say{font:400 clamp(30px,2.8vw,44px)/1.08 var(--disp);max-width:15em;margin-bottom:36px}
.badge-wrap{position:relative;display:flex;justify-content:center;perspective:1200px;padding-top:150px}
.strap{position:absolute;top:0;left:50%;width:30px;height:170px;margin-left:-15px;background:repeating-linear-gradient(180deg,var(--red) 0 12px,var(--red-d) 12px 14px);box-shadow:inset -6px 0 8px rgba(0,0,0,.2)}
.badge{position:relative;width:min(380px,86vw);background:var(--paper);color:var(--oil);border-radius:12px;padding:28px;box-shadow:0 60px 90px -40px rgba(23,21,18,.55),0 2px 0 rgba(255,255,255,.6) inset;transform-style:preserve-3d;will-change:transform}
.badge .clip{width:56px;height:10px;border-radius:6px;background:#D8D0C2;margin:0 auto 26px;box-shadow:inset 0 2px 3px rgba(0,0,0,.2)}
.badge .top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.badge .top .mono{font-size:10px;color:var(--mute-d)}
.badge .seats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:30px 0 26px;padding:22px;border:1px dashed rgba(23,21,18,.25);border-radius:6px}
.badge .tbl{display:flex;flex-direction:column;align-items:center;gap:8px}
.badge .tbl .ds{display:flex;gap:6px}
.badge .tbl i{width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--concrete);transition:background .3s,box-shadow .3s,transform .4s var(--ease)}
.badge .tbl i.f{background:var(--oil);box-shadow:none;transform:scale(1.1)}
.badge .tbl u{display:block;width:100%;height:18px;background:#E6DFD3;border-radius:2px;text-decoration:none}
.badge .fo{display:flex;justify-content:center;gap:10px;align-items:center;margin-top:-6px;margin-bottom:6px}
.badge .fo i{width:14px;height:14px;border-radius:50%;background:var(--red)}
.badge .fo span{font:500 9.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mute-d)}
.badge .big{display:flex;justify-content:space-between;align-items:flex-end}
.badge .big .disp{font-size:92px;line-height:.8}
.badge .stampx{position:absolute;right:26px;top:92px;padding:10px 16px;border:3px solid var(--red);color:var(--red);font:500 22px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;transform:rotate(-12deg);background:rgba(251,248,242,.85);mix-blend-mode:multiply}

/* ========== founders ========== */
.slats-bg{position:absolute;inset:-20% -10%;z-index:0;background:repeating-linear-gradient(176deg,rgba(0,0,0,0) 0 44px,rgba(0,0,0,.075) 44px 60px);animation:slat 22s linear infinite}
@keyframes slat{to{background-position:0 208px}}
.found{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(40px,6vw,100px);align-items:end}
.found .h2{font-size:clamp(52px,7.4vw,128px)}
.found p{font-size:clamp(18px,1.5vw,22px);line-height:1.5;margin-bottom:36px}
.stages{display:flex;flex-direction:column;border-top:1px solid rgba(255,255,255,.3);margin-top:48px}
.stages li{display:flex;align-items:baseline;gap:18px;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.3);font:400 32px/1 var(--disp)}
.stages li b{font:500 11px var(--mono);letter-spacing:.14em;opacity:.8}

/* ========== decision board ========== */
.tool{position:relative}
.tool-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px;flex-wrap:wrap}
.tool-bar .prog{display:flex;align-items:center;gap:14px;min-width:260px}
.tool-bar .prog .t{flex:1;height:3px;background:rgba(23,21,18,.12)}
.tool-bar .prog .t i{display:block;height:3px;width:0;background:var(--red);transition:width .6s var(--ease)}
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.card{position:relative;display:flex;flex-direction:column;gap:10px;min-height:260px;padding:22px;background:#fff;border:1px solid var(--line-d);border-radius:3px;transition:border-color .35s,transform .6s var(--ease),box-shadow .6s var(--ease)}
.card:hover{transform:translateY(-6px);box-shadow:0 30px 50px -30px rgba(23,21,18,.45)}
.card.done{border-color:var(--red)}
.card.done .dot{background:var(--red)}
.card .top{display:flex;justify-content:space-between;align-items:center}
.card .dot{width:9px;height:9px;border-radius:50%;background:rgba(23,21,18,.15);transition:background .3s}
.card label{font:400 30px/1 var(--disp);letter-spacing:-.01em}
.card .q{font-size:14px;line-height:1.45;color:var(--mute-d)}
.card textarea{flex:1;margin-top:6px;min-height:84px;width:100%;resize:vertical;border:0;border-top:1px dashed rgba(23,21,18,.2);background:transparent;padding:12px 0 0;font:400 16px/1.45 var(--body);color:var(--oil);outline:none}
.card textarea::placeholder{color:#7A7367}
.card.cta{background:var(--oil);color:var(--chalk);border-color:var(--oil);justify-content:space-between}
.card.cta .disp{font-size:34px;line-height:1.02}

/* ========== forms ========== */
.join{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,100px);align-items:start}
.bul li{display:flex;gap:20px;padding:20px 0;border-bottom:1px solid var(--line);font-size:19px;line-height:1.4}
.bul li:first-child{border-top:1px solid var(--line)}
.bul li b{font:500 12px/1.9 var(--mono);color:var(--red)}
.lt .bul li{border-color:var(--line-d)}
.panel{position:relative;padding:clamp(28px,3.4vw,48px);background:#1d1a17;border:1px solid var(--line);border-radius:3px}
.panel::before{content:"";position:absolute;left:clamp(28px,3.4vw,48px);top:-1px;width:72px;height:3px;background:var(--red)}
.lt .panel{background:#fff;border-color:var(--line-d)}
form.f{display:flex;flex-direction:column;gap:20px}
.fr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.fld{position:relative;display:flex;flex-direction:column;gap:10px}
.fld label{font:500 11px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.lt .fld label{color:var(--mute-d)}
.fld input,.fld textarea{width:100%;height:54px;padding:0 2px;background:transparent;border:0;border-bottom:1px solid rgba(243,238,229,.28);border-radius:0;color:var(--chalk);font:400 18px var(--body);outline:none;transition:border-color .3s}
.fld textarea{height:auto;padding:12px 2px;line-height:1.5;resize:vertical}
.lt .fld input,.lt .fld textarea{border-color:rgba(23,21,18,.25);color:var(--oil)}
.fld::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.fld:focus-within::after{transform:scaleX(1)}
.fld.ta::after{bottom:4px}
.chk{display:flex;gap:14px;align-items:flex-start;cursor:pointer;font-size:16px;line-height:1.45;min-height:44px;padding-top:6px}
.chk input{appearance:none;-webkit-appearance:none;flex:none;width:22px;height:22px;margin:0;border:1.5px solid rgba(243,238,229,.4);border-radius:2px;display:grid;place-items:center;cursor:pointer;transition:background .2s,border-color .2s}
.lt .chk input{border-color:rgba(23,21,18,.35)}
.chk input:checked{background:var(--red);border-color:var(--red)}
.chk input:checked::after{content:"";width:10px;height:6px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translate(1px,-1px)}
.fnote{font-size:14px;color:var(--mute)}
.lt .fnote{color:var(--mute-d)}
.err{color:#FF8A73;font-size:15px}
.lt .err{color:var(--red-d)}
.ok{display:flex;gap:22px;align-items:center;padding:8px 0}
.ok svg{flex:none;width:56px;height:56px}
.ok svg circle{stroke-dasharray:180;stroke-dashoffset:180;animation:draw .9s var(--ease) forwards}
.ok svg path{stroke-dasharray:40;stroke-dashoffset:40;animation:draw .5s var(--ease) .6s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.ok h3{font:400 40px/1 var(--disp);margin-bottom:8px}
.wc{display:flex;align-items:center;gap:14px;margin-top:4px}
.wc .t{flex:1;height:2px;background:rgba(243,238,229,.12)}
.wc .t i{display:block;height:2px;width:0;background:var(--chalk);transition:width .3s,background .3s}
.wc.good .t i{background:var(--red)}
.wc .mono{font-size:10.5px;color:var(--mute)}

/* ========== generic blocks ========== */
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,72px)}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.tile{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:56px;min-height:340px;padding:clamp(26px,2.6vw,40px);border:1px solid var(--line);border-radius:3px;background:#1b1916;text-decoration:none;overflow:hidden;transition:transform .7s var(--ease),border-color .4s}
.tile::before{content:"";position:absolute;inset:0;background:var(--red);transform:translateY(101%);transition:transform .7s var(--ease-io);z-index:0}
.tile>*{position:relative;z-index:1}
.tile:hover{transform:translateY(-8px)}
.tile:hover::before{transform:translateY(0)}
.tile:hover .muted,.tile:hover .mono{color:#fff}
.tile .big{font:400 clamp(56px,6vw,104px)/.8 var(--disp);letter-spacing:-.03em}
.lt .tile{background:#fff;border-color:var(--line-d)}
.lt .tile:hover{color:#fff}
.lt .tile .muted{color:var(--mute-d)}
.tile .go{display:flex;justify-content:space-between;align-items:center}
.tile .go svg{transition:transform .6s var(--ease)}
.tile:hover .go svg{transform:rotate(-45deg)}

.rows>li,.rows>a{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr) minmax(0,4fr) minmax(0,2fr);gap:24px;align-items:center;padding:30px 0;border-bottom:1px solid var(--line-d);text-decoration:none;transition:padding .5s var(--ease),background .4s}
.rows>li:first-child{border-top:1px solid var(--line-d)}
.rows>li:hover{padding-left:18px;background:rgba(23,21,18,.035)}
.rows .disp{font-size:clamp(34px,3.4vw,52px);line-height:1}
.rows .r{text-align:right}

.who li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:baseline;padding:clamp(24px,3vw,38px) 0;border-bottom:1px solid var(--line);transition:padding .5s var(--ease)}
.who li:first-child{border-top:1px solid var(--line)}
.who li .disp{font-size:clamp(40px,5vw,84px);transition:color .4s}
.who li p{font-size:clamp(18px,1.6vw,24px);color:#D9D2C6}
.who li:hover{padding-left:20px}
.who li:hover .disp{color:var(--red)}

.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:40px}
.tabs button{height:52px;padding:0 24px;border:1px solid rgba(243,238,229,.25);background:transparent;border-radius:2px;cursor:pointer;font:600 15px var(--body);transition:background .35s,color .35s,border-color .35s}
.tabs button[aria-selected=true]{background:var(--chalk);color:var(--oil);border-color:var(--chalk)}
.tpanel{display:grid;grid-template-columns:200px minmax(0,1fr);gap:40px;align-items:start;padding:clamp(36px,5vw,72px) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tpanel .n{font:400 clamp(110px,12vw,190px)/.75 var(--disp);color:var(--red)}
.tpanel p{font:400 clamp(34px,4vw,64px)/1.04 var(--disp)}

.journey{position:relative}
.jtrack{position:relative;height:2px;background:rgba(23,21,18,.15);margin:10px 0 0}
.jtrack i{position:absolute;left:0;top:0;height:2px;width:0;background:var(--red);transition:width .8s var(--ease-io)}
.jst{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:-18px}
.jst button{display:flex;flex-direction:column;align-items:flex-start;gap:20px;padding:0;background:none;border:0;cursor:pointer;text-align:left}
.jst .dotn{width:34px;height:34px;border-radius:50%;border:2px solid rgba(23,21,18,.25);background:var(--chalk);display:grid;place-items:center;font:500 10px var(--mono);color:var(--mute-d);transition:background .4s,border-color .4s,color .4s}
.jst button.done .dotn{background:var(--red);border-color:var(--red);color:#fff}
.jst .lab{font:400 clamp(40px,4.4vw,72px)/.9 var(--disp);opacity:.3;transition:opacity .4s}
.jst button[aria-pressed=true] .lab{opacity:1}
.jpanel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:end;margin-top:44px;padding:clamp(32px,4vw,56px);background:var(--oil);color:var(--chalk);border-radius:3px;min-height:240px}
.jpanel p{font:400 clamp(32px,3.6vw,56px)/1.04 var(--disp)}
.jpanel .mono{color:var(--mute)}

.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:28px 0;cursor:pointer;list-style:none;font:400 clamp(26px,2.4vw,36px)/1.1 var(--disp)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pl{position:relative;flex:none;width:22px;height:22px}
.faq summary .pl::before,.faq summary .pl::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;background:var(--red);transition:transform .45s var(--ease)}
.faq summary .pl::after{transform:rotate(90deg)}
.faq details[open] .pl::after{transform:rotate(0)}
.faq details p{padding:0 0 30px;font-size:18px;line-height:1.55;color:#D9D2C6;max-width:40em}

.person figure{display:flex;flex-direction:column;gap:18px}
.portrait{position:relative;aspect-ratio:4/5;background:#26221e;border-radius:3px;overflow:hidden}
.portrait::before{content:"";position:absolute;inset:-30%;background:repeating-linear-gradient(170deg,rgba(255,226,186,.0) 0 26px,rgba(255,226,186,.09) 26px 40px);animation:slat 12s linear infinite}
.portrait::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 38%,rgba(255,214,160,.14),transparent 70%)}
.portrait span{position:absolute;left:16px;bottom:14px;z-index:1;font:500 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.portrait .ini{position:absolute;inset:0;display:grid;place-items:center;font:400 120px/1 var(--disp);color:rgba(243,238,229,.08);z-index:1}
.person figcaption .disp{font-size:38px;line-height:1}

.empty{position:relative;padding:clamp(32px,4vw,56px);border-radius:3px;background:#E7E0D4;background-image:radial-gradient(circle,rgba(23,21,18,.2) 2px,transparent 2.6px);background-size:28px 28px;display:grid;place-items:center;min-height:360px}
.empty svg{width:min(420px,100%);height:auto}
.empty svg g{stroke-dasharray:6 7;animation:dash 30s linear infinite}
@keyframes dash{to{stroke-dashoffset:-400}}

.brief{position:relative;padding:40px;background:#fff;border-radius:2px;min-height:460px;box-shadow:0 60px 90px -40px rgba(23,21,18,.5);transform:rotate(1.6deg);display:flex;flex-direction:column;gap:20px}
.brief::before{content:"";position:absolute;left:calc(50% - 60px);top:-14px;width:120px;height:28px;background:rgba(210,58,34,.28);transform:rotate(-3deg)}
.brief .dec{font:400 40px/1.04 var(--disp);color:#B9B2A5;transition:color .3s}
.brief .dec.on,.brief .why.on{color:var(--oil)}
.brief .why{font-size:16px;line-height:1.5;color:#B9B2A5;white-space:pre-line;transition:color .3s}
.brief .hd{display:flex;justify-content:space-between}

.contact a{display:flex;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:18px;transition:padding .5s var(--ease),color .3s}
.contact a:hover{padding-left:12px;color:var(--red)}
.contact a span:first-child{color:var(--mute)}

/* ========== footer ========== */
.foot{position:relative;background:var(--ink);border-top:1px solid var(--line);overflow:hidden}
.foot .top{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;padding:clamp(64px,8vw,120px) 0 40px}
.foot .top .disp{font-size:clamp(36px,3.6vw,56px);max-width:12em;line-height:1.02}
.foot .wm{font:400 clamp(70px,15.2vw,270px)/.9 var(--disp);letter-spacing:-.05em;white-space:nowrap;padding:10px 0 .06em;display:flex;overflow:hidden}
.foot .wm span{display:inline-block;transition:transform .7s var(--ease),color .4s}
.foot .wm:hover span{transform:translateY(-6%)}
.foot .wm span:nth-child(odd){transition-delay:.03s}
.foot .wm .a{font-style:italic;color:var(--red)}
.foot .bot{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 0 34px;border-top:1px solid var(--line);font-size:14px;color:var(--mute)}
.foot .bot nav{display:flex;gap:26px}
.foot .bot a{text-decoration:none;color:var(--mute);transition:color .25s}
.foot .bot a:hover{color:var(--chalk)}

/* reveal fallback */
.no-js .rv{opacity:1}

/* reduced motion */
html.nomo *,html.nomo *::before,html.nomo *::after{animation:none !important;transition-duration:.01s !important}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none !important;transition-duration:.01s !important}}

/* ========== responsive ========== */
@media (max-width:1180px){
  .nav,.hdr-r .hide-m{display:none}
  .menu{display:inline-flex}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .next,.found,.join,.g2,.g3,.g4,.step,.tpanel,.jpanel,.who li,.rows>li,.rows>a{grid-template-columns:minmax(0,1fr)}
  .step{gap:12px}
  .jst{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}
  .jtrack{display:none}.jst{margin-top:0}
  .rows .r{text-align:left}
  .head{flex-direction:column;align-items:flex-start}
  .get li{grid-template-columns:minmax(0,1fr);gap:10px}
  .fr{grid-template-columns:minmax(0,1fr)}
  .rail,.cue{display:none}
  .story{top:auto;bottom:24%;transform:none}
  .crumb{display:none}
  .foot .top,.foot .bot{flex-direction:column;align-items:flex-start}
  .cards{grid-template-columns:minmax(0,1fr)}
}

/* one fixed film-grain layer for the whole page (cheaper than per-section) */
body::after{content:"";position:fixed;inset:-50%;z-index:150;pointer-events:none;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1s steps(6) infinite;mix-blend-mode:overlay}

[data-count],[data-done],.date,.pre .ct{font-variant-numeric:tabular-nums}
.fld input::placeholder{color:#8E877B}
/* what you get: words fill as you read */
.get li{grid-template-columns:minmax(0,1fr)}
.get .w8{display:inline;opacity:.16;transition:opacity .25s}
.get .w8.on{opacity:1}
/* community: three ways in, asymmetric */
.ways{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.5fr);gap:16px;align-items:stretch}
.ways .tile:last-child{background:var(--red);border-color:var(--red);color:#fff}
.ways .tile:last-child .muted{color:rgba(255,255,255,.85)}
.ways .tile:last-child::before{background:var(--oil)}
.ways .tile:nth-child(2){margin-top:64px}
/* for companies: statements, not cards */
.gains li{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:32px;align-items:baseline;padding:clamp(24px,3vw,40px) 0;border-top:1px solid var(--line)}
.gains .disp{font-size:clamp(34px,4vw,64px);line-height:1}
.gains p{font-size:clamp(18px,1.5vw,22px);color:#D9D2C6}
@media (max-width:900px){.ways,.gains li{grid-template-columns:minmax(0,1fr)}.ways .tile:nth-child(2){margin-top:0}}