/* 1N1 Scalez — generated by build_site.py from design/_parts. Do not edit by hand. */
html{scroll-behavior:smooth}
body{margin:0;background:#EFEDE6}
a{color:inherit;text-decoration:none}
a:hover{color:inherit}

/* ---------- tokens + base ---------- */
.n1{--bone:#EFEDE6;--bone-2:#E4E1D6;--ink:#101012;--ink-2:#1B1B20;--ink-soft:#55534E;--bone-soft:#A6A49C;--line:rgba(16,16,18,.16);--line-d:rgba(239,237,230,.2);--display:'Syne',system-ui,sans-serif;--body:'Schibsted Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;--mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;--ease:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.65,0,.35,1);--spring:cubic-bezier(.34,1.56,.64,1);--pad:clamp(20px,5vw,72px);--sec:clamp(80px,9vw,132px);width:100%;position:relative;overflow-x:clip;background:var(--bone);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;transition:background-color .9s var(--ease-io)}
.n1 *,.n1 *::before,.n1 *::after{box-sizing:border-box}
.n1 :where(h1,h2,h3,p,ul,ol,figure,blockquote){margin:0;padding:0}
.n1 :where(button){font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.n1 :where(input){font:inherit;color:inherit}
.n1 :focus-visible{outline:2px solid var(--hi);outline-offset:3px;border-radius:10px}
.n1 ::selection{background:var(--hi);color:var(--bone)}
.n1 :where(section){scroll-margin-top:64px}

/* acts: every section owns a colour; in live mode they go transparent and the ROOT morphs between them */
.act.bone{background:var(--bone);color:var(--ink)}
.act.ink{background:var(--ink);color:var(--bone)}
.act.hi{background:var(--hi);color:var(--bone)}
.live .act{background:transparent}
.live.act-bone{background:var(--bone)}
.live.act-ink{background:var(--ink)}
.live.act-hi{background:var(--hi)}

.tag{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:500}
.tag i{width:34px;height:34px;border:1.5px solid currentColor;border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-size:11px;font-style:normal}
.ink .tag{color:var(--hi-lite)}
.h2{font-family:var(--display);font-weight:800;font-size:clamp(34px,5vw,72px);line-height:1;letter-spacing:-.035em}
.ln{display:block;overflow:hidden;padding:.06em .1em .16em;margin:-.06em -.1em -.16em}
.ln.roomy{padding:.3em .34em .34em;margin:-.3em -.34em -.34em}
.ln-i{display:block;transform-origin:left bottom;will-change:transform}
.mono{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase}

.btn{display:inline-flex;align-items:center;gap:10px;border-radius:999px;padding:19px 32px;font-weight:600;font-size:16px;line-height:1;white-space:nowrap;transition:transform .35s var(--ease),background-color .35s,color .35s,border-color .35s}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:translate .35s var(--ease)}
.btn:hover svg{translate:3px -3px}
.btn-ink{background:var(--ink);color:var(--bone)}
.btn-ink:hover{background:var(--hi);color:var(--bone)}
.btn-line{border:1.5px solid currentColor}
.btn-line:hover{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.btn-bone{background:var(--bone);color:var(--ink)}
.btn-bone:hover{background:var(--ink);color:var(--bone)}

/* ---------- reveal system ---------- */
[data-rv="up"]{opacity:0;transform:translateY(38px);animation:rvFallback .6s 3s forwards}
[data-rv="fade"]{opacity:0;animation:rvFallback .6s 3s forwards}
[data-rv="pop"]{opacity:0;scale:.5;animation:rvFallbackPop .6s 3s forwards}
[data-rv="lines"] .ln-i{transform:translateY(112%) rotate(2deg);animation:rvFallback .6s 3s forwards}
@keyframes rvFallback{to{opacity:1;transform:none}}
@keyframes rvFallbackPop{to{opacity:1;scale:1}}
.js [data-rv],.js [data-rv="lines"] .ln-i{animation:none}
.js [data-rv="up"]{transition:opacity .9s var(--ease),transform 1.1s var(--ease);transition-delay:var(--d,0ms)}
.js [data-rv="fade"]{transition:opacity 1.2s var(--ease);transition-delay:var(--d,0ms)}
.js [data-rv="pop"]{transition:opacity .35s ease,scale .9s var(--spring);transition-delay:var(--d,0ms)}
.js [data-rv="lines"] .ln-i{transition:transform 1.1s var(--ease);transition-delay:calc(var(--li,0)*90ms + var(--d,0ms))}
.js [data-rv="up"].in,.js [data-rv="fade"].in{opacity:1;transform:none}
.js [data-rv="pop"].in{opacity:1;scale:1}
.js [data-rv="lines"].in .ln-i{transform:none}

@keyframes spin{to{rotate:360deg}}
@keyframes bob{0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes fadeUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes lineUp{from{transform:translateY(112%) rotate(2.5deg)}to{transform:none}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes popIn{0%{opacity:0;scale:.3}60%{opacity:1}100%{opacity:1;scale:1}}
@keyframes navIn{from{opacity:0;transform:translateY(-28px)}to{opacity:1;transform:none}}
@keyframes mq{to{transform:translateX(-100%)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--hi) 60%,transparent)}100%{box-shadow:0 0 0 12px transparent}}
@keyframes cue{0%{translate:0 0;opacity:0}30%{opacity:1}100%{translate:0 18px;opacity:0}}
.fu{animation:fadeUp .9s var(--ease) both;animation-delay:var(--d,0ms)}

/* ---------- cursor ---------- */
.cur{position:fixed;left:0;top:0;z-index:90;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fff;mix-blend-mode:difference;pointer-events:none;opacity:0;transition:opacity .3s,width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease)}
.cur.show{opacity:1}
.cur.big{width:68px;height:68px;margin:-34px 0 0 -34px}
@media not ((hover:hover) and (pointer:fine)){.cur{display:none}}

/* ---------- nav ---------- */
.nav{position:fixed;z-index:60;top:16px;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:8px;padding:0 16px;pointer-events:none;animation:navIn .9s var(--ease) .15s both}
.nav-in{pointer-events:auto;display:flex;align-items:center;gap:6px;padding:7px;border-radius:999px;background:color-mix(in srgb,var(--bone) 74%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--line);color:var(--ink);transition:background-color .7s,border-color .7s,color .7s,padding .5s var(--ease)}
.act-ink .nav-in,.act-hi .nav-in{background:color-mix(in srgb,var(--ink) 70%,transparent);border-color:var(--line-d);color:var(--bone)}
.logo{display:flex;align-items:center;gap:9px;padding:0 16px 0 12px;font-family:var(--display);font-weight:800;font-size:18px;letter-spacing:-.02em}
.logo svg{width:24px;height:24px;color:var(--hi);fill:currentColor;rotate:0deg;transition:rotate 1s var(--spring),color .7s}
.act-ink .logo svg{rotate:360deg}
.act-hi .logo svg{rotate:720deg}
.act-ink .logo svg,.act-hi .logo svg{color:var(--hi-lite)}
.act-hi .logo svg{color:var(--bone)}
.nav-links{display:flex;gap:2px}
.nav-links a{padding:11px 18px;border-radius:999px;font-size:14px;font-weight:500;transition:background-color .3s}
.nav-links a:hover{background:color-mix(in srgb,currentColor 12%,transparent)}
.nav-cta{background:var(--ink);color:var(--bone);padding:12px 22px;border-radius:999px;font-size:14px;font-weight:600;transition:background-color .4s,color .4s}
.act-ink .nav-cta,.act-hi .nav-cta{background:var(--bone);color:var(--ink)}
.nav-cta:hover{background:var(--hi);color:var(--bone)}
.nav-burger{display:none;width:44px;height:44px;border-radius:50%;place-items:center}
.nav-burger svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.nav-sheet{pointer-events:auto;display:none;flex-direction:column;gap:2px;width:min(360px,100%);padding:10px;border-radius:24px;background:var(--ink);color:var(--bone)}
.nav-sheet a{padding:14px 18px;border-radius:16px;font-family:var(--display);font-weight:700;font-size:20px}
.nav.open .nav-sheet{display:flex}

/* ---------- hero ---------- */
.hero{position:relative;min-height:min(100vh,940px);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:128px var(--pad) 84px;overflow:hidden}
.hero-ast{position:absolute;color:var(--ink);opacity:.07;fill:none;stroke:currentColor;stroke-width:1.1;stroke-linecap:round;animation:spin 70s linear infinite;translate:0 calc(var(--hy,0)*1px);pointer-events:none}
.hero-ast.a{width:min(46vw,620px);height:min(46vw,620px);left:-8%;top:6%}
.hero-ast.b{width:min(30vw,400px);height:min(30vw,400px);right:-5%;bottom:-6%;animation-duration:48s;animation-direction:reverse;translate:0 calc(var(--hy,0)*-.6px)}
.pill{display:inline-flex;align-items:center;gap:10px;border:1.5px solid currentColor;border-radius:999px;padding:9px 20px;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.h1-wrap{position:relative;margin-top:30px}
.h1{font-family:var(--display);font-weight:800;font-size:clamp(42px,7.5vw,112px);line-height:1.04;letter-spacing:-.04em}
.h1 .ln-i{animation:lineUp 1.15s var(--ease) both;animation-delay:calc(var(--li)*120ms + 300ms);transform-origin:center bottom}
.circ{position:relative;display:inline-block;padding:0 .16em}
.circ svg{position:absolute;left:-3%;top:4%;width:106%;height:98%;overflow:visible;color:var(--hi);fill:none}
.circ ellipse{stroke:currentColor;stroke-width:5;stroke-dasharray:910;stroke-dashoffset:910;animation:draw 1.1s var(--ease-io) 1.35s forwards}
.stk{position:absolute;display:inline-flex;align-items:center;gap:9px;border-radius:999px;padding:12px 22px;background:var(--hi);color:var(--bone);font-family:var(--display);font-weight:700;font-size:clamp(13px,1.2vw,16px);white-space:nowrap}
.stk svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:3.2;stroke-linecap:round;animation:spin 7s linear infinite}
.hero .stk{right:-3%;top:-2%;rotate:7deg;animation:popIn .9s var(--spring) 1.7s both,bob 5s ease-in-out 2.6s infinite}
.hero-sub{max-width:540px;margin-top:30px;font-size:clamp(16px,1.35vw,19px);color:var(--ink-soft)}
.hero-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:34px}
.offer-chip{display:inline-flex;align-items:center;gap:12px;margin-top:26px;padding:10px 18px 10px 14px;border-radius:999px;background:var(--bone-2);font-size:14px;font-weight:500;transition:background-color .35s,color .35s}
.offer-chip:hover{background:var(--hi);color:var(--bone)}
.offer-chip i{width:9px;height:9px;border-radius:50%;background:var(--hi);animation:pulse 1.8s ease-out infinite}
.offer-chip:hover i{background:var(--bone)}
.cue{position:absolute;left:var(--pad);bottom:26px;display:flex;align-items:center;gap:12px;color:var(--ink-soft)}
.cue b{width:22px;height:36px;border:1.5px solid currentColor;border-radius:12px;position:relative}
.cue b::after{content:'';position:absolute;left:50%;top:6px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:currentColor;animation:cue 1.9s var(--ease) infinite}
.hero-meta{position:absolute;right:var(--pad);bottom:30px;color:var(--ink-soft)}

/* ---------- marquee ---------- */
.mq{position:relative;z-index:2;overflow:hidden;background:var(--hi);color:var(--bone);padding:24px 0}
.mq-in{display:flex;width:max-content;translate:calc(var(--mqx,0)*1px) 0}
.mq-t{display:flex;align-items:center;gap:34px;padding-right:34px;flex:none;animation:mq 24s linear infinite}
.mq-t span{font-family:var(--display);font-weight:800;font-size:clamp(24px,2.9vw,42px);letter-spacing:-.03em;white-space:nowrap}
.mq-t svg{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;animation:spin 6s linear infinite}
.mq.names{background:transparent;color:inherit;padding:0;margin-top:48px}
.mq.names .mq-in{margin-left:-900px;translate:calc(var(--mqx,0)*-1px) 0}
.mq.names .mq-t{animation-direction:reverse;animation-duration:30s;gap:14px;padding-right:14px}
.mq.names .mq-t span{font-family:var(--body);font-weight:500;font-size:15px;letter-spacing:0;border:1px solid var(--line-d);border-radius:999px;padding:13px 24px}

/* ---------- statement ---------- */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.stmt{padding:var(--sec) var(--pad)}
.stmt-p{--p:1;max-width:1260px;margin-top:40px;font-family:var(--display);font-weight:800;font-size:clamp(30px,4.7vw,70px);line-height:1.1;letter-spacing:-.035em}
.w{display:inline-block;margin-right:.26em;opacity:calc(.14 + .86*clamp(0,var(--p)*var(--n) - var(--i),1));transition:opacity .25s linear}
.w.hot{color:var(--hi-lite)}
.stmt-sub{max-width:580px;margin:44px 0 0 auto;font-size:18px;color:var(--bone-soft)}

/* ---------- system (pins + scrolls sideways once measured) ---------- */
.sys{position:relative}
.sys-pin{padding:var(--sec) 0}
.sys-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;padding:0 var(--pad)}
.sys-head .h2{margin-top:22px}
.sys-hint{display:none;border:1px solid var(--line-d);border-radius:999px;padding:10px 18px;color:var(--bone-soft)}
.sys-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;padding:48px var(--pad) 0;will-change:transform}
.sys-cards{display:contents}
.sys-card{border-radius:28px;padding:36px 32px;min-height:340px;display:flex;flex-direction:column;justify-content:space-between;gap:28px;background:var(--ink-2)}
.sys-card b{font-family:var(--display);font-weight:800;font-size:56px;line-height:1;letter-spacing:-.04em;color:var(--hi-lite)}
.sys-card h3{font-family:var(--display);font-weight:700;font-size:28px;letter-spacing:-.02em;margin-bottom:12px}
.sys-card p{font-size:15.5px;line-height:1.6;color:var(--bone-soft)}
.sys-card.c3{background:var(--hi)}
.sys-card.c3 b,.sys-card.c3 p{color:var(--bone)}
.sys-out{display:none}
.sys-bar{position:relative;overflow:hidden;height:3px;border-radius:3px;margin:40px var(--pad) 0;background:var(--line-d)}
.sys-bar b{position:absolute;inset:0;background:var(--hi-lite);transform-origin:left center;transform:scaleX(var(--sp,1))}
.pin .sys{height:320vh}
.pin .sys-pin{position:sticky;top:0;height:100vh;padding:0;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.pin .sys-hint{display:inline-block}
.pin .sys-track{display:flex;width:max-content;gap:28px;padding:44px var(--pad) 0}
.pin .sys-card{flex:none;width:min(540px,70vw);min-height:min(400px,44vh);rotate:calc((var(--sp,.5) - var(--c,.5))*-7deg);transition:rotate .2s linear}
.pin .sys-out{display:flex;flex:none;flex-direction:column;justify-content:center;align-items:flex-start;gap:26px;width:min(620px,80vw);padding-left:40px}
.pin .sys-out strong{font-family:var(--display);font-weight:800;font-size:clamp(34px,4vw,60px);line-height:1;letter-spacing:-.035em}

/* ---------- services ---------- */
.svc{padding:var(--sec) var(--pad)}
.svc-hint{color:var(--ink-soft)}
.svc-list{display:flex;flex-direction:column;gap:16px;margin-top:40px}
.svc-row{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;gap:28px;padding:clamp(28px,3.3vw,50px) clamp(24px,3vw,44px);border-radius:32px;background:var(--bone-2);transition:transform .55s var(--ease),color .45s}
.svc-row::before{content:'';position:absolute;z-index:-1;right:clamp(24px,3vw,44px);top:50%;width:56px;height:56px;margin-top:-28px;border-radius:50%;background:var(--hi);transform:scale(0);transition:transform .75s var(--ease-io)}
.svc-row:hover{color:var(--bone);transform:translateY(-5px) rotate(-.5deg)}
.svc-row:hover::before{transform:scale(64)}
.svc-row.dk{background:var(--ink);color:var(--bone)}
.svc-t{flex:1;font-family:var(--display);font-weight:800;font-size:clamp(24px,3.7vw,54px);line-height:1.05;letter-spacing:-.035em}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{border:1px solid color-mix(in srgb,currentColor 38%,transparent);border-radius:999px;padding:8px 14px;font-size:12.5px;white-space:nowrap}
.svc-go{position:relative;flex:none;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--bone);transition:rotate .55s var(--ease),background-color .4s,color .4s}
.svc-row.dk .svc-go{background:var(--hi)}
.svc-go svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.svc-row:hover .svc-go{rotate:45deg;background:var(--bone);color:var(--ink)}
.svc-line{margin-top:30px;font-family:var(--display);font-weight:700;font-size:clamp(17px,1.5vw,21px);letter-spacing:-.02em}
.svc-line em{font-style:normal;color:var(--hi)}

