/* WerkOS (Keystone system) design tokens. Dark is the default theme; add data-theme="light" for light. */
:root {
  --wos-onyx: #0A0A0B;
  --wos-carbon: #18181B;
  --wos-ultraviolet: #6E56FF;
  --wos-ultraviolet-light: #9A8CFF;
  --wos-ultraviolet-deep: #5B43E8;
  --wos-iron: #3F3F46;
  --wos-ash: #A1A1AA;
  --wos-smoke: #F4F4F5;
  --wos-white: #FFFFFF;
  --wos-line-dark: #27272A;
  --wos-line-light: #E4E4E7;
  --wos-green-400: #4ADE80;
  --wos-amber-400: #FBBF24;
  --wos-red-400: #F87171;
  --wos-green-700: #15803D;
  --wos-amber-700: #B45309;
  --wos-red-700: #C81E1E;
  --wos-font-sans: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  --wos-font-mono: 'Geist Mono', ui-monospace, SFMono-Regular, monospace;
  --wos-type-display-size: 4.5rem;
  --wos-type-display-line: 4.75rem;
  --wos-type-display-tracking: -0.035em;
  --wos-type-display-weight: 600;
  --wos-type-h1-size: 3.5rem;
  --wos-type-h1-line: 3.75rem;
  --wos-type-h1-tracking: -0.03em;
  --wos-type-h1-weight: 600;
  --wos-type-h2-size: 2.5rem;
  --wos-type-h2-line: 2.875rem;
  --wos-type-h2-tracking: -0.025em;
  --wos-type-h2-weight: 600;
  --wos-type-h3-size: 2rem;
  --wos-type-h3-line: 2.375rem;
  --wos-type-h3-tracking: -0.02em;
  --wos-type-h3-weight: 600;
  --wos-type-h4-size: 1.5rem;
  --wos-type-h4-line: 1.875rem;
  --wos-type-h4-tracking: -0.015em;
  --wos-type-h4-weight: 600;
  --wos-type-title-size: 1.25rem;
  --wos-type-title-line: 1.75rem;
  --wos-type-title-tracking: -0.01em;
  --wos-type-title-weight: 500;
  --wos-type-body-lg-size: 1.125rem;
  --wos-type-body-lg-line: 1.75rem;
  --wos-type-body-lg-tracking: 0em;
  --wos-type-body-lg-weight: 400;
  --wos-type-body-size: 1rem;
  --wos-type-body-line: 1.5rem;
  --wos-type-body-tracking: 0em;
  --wos-type-body-weight: 400;
  --wos-type-small-size: 0.875rem;
  --wos-type-small-line: 1.25rem;
  --wos-type-small-tracking: 0em;
  --wos-type-small-weight: 400;
  --wos-type-caption-size: 0.75rem;
  --wos-type-caption-line: 1rem;
  --wos-type-caption-tracking: 0.01em;
  --wos-type-caption-weight: 400;
  --wos-type-label-size: 0.75rem;
  --wos-type-label-line: 1rem;
  --wos-type-label-tracking: 0.08em;
  --wos-type-label-weight: 500;
  --wos-radius-xs: 4px;
  --wos-radius-sm: 6px;
  --wos-radius-md: 10px;
  --wos-radius-lg: 14px;
  --wos-radius-xl: 20px;
  --wos-radius-full: 9999px;
  --wos-space-0: 0rem;
  --wos-space-1: 0.125rem;
  --wos-space-2: 0.25rem;
  --wos-space-3: 0.5rem;
  --wos-space-4: 0.75rem;
  --wos-space-5: 1rem;
  --wos-space-6: 1.25rem;
  --wos-space-7: 1.5rem;
  --wos-space-8: 2rem;
  --wos-space-9: 2.5rem;
  --wos-space-10: 3rem;
  --wos-space-11: 4rem;
  --wos-space-12: 5rem;
  --wos-space-13: 6rem;
  --wos-space-14: 8rem;
  --wos-bg: var(--wos-onyx);
  --wos-surface: var(--wos-carbon);
  --wos-text: var(--wos-smoke);
  --wos-muted: var(--wos-ash);
  --wos-accent: var(--wos-ultraviolet);
  --wos-accent-text: var(--wos-ultraviolet-light);
  --wos-on-accent: var(--wos-white);
  --wos-border: var(--wos-line-dark);
  --wos-border-strong: var(--wos-iron);
  --wos-success: var(--wos-green-400);
  --wos-warning: var(--wos-amber-400);
  --wos-error: var(--wos-red-400);
  color-scheme: dark;
}
[data-theme="light"] {
  --wos-bg: var(--wos-white);
  --wos-surface: var(--wos-smoke);
  --wos-text: var(--wos-onyx);
  --wos-muted: var(--wos-iron);
  --wos-accent: var(--wos-ultraviolet);
  --wos-accent-text: var(--wos-ultraviolet-deep);
  --wos-on-accent: var(--wos-white);
  --wos-border: var(--wos-line-light);
  --wos-border-strong: var(--wos-ash);
  --wos-success: var(--wos-green-700);
  --wos-warning: var(--wos-amber-700);
  --wos-error: var(--wos-red-700);
  color-scheme: light;
}

