/* Dibs · loud version · poster run · draft for Stephen */
@font-face{font-family:"Switzer";src:url("/fonts/Switzer-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Geist";src:url("/fonts/Geist-var.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Paper Mono";src:url("/fonts/PaperMono-var.woff2") format("woff2");font-weight:100 800;font-style:normal;font-display:swap}
:root{--ink:#111111;--paper:#FFFFFF;--red:#FF3B1F;--red-700:#C8260B;--blush:#FFD8CC;--ice:#DCE3FF;--cobalt:#2442F5;--warm:#FFA21F;--cooling:#9BB0C4;--grey-200:#D9D9D9;--grey-600:#6B6B6B;--grey-800:#3A3A3A;
--display:"Switzer","Helvetica Neue",Arial,sans-serif;--text:"Geist",system-ui,sans-serif;--mono:"Paper Mono",ui-monospace,Consolas,monospace;--g:clamp(16px,2.6vw,40px);--line:rgba(255,59,31,.22)}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--text);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;font-synthesis:none;overflow-x:clip}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:.18em}
p,h1,h2,h3,figure{margin:0}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--cobalt);outline-offset:3px}
.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{position:absolute;left:16px;top:-80px;z-index:50;background:var(--ink);color:#fff;padding:12px 20px;border-radius:999px;font-weight:600;text-decoration:none}.skip:focus{top:16px}
.mono{font-family:var(--mono);font-weight:500;font-size:12px;line-height:16px;letter-spacing:.04em;text-transform:uppercase}
.d{font-family:var(--display);font-weight:700;letter-spacing:-.035em;line-height:.82}
.fit{display:block;white-space:nowrap;width:max-content}
.stop{color:var(--red)}
.poster{position:relative;min-height:100svh;padding:var(--g);display:flex;flex-direction:column;justify-content:space-between;gap:32px;overflow:hidden;isolation:isolate}
.grid::before{content:"";position:absolute;z-index:-1;inset:0 var(--g);pointer-events:none;border-right:1px solid var(--line);background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px calc(100% / 6))}
.row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0 var(--g);align-items:start}
.non-mobile{display:inline}.mobile-only{display:none}