/* ---------- proof: one deep case study (video + numbers + the real calendar) ---------- */
.proof{padding:var(--sec) 0}
.proof-head{padding:0 var(--pad)}
.proof-head .h2{margin-top:22px}
.proof-grid{display:grid;grid-template-columns:minmax(260px,360px) 1fr;gap:28px;align-items:stretch;padding:0 var(--pad);margin-top:44px}
.vid{position:relative;width:100%;height:100%;min-height:520px;aspect-ratio:9/16;max-height:640px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center;padding:24px;border-radius:32px;border:1.5px dashed var(--line-d);background:var(--ink-2);color:var(--bone-soft)}
.vid-play{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;background:var(--hi);color:var(--bone);animation:pulse 2s ease-out infinite}
.vid-play svg{width:30px;height:30px;fill:currentColor;stroke:none;translate:3px 0}
.vid strong{font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-.02em;color:var(--bone)}
.proof-side{display:flex;flex-direction:column;gap:28px}
.proof-side>div:last-child{flex:1}
.stat{background:var(--ink-2);border-radius:32px;padding:clamp(28px,3.4vw,50px)}
.stat-n{font-family:var(--display);font-weight:800;font-size:clamp(54px,7vw,118px);line-height:1;letter-spacing:-.05em;font-variant-numeric:tabular-nums;white-space:nowrap}
.stat-n em{font-style:normal;color:var(--hi-lite)}
.stat p{margin-top:22px;font-size:17px;color:var(--bone-soft)}
.stat p b{font-weight:600;color:var(--bone)}
.stat small{display:block;max-width:560px;margin-top:12px;font-size:13.5px;line-height:1.55;color:var(--bone-soft)}
.quote{height:100%;display:flex;flex-direction:column;justify-content:space-between;gap:24px;background:var(--hi);color:var(--bone);border-radius:32px;padding:clamp(26px,3vw,44px);rotate:.8deg}
.quote blockquote{font-style:italic;font-weight:500;font-size:clamp(18px,1.8vw,25px);line-height:1.38}
.quote figcaption{font-size:15px;font-weight:600}
.cal-wrap{padding:0 var(--pad);margin-top:72px}
.cal-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.cal-head h3{font-family:var(--display);font-weight:700;font-size:clamp(22px,2.3vw,32px);line-height:1.1;letter-spacing:-.025em}
.legend{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:13.5px;color:var(--bone-soft)}
.legend span{display:inline-flex;align-items:center;gap:8px}
.legend i{width:14px;height:14px;border-radius:5px;background:var(--hi)}
.legend i.o{background:transparent;box-shadow:inset 0 0 0 1.5px var(--bone-soft)}
.cal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:28px}
.mo{background:var(--ink-2);border-radius:24px;padding:22px 20px 20px}
.mo-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:16px}
.mo-h strong{font-family:var(--display);font-weight:700;font-size:19px;letter-spacing:-.02em}
.mo-h span{color:var(--bone-soft)}
.mo-g{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.dy{position:relative;aspect-ratio:1;display:grid;place-items:center;border-radius:9px;font-family:var(--mono);font-size:10.5px;color:#8B8983}
.dy.blank{visibility:hidden}
.dy.hd{aspect-ratio:auto;height:20px;font-size:9.5px;color:#75736D}
.dy i{font-style:normal}
.dy b{position:absolute;right:4px;bottom:2px;font-size:9.5px;font-weight:500;line-height:1}
.dy.on{color:var(--bone)}
.dy.g1{background:color-mix(in srgb,var(--hi) 52%,var(--ink-2))}
.dy.g2{background:color-mix(in srgb,var(--hi) 76%,var(--ink-2))}
.dy.g3{background:var(--hi)}
.dy.ot{box-shadow:inset 0 0 0 1.5px var(--bone-soft)}
[data-rv="cal"] .on{opacity:0;scale:.2;animation:rvFallbackPop .6s 3s forwards}
.js [data-rv="cal"] .on{animation:none;transition:opacity .3s ease,scale .55s var(--spring);transition-delay:calc(var(--k,0)*24ms)}
.js [data-rv="cal"].in .on{opacity:1;scale:1}
.cal-foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:20px}
.cal-foot strong{font-family:var(--display);font-weight:700;font-size:clamp(17px,1.5vw,21px);letter-spacing:-.02em}
.cal-foot span{color:var(--bone-soft)}
.zone{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:end;margin:28px var(--pad) 0;padding:clamp(24px,3vw,40px);border:1px solid var(--line-d);border-radius:28px}
.zone blockquote{max-width:940px;font-size:clamp(17px,1.6vw,23px);line-height:1.45;font-weight:500}
.zone figcaption{font-size:14px;white-space:nowrap;color:var(--bone-soft)}

/* ---------- the offer ---------- */
.offer{position:relative;overflow:hidden;text-align:center;padding:var(--sec) var(--pad)}
.offer-h{max-width:1180px;margin:28px auto 0;font-family:var(--display);font-weight:800;font-size:clamp(38px,6.6vw,100px);line-height:1.03;letter-spacing:-.04em;scale:calc(.88 + .12*var(--gs,1))}
.offer-sub{max-width:600px;margin:28px auto 0;font-size:clamp(16px,1.35vw,18.5px)}
.steps{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;max-width:1120px;margin:64px auto 0;text-align:left}
.steps::before,.steps::after{content:'';position:absolute;left:28px;right:28px;top:27px;height:2px;border-radius:2px}
.steps::before{background:color-mix(in srgb,var(--bone) 30%,transparent)}
.steps::after{background:var(--bone);transform-origin:left center;transform:scaleX(var(--gp,1))}
.step{position:relative;z-index:1}
.step i{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--bone);color:var(--ink);font-family:var(--display);font-weight:800;font-style:normal;font-size:20px}
.step h3{margin-top:22px;font-family:var(--display);font-weight:700;font-size:22px;letter-spacing:-.02em}
.step p{margin-top:8px;font-size:15.5px;line-height:1.55}
.offer-fine{max-width:880px;margin:44px auto 0;font-size:12px;line-height:1.7;opacity:.92}
.offer-cta{display:flex;justify-content:center;margin-top:36px}
.offer .stk{left:clamp(16px,6vw,96px);bottom:clamp(24px,5vw,72px);rotate:-6deg;background:var(--bone);color:var(--ink);border-radius:16px}

/* ---------- founder ---------- */
.fdr{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:clamp(32px,6vw,88px);align-items:center;padding:var(--sec) var(--pad)}
.ph{position:relative;overflow:hidden;aspect-ratio:3/4;border-radius:32px;background:var(--bone-2);box-shadow:0 34px 60px -34px rgba(16,16,18,.5);rotate:calc(-8deg + 6deg*var(--fy,1))}
.ph img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 76%;transition:filter .8s var(--ease),scale 1.2s var(--ease)}
.bw .ph img{filter:grayscale(1) contrast(1.06)}
.bw .ph:hover img{filter:none}
.ph:hover img{scale:1.04}
.fdr .h2{margin-top:24px;font-size:clamp(32px,4.2vw,58px);line-height:1.04}
.fdr-p{max-width:560px;margin-top:24px;font-size:18px;color:var(--ink-soft)}
.fdr-sig{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.sig{border-radius:999px;padding:12px 20px;font-size:14px;font-weight:600;background:var(--ink);color:var(--bone)}
.sig.ig{background:transparent;border:1.5px solid var(--hi);color:var(--hi);transition:background-color .35s,color .35s}
.sig.ig:hover{background:var(--hi);color:var(--bone)}

/* ---------- faq ---------- */
.faq{padding:var(--sec) var(--pad)}
.faq-list{display:flex;flex-direction:column;gap:12px;max-width:1080px;margin-top:40px}
.fq{border-radius:24px;background:var(--bone-2);transition:background-color .5s var(--ease),color .5s var(--ease)}
.fq.open{background:var(--ink);color:var(--bone)}
.fq-q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 30px;text-align:left;font-family:var(--display);font-weight:700;font-size:clamp(18px,1.7vw,23px);line-height:1.2;letter-spacing:-.02em}
.fq-i{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1.5px solid currentColor;transition:rotate .6s var(--spring),background-color .4s,color .4s,border-color .4s}
.fq-i svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.fq.open .fq-i{rotate:135deg;background:var(--hi);border-color:var(--hi);color:var(--bone)}
.fq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .65s var(--ease)}
.fq.open .fq-a{grid-template-rows:1fr}
.fq-a>div{overflow:hidden}
.fq-a p{max-width:780px;padding:0 30px 28px;font-size:16px;line-height:1.6;color:var(--bone-soft)}