/* ---- Glass material (from HandelOS front-end guideline v3.2) ---- */
:root {
  --wos-glass-bg: rgba(30, 30, 36, .44);
  --wos-glass-bg-strong: rgba(18, 18, 22, .66);
  --wos-glass-bg-soft: rgba(40, 40, 48, .28);
  --wos-glass-blur: 22px;
  --wos-glass-saturate: 170%;
  --wos-glass-border: rgba(255, 255, 255, .09);
  --wos-glass-border-hover: rgba(255, 255, 255, .16);
  --wos-glass-highlight: inset 0 1px 0 rgba(255,255,255,.10), inset 0 0 0 1px rgba(255,255,255,.025);
  --wos-glass-shadow: 0 1px 1px rgba(0,0,0,.35), 0 14px 34px -14px rgba(0,0,0,.65), 0 44px 90px -46px rgba(0,0,0,.8);
  --wos-glass-fallback: rgba(22, 22, 26, .94);
}
.wos-glass {
  background: var(--wos-glass-bg);
  -webkit-backdrop-filter: blur(var(--wos-glass-blur)) saturate(var(--wos-glass-saturate));
  backdrop-filter: blur(var(--wos-glass-blur)) saturate(var(--wos-glass-saturate));
  border: 1px solid var(--wos-glass-border);
  box-shadow: var(--wos-glass-highlight), var(--wos-glass-shadow);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .wos-glass { background: var(--wos-glass-fallback); } }
@media (prefers-reduced-transparency: reduce) { .wos-glass { background: var(--wos-carbon); backdrop-filter: none; -webkit-backdrop-filter: none; } }
/* HandelOS v4 · light Keystone + Apple-style glass. Tokens from brand-suite/04-design-tokens */
@font-face{font-family:Manrope;src:url(/assets/fonts/manrope-latin.woff2) format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(/assets/fonts/geist-mono-latin.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--bg:#F4F4F5;--ink:#0A0A0B;--mu:#3F3F46;--line:#E4E4E7;--uvd:#5B43E8;--uv:#6E56FF;
 --lg-bg:rgba(255,255,255,.62);--lg-bg-strong:rgba(255,255,255,.78);--lg-brd:rgba(10,10,11,.08);--lg-hi:inset 0 1px 0 rgba(255,255,255,.9);
 --lg-sh:0 1px 1px rgba(10,10,11,.04),0 12px 32px -14px rgba(10,10,11,.18),0 40px 80px -40px rgba(91,67,232,.18);--hp:0}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{font-family:Manrope,var(--wos-font-sans,ui-sans-serif),system-ui,sans-serif;background:var(--bg);color:var(--ink);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(40% 35% at 85% 8%,rgba(110,86,255,.16),transparent 70%),radial-gradient(35% 30% at 5% 45%,rgba(154,140,255,.14),transparent 70%),radial-gradient(40% 30% at 90% 85%,rgba(91,67,232,.10),transparent 70%)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.w{max-width:1180px;margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 12px;border-radius:8px;z-index:99}.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--uvd);outline-offset:3px;border-radius:6px}
