*{box-sizing:border-box} :root{--ink:#0c123d;--muted:#7581b2;--shadow:0 18px 50px #34457425;font-family:Inter,Arial,sans-serif;color:var(--ink)}
html,body{margin:0;min-width:320px;background:#e4edfd}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;border:0;background:none}a{color:inherit;text-decoration:none}button svg{flex:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #614bea;outline-offset:5px}[hidden]{display:none!important}.skip-link{position:fixed;top:-100px;left:16px;z-index:100;background:white;padding:12px}.skip-link:focus{top:12px}

/* Cursor behaviour: the interface feels like an app, not a text document.
   Regular copy keeps the arrow; only real text-entry controls show the I-beam. */
html,body,.landing,.hero-copy,.metrics,.modal,.modal-card,.modal-copy,.auth-form,#infoDialog,#infoContent,.topic-list{cursor:default}
button,a,button *,a *{cursor:pointer}
input,textarea,[contenteditable="true"]{cursor:text}
.modal-backdrop{cursor:default}

/* Interactive micro-effects: desktop hover + tactile press feedback. */
.nav button,.login-link,.signup-top,.primary-cta,.secondary-cta,.menu-button,.mobile-nav button,.modal-close,.info-close,.auth-tab{transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease,border-color .22s ease,color .22s ease,opacity .22s ease,filter .22s ease}
.nav button,.login-link{position:relative}
.nav button::after,.login-link::after{content:"";position:absolute;left:0;right:0;bottom:5px;height:1.5px;border-radius:2px;background:currentColor;transform:scaleX(0);transform-origin:left center;opacity:.72;transition:transform .22s ease}
.primary-cta svg,.secondary-cta svg,.signup-top{transition:transform .22s ease}

@media (hover:hover) and (pointer:fine){
  .nav button:hover,.login-link:hover{color:#4057a6}
  .nav button:hover::after,.login-link:hover::after{transform:scaleX(1)}
  .signup-top:hover,.primary-cta:hover{transform:translateY(-2px) scale(1.015);box-shadow:0 10px 26px rgba(12,25,68,.22);filter:brightness(1.05)}
  .primary-cta:hover svg{transform:translateX(3px)}
  .secondary-cta:hover{transform:translateY(-2px);background:rgba(255,255,255,.58);border-color:#728bbd;box-shadow:0 9px 24px rgba(57,76,128,.13)}
  .secondary-cta:hover svg{transform:scale(1.08)}
  .menu-button:hover,.modal-close:hover,.info-close:hover{transform:translateY(-1px);filter:brightness(1.04)}
  .auth-tab:hover:not(.active){background:rgba(255,255,255,.52);color:#465b8f}
  .mobile-nav button:hover{transform:translateX(3px)}
}

.signup-top:active,.primary-cta:active,.secondary-cta:active,.menu-button:active,.mobile-nav button:active,.modal-close:active,.info-close:active,.auth-tab:active{transform:translateY(0) scale(.98);transition-duration:.08s}
.nav button:active,.login-link:active{opacity:.72}
.landing{position:relative;isolation:isolate;min-height:max(100svh,56.28vw);overflow:hidden}
.scene{position:absolute;inset:0;z-index:-2;background:url(assets/scene.png) center center/cover no-repeat}
.scene:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 29vw 31vw at 22% 36%,#fcfcffee 0%,#fcfcffe5 38%,#fafbff95 70%,transparent 100%),linear-gradient(180deg,#e2edff42,transparent 16%)}
.topbar{position:relative;z-index:5;width:89.24%;margin:0 auto;height:5.5vw;display:flex;align-items:center;gap:0}
.brand{font-weight:800;letter-spacing:-.075em;font-size:2.4vw;line-height:1;white-space:nowrap}.brand span{color:#536bff}
.nav{display:flex;align-items:center;gap:2.85vw;margin-left:4.3vw;white-space:nowrap}.nav button{font-size:.84vw;padding:12px 0;letter-spacing:-.025em}
.account-actions{display:flex;align-items:center;gap:2.45vw;margin-left:auto}.login-link{font-size:.85vw;white-space:nowrap;padding:12px 0;max-width:12vw;overflow:hidden;text-overflow:ellipsis}.signup-top{font-size:.9vw;height:2.85vw;padding:0 2vw;background:linear-gradient(120deg,#172347,#11182f);color:white;border-radius:100px;border:1px solid #15233b;white-space:nowrap}
.menu-button,.mobile-nav{display:none}
.hero-copy{position:relative;margin:3.9vw 0 0 5.38vw;width:38vw}.overline{margin:0 0 1.04vw;font-size:.74vw;font-weight:600;letter-spacing:.34em;color:#747eb0;line-height:1.5}
h1{font-size:4.79vw;letter-spacing:-.063em;line-height:.85;font-weight:800;margin:0}.line{display:block;white-space:nowrap}.gradient{background:linear-gradient(100deg,#3787ff 0%,#6565ff 35%,#a44bd1 68%,#f28d68 100%);background-clip:text;-webkit-background-clip:text;color:transparent;width:max-content}.gradient.last{background-image:linear-gradient(100deg,#438bff,#7959f0 52%,#ba55b5 78%,#f48a6b)}
.lead{font-size:1.35vw;letter-spacing:-.035em;line-height:1.36;color:#737fae;margin:1.35vw 0 0}.cta-row{display:flex;gap:.78vw;margin-top:1.5vw;align-items:center}.primary-cta,.secondary-cta{display:inline-flex;align-items:center;justify-content:center;gap:1vw;height:3.62vw;border-radius:100px;font-size:1.01vw;font-weight:500;white-space:nowrap}.primary-cta{background:linear-gradient(125deg,#111935,#14162e);border:1px solid #202746;color:white;padding:0 2.24vw}.primary-cta svg{height:1.3vw;width:1.3vw}.secondary-cta{border:1.4px solid #92a6cc;background:#fff3;padding:0 1.32vw;gap:1.02vw}.secondary-cta svg{width:1.58vw;height:1.58vw;color:#26367a}
.metrics{position:absolute;bottom:0;left:7.4%;width:85.2%;height:6.18vw;display:grid;grid-template-columns:repeat(4,1fr);align-items:center;padding:0 4.5vw;border:1px solid #fffffff0;border-bottom:0;border-radius:6vw 6vw 0 0;background:linear-gradient(115deg,#f7f7ffa8,#e5edffb8);backdrop-filter:blur(16px);box-shadow:0 0 60px #f0f5ff8c}.metrics article{display:flex;align-items:center;justify-content:center;gap:1.25vw;min-width:0;height:2.55vw}.metrics article+article{border-left:1px solid #bbc9eaa6}.metric-icon{width:2.2vw;height:2.3vw;flex:none;color:#3513b8}.metric-icon svg{width:100%;height:100%}.metrics strong{font-size:1.36vw;letter-spacing:-.045em;line-height:1.2;font-weight:700;display:block}.metrics small{font-size:.8vw;letter-spacing:-.03em;line-height:1.6;display:block;white-space:nowrap;color:#6c7fad}
.modal{position:fixed;inset:0;z-index:30;display:grid;place-items:center;opacity:0;pointer-events:none;transition:.2s ease}
.modal.open{opacity:1;pointer-events:auto}
.modal-backdrop{position:absolute;inset:0;background:rgba(16,28,65,.38);backdrop-filter:blur(16px) saturate(.9)}
.modal-card{width:min(470px,calc(100% - 34px));position:relative;z-index:1;border-radius:28px;overflow:hidden;background:rgba(250,252,255,.98);box-shadow:0 35px 100px rgba(57,76,128,.3)}
.modal-close{position:absolute;right:14px;top:14px;width:38px;height:38px;border-radius:50%;background:#fff;font-size:22px;box-shadow:var(--shadow);z-index:3}
.auth-form{padding:64px 34px 34px;display:grid;gap:14px}
.auth-tabs{display:flex;gap:6px;padding:4px;border-radius:999px;background:#edf2ff}
.auth-tab{flex:1;height:42px;border-radius:999px;font-weight:700;color:#6f7fa4}
.auth-tab.active{background:#fff;color:#1a2c66;box-shadow:0 6px 18px rgba(77,99,155,.1)}
.auth-form label{display:grid;gap:7px;font-size:13px;font-weight:700;color:#586b91}
.auth-form input{height:48px;border:1px solid #dbe4f5;background:#fff;border-radius:14px;padding:0 15px;outline:none;color:#19295f}
.auth-form input:focus{border-color:#7aa6ff;box-shadow:0 0 0 4px rgba(78,146,255,.09)}
.auth-submit{width:100%;margin-top:4px}
.toast{position:fixed;left:50%;bottom:22px;z-index:40;transform:translate(-50%,14px);opacity:0;background:#20325f;color:#fff;padding:12px 18px;border-radius:999px;font-size:14px;font-weight:700;box-shadow:var(--shadow);transition:.2s ease}.toast.show{opacity:1;transform:translate(-50%,0)}


.modal{visibility:hidden}.modal.open{visibility:visible}.modal-card{max-height:calc(100dvh - 32px);overflow:auto}.modal .primary-cta{height:52px;font-size:16px}
#infoDialog{color:var(--ink);width:min(560px,calc(100% - 32px));border:1px solid white;border-radius:28px;background:#f7faff;padding:40px;box-shadow:0 30px 100px #152b5355;max-height:calc(100dvh - 32px)}#infoDialog::backdrop{background:#16244e55;backdrop-filter:blur(8px)}#infoDialog h2{font-size:32px;letter-spacing:-.05em;line-height:1.12;margin:12px 0 22px}#infoDialog p,#infoDialog li{line-height:1.6;color:#596b96}#infoDialog .primary-cta{font-size:16px;height:48px;margin-top:14px}#infoDialog svg{width:20px;height:20px}.dialog-eyebrow{font-size:11px;letter-spacing:.24em}.info-close{position:absolute;top:14px;right:16px;font-size:28px}.topic-list{display:flex;gap:8px;flex-wrap:wrap}.topic-list span{padding:8px 12px;background:#e6edfc;border-radius:100px;font-size:14px}
@media(min-width:1001px) and (max-aspect-ratio:16/10){.scene{background-size:100% auto;background-position:center bottom;background-color:#e3edff}.hero-copy{margin-top:5vw}.scene:after{background:radial-gradient(ellipse 33vw 39vw at 22% 38%,#fcfcfff5 0%,#fcfcffe5 35%,#fafbff90 70%,transparent 100%)}}
@media(min-width:1001px) and (min-aspect-ratio:2/1){.landing{min-height:56.28vw}}
@media(max-width:1000px){
.landing{min-height:100svh;padding-bottom:0;display:flex;flex-direction:column;overflow:clip;background:radial-gradient(ellipse at 0 22%,#fffcff,#dfecff 75%)}
.topbar{height:auto;width:calc(100% - 48px);padding:20px 0;flex-wrap:wrap;gap:18px}.brand{font-size:36px}.nav{display:none}.account-actions{margin-left:auto;gap:18px}.login-link{font-size:14px;max-width:160px}.signup-top{font-size:14px;height:44px;padding:0 22px}.menu-button{display:grid;place-items:center;padding:5px;width:38px;height:44px}.menu-button svg{width:24px;height:24px}.mobile-nav{position:absolute;display:grid;top:76px;right:0;width:230px;padding:12px;border-radius:20px;background:#f8fbfff5;box-shadow:0 12px 40px #25356730;z-index:10}.mobile-nav button{text-align:left;padding:14px;border-radius:12px}.mobile-nav button:hover{background:#e8eeff}
.hero-copy{margin:24px 32px 0;width:auto;order:1}.overline{font-size:11px;letter-spacing:.29em;margin-bottom:20px}h1{font-size:clamp(44px,7.6vw,75px);line-height:.96;letter-spacing:-.064em}.lead{font-size:clamp(16px,2.3vw,21px);line-height:1.45;margin-top:20px;letter-spacing:-.025em}.cta-row{gap:12px;margin-top:24px}.primary-cta,.secondary-cta{height:54px;padding:0 25px;font-size:16px;gap:16px}.primary-cta svg{width:22px;height:22px}.secondary-cta svg{width:24px;height:24px}
.scene{position:relative;inset:auto;z-index:0;order:2;width:100%;height:72vw;min-height:350px;margin-top:16px;background-size:140% auto;background-position:right bottom}.scene:after{background:linear-gradient(180deg,#e0edff 0%,#e0edff40 9%,transparent 24%)}
.metrics{position:relative;order:3;bottom:auto;left:auto;width:calc(100% - 32px);margin:-12px auto 0;z-index:2;height:auto;min-height:150px;grid-template-columns:1fr 1fr;padding:20px 12px;gap:20px 0;border-radius:34px 34px 0 0;backdrop-filter:blur(14px)}.metrics article{height:auto;gap:16px;justify-content:flex-start;padding:0 20px}.metrics article:nth-child(3){border-left:0}.metric-icon{width:30px;height:32px}.metrics strong{font-size:21px}.metrics small{font-size:12px;white-space:normal;line-height:1.4;margin-top:3px}
}
@media(max-width:540px){.topbar{width:calc(100% - 32px);padding:16px 0;gap:14px}.brand{font-size:30px}.account-actions{gap:10px}.signup-top{display:none}.login-link{padding:10px 3px;font-size:14px}.hero-copy{margin:22px 20px 0}.overline{font-size:9px;letter-spacing:.23em;margin-bottom:17px}h1{font-size:clamp(36px,9.45vw,51px);line-height:.98}.lead{font-size:16px;line-height:1.45;max-width:440px;margin-top:20px}.desktop-break{display:none}.cta-row{gap:10px;flex-wrap:wrap}.primary-cta,.secondary-cta{height:50px;padding:0 18px;font-size:14px;gap:12px}.secondary-cta{padding:0 16px}.secondary-cta svg{width:22px;height:22px}.scene{height:93vw;min-height:320px;background-size:auto 100%;background-position:88% bottom;margin-top:22px}.metrics{padding:22px 5px;gap:24px 0}.metrics article{gap:10px;padding:0 9px}.metric-icon{width:25px;height:28px}.metrics strong{font-size:20px}.metrics small{font-size:10px;line-height:1.45}.modal-card{border-radius:24px}.auth-form{padding:60px 22px 24px}#infoDialog{padding:30px 24px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Final visual alignment with the 1672 × 941 reference. */
@media(min-width:1001px){
h1{font-size:4.67vw;line-height:.872}.lead{margin-top:1vw}.cta-row{margin-top:1.38vw}.secondary-cta{font-size:.94vw}.metrics{padding-bottom:.6vw}
.scene:after{background:radial-gradient(ellipse 29vw 29vw at 16% 36%,#fcfcfff5 0%,#fcfcffe8 42%,#fafbff8a 72%,transparent 100%),linear-gradient(180deg,#e2edff8a,transparent 16%)}
}
@media(min-width:1001px) and (max-aspect-ratio:16/10){.scene:before{content:"";position:absolute;bottom:0;left:0;width:100%;height:56.28vw;background:linear-gradient(180deg,#e3edff 0%,#e3edff70 10%,transparent 28%)}}
@media(max-width:1000px){.scene{mask-image:linear-gradient(180deg,transparent,#000 16%);-webkit-mask-image:linear-gradient(180deg,transparent,#000 16%)}}