/* Top bar */
.bar{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--g);align-items:start}
.bar .brand img{height:30px;width:auto}
.bar__join{justify-self:end;text-decoration:none;display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:#fff;border-radius:999px;padding:10px 16px}
.bar__join:hover{background:var(--red);color:var(--ink)}

/* Hero */
.hero__words{display:flex;flex-direction:column;gap:clamp(4px,1vw,14px)}
.hero__lead{grid-column:1 / span 3;font-size:clamp(18px,1.5vw,22px);line-height:1.4;max-width:30ch}
.hero__form{grid-column:4 / span 3;justify-self:end;width:100%;max-width:560px}
.pulse{display:inline-block;animation:onair 2.6s ease-in-out infinite}
@keyframes onair{0%,100%{opacity:1}55%{opacity:.25}}
.tag{position:absolute;z-index:1}
.tag--a{right:var(--g);top:38%}

/* Form */
.join{position:relative}
.join__line{display:flex;align-items:center;background:#fff;border:3px solid var(--ink);border-radius:999px;padding:5px}
.join__line:focus-within{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--cobalt)}
.join__input{flex:1;min-width:0;height:54px;border:0;background:transparent;padding:0 12px 0 20px;font:inherit;font-size:17px;color:var(--ink);border-radius:999px}
.join__input::placeholder{color:var(--grey-600)}
.join__input:focus{outline:none}
.join__button{height:54px;padding:0 26px;border:0;border-radius:999px;background:var(--ink);color:#fff;font:inherit;font-weight:600;font-size:16px;white-space:nowrap;cursor:pointer}
.join__button:hover{background:var(--red);color:var(--ink)}
.join__button:disabled{opacity:.75;cursor:progress}
.join[data-state="success"] .join__line{display:none}
.join__error{display:flex;align-items:center;gap:10px;width:fit-content;max-width:100%;margin-top:12px;padding:10px 18px;border-radius:18px;background:var(--ink);color:#fff;font-size:15px;font-weight:500}
.join__error::before{content:"";width:8px;height:8px;border-radius:999px;background:var(--red);flex:0 0 auto}
.join__success{display:flex;align-items:center;gap:12px;width:fit-content;max-width:100%;padding:16px 24px;border-radius:999px;background:var(--ink);color:#fff;font-weight:600}
.join__success:focus{outline:none}
.join__help{margin-top:12px;font-size:14px;color:var(--grey-800)}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.dot{display:inline-block;flex:0 0 auto;width:10px;height:10px;border-radius:999px;background:var(--red)}
.dot--white{background:#fff}

/* Ticker */
.ticker{background:var(--ink);color:#fff;overflow:hidden;border-top:1px solid var(--ink)}
.ticker__track{display:flex;width:max-content;animation:tick 48s linear infinite}
.ticker:hover .ticker__track{animation-play-state:paused}
.ticker__set{display:flex;align-items:center;gap:28px;padding:20px 14px 20px 0;white-space:nowrap}
.ticker__item{display:inline-flex;align-items:center;gap:12px}
.ticker__item .dot--muted{background:#6B6B6B}
.ticker__item .dot--cool{background:var(--cooling)}
.ticker__item .dot--warm{background:var(--warm)}
@keyframes tick{to{transform:translateX(-50%)}}

/* 02 · Times · cobalt */
.times{background:var(--cobalt);color:#fff}
.times{--line:rgba(220,227,255,.16)}.verbs{--line:rgba(17,17,17,.14)}.product{--line:rgba(36,66,245,.14)}.data{--line:rgba(255,255,255,.1)}.close{--line:rgba(17,17,17,.14)}
.times__label,.verbs__label,.temp__label,.data__label{color:inherit;opacity:.85}
.times__head{font-size:clamp(44px,6.4vw,110px)}
.times__list{display:flex;flex-direction:column;border-top:2px solid rgba(220,227,255,.4)}
.time{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,2fr);gap:var(--g);align-items:end;border-bottom:2px solid rgba(220,227,255,.4);padding:clamp(6px,1vw,14px) 0}
.time__n{font-size:clamp(88px,23vw,400px);line-height:.8;letter-spacing:-.045em}
.time--late .time__n{color:#5B73FF}
.time__who{display:flex;align-items:center;gap:12px;padding-bottom:clamp(8px,1.4vw,24px);color:var(--ice)}
.time--first .time__who{color:#fff}
.times__note{grid-column:4 / span 3;color:var(--ice);font-size:clamp(17px,1.4vw,20px);line-height:1.45;max-width:38ch}

/* 03 · Verbs · on-air red */
.verbs{background:var(--red);color:var(--ink)}
.verbs__head{font-size:clamp(40px,5.2vw,88px);max-width:16ch}
.verbs__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--g);align-items:stretch}
.verb{display:flex;gap:clamp(12px,1.6vw,28px);align-items:flex-end;border-top:3px solid var(--ink);padding-top:16px}
.verb__word{writing-mode:vertical-rl;transform:rotate(180deg);font-size:clamp(88px,11.5vh,168px);line-height:.8;white-space:nowrap}
.verb__body{display:flex;flex-direction:column;gap:10px;padding-bottom:6px}
.verb__title{font-family:var(--display);font-weight:700;font-size:clamp(22px,1.9vw,30px);line-height:1.08;letter-spacing:-.02em}
.verb__desc{font-size:16px;line-height:1.5;max-width:30ch}

/* 04 · Temperature · paper */
.temp__head{font-size:clamp(48px,8vw,140px)}
.temps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.t{display:flex;flex-direction:column;gap:16px}
.t__dot{aspect-ratio:1;border-radius:999px;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700;font-size:clamp(28px,3.6vw,60px);letter-spacing:-.03em}
.t--hot .t__dot{background:var(--red)}.t--warm .t__dot{background:var(--warm)}.t--cooling .t__dot{background:var(--cooling)}.t--cold .t__dot{background:var(--cobalt);color:#fff}
.t__copy{display:flex;flex-direction:column;gap:4px;padding-right:var(--g)}
.t__copy p:first-child{font-weight:600}
.t__copy .mono{color:var(--grey-600)}

/* 05 · Product · ice */
.product{background:var(--ice)}
.product__head{font-size:clamp(48px,8vw,140px);color:var(--cobalt)}
.product__desc{grid-column:5 / span 2;font-size:clamp(17px,1.4vw,20px);line-height:1.45}
.shortlist{background:#fff;border:1px solid #B7C4FA;border-radius:28px;padding:clamp(18px,2.4vw,36px)}
.shortlist__head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid var(--grey-200)}
.shortlist__title{font-family:var(--display);font-weight:700;font-size:clamp(24px,2.4vw,36px);letter-spacing:-.02em;line-height:1.1}
.srow{display:grid;grid-template-columns:minmax(200px,1.2fr) minmax(0,1.3fr) auto auto auto;gap:18px;align-items:center;padding:16px 0;border-bottom:1px solid #EEEEEE}
.srow:last-child{border-bottom:0}
.person{display:flex;align-items:center;gap:14px}
.avatar{display:grid;place-items:center;width:44px;height:44px;border-radius:999px;background:#EEEEEE;font-weight:600;font-size:14px;flex:0 0 auto}
.person__name{font-weight:600}.person__role{font-size:14px;color:var(--grey-600)}
.srow__note{font-size:15px;color:var(--grey-800)}
.pill{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 14px;border-radius:999px;border:1px solid var(--grey-200);font-size:14px;font-weight:500;white-space:nowrap}
.pill .dot{width:8px;height:8px}
.chip{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 13px;border-radius:999px;border:1px solid var(--grey-200);font-family:var(--mono);font-weight:500;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.chip .dot{width:7px;height:7px}.dot--ink{background:var(--ink)}.dot--warm{background:var(--warm)}.dot--cooling{background:var(--cooling)}
.reply{display:inline-flex;align-items:center;height:40px;padding:0 18px;border-radius:999px;background:var(--ink);color:#fff;font-weight:600;font-size:15px}

/* 06 · Data · ink */
.data{background:var(--ink);color:#fff}
.data__lead{grid-column:1 / span 3;font-size:clamp(17px,1.4vw,20px);line-height:1.5;color:#BDBDBD;max-width:40ch}
.data__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--g)}
.data__col{border-top:2px solid #fff;padding-top:16px;display:flex;flex-direction:column;gap:10px}
.data__col h3{font-family:var(--display);font-weight:700;font-size:clamp(22px,1.9vw,30px);line-height:1.08;letter-spacing:-.02em}
.data__col p{color:#BDBDBD;font-size:16px;line-height:1.5;max-width:34ch}

/* 07 · Close · red */
.close{background:var(--red);color:var(--ink)}
.close__lead{grid-column:1 / span 3;font-size:clamp(19px,1.6vw,24px);line-height:1.4;max-width:28ch}
.close__form{grid-column:4 / span 3;justify-self:end;width:100%;max-width:560px}
.close .join__help,.close .join__help a{color:var(--ink)}

/* Footer */
.foot{padding:var(--g)}
.foot__meta{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;font-size:14px;color:var(--grey-600)}
.foot__meta a{color:var(--ink)}
.foot__links{display:flex;gap:24px;flex-wrap:wrap}
.foot__mark{width:100%;height:auto;margin-top:clamp(32px,4vw,64px)}

/* Reveal (only when motion is allowed and JS is running) */
.motion [data-reveal]{opacity:0;transform:translateY(48px);transition:opacity .7s ease-out,transform .9s cubic-bezier(.2,.7,0,1)}
.motion [data-reveal].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.pulse,.ticker__track{animation:none}.motion [data-reveal]{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

/* Tablet and phone */
@media (max-width:1000px){
  .bar{grid-template-columns:1fr auto}.bar .hide-s{display:none}
  .srow{grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"person temp act" "note own own";row-gap:10px}
  .srow .person{grid-area:person}.srow__note{grid-area:note}.srow__temp{grid-area:temp;justify-self:end}.srow__own{grid-area:own;justify-self:end}.srow__act{grid-area:act}
  .verbs__cols{grid-template-columns:minmax(0,1fr);gap:28px}
  .verb__word{writing-mode:horizontal-tb;transform:none;display:block;width:max-content;white-space:nowrap;font-size:clamp(72px,24vw,220px);line-height:.8;padding-top:4px}
  .verb{flex-direction:column;align-items:stretch;gap:18px;padding-top:14px}
  .verb__body{gap:8px}
  .verb__body .mono{display:none}
  .verb__title::before{content:attr(data-n);font-family:var(--mono);font-weight:500;font-size:12px;letter-spacing:.04em;margin-right:12px;vertical-align:middle}
  .temps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}
  .data__cols{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:700px){
  .non-mobile{display:none}.mobile-only{display:inline}
  .bar{grid-template-columns:1fr auto}
  .bar .hide-s{display:none}
  .hero__lead,.hero__form,.times__note,.product__desc,.data__lead,.close__lead,.close__form{grid-column:1 / -1}
  .row{row-gap:24px}
  .tag--a{display:none}
  .join__line{flex-direction:column;align-items:stretch;border-radius:28px;padding:6px;gap:6px}
  .join__button{width:100%}
  .time{grid-template-columns:minmax(0,1fr)}
  .time__who{padding-bottom:4px}
  .srow{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"person person act" "note note note" "temp own own";column-gap:10px}
  .srow__own,.srow__temp{justify-self:start}
}

/* Fallback sizes before the fit script runs */
.w-get{font-size:24vw}.w-first{font-size:31vw}.w-call{font-size:27vw}.w-yours{font-size:11vw}

.stop-w{color:#fff}
.dot--dim{background:rgba(220,227,255,.55)}
.dot--muted{background:#6B6B6B}
.product__row{align-items:end}
.product__head{grid-column:1 / span 4}
.bar p:empty{min-height:1px}
.ticker .dot--white{background:#fff}

.times__head,.verbs__head,.temp__head,.product__head{line-height:.9}
.fit .stop,.fit .stop-w{letter-spacing:0}


/* ===== v10 · multi-page site · 25 Oct 2026 ===== */
.bar .nav{grid-column:2 / span 3;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.nav a{font-family:var(--mono);font-weight:500;font-size:12px;line-height:16px;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;padding:9px 13px;border-radius:999px;border:1.5px solid var(--ink);white-space:nowrap}
.nav a:hover{background:var(--red)}
.nav a[aria-current="page"]{background:var(--ink);color:#fff}
.bar__note{grid-column:5}
.bar__join{grid-column:6}
.bar--plain{display:flex;justify-content:space-between;gap:var(--g)}
.price-tag{display:inline-flex;align-items:center;width:fit-content;padding:6px 12px;border-radius:999px;background:var(--ink);color:#fff}
.more{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 22px;border-radius:999px;background:var(--ink);color:#fff;text-decoration:none;font-weight:600}
.more::after{content:"";width:10px;height:10px;border-radius:999px;background:var(--red)}
.more:hover{background:#fff;color:var(--ink)}
.head{font-size:clamp(44px,6.4vw,110px);line-height:.9;max-width:18ch}
.small{font-size:14px;color:var(--grey-800);max-width:60ch}

/* Pricing · prices on red */
.prices-sec{background:var(--red);color:var(--ink);--line:rgba(17,17,17,.14)}
.prices{display:flex;flex-direction:column;border-top:3px solid var(--ink)}
.price{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--g);align-items:end;border-bottom:3px solid var(--ink);padding:clamp(10px,1.4vw,20px) 0}
.price__n{font-size:clamp(72px,11vw,200px);line-height:.8;letter-spacing:-.045em;white-space:nowrap}
.price__copy{display:flex;flex-direction:column;gap:8px;padding-bottom:6px}
.price__copy h3{font-family:var(--display);font-weight:700;font-size:clamp(22px,2vw,32px);line-height:1.08;letter-spacing:-.02em}
.price__copy p{max-width:46ch}
.time__n--money{font-size:clamp(64px,14vw,250px)}

/* Rules · paper */
.rules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px var(--g)}
.rule{border-top:2px solid var(--ink);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.rule h3{font-family:var(--display);font-weight:700;font-size:clamp(22px,1.9vw,30px);line-height:1.08;letter-spacing:-.02em}
.rule p:last-child{max-width:34ch}

/* Recruiters · clients on cobalt */
.clients{background:var(--cobalt);color:#fff;--line:rgba(220,227,255,.16)}

/* Architects · steps on cobalt, tools on red */
.steps-sec{background:var(--cobalt);color:#fff;--line:rgba(220,227,255,.16)}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--g)}
.step{border-top:2px solid rgba(220,227,255,.4);padding-top:12px;display:flex;flex-direction:column;gap:10px}
.step__n{font-size:clamp(88px,13vw,240px);line-height:.8;letter-spacing:-.045em}
.step h3{font-family:var(--display);font-weight:700;font-size:clamp(22px,1.9vw,30px);line-height:1.08;letter-spacing:-.02em}
.step p:last-child{color:var(--ice);max-width:32ch}
.tools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--g)}
.tool{border-top:3px solid var(--ink);padding-top:16px;display:flex;flex-direction:column;gap:10px}
.tool h3{font-family:var(--display);font-weight:700;font-size:clamp(24px,2.4vw,40px);line-height:1;letter-spacing:-.03em}
.tool p:last-child{max-width:28ch}

/* Fallback sizes for fit lines before the script runs */
.hero__words .fit{font-size:22vw}
.data .fit,.clients .fit{font-size:9vw}
.close .fit{font-size:27vw}

@media (max-width:1000px){
  .bar .nav{grid-column:1 / -1;grid-row:2;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--g) * -1);padding:0 var(--g)}
  .bar .nav::-webkit-scrollbar{display:none}
  .bar__join{grid-column:2;grid-row:1}
  .rules{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps{grid-template-columns:minmax(0,1fr);gap:28px}
  .tools{grid-template-columns:repeat(2,minmax(0,1fr))}
  .price{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:700px){
  .rules,.tools{grid-template-columns:minmax(0,1fr)}
  .bar--plain{flex-direction:column;gap:8px}
}

/* Giant type never blocks clicks; forms sit above it */
.fit,.hero__words,.time__n,.price__n,.step__n,.verb__word{pointer-events:none}
.hero .row,.close .row{position:relative;z-index:2}

/* Balanced headline breaks */
.head,.verbs__head,.times__head,.temp__head,.product__head{text-wrap:balance}