/* ---------- start: quiz + booking ---------- */
.start{padding:var(--sec) var(--pad)}
.start-head{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap}
.start-head .h2{margin-top:20px}
.start-head p{max-width:320px;font-size:15px;color:var(--bone-soft)}
.start-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:40px}
.card{display:flex;flex-direction:column;gap:20px;min-height:540px;height:100%;background:var(--ink-2);border-radius:32px;padding:clamp(26px,3vw,40px)}
.card-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.badge{border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600;background:var(--hi);color:var(--bone)}
.badge.alt{background:transparent;border:1px solid var(--line-d)}
.qbar{height:4px;border-radius:4px;overflow:hidden;background:var(--line-d)}
.qbar b{display:block;height:100%;border-radius:4px;background:var(--hi-lite);width:calc(var(--q,0)*100%);transition:width .7s var(--ease)}
.card h3{font-family:var(--display);font-weight:700;font-size:clamp(22px,2.1vw,28px);line-height:1.15;letter-spacing:-.02em}
.qa,.qb{flex:1;display:flex;flex-direction:column;gap:18px}
.qa{animation:slideA .6s var(--ease) both}
.qb{animation:slideB .6s var(--ease) both}
@keyframes slideA{from{opacity:0;transform:translateX(34px)}to{opacity:1;transform:none}}
@keyframes slideB{from{opacity:0;transform:translateX(34px)}to{opacity:1;transform:none}}
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-size:13px;font-weight:500;color:var(--bone-soft)}
.field input{background:var(--ink);border:1px solid var(--line-d);border-radius:16px;padding:17px 18px;font-size:15px;color:var(--bone);transition:border-color .3s}
.field input:focus{outline:none;border-color:var(--hi-lite)}
.field input::placeholder{color:#807E78}
.opts{display:flex;flex-wrap:wrap;gap:10px}
.opt{min-height:44px;border:1.5px solid var(--line-d);border-radius:999px;padding:12px 20px;font-size:14.5px;font-weight:500;transition:background-color .3s,color .3s,border-color .3s,scale .35s var(--spring)}
.opt:hover{border-color:var(--bone)}
.opt.sel{background:var(--bone);color:var(--ink);border-color:var(--bone);scale:1.04}
.card-foot{margin-top:auto;display:flex;align-items:center;gap:14px}
.back{min-height:44px;padding:12px 6px;font-size:14px;font-weight:500;color:var(--bone-soft)}
.back:hover{color:var(--bone)}
.go{flex:1;min-height:56px;border-radius:999px;padding:18px 24px;font-size:16px;font-weight:600;background:var(--bone);color:var(--ink);transition:background-color .35s,color .35s,opacity .3s}
.go:hover{background:var(--hi);color:var(--bone)}
.go[disabled]{opacity:.4;cursor:default}
.go[disabled]:hover{background:var(--bone);color:var(--ink)}
.done{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:16px;animation:slideA .7s var(--ease) both}
.done p{color:var(--bone-soft)}
.ok{width:64px;height:64px;color:var(--hi-lite)}
.ok circle,.ok path{fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.ok circle{stroke-dasharray:180;stroke-dashoffset:180;animation:draw .8s var(--ease-io) .15s forwards}
.ok path{stroke-dasharray:40;stroke-dashoffset:40;animation:draw .45s var(--ease) .75s forwards}
.link{font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:4px;min-height:44px}
.note{font-size:13px;color:var(--bone-soft)}
.days{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.day{min-height:64px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:1.5px solid var(--line-d);border-radius:18px;padding:10px 4px;transition:background-color .3s,color .3s,border-color .3s,translate .35s var(--spring)}
.day small{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase}
.day strong{font-family:var(--display);font-weight:800;font-size:22px;line-height:1}
.day:hover{border-color:var(--bone)}
.day.sel{background:var(--hi);border-color:var(--hi);color:var(--bone);translate:0 -3px}

/* ---------- footer ---------- */
.ft{padding:44px var(--pad) 30px;border-top:1px solid var(--line-d)}
.ft-top{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;font-size:14.5px;font-weight:500}
.ft-nav{display:flex;flex-wrap:wrap;gap:6px 28px}
.ft-nav a{transition:color .3s}
.ft-nav a:hover{color:var(--hi-lite)}
.ft-mail{display:flex;flex-wrap:wrap;gap:10px}
.ft-mail a{border:1px solid var(--line-d);border-radius:999px;padding:10px 18px;transition:border-color .3s}
.ft-mail a:hover{border-color:var(--bone)}
.ft-mail a.hl{color:var(--hi-lite)}
/* v1 bug: the letters were overflow:hidden FLEX ITEMS, so flexbox silently squeezed each box narrower than its glyph
   (min-width:auto becomes 0 on overflow:hidden items) — that is what shaved the S and the asterisk.
   Now the WORD is the mask (clipped top/bottom only, never sideways) and the script sizes the type so the natural,
   unsqueezed word exactly fits the footer's width (--fit). Syne 800 is ultra-wide: never size this by a vw guess. */
.ft-word{display:flex;justify-content:center;margin:calc(44px - .2em) 0 calc(30px - .16em);padding:.2em 0 .16em;overflow-x:visible;overflow-y:clip;font-family:var(--display);font-weight:800;font-size:min(var(--fit,10.6vw),208px);line-height:.92;letter-spacing:-.06em;white-space:nowrap}
.ft-word .ln{display:inline-block;flex:none;overflow:visible;padding:0;margin:0}
.ft-word .ln-i{display:inline-block;opacity:0;transform:translateY(140%) rotate(2deg)}
.js .ft-word .ln-i{transition:transform 1.1s var(--ease),opacity .45s ease;transition-delay:calc(var(--li,0)*90ms + var(--d,0ms))}
.js .ft-word.in .ln-i{opacity:1}
.ft-word .sp{width:.26em}
.ft-word .star{color:var(--hi-lite);height:.92em;margin-left:.05em}
.ft-word .star svg{display:block;width:.54em;height:.54em;margin-top:.1em;fill:currentColor}
.ft-bot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--bone-soft)}

/* ---------- responsive ---------- */
@media (max-width:1100px){
.nav-links a{padding:11px 13px}
.cal{grid-template-columns:repeat(2,minmax(0,1fr))}
.quote{rotate:0deg}
.stat-n{font-size:clamp(54px,6.4vw,118px)}
}
@media (hover:none){
.svc-hint{display:none}
}
@media (max-width:900px){
.n1{font-size:16px;-webkit-tap-highlight-color:transparent}
/* nav: logo · Start · menu — the CTA stays on screen the whole scroll */
.nav{top:max(12px,env(safe-area-inset-top))}
.nav-links,.nav-x{display:none}
.nav-in{width:100%}
.nav-cta{margin-left:auto;padding:12px 18px;font-size:13.5px}
.nav-burger{display:grid}
.nav-sheet{border:1px solid var(--line-d);box-shadow:0 24px 48px -20px rgba(0,0,0,.55)}
.nav.open .nav-sheet{animation:fadeUp .45s var(--ease) both}
.hero{min-height:min(100svh,940px);padding-top:108px;padding-bottom:60px}
.hero .stk{position:static;margin-top:20px;rotate:-3deg}
.cue,.hero-meta{display:none}
.stmt-sub{margin-left:0}
/* system: the sideways scroller becomes a deck — each card sticks a little lower and the next slides over it */
.sys-track{display:block;padding-top:40px;will-change:auto}
.sys-cards{display:flex;flex-direction:column;gap:16px}
.sys-card{min-height:316px;padding:28px 26px;border-radius:26px;border:1px solid var(--line-d);box-shadow:0 -16px 30px -20px rgba(0,0,0,.65)}
.sys-card.c3{border-color:color-mix(in srgb,var(--bone) 30%,transparent)}
.live .sys-card{position:sticky;top:calc(84px + var(--n,0)*14px)}
.sys-card b{font-size:48px}
.sys-card h3{font-size:24px}
.sys-out{display:flex;flex-direction:column;align-items:flex-start;gap:22px;padding:40px 4px 0}
.sys-out strong{font-family:var(--display);font-weight:800;font-size:clamp(28px,7.6vw,44px);line-height:1.02;letter-spacing:-.035em}
.sys-bar{display:none}
.svc-row{flex-wrap:wrap;gap:16px;border-radius:26px}
.svc-t{flex:1 1 100%}
.chips{flex:1}
.proof-grid{grid-template-columns:1fr;margin-top:36px}
.vid{max-width:340px;margin:0 auto;min-height:0}
.cal-wrap{margin-top:56px}
.zone{grid-template-columns:1fr}
/* offer: 1-2-3 turns into a vertical timeline; the line draws DOWN between the numbers as you scroll */
.steps{grid-template-columns:1fr;gap:30px;margin-top:48px}
.steps::before,.steps::after{display:none}
.step{display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:18px;align-items:start}
.step i{position:relative;z-index:1;grid-row:1 / span 2}
.step h3{margin-top:6px}
.step p{grid-column:2;margin-top:6px}
.step:not(:last-child)::before,.step:not(:last-child)::after{content:'';position:absolute;left:27px;top:56px;bottom:-30px;width:2px;border-radius:2px}
.step:not(:last-child)::before{background:color-mix(in srgb,var(--bone) 30%,transparent)}
.step:not(:last-child)::after{background:var(--bone);transform-origin:center top;transform:scaleY(clamp(0,calc(var(--gp,1)*2 - var(--s,0)),1))}
.step:nth-child(2){--s:1}
.offer .stk{position:static;margin-top:36px}
.fdr{grid-template-columns:1fr}
.ph{max-width:300px}
.start-grid{grid-template-columns:1fr}
.start-head p{text-align:left}
.field input{font-size:16px}
}
@media (max-width:640px){
.n1{--sec:72px}
.btn{padding:17px 24px;font-size:15px}
.h1{font-size:clamp(36px,11.4vw,58px)}
.h2{font-size:clamp(30px,8.4vw,44px)}
.hero .stk{font-size:12px;padding:10px 16px}
.hero-ast.a{width:74vw;height:74vw;left:-24%;top:3%}
.hero-ast.b{width:50vw;height:50vw;right:-16%;bottom:-3%}
.hero-cta{flex-direction:column;align-items:stretch;width:100%;max-width:340px}
.hero-cta .btn{justify-content:center}
.offer-chip{font-size:13px}
.mq{padding:18px 0}
.stmt-sub{font-size:16.5px}
.stat-n{font-size:clamp(34px,11vw,76px)}
/* the calendar becomes a 2×2 heat-map: the whole season on one screen, numerals dropped, fills kept */
.cal{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:22px}
.mo{padding:14px 12px 12px;border-radius:18px}
.mo-h{flex-direction:column;align-items:flex-start;gap:3px;margin-bottom:10px}
.mo-h strong{font-size:16px}
.mo-h span{font-size:9.5px;letter-spacing:.06em}
.mo-g{gap:3px}
.dy{border-radius:5px;background:color-mix(in srgb,var(--bone) 8%,transparent)}
.dy i,.dy b,.dy.hd{display:none}
.offer-h{font-size:max(26px,7.4vw)}
.offer-fine{font-size:11px;letter-spacing:.08em}
.card{min-height:500px;border-radius:26px}
.fq-q{padding:22px 20px}
.fq-a p{padding:0 20px 24px}
.days{gap:6px}
.ft-top{flex-direction:column;align-items:flex-start}
.ft-nav a{padding:9px 0}
.ft-bot{flex-direction:column;gap:6px}
}
@media (max-width:420px){
.logo{font-size:16.5px;gap:7px;padding:0 8px}
.nav-cta{padding:12px 15px}
}
@media (max-width:350px){
.nav-cta{display:none}
}

/* ---------- flat (canvas overview / exports), calm (motion off), reduced motion ---------- */
.flat{--sec:88px}
.flat .w{opacity:1}
.calm *,.calm *::before,.calm *::after{animation:none !important;transition:none !important}
.calm [data-rv],.calm [data-rv] .ln-i,.calm [data-rv="cal"] .on{opacity:1 !important;transform:none !important;scale:1 !important}
.calm .w{opacity:1}
.calm .circ ellipse,.calm .ok circle,.calm .ok path{stroke-dashoffset:0}
.calm .cur{display:none}
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
.n1 *,.n1 *::before,.n1 *::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
.n1 [data-rv],.n1 [data-rv] .ln-i,.n1 [data-rv="cal"] .on{opacity:1 !important;transform:none !important;scale:1 !important}
.n1 .w{opacity:1}
.n1 .mq-t{animation:none !important}
}

