:root{--ink:#1D1D1F;--muted:#6E6E73;--hair:#E8E8ED;--butter:#FFFF8C;--ease:cubic-bezier(.22,1,.36,1);--sf:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text",Inter,system-ui,sans-serif}
*{box-sizing:border-box}
html{background:#fff}
body{margin:0;background:#fff;color:var(--ink);font:400 17px/1.55 var(--sf);-webkit-font-smoothing:antialiased;padding-inline:clamp(16px,2.2vw,36px)}
a{color:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:10px}
.metal{background:linear-gradient(178deg,#5C5C64 0%,#2A2A30 42%,#0E0E11 78%,#2E2E34 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.metal-w{background:linear-gradient(178deg,#fff 0%,#EDEDF2 45%,#B4B4BD 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
/* nav pill */
.nav{position:fixed;top:18px;left:clamp(16px,2.2vw,36px);right:clamp(16px,2.2vw,36px);z-index:60;max-width:1480px;margin:0 auto;height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 8px 0 22px;border-radius:99px;
  background:linear-gradient(140deg,rgba(255,255,255,.66),rgba(255,255,255,.34));-webkit-backdrop-filter:blur(24px) saturate(190%);backdrop-filter:blur(24px) saturate(190%);
  border:1px solid rgba(255,255,255,.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(255,255,255,.25),0 1px 2px rgba(22,22,40,.05),0 18px 40px -20px rgba(22,22,40,.3)}
.nav-l{display:flex;align-items:center;gap:6px}
.nav .logo{line-height:0}.nav .logo img{height:24px;width:auto;display:block}
.nav-link{font-size:15px;font-weight:600;color:var(--ink);text-decoration:none;padding:9px 14px;border-radius:99px;margin-left:10px}
.nav-link:hover,.nav-link[aria-current=page]{background:rgba(29,29,31,.06)}
.nav-cta{font-size:15px;font-weight:700;color:var(--ink);text-decoration:none;padding:13px 20px;border-radius:99px;background:var(--butter);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 6px 16px -8px rgba(160,150,0,.5);white-space:nowrap}
@media (max-width:560px){.nav{height:56px;padding:0 6px 0 16px}.nav .logo img{height:18px}.nav-link{font-size:14px;padding:8px 10px;margin-left:2px}.nav-cta{font-size:13.5px;padding:11px 14px}}
@media (max-width:360px){.nav .logo img{height:15px}.nav-link{display:none}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 16px var(--sf);color:var(--ink);text-decoration:none;padding:16px 26px;border-radius:99px;border:0;background:var(--butter);cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 10px 24px -12px rgba(160,150,0,.55);transition:transform .2s var(--ease)}
.btn:hover{transform:translateY(-1px)}
footer{max-width:1440px;margin:0 auto;padding:24px 0 20px;border-top:1px solid var(--hair);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13.5px;color:var(--muted)}
footer nav{display:flex;gap:18px}footer a{text-decoration:none}
@media (prefers-reduced-motion:no-preference){.rv{animation:rise .9s var(--ease) both;animation-delay:var(--d,0s)}@keyframes rise{from{opacity:0;transform:translateY(18px)}}}
html,body{overflow-x:clip}
/* nav: left-aligned pill, no CTA */
.nav{left:max(clamp(16px,2.2vw,36px),calc((100vw - 1480px)/2));right:auto;width:auto;margin:0;padding:0 8px 0 20px;justify-content:flex-start}
.nav-cta{display:none}
.lang{position:relative;margin-left:6px}
.lang-btn{display:inline-flex;align-items:center;gap:7px;height:44px;padding:0 14px;border-radius:99px;border:0;cursor:pointer;font:700 14px var(--sf);color:#fff;background:linear-gradient(140deg,rgba(44,44,50,.92),rgba(22,22,26,.86));box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 6px 16px -8px rgba(0,0,0,.5)}
.lang-btn svg{width:17px;height:17px}.lang-btn .chev{width:12px;height:12px;opacity:.7;transition:transform .25s}
.lang.open .chev{transform:rotate(180deg)}
.lang-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:150px;padding:6px;border-radius:18px;display:none;flex-direction:column;background:linear-gradient(140deg,rgba(255,255,255,.85),rgba(255,255,255,.62));-webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);border:1px solid rgba(255,255,255,.7);box-shadow:inset 0 1px 0 #fff,0 18px 40px -16px rgba(22,22,40,.35)}
.lang.open .lang-menu{display:flex}
.lang-menu button{text-align:left;font:600 14.5px var(--sf);padding:10px 12px;border-radius:12px;border:0;background:transparent;color:#1D1D1F;cursor:pointer}
.lang-menu button:hover,.lang-menu button[aria-current=true]{background:rgba(29,29,31,.06)}
@media (max-width:560px){.lang-btn{height:40px;padding:0 11px}.lang-btn>svg:first-child{display:none}}
/* CTA hover glow */
@property --a{syntax:'<angle>';initial-value:0deg;inherits:false}
.btn{position:relative;isolation:isolate}
.btn::before{content:"";position:absolute;inset:-3px;border-radius:inherit;padding:2px;z-index:-1;opacity:0;transition:opacity .35s var(--ease);background:conic-gradient(from var(--a),rgba(255,248,150,0) 0deg,rgba(255,248,150,0) 200deg,#FFF8A6 250deg,#FFFEEA 290deg,#FFF38A 320deg,rgba(255,248,150,0) 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.btn::after{content:"";position:absolute;inset:-10px;border-radius:inherit;z-index:-2;opacity:0;transition:opacity .35s var(--ease);background:conic-gradient(from var(--a),transparent 0 220deg,rgba(255,250,160,.6) 290deg,transparent 340deg);filter:blur(14px)}
.btn:hover::before,.btn:hover::after,.btn:focus-visible::before,.btn:focus-visible::after{opacity:1;animation:btnSpin 2.4s linear infinite}
@keyframes btnSpin{to{--a:360deg}}
@media (prefers-reduced-motion:reduce){.btn:hover::before,.btn:hover::after{animation:none}}

/* traditional nav (v3) */
.nav{position:absolute;top:18px;left:max(clamp(16px,2.2vw,36px),calc((100vw - 1480px)/2));right:max(clamp(16px,2.2vw,36px),calc((100vw - 1480px)/2));width:auto;max-width:none;margin:0;height:56px;padding:0;display:flex;justify-content:space-between;align-items:center;background:transparent;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;border-radius:0}
.nav .logo img{height:26px}
.nav-r{display:flex;align-items:center;gap:6px}
.nav-link{margin-left:0}
.lang-btn{height:34px;padding:0 10px;gap:4px;background:transparent;color:#1D1D1F;box-shadow:none;border:1px solid rgba(29,29,31,.14);font:600 13px var(--sf)}
.lang-btn:hover{background:rgba(29,29,31,.05)}
.lang-btn .chev{width:10px;height:10px}
.lang-menu{left:auto;right:0;min-width:132px}
.metal,.metal-w{padding:0 .08em .12em .02em;margin-right:-.08em;margin-left:-.02em}

/* sign-up success card */
.yay{display:flex;align-items:center;gap:14px;text-align:left;padding:16px 22px 16px 16px;border-radius:24px;max-width:520px;width:100%;box-sizing:border-box;
  background:linear-gradient(140deg,rgba(255,255,255,.94),rgba(255,255,255,.74));-webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);
  border:1px solid rgba(255,255,255,.85);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(22,22,40,.05),0 20px 44px -22px rgba(22,22,40,.4);animation:yayIn .6s cubic-bezier(.22,1,.36,1) both}
.yay-ic{flex:none;width:46px;height:46px;border-radius:50%;background:#FFFF8C;display:grid;place-items:center;animation:yayPulse 1.4s ease-out .25s 2}
.yay-ic svg{width:22px;height:22px}
.yay-t b{display:block;font-size:19px;font-weight:800;letter-spacing:-.02em;color:#1D1D1F}
.yay-t p{margin:3px 0 0;font-size:14.5px;line-height:1.45;color:#3A3A3C}
.yay-t small{display:block;margin-top:5px;font-size:12.5px;color:#8E8E93}
.yay-compact{padding:7px 18px 7px 7px;border-radius:99px}
.yay-compact .yay-ic{width:36px;height:36px}.yay-compact .yay-ic svg{width:18px;height:18px}
.yay-compact .yay-t{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.yay-compact .yay-t b{font-size:15.5px}.yay-compact .yay-t span{font-size:13.5px;color:#6E6E73}
.htop .yay{margin-inline:auto}
@keyframes yayIn{from{opacity:0;transform:scale(.94) translateY(8px)}}
@keyframes yayPulse{0%{box-shadow:0 0 0 0 rgba(255,236,90,.65)}100%{box-shadow:0 0 0 18px rgba(255,236,90,0)}}
@media (prefers-reduced-motion:reduce){.yay,.yay-ic{animation:none}}