/* Generated by scripts/styles.cjs. Edit the source stylesheets. */

/* fleks-base.css */
/* FLEKS shared design system: fonts, colour, type, buttons, fields, header, footer, and the patterns inner pages share.
   scripts/styles.cjs bundles it into fleks-home.css (with fleks-tee01.css) and fleks-page.css (inner pages). */
@font-face{font-family:FleksDisplay;src:url('/assets/fonts/fleks-display.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Montserrat;src:url('/assets/fonts/montserrat-regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Montserrat;src:url('/assets/fonts/montserrat-medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Montserrat;src:url('/assets/fonts/montserrat-semibold.woff2') format('woff2');font-weight:600;font-display:swap}

:root{
  --ink:#0f0f0e;
  --charcoal:#1a1a18;
  --bone:#f5f5f0;
  --bone-2:#ecece5;
  --stone:#d6d5cc;
  --mute-light:#5c5c55;
  --mute-dark:#a6a69e;
  --line-dark:rgba(245,245,240,.16);
  --ghost:#8f8f87;
  --oxblood:#6b1f1f;
  --display:FleksDisplay,'Bebas Neue',Impact,'Arial Narrow',sans-serif;
  --body:Montserrat,Arial,Helvetica,sans-serif;
  --gutter:clamp(20px,5vw,80px);
  --max:1360px;
  --section:clamp(88px,11vw,176px);
  --ease:cubic-bezier(.2,.7,.2,1);
  --sand:#ece7de;
  --sand-line:#d3cdc1;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--bone);color:var(--ink);font:400 16px/1.6 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
@media(min-width:1100px){body{font-size:17px}}
h1,h2,h3,p,figure,dl,dd{margin:0}
img,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-underline-offset:4px}
button,input,select{font:inherit}
[hidden]{display:none!important}
::selection{background:var(--oxblood);color:var(--bone)}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.on-dark :focus-visible{outline-color:var(--bone)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:10px;z-index:100;padding:12px 16px;background:var(--bone);color:var(--ink);transform:translateY(-200%)}
.skip-link:focus{transform:none}

.shell{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.label{font:600 12px/1.3 var(--body);text-transform:uppercase;letter-spacing:.14em}
h2{font:400 clamp(52px,8.4vw,128px)/.88 var(--display);text-transform:uppercase;letter-spacing:.005em}
.lead{font:500 clamp(18px,1.55vw,22px)/1.45 var(--body);max-width:34ch;margin-top:24px}

/* Buttons and fields */
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;min-height:56px;padding:0 22px;border:1px solid var(--ink);background:var(--ink);color:var(--bone);font:600 13px/1 var(--body);text-transform:uppercase;letter-spacing:.1em;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s,box-shadow .2s}
.button:hover{box-shadow:inset 0 -3px 0 var(--oxblood)}
.button:disabled{opacity:.6;cursor:wait}
.on-dark .button{background:var(--bone);border-color:var(--bone);color:var(--ink)}
.field{width:100%;min-height:56px;padding:0 16px;border:1px solid var(--stone);border-radius:0;background:var(--bone-2);color:var(--ink);font-size:16px;-webkit-appearance:none;appearance:none}
.field:focus{border-color:var(--ink);outline:none}
select.field{padding-right:44px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%230f0f0e' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;cursor:pointer}
select.field:invalid{color:var(--mute-light)}
.on-dark .field{background-color:rgba(245,245,240,.06);border-color:rgba(245,245,240,.3);color:var(--bone);color-scheme:dark}
.on-dark .field::placeholder{color:#8d8d86;opacity:1}
.on-dark .field:focus{border-color:var(--bone)}
.on-dark select.field{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23f5f5f0' stroke-width='1.6'/%3E%3C/svg%3E")}
.on-dark select.field:invalid{color:#8d8d86}
.on-dark select.field option{color:var(--ink);background:var(--bone)}
.form-note{font-size:13px;line-height:1.5;margin-top:12px;color:var(--mute-light)}
.on-dark .form-note{color:var(--mute-dark)}
.form-note a{margin-left:4px}
.form-status{font-size:14px;line-height:1.5}
.form-status:not(:empty){margin-top:12px;padding:10px 14px;border-left:2px solid currentColor}
.form-status[data-state=error]{color:#8a2a2a}
.on-dark .form-status[data-state=error]{color:#f0b9b9}
.signup-next{font-size:14px;margin-top:12px}

/* Header */
.site-header{position:absolute;top:0;left:0;right:0;z-index:10;height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 var(--gutter);color:var(--bone)}
.wordmark{display:block;width:118px}
.wordmark img{width:100%}
.site-header nav{display:flex;align-items:center;gap:32px}
.nav-link{display:inline-flex;align-items:center;min-height:44px;font:600 12px/1 var(--body);text-transform:uppercase;letter-spacing:.14em;text-decoration:none;color:var(--mute-dark);transition:color .2s}
.nav-link:hover{color:var(--bone)}
.nav-join{min-height:42px;padding:0 16px;gap:14px;font-size:12px;background:transparent!important;color:var(--bone)!important;border-color:rgba(245,245,240,.45)!important}
.nav-join:hover{background:var(--bone)!important;color:var(--ink)!important;box-shadow:none}

/* Questions (details rows) */
.faq-title{font:600 12px/1.3 var(--body);text-transform:uppercase;letter-spacing:.14em;padding-bottom:16px;border-bottom:1px solid var(--ink)}
.faq details{border-bottom:1px solid var(--stone)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:60px;padding:16px 0;font-weight:600;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary span{font-size:22px;font-weight:400;line-height:1;transition:transform .2s var(--ease)}
.faq details[open] summary span{transform:rotate(45deg)}
.faq details p{padding:0 32px 20px 0;color:var(--mute-light)}
.on-dark .faq-title{border-color:var(--bone)}
.on-dark .faq details{border-color:var(--line-dark)}
.on-dark .faq details p{color:var(--mute-dark)}

/* Footer */
.site-footer{background:var(--ink);color:var(--bone);padding:clamp(72px,9vw,128px) 0 40px}
.footer-signoff{width:min(100%,760px);height:auto}
.footer-rebuild{margin-top:clamp(48px,6vw,80px);padding:20px 0;border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);font-size:15px;color:#cfcfc8}
.footer-rebuild a{color:var(--bone);font-weight:600;white-space:nowrap}
.footer-row{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;margin-top:40px}
.footer-row .wordmark{width:96px}
.footer-tagline{margin-top:12px;font-size:14px;color:var(--mute-dark)}
.site-footer nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:0 28px;max-width:640px}
.site-footer nav a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;text-decoration:none;color:#cfcfc8}
.site-footer nav a:hover{color:var(--bone);text-decoration:underline}
.copyright{margin-top:40px;font-size:13px;color:var(--mute-dark)}
.analytics-preferences{margin-top:12px}

/* Inner pages: a dark page hero under the header, then light, sand or dark sections. */
.page-hero{position:relative;overflow:hidden;background:var(--ink);color:var(--bone);padding:clamp(140px,15vw,210px) 0 clamp(64px,8vw,112px)}
.page-mega{position:absolute;left:-.02em;right:0;bottom:-.08em;margin:0;font:400 clamp(160px,28vw,460px)/.78 var(--display);color:rgba(245,245,240,.045);white-space:nowrap;pointer-events:none;user-select:none}
.page-hero .shell{position:relative;z-index:1}
.page-hero h1{font:400 clamp(60px,9vw,148px)/.86 var(--display);text-transform:uppercase;letter-spacing:.005em;max-width:12ch}
.page-hero .lead{color:#d9d9d2;max-width:40ch}
.page-status{display:flex;align-items:center;gap:10px;margin-bottom:24px;color:var(--mute-dark);font:600 11px/1.3 var(--body);text-transform:uppercase;letter-spacing:.14em}
.page-status::before{content:'';width:16px;height:2px;background:var(--oxblood)}
.section{padding:var(--section) 0}
.section.alt{background:var(--sand)}
.section.on-dark{background:var(--ink);color:var(--bone)}
.section-head{max-width:760px}
.section-head h2{max-width:14ch}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,7vw,120px);align-items:start}

/* Long-form text (guides, privacy) */
.prose{max-width:68ch}
.prose h2{font-size:clamp(36px,4.2vw,56px);line-height:.95;margin:64px 0 18px;max-width:none}
.prose h2:first-child{margin-top:0}
.prose h3{font:600 13px/1.3 var(--body);text-transform:uppercase;letter-spacing:.14em;margin:36px 0 12px}
.prose p,.prose li{font-size:17px;line-height:1.7;color:#2b2b28}
.prose p+p{margin-top:16px}
.prose ul,.prose ol{margin:12px 0 0;padding-left:22px}
.prose li+li{margin-top:8px}
.prose a{font-weight:600}
.on-dark .prose p,.on-dark .prose li{color:#cfcfc8}

/* Stacked, labelled forms */
.form-stack form{display:grid;gap:8px}
.form-stack label{margin-top:16px;font:600 12px/1.3 var(--body);text-transform:uppercase;letter-spacing:.14em}
.form-stack label:first-of-type{margin-top:0}
.form-stack .button{margin-top:20px;width:100%}
.form-hint{font-size:13px;line-height:1.5;color:var(--mute-light)}
.label-optional{margin-left:8px;color:var(--mute-light);font-weight:500;letter-spacing:.06em}

.text-link{font-weight:600;text-decoration:underline;text-underline-offset:5px}
.on-dark .text-link{color:var(--bone)}

@media(max-width:899px){
  .split{grid-template-columns:1fr}
}
@media(max-width:699px){
  .site-header{height:60px}
  .wordmark{width:92px}
  .site-header .nav-link{display:none}
  .nav-join{min-height:38px;padding:0 12px}
  .button{min-height:52px}
  .field{min-height:52px}
  .footer-row{flex-direction:column}
  .site-footer nav{justify-content:flex-start;gap:0 22px}
  .page-hero{padding-top:120px}
  .page-mega{font-size:52vw}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important;animation:none!important}
}

/* fleks-tee01.css */
/* FLEKS homepage, Tee 01. Built on fleks-base.css; scripts/styles.cjs bundles both with fleks-analytics.css into fleks-home.css. */

/* Social arrival bar: shown by the inline script in index.html only to visitors from Instagram, Facebook, TikTok or YouTube
   (or ?from=ig|tt|yt), otherwise it stays hidden and takes no space. It sits in normal flow above the header, which takes its
   static position under it, so it never covers the header, the 3D tee or the mobile sticky bar. */
.social-bar{position:relative;z-index:11;display:flex;align-items:stretch;padding:0 max(4px,calc(var(--gutter) - 12px));background:var(--bone);color:var(--ink);border-bottom:1px solid var(--stone)}
.social-bar~.site-header{top:auto}
.social-bar-link{flex:1;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:2px 8px;min-height:44px;padding:8px 0 8px 44px;font:500 14px/1.35 var(--body);text-decoration:none}
.social-bar-link::before{content:'';flex:none;width:16px;height:2px;margin-right:2px;background:var(--oxblood)}
.social-bar-link strong{font-weight:600;white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.social-bar-link strong span{display:inline-block;transition:transform .2s var(--ease)}
.social-bar-link:hover strong span{transform:translateX(3px)}
.social-bar-close{flex:none;display:grid;place-items:center;width:44px;min-height:44px;padding:0;border:0;background:transparent;color:var(--ink);cursor:pointer}
.social-bar-close:hover{color:var(--oxblood)}
.social-bar :focus-visible{outline-color:var(--ink);outline-offset:-4px}
/* Keep the first screen the same at every width: the hero (desktop) or the tee (phone) gives back the bar's 45px,
   so the signup form and its "Free. No payment." note sit exactly where they do without the bar. */
@media(min-width:700px){
  .social-bar:not([hidden])~main .hero{min-height:clamp(640px,calc(100svh - 45px),1000px)}
  .social-bar:not([hidden])~main .tee-frame{width:min(100%,calc(min(100svh,1000px) - 85px),900px)}
}
@media(max-width:699px){
  .social-bar{padding:0 4px 0 16px}
  .social-bar-link{justify-content:flex-start;padding-left:0;font-size:13px}
  .social-bar:not([hidden])~main .tee-frame{width:min(100%,46svh - 45px)}
  .social-bar:not([hidden])~main .render-label{top:calc(52px + min(100vw,46svh - 45px) - 8px)}
}
/* One line down to 360px wide: drop the decorative tick on narrow phones. */
@media(max-width:399px){.social-bar-link::before{display:none}}

/* Hero */
.hero{position:relative;overflow:hidden;background:var(--ink);color:var(--bone);min-height:clamp(640px,100svh,1000px);display:flex;align-items:flex-end}
.hero-mega{position:absolute;left:-.02em;right:0;top:50%;transform:translateY(-54%);margin:0;font:400 clamp(220px,38vw,620px)/.78 var(--display);color:rgba(245,245,240,.045);white-space:nowrap;pointer-events:none;user-select:none;letter-spacing:-.01em}
.hero-stage{position:absolute;top:0;right:0;bottom:0;width:58%;display:flex;align-items:center;justify-content:center}
.tee-frame{position:relative;width:min(100%,calc(min(100svh,1000px) - 40px),900px);aspect-ratio:1;touch-action:pan-y;cursor:grab;-webkit-user-select:none;user-select:none}
.tee-frame[data-dragging]{cursor:grabbing}
.tee-frame:focus-visible{outline:2px solid var(--bone);outline-offset:-2px}
.tee-frame::before{content:'';position:absolute;inset:8% 10%;background:radial-gradient(closest-side,rgba(245,245,240,.075),rgba(245,245,240,0));pointer-events:none}
.tee-poster,.tee3d-canvas{position:absolute;inset:0;width:100%;height:100%}
.tee-poster{object-fit:contain;transition:opacity .8s var(--ease);pointer-events:none;-webkit-user-drag:none;user-select:none}
.tee3d-canvas{opacity:0;transition:opacity .8s var(--ease)}
.tee-frame[data-tee3d=ready] .tee3d-canvas{opacity:1}
.tee-frame[data-tee3d=ready] .tee-poster{opacity:0}
.render-label{position:absolute;right:var(--gutter);bottom:32px;z-index:2;color:var(--mute-dark);font-size:11px}
.render-label::before{content:'';display:inline-block;width:16px;height:2px;margin-right:10px;vertical-align:middle;background:var(--oxblood)}
.drag-hint{display:none}
.tee-frame[data-tee3d=ready]~.render-label .drag-hint,.hero-stage[data-ready] .drag-hint{display:inline}
.hero-copy{position:relative;z-index:2;width:100%;max-width:var(--max);margin:0 auto;padding:140px var(--gutter) clamp(56px,8vh,96px)}
/* The copy box spans the hero; let pointers through to the tee except on the headline and form. */
.hero-copy{pointer-events:none}
.hero-copy>*{pointer-events:auto}
.hero h1{max-width:min(46vw,760px)}
.hero-display{display:block;font:400 clamp(64px,9vw,148px)/.86 var(--display);text-transform:uppercase;letter-spacing:.005em}
.hero-kicker{display:block;margin-top:22px;max-width:30ch;font:500 clamp(17px,1.5vw,21px)/1.45 var(--body);color:#d9d9d2}
.hero-signup{margin-top:34px;max-width:620px}
.hero-form{display:grid;grid-template-columns:minmax(150px,190px) minmax(0,1fr) auto}
.hero-form .field{border-right-width:0}
.hero-form .form-status{grid-column:1/-1}

/* Problem */
.problem{padding:var(--section) 0;background:var(--bone)}
.problem h2{max-width:11ch}
.sizes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,5vw,80px);margin-top:clamp(48px,6vw,88px);max-width:980px;border-top:1px solid var(--stone)}
.size-row{display:flex;gap:20px;align-items:flex-start;padding-top:24px}
.size-tag{flex:none;display:inline-grid;place-items:center;min-width:58px;height:34px;padding:0 10px;border:1.5px solid var(--ink);font:400 22px/1 var(--display);letter-spacing:.04em}
.size-row p{font-size:17px;line-height:1.5;max-width:30ch;padding-top:4px}
.problem-kicker{margin-top:clamp(40px,5vw,64px);font:600 clamp(18px,1.55vw,22px)/1.3 var(--body)}
.problem-kicker span{color:var(--mute-light);font-weight:500}

/* Spec */
/* Spec board: the photo sits in the middle 40%, callouts either side, leader lines drawn in a 100x50 SVG over the board. */
.spec{padding:var(--section) 0;background:#ece7de}
.spec-head{max-width:760px;margin:0 auto;text-align:center}
.spec-head h2{max-width:none}
.spec-head .lead{margin:22px auto 0;max-width:40ch}
.spec-board{position:relative;max-width:1240px;margin:clamp(40px,5vw,72px) auto 0;aspect-ratio:100/50}
.spec-shot{position:absolute;top:0;left:30%;width:40%;height:100%}
.spec-photo{position:relative;height:100%}
.spec-shot img{display:block;width:100%;height:100%;object-fit:cover;-webkit-mask-image:radial-gradient(ellipse 60% 58% at 50% 50%,#000 62%,transparent 98%);mask-image:radial-gradient(ellipse 60% 58% at 50% 50%,#000 62%,transparent 98%)}
.spec-pins{position:absolute;inset:0;z-index:2;margin:0;padding:0;list-style:none;pointer-events:none}
.spec-pins li{position:absolute;left:calc(var(--x) * 1%);top:calc(var(--y) * 1%);display:grid;place-items:center;width:22px;height:22px;transform:translate(-50%,-50%);border-radius:50%;background:var(--bone);color:var(--ink);font:600 11px/1 var(--body);box-shadow:0 0 0 1px var(--ink),0 0 0 3px rgba(236,231,222,.6)}
.spec-leaders{position:absolute;inset:0;z-index:1;width:100%;height:100%;overflow:visible;pointer-events:none}
.spec-leaders line{vector-effect:non-scaling-stroke}
.leader-halo line{stroke:rgba(236,231,222,.85);stroke-width:3}
.leader-line line{stroke:var(--ink);stroke-width:1}
.spec-callouts{margin:0}
.callout{position:absolute;top:calc(var(--y) * 1%);width:26%;transform:translateY(-11px)}
.callout[data-side=left]{left:0;text-align:right}
.callout[data-side=right]{right:0}
.callout dt{display:flex;align-items:center;gap:10px;font:400 clamp(24px,2.2vw,32px)/1 var(--display);text-transform:uppercase;letter-spacing:.01em}
.callout[data-side=left] dt{justify-content:flex-end}
.callout-no{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1px solid var(--ink);font:600 11px/1 var(--body)}
.callout[data-side=left] .callout-no{order:2}
.callout dd{margin:8px 0 0;font-size:16px;line-height:1.45;color:#3d3d38}

/* Active fix: its pin, line and callout come forward, the rest step back. Set by fleks-spec.js. */
.spec-pins li,.callout,.leader-line line{transition:opacity .35s var(--ease),transform .35s var(--ease),background-color .35s,color .35s,stroke-width .35s}
.spec-board[data-active] .spec-pins li{opacity:.55}
.spec-board[data-active] .callout{opacity:.4}
.spec-board[data-active="1"] .spec-pins li[data-n="1"],
.spec-board[data-active="2"] .spec-pins li[data-n="2"],
.spec-board[data-active="3"] .spec-pins li[data-n="3"],
.spec-board[data-active="4"] .spec-pins li[data-n="4"]{opacity:1;transform:translate(-50%,-50%) scale(1.3);background:var(--ink);color:var(--bone);box-shadow:0 0 0 1px var(--bone),0 0 0 6px rgba(15,15,14,.16)}
.spec-board[data-active="1"] .callout[data-n="1"],
.spec-board[data-active="2"] .callout[data-n="2"],
.spec-board[data-active="3"] .callout[data-n="3"],
.spec-board[data-active="4"] .callout[data-n="4"]{opacity:1}
.spec-board[data-active="1"] .leader-line line[data-n="1"],
.spec-board[data-active="2"] .leader-line line[data-n="2"],
.spec-board[data-active="3"] .leader-line line[data-n="3"],
.spec-board[data-active="4"] .leader-line line[data-n="4"]{stroke-width:2}
.spec-board figcaption{position:absolute;left:0;right:0;bottom:-44px;text-align:center;font-size:12px;color:var(--mute-light)}
@media(max-width:899px){
  .spec-head{text-align:left;margin:0}
  .spec-head .lead{margin-left:0}
  .spec-board{aspect-ratio:auto}
  /* The photo sticks under the top of the screen while the four fixes scroll past it. */
  .spec-shot{position:sticky;top:0;z-index:3;left:auto;width:auto;height:auto;margin:0 calc(var(--gutter) * -1);padding:12px var(--gutter) 10px;background:#ece7de}
  .spec-shot::after{content:'';position:absolute;left:0;right:0;top:100%;height:96px;background:linear-gradient(#ece7de 30%,rgba(236,231,222,0));pointer-events:none}
  .spec-photo{width:min(100%,calc(50svh * .8));height:auto;margin:0 auto}
  .spec-shot img{height:auto;aspect-ratio:4/5}
  .spec-leaders{display:none}
  .spec-callouts{display:block;margin-top:8px}
  .callout{position:static;width:auto;transform:none;text-align:left!important;min-height:34svh;display:flex;flex-direction:column;justify-content:center;padding:20px 0;border-bottom:1px solid #d3cdc1}
  .callout:last-child{border-bottom:0;margin-bottom:12svh}
  .callout dt{justify-content:flex-start!important;font-size:30px}
  .callout .callout-no{order:0!important;width:26px;height:26px;font-size:12px}
  .callout dd{margin-left:36px;font-size:17px}
  .spec-board[data-active="1"] .callout[data-n="1"] .callout-no,.spec-board[data-active="2"] .callout[data-n="2"] .callout-no,.spec-board[data-active="3"] .callout[data-n="3"] .callout-no,.spec-board[data-active="4"] .callout[data-n="4"] .callout-no{background:var(--ink);color:var(--bone)}
  .spec-board figcaption{position:static;margin-top:0;text-align:left}
}

/* Founder */
.founder{padding:var(--section) 0;background:var(--ink);color:var(--bone)}
.founder-grid{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:clamp(40px,7vw,120px);align-items:end}
.founder-film video{width:100%;aspect-ratio:9/16;height:auto;object-fit:cover;background:var(--charcoal)}
.founder-film figcaption{margin-top:12px;font-size:13px;color:var(--mute-dark)}
.founder-transcript{margin-top:8px;border-top:1px solid var(--line-dark)}
.founder-transcript summary{display:flex;justify-content:space-between;align-items:center;min-height:52px;font-size:14px;font-weight:600;cursor:pointer;list-style:none}
.founder-transcript summary::-webkit-details-marker{display:none}
.founder-transcript p{padding-bottom:16px;font-size:15px;color:#cfcfc8}
.founder-copy h2{max-width:9ch}
.founder-copy .lead{color:#d9d9d2;max-width:36ch}
.build-log{margin-top:48px;border-top:1px solid var(--line-dark);max-width:520px}
.build-log li{display:grid;grid-template-columns:72px minmax(0,1fr);gap:16px;padding:16px 0;border-bottom:1px solid var(--line-dark);font-size:15px;line-height:1.5}
.build-log ol{list-style:none;margin:0;padding:0}
.build-log .label{line-height:1.9;color:var(--mute-dark)}
.build-log .now .label{color:var(--bone)}
.build-log .now .label::after{content:'';display:inline-block;width:6px;height:6px;margin-left:8px;border-radius:50%;background:#c9473f;vertical-align:2px}

/* Reserve */
.reserve{padding:var(--section) 0;background:var(--bone)}
.reserve-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:clamp(40px,7vw,120px);align-items:start}
.reserve-copy{position:sticky;top:48px}
.reserve-copy h2{max-width:8ch}
.final-signup form{display:grid;gap:8px}
.final-signup label{margin-top:16px;font:600 12px/1.3 var(--body);text-transform:uppercase;letter-spacing:.14em}
.final-signup label:first-of-type{margin-top:0}
.final-signup .button{margin-top:20px;width:100%}
.faq{grid-column:2;margin-top:clamp(56px,6vw,96px)}
.founder-transcript summary span{font-size:22px;font-weight:400;line-height:1;transition:transform .2s var(--ease)}
.founder-transcript[open] summary span{transform:rotate(45deg)}

/* Mobile sticky bar: fleks-site-v2.js shows it between the hero and the reserve form */
.mobile-join{display:none}

@media(max-width:1099px){
  .hero-stage{width:52%}
  .hero h1{max-width:52vw}
  .hero-form{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}
  .hero-form input.field{border-right-width:1px}
  .hero-form .button{grid-column:1/-1;margin-top:8px}
  .founder-grid{grid-template-columns:1fr}
  .founder-film{max-width:420px}
  .reserve-grid{grid-template-columns:1fr}
  .reserve-copy{position:static}
  .faq{grid-column:auto;margin-top:72px}
}
@media(max-width:699px){
  .hero{display:block;min-height:0}
  .hero-mega{top:22svh;font-size:58vw}
  .hero-stage{position:relative;width:100%;height:auto;padding-top:52px}
  .tee-frame{width:min(100%,46svh)}
  .render-label{right:auto;left:var(--gutter);bottom:auto;top:calc(52px + min(100vw,46svh) - 8px);font-size:10px}
  .hero-copy{padding:28px var(--gutter) 48px}
  .hero h1{max-width:none}
  .hero-display{font-size:clamp(56px,17.5vw,84px)}
  .hero-kicker{margin-top:14px;font-size:17px}
  .hero-signup{margin-top:22px}
  /* "Your size" shows in full from 320px wide: the size column keeps the width it needs and the text may run closer to the arrow. */
  .hero-form{grid-template-columns:minmax(130px,.9fr) minmax(0,1.5fr)}
  .hero-form select.field{padding-right:36px}
  .sizes{grid-template-columns:1fr}
  .size-row{padding:20px 0;border-bottom:1px solid var(--stone)}
  .build-log li{grid-template-columns:60px minmax(0,1fr)}
  .site-footer{padding-bottom:96px}
  .mobile-join{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px max(10px,env(safe-area-inset-bottom));background:var(--ink);color:var(--bone);border-top:1px solid var(--line-dark)}
  .mobile-join>span{font:600 11px/1.4 var(--body);text-transform:uppercase;letter-spacing:.12em;color:var(--mute-dark)}
  .mobile-join .button{min-height:46px}
}

/* fleks-analytics.css */
/* The choice takes normal document space and never covers a form or purchase bar. */
.analytics-choice{background:#ece8df;color:#292923;padding:16px max(20px,calc((100% - 1136px)/2));display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #d7d1c5;font:14px/1.5 var(--body)}
.analytics-choice[hidden]{display:none!important}.analytics-choice p{margin:0}.analytics-choice p strong{font-weight:600}.analytics-choice a{font-size:13px;color:#565248;text-underline-offset:3px}.analytics-choice-actions{display:flex;gap:8px;flex-shrink:0}.analytics-choice button{font:600 13px/1.3 var(--body);min-height:42px;padding:10px 14px;border:1px solid #5d574e;background:transparent;color:#292923;cursor:pointer}.analytics-choice button:first-child{background:#872f36;color:#fff;border-color:#872f36}.analytics-preferences{font:14px/1.5 var(--body);background:none;border:0;color:#bebbb1;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:4px;min-height:32px}.analytics-preferences:focus-visible,.analytics-choice button:focus-visible{outline:3px solid #af4650;outline-offset:3px}
@media(max-width:700px){.analytics-choice{display:block;padding:13px 20px}.analytics-choice-actions{margin-top:10px}.analytics-choice button{flex:1}.analytics-choice a{display:inline-block;margin-top:3px}.analytics-preferences{min-height:36px}}