/* ================= site-only additions ================= */
html.lenis,html.lenis body{height:auto}
html.lenis{scroll-behavior:auto}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
[hidden]{display:none !important}
.skip{position:fixed;left:16px;top:-80px;z-index:100;background:var(--ink,#101012);color:#EFEDE6;padding:12px 18px;border-radius:12px;font-weight:600;transition:top .2s}
.skip:focus{top:16px}
.hp{position:absolute !important;left:-9999px !important;width:1px;height:1px;opacity:0;pointer-events:none}
/* proof without the video (until Jay's clip is in assets/): numbers and quote sit side by side */
.proof-grid.no-vid{grid-template-columns:1fr}
.no-vid .proof-side{flex-direction:row;align-items:stretch}
.no-vid .proof-side>div{flex:1 1 0}
.no-vid .proof-side>div:first-child{flex:1.25 1 0}
.no-vid .stat{height:100%}
.vid video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.vid.has-video{border:0;padding:0;overflow:hidden}
/* forms */
form.card{margin:0}
.field input.bad{border-color:#F08A7B}
.err{min-height:18px;font-size:13px;color:#F3A093}
.opts.req .opt{border-color:#F08A7B}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cal-embed{flex:1;min-height:600px;border-radius:20px;overflow:hidden;background:var(--bone);color:var(--ink-soft);display:grid}
.cal-embed .note{place-self:center;color:var(--ink-soft)}
.cal-embed iframe{display:block;width:100%;min-height:600px;border:0}
.cal-embed.is-cal{background:transparent;display:block;flex:none;height:min(640px,72vh);min-height:0;overflow:auto;border-radius:16px;overscroll-behavior:contain}
.start-grid{align-items:start}
.card h3:focus{outline:none}
.card .note a{text-decoration:underline;text-underline-offset:3px}
.ft-bot a{transition:color .3s}
.ft-bot a:hover{color:var(--bone)}
@media (max-width:900px){
.no-vid .proof-side{flex-direction:column}
}
@media (max-width:640px){
.two{grid-template-columns:1fr}
}
/* legal + 404 */
.legal-wrap{min-height:100vh;display:flex;flex-direction:column}
.legal-top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px var(--pad)}
.legal-top .logo{padding:0}
.legal{flex:1;width:100%;max-width:820px;margin:0 auto;padding:clamp(40px,7vw,96px) var(--pad) 96px}
.legal h1{font-family:var(--display);font-weight:800;font-size:clamp(38px,6vw,72px);line-height:1;letter-spacing:-.04em}
.legal .legal-date{margin-top:14px;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.legal h2{margin-top:44px;font-family:var(--display);font-weight:700;font-size:22px;letter-spacing:-.02em}
.legal p,.legal li{margin-top:12px;color:var(--ink-soft)}
.legal ul{padding-left:20px}
.legal a{color:var(--hi);text-decoration:underline;text-underline-offset:3px}
.legal-foot{margin-top:56px}
.nf{flex:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:26px;padding:0 var(--pad) 80px}
.nf h1{font-family:var(--display);font-weight:800;font-size:clamp(64px,16vw,220px);line-height:.9;letter-spacing:-.05em}
.nf h1 em{font-style:normal;color:var(--hi)}