.k{font-family:"Geist Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mu);margin-bottom:12px}
.mu{color:var(--mu)}.sm{font-size:14px}
h1,h2,h3{font-weight:700;letter-spacing:-.035em;line-height:1.04}
h1{font-size:clamp(44px,7vw,84px)}h2{font-size:clamp(32px,4.6vw,52px)}h3{font-size:clamp(26px,3vw,34px)}
h1 em,h2 em{font-style:normal;color:var(--uvd)}
.lead{font-size:clamp(17px,1.6vw,20px);color:var(--mu);max-width:40em;margin-top:22px}.lead.sm{font-size:17px}
.row{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;margin-top:30px}
.b{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 20px;border-radius:12px;font-weight:600;font-size:15px;text-decoration:none;transition:transform .2s,background .2s,box-shadow .2s}
.b.sm{min-height:38px;padding:0 14px;font-size:14px;border-radius:10px}
.b.p{background:var(--ink);color:#fff;box-shadow:0 8px 24px -10px rgba(10,10,11,.5)}.b.p:hover{background:#18181B;transform:translateY(-1px)}
.b.s{background:var(--lg-bg);border:1px solid var(--lg-brd);box-shadow:var(--lg-hi);-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%)}.b.s:hover{border-color:rgba(91,67,232,.35)}
.ar{transition:transform .2s}.b:hover .ar{transform:translateX(3px)}
.tl{color:var(--ink);text-decoration:none;font-weight:600;border-bottom:1px solid rgba(10,10,11,.25);padding-bottom:2px}.tl:hover{color:var(--uvd);border-color:var(--uvd)}
/* glass */
.glass{position:relative;background:var(--lg-bg);-webkit-backdrop-filter:blur(var(--wos-glass-blur,22px)) saturate(var(--wos-glass-saturate,170%));backdrop-filter:blur(var(--wos-glass-blur,22px)) saturate(var(--wos-glass-saturate,170%));border:1px solid var(--lg-brd);box-shadow:var(--lg-hi),var(--lg-sh)}
.glass::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;padding:1px;background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(255,255,255,0) 40%,rgba(110,86,255,.18));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass,.b.s,.hdr{background:#fff!important}}
@media (prefers-reduced-transparency:reduce){.glass,.b.s,.hdr{background:#fff!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}body::before{display:none}}
/* header */
.hdr{position:sticky;top:0;z-index:50;background:rgba(244,244,245,calc(.55 + .3*var(--hp)));-webkit-backdrop-filter:blur(calc(8px + 14px*var(--hp))) saturate(160%);backdrop-filter:blur(calc(8px + 14px*var(--hp))) saturate(160%);border-bottom:1px solid rgba(10,10,11,calc(.08*var(--hp)))}
.hdr .w{display:flex;align-items:center;gap:28px;height:68px}.wm{display:block;text-decoration:none}.wm img{height:22px;width:auto}
.nav{display:flex;gap:26px;margin-left:auto}.nav a{text-decoration:none;font-size:15px;font-weight:500;color:var(--mu)}.nav a:hover{color:var(--ink)}
/* hero */
.hero{padding:clamp(64px,10vw,120px) 0 48px}
.sec{padding:clamp(48px,7vw,88px) 0}.bt{border-top:1px solid var(--line)}
.card{border-radius:24px}
/* werkos card */
.wk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:48px;padding:clamp(24px,4vw,44px);align-items:start}
.pills{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px}.pill{font-size:13px;font-weight:600;padding:5px 11px;border-radius:999px;background:rgba(10,10,11,.05);color:var(--mu);display:inline-flex;gap:7px;align-items:center}
.pill.live{background:rgba(110,86,255,.12);color:var(--uvd)}.pill i{width:7px;height:7px;border-radius:50%;background:var(--uv)}
.wlogo{height:34px;width:auto;margin-bottom:18px}
.feats{margin-top:26px;border-top:1px solid var(--line)}.feats div{padding:16px 0;border-bottom:1px solid var(--line)}
.feats dt{display:inline;font-weight:700}.feats dd{display:inline;color:var(--mu);margin-left:4px}
.shot{position:sticky;top:96px}.shot picture{display:block;border-radius:16px;overflow:hidden;background:#0A0A0B;padding:6px;box-shadow:0 30px 60px -30px rgba(10,10,11,.45)}.shot img{border-radius:11px}
figcaption{font-size:13px;color:var(--mu);margin-top:12px}
details.disc summary{cursor:pointer;list-style:none;font-weight:600;border-bottom:1px solid rgba(10,10,11,.25);padding-bottom:2px}details.disc summary::-webkit-details-marker{display:none}
details.disc summary::after{content:" ↓";color:var(--uvd)}details.disc[open] summary::after{content:" ↑"}
.discb{margin-top:16px;font-size:15px;color:var(--mu)}.discb .k{margin:14px 0 6px}
.wk .row details{flex-basis:100%}
.dash{list-style:none}.dash li{padding:10px 0 10px 20px;border-bottom:1px solid var(--line);position:relative}.dash li::before{content:"–";position:absolute;left:0;color:var(--uvd)}
/* products */
.sh{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap;margin-bottom:24px}
.prods{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,2fr);overflow:hidden}
.pl{padding:10px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:4px}
.pt{all:unset;box-sizing:border-box;display:grid;grid-template-columns:36px 1fr auto;gap:12px;align-items:center;padding:12px;border-radius:14px;cursor:pointer;transition:background .2s}
.pt:hover{background:rgba(10,10,11,.04)}.pt[aria-selected=true]{background:rgba(255,255,255,.9);box-shadow:0 1px 2px rgba(10,10,11,.06),inset 0 0 0 1px rgba(91,67,232,.18)}
.pt:focus-visible{outline:2px solid var(--uvd)}
.ic{width:36px;height:36px;border-radius:10px;background:rgba(10,10,11,.06);display:grid;place-items:center;font-weight:700;font-size:14px}
.pt[aria-selected=true] .ic{background:var(--ink);color:#fff}
.pn b{display:block;font-size:15px}.pn small{color:var(--mu);font-size:13px}
.st{font-size:12px;font-weight:600;padding:3px 9px;border-radius:999px;white-space:nowrap;background:rgba(10,10,11,.06);color:var(--mu)}.st.live{background:rgba(110,86,255,.12);color:var(--uvd)}
.pp{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.9fr);gap:32px;padding:28px}.pp[hidden]{display:none}
.ppt h3{margin:6px 0 10px}.ppt>p{color:var(--mu)}.ppt .st{display:inline-block;margin-bottom:10px}.ppt .dash{margin-top:16px}
.phone picture{display:block;max-width:240px;margin:0 auto;border-radius:30px;padding:8px;background:#0A0A0B;box-shadow:0 30px 60px -30px rgba(10,10,11,.5)}.phone img{border-radius:22px;max-height:420px;object-fit:cover;object-position:top}.phone figcaption{text-align:center}
.soon{display:grid}.soonc{border-radius:20px;background:#0A0A0B;color:#F4F4F5;padding:24px;display:flex;flex-direction:column;justify-content:flex-end;min-height:240px;background-image:radial-gradient(60% 60% at 80% 10%,rgba(110,86,255,.45),transparent 70%)}.soonc .k{color:#A1A1AA}
/* services */
.svc{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:40px;border-top:1px solid var(--line);padding-top:24px}
.ll{list-style:none}.ll li{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid var(--line);font-weight:600}
.tag{font-size:12px;font-weight:600;padding:3px 9px;border-radius:999px;background:rgba(10,10,11,.06);color:var(--mu)}
details.box{margin-top:28px}details.box summary{display:inline-flex;border:1px solid var(--lg-brd);background:var(--lg-bg);padding:11px 16px;border-radius:12px;box-shadow:var(--lg-hi)}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.num{padding-left:20px}.num li{padding:6px 0}.g3 p{margin-bottom:12px}
/* founder */
.fd{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;margin-top:36px;align-items:center}.fd .lead{margin-top:0}
.fc{display:flex;gap:22px;align-items:center;padding:28px}.fc .links{margin-top:12px}.av{width:72px;height:72px;flex:none;border-radius:50%;display:grid;place-items:center;background:#0A0A0B;color:#F4F4F5;font-weight:700}
.links{display:flex;gap:20px;margin-top:16px;flex-wrap:wrap}


/* cta */
.cta{text-align:center;padding:clamp(72px,10vw,120px) 0}.cta .lead{margin:18px auto 28px}.cta p.mu{margin-top:18px}
/* footer */
.ftr{border-top:1px solid var(--line);padding:48px 0 36px}.fg{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px}
.ftr nav{display:flex;flex-direction:column;gap:9px;font-size:14px}.ftr nav a{text-decoration:none;color:var(--mu)}.ftr nav a:hover{color:var(--ink)}
.ftr .mu{margin-top:12px;font-size:14px}.fine{font-size:12px;color:var(--mu);margin-top:36px}
/* legal */
.lg{padding:72px 0}.lg h2{font-size:24px;margin:32px 0 10px}.lg h3{font-size:18px;margin:20px 0 6px}.lg p,.lg li{color:var(--mu);max-width:46em;margin-bottom:10px}
.todo{background:rgba(251,191,36,.18);border-radius:6px;padding:2px 6px;color:#713F12;display:inline}p.todo{display:block;padding:10px 12px;margin:14px 0}
.draft{margin:20px 0;padding:14px;border-radius:12px;background:#fff;border:1px solid var(--line)}
.kv{list-style:none}.kv li{display:grid;grid-template-columns:240px 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
/* responsive */
@media (max-width:960px){.wk,.prods,.pp,.fd,.svc,.g3{grid-template-columns:1fr}.shot{position:static}.pl{border-right:0;border-bottom:1px solid var(--line)}.svc{gap:24px}}
@media (max-width:720px){.nav{display:none}.hdr .b{margin-left:auto}.fg{grid-template-columns:1fr 1fr}.fg>div{grid-column:1/-1}.kv li{grid-template-columns:1fr}.pt{grid-template-columns:36px 1fr}.pt .st{grid-column:2;justify-self:start}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.bshot a{display:block;border-radius:14px;overflow:hidden;padding:5px;background:#0A0A0B;box-shadow:0 24px 50px -26px rgba(10,10,11,.45);transition:transform .2s}.bshot a:hover{transform:translateY(-2px)}.bshot img{border-radius:10px}
.pp{align-items:start}
.cl{margin-top:48px}.cl h3{font-size:26px}
.clg{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.clc{display:flex;flex-direction:column;border-radius:16px;overflow:hidden;text-decoration:none;height:100%;transition:transform .2s}.clc:hover{transform:translateY(-2px)}
.clc img{aspect-ratio:16/10;object-fit:cover;object-position:top}.clc span{padding:12px 14px 14px;display:flex;flex-direction:column;gap:3px}.clc b{font-size:15px}.clc small{font-size:13px;color:var(--mu)}
.proof{margin-top:12px}
@media (max-width:960px){.clg{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.clg{grid-template-columns:1fr}}
.clc b{display:flex;gap:6px;align-items:center}
.prin{margin-top:32px}.prin .card{padding:28px}.prin h3{margin:6px 0 8px}
.faq{display:grid;gap:12px;margin-top:28px}.faq .discb p{margin:0}
