:root{color-scheme:dark;--bg:#050608;--ink:#eef1f6;--muted:#c4ccd6;--soft:#aab3be;--line:#23272f;--panel:#0c0e12;--field:#12151a}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg)}
body{color:var(--ink);font:400 15px/1.5 Geist,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
body:has(dialog[open]){overflow:hidden}
button,input,select{font:inherit}
button{cursor:pointer;color:inherit}
button:disabled{cursor:wait;opacity:.6}
a{color:inherit}
h1,h2,p{margin:0}
main:focus{outline:none}
[hidden]{display:none!important}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #fff;outline-offset:4px}
.skip-link{position:absolute;left:16px;top:-60px;z-index:10;background:#fff;color:#07080b;padding:10px 14px;border-radius:8px;text-decoration:none}
.skip-link:focus{top:16px}

.track{height:4200px;position:relative}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
#field{position:absolute;inset:0;width:100%;height:100%;display:block}

.nav{position:absolute;top:0;left:0;right:0;z-index:2}
.nav-inner{max-width:1200px;margin:0 auto;padding:22px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.logo{display:inline-flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.logo span{font-size:19px;font-weight:600;letter-spacing:-.03em}

.pill{appearance:none;border:0;min-height:52px;padding:0 28px;border-radius:999px;background:var(--ink);color:#07080b;font-weight:500;font-size:16px;letter-spacing:-.01em;display:inline-flex;align-items:center;gap:10px}
.pill:hover{background:#fff}
.pill-sm{min-height:44px;padding:0 18px;font-size:14px;gap:8px}
.nav-actions{display:flex;align-items:center;gap:10px}
.ghost{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid #2c323b;color:var(--ink);font-size:14px;font-weight:500;text-decoration:none}
.ghost:hover{border-color:#5a6370}

.hero{position:absolute;left:0;right:0;top:42%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;text-align:center;gap:26px;padding:0 24px;will-change:transform,opacity}
.hero h1{max-width:980px;font-size:clamp(42px,6.6vw,88px);line-height:1.02;font-weight:600;letter-spacing:-.045em;color:#fff}
.hero p{max-width:640px;font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--muted)}
.cta{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:6px}
.cta span{font-size:13px;color:var(--soft)}

.finale{position:absolute;left:0;right:0;bottom:12%;display:flex;flex-direction:column;align-items:center;gap:18px;padding:0 16px;text-align:center;opacity:0;pointer-events:none;will-change:transform,opacity}
.finale h2{font-size:clamp(26px,3vw,40px);font-weight:600;letter-spacing:-.035em;color:#f4f6fa}
.finale .pill{min-height:48px;padding:0 26px;font-size:15px}
.finale span{font-size:13px;color:#b4bcc7}

/* Signup and payment dialogs */
dialog{width:min(640px,calc(100vw - 32px));max-height:calc(100svh - 32px);padding:28px 32px;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:18px;box-shadow:0 30px 120px #000c;overflow-y:auto}
dialog::backdrop{background:#020306c7;backdrop-filter:blur(10px)}
.dialog-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.16em;font-weight:500;color:var(--soft)}
.close-button{background:none;border:0;color:var(--soft);font-size:26px;width:44px;height:44px;display:grid;place-items:center;line-height:1;margin-right:-10px}
.close-button:hover{color:#fff}
.signup-title{display:flex;align-items:center;justify-content:space-between;gap:15px}
.signup-title h2{font-size:28px;font-weight:600;letter-spacing:-.03em;line-height:1.15}
.signup-title>span{font-size:22px;white-space:nowrap;font-weight:500}
.signup-title small{font-size:12px;color:var(--soft)}
.signup-description{font-size:14px;color:var(--soft);margin:8px 0 22px}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px}
#partner-form label,#partner-form legend{font-size:13px;font-weight:500;color:var(--muted)}
#partner-form legend>span{font-weight:400;color:var(--soft)}
#partner-form input:not([type=checkbox]),#partner-form select{display:block;width:100%;min-width:0;height:44px;background:var(--field);border:1px solid #2a2f38;border-radius:10px;margin-top:6px;padding:0 12px;color:#fff;font-size:15px}
#partner-form input::placeholder{color:#6f7884}
#partner-form input[aria-invalid=true],#partner-form select[aria-invalid=true]{border-color:#ff7a7a}
#partner-form fieldset{padding:0;border:0;margin:20px 0 18px}
.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:8px}
.service-grid label{position:relative;cursor:pointer}
.service-grid input{position:absolute;opacity:0;inset:0}
.service-grid span{display:block;font-size:14px;text-align:center;white-space:nowrap;border:1px solid #2a2f38;border-radius:10px;padding:11px 4px;background:var(--field);color:var(--muted)!important}
.service-grid input:checked+span{background:#eef1f6;border-color:#eef1f6;color:#07080b!important}
.service-grid input:focus-visible+span{outline:2px solid #fff;outline-offset:2px}
.terms-check{display:flex;align-items:flex-start;gap:10px;margin-top:20px}
.terms-check input{margin:3px 0 0;accent-color:#eef1f6;width:16px;height:16px;flex:none}
.terms-check>span{font-size:13px;line-height:1.6;color:var(--soft)!important}
.form-status{font-size:13px;color:#ff8a8a;line-height:1.5;min-height:24px;margin:12px 0 8px;overflow-wrap:anywhere}
.checkout-button{appearance:none;border:0;width:100%;min-height:52px;border-radius:999px;background:var(--ink);color:#07080b;font-size:15px;font-weight:500;display:flex;align-items:center;justify-content:center;gap:10px}
.checkout-button:hover{background:#fff}
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
#payment-dialog{width:min(480px,calc(100vw - 32px))}
#payment-dialog h2{font-size:30px;font-weight:600;letter-spacing:-.03em;line-height:1.2}
#payment-message{font-size:15px;color:var(--muted);line-height:1.7;margin:18px 0 28px}

@media(max-width:560px){
  .nav-inner{padding:16px}
  .hero{gap:20px;padding:0 16px}
  dialog{padding:20px}
  .field-grid{grid-template-columns:1fr}
  .signup-title h2{font-size:22px}
  #partner-form input:not([type=checkbox]),#partner-form select{font-size:16px}
}