:root { color-scheme: dark; }
html { background: #0b0c0f; scroll-behavior: smooth; }
body { margin: 0; background: #0b0c0f; }
.next-landing { --bg:#0b0c0f; --surface:rgba(255,255,255,.045); --line:rgba(255,255,255,.11); --text:#f5f4f1; --muted:rgba(245,244,241,.58); --gold:#c9a961; overflow:hidden; background:var(--bg); color:var(--text); font-family:"Avenir Next","Trebuchet MS",sans-serif; }
.nl-nav { position:fixed; z-index:30; top:0; left:0; right:0; height:72px; padding:0 clamp(20px,5vw,72px); display:flex; align-items:center; justify-content:space-between; box-sizing:border-box; background:rgba(11,12,15,.72); border-bottom:1px solid rgba(255,255,255,.06); backdrop-filter:blur(18px); }
.nl-logo { color:var(--text); text-decoration:none; font:600 18px "Avenir Next Condensed","Trebuchet MS",sans-serif; letter-spacing:.35em; }
.nl-nav__cta { color:#111; background:#f2eee5; text-decoration:none; padding:11px 18px; border-radius:999px; font-weight:600; transition:transform .3s ease,box-shadow .3s ease; }
.nl-nav__cta:hover,.nl-button:hover { transform:translateY(-2px); box-shadow:0 12px 36px rgba(201,169,97,.22); }
.nl-hero { min-height:100svh; padding:clamp(120px,15vh,170px) clamp(20px,7vw,110px) clamp(70px,10vh,110px); box-sizing:border-box; display:grid; grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr); gap:clamp(44px,7vw,110px); align-items:center; position:relative; isolation:isolate; }
.nl-glow { position:absolute; z-index:-1; width:42vw; height:42vw; border-radius:50%; filter:blur(100px); opacity:.12; pointer-events:none; }
.nl-glow--one { background:#c9a961; top:-20vw; right:4vw; }.nl-glow--two { background:#77869d; bottom:-24vw; left:-18vw; }
.nl-eyebrow { margin:0 0 18px; color:var(--gold); text-transform:uppercase; letter-spacing:.18em; font-size:12px; font-weight:600; }
.nl-hero h1,.nl-section h2,.nl-contrast h2,.nl-early h2,.nl-final h2 { margin:0; font-family:"Avenir Next Condensed","Trebuchet MS",sans-serif; font-weight:400; letter-spacing:-.045em; line-height:1.04; }
.nl-hero h1 { font-size:clamp(46px,6.6vw,102px); max-width:980px; }.nl-hero h1 span { color:rgba(245,244,241,.44); }
.nl-lead { max-width:650px; margin:28px 0 0; color:var(--muted); font-size:clamp(18px,2vw,25px); line-height:1.45; }
.nl-actions { display:flex; align-items:center; gap:22px; margin-top:34px; flex-wrap:wrap; }
.nl-button { display:inline-flex; justify-content:center; align-items:center; min-height:54px; padding:0 27px; box-sizing:border-box; color:#15120d; background:linear-gradient(135deg,#f4efe4,#c9a961); text-decoration:none; border-radius:999px; font-weight:600; transition:transform .35s ease,box-shadow .35s ease; }
.nl-text-link { color:var(--text); text-underline-offset:5px; }.nl-trust { margin:18px 0 0; color:var(--muted); font-size:13px; }
.nl-board-wrap { width:min(100%,560px); justify-self:end; transform:rotate(2deg); }.nl-board { padding:clamp(10px,1.5vw,17px); display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(7px,1vw,12px); aspect-ratio:1; background:rgba(255,255,255,.045); border:1px solid var(--line); border-radius:clamp(22px,3vw,38px); box-shadow:inset 0 1px rgba(255,255,255,.08),0 35px 100px rgba(0,0,0,.5); backdrop-filter:blur(20px); }
.nl-tile { display:grid; place-items:center; border-radius:clamp(10px,1.4vw,18px); color:#11131a; font:600 clamp(17px,2.4vw,34px) "Avenir Next Condensed","Trebuchet MS",sans-serif; background-image:repeating-linear-gradient(115deg,rgba(255,255,255,.16) 0 1px,rgba(0,0,0,.04) 1px 3px),linear-gradient(145deg,#f4f5f7,#aeb5c0); box-shadow:inset 0 1px rgba(255,255,255,.6),inset 0 -8px 14px rgba(0,0,0,.12); }
.nl-tile--64,.nl-tile--128,.nl-tile--256 { background-image:repeating-linear-gradient(115deg,rgba(255,255,255,.16) 0 1px,rgba(0,0,0,.04) 1px 3px),linear-gradient(145deg,#eadfca,#aa8742); }
.nl-board__caption { display:flex; justify-content:space-between; margin-top:15px; color:var(--muted); font-size:11px; letter-spacing:.16em; }
.nl-section,.nl-contrast { padding:clamp(85px,12vw,180px) clamp(20px,7vw,110px); }.nl-section__head { max-width:850px; }.nl-section h2,.nl-contrast h2,.nl-early h2,.nl-final h2 { font-size:clamp(38px,5.7vw,82px); }
.nl-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:clamp(45px,7vw,90px); }.nl-card { min-height:250px; padding:30px; border:1px solid var(--line); border-radius:26px; background:var(--surface); box-sizing:border-box; }.nl-card b { color:var(--gold); font:400 13px "Avenir Next Condensed","Trebuchet MS",sans-serif; letter-spacing:.18em; }.nl-card h3 { margin:70px 0 13px; font:500 clamp(21px,2vw,28px) "Avenir Next Condensed","Trebuchet MS",sans-serif; }.nl-card p { margin:0; color:var(--muted); font-size:17px; line-height:1.5; }
.nl-contrast { display:grid; grid-template-columns:1fr 1fr; gap:clamp(50px,8vw,130px); align-items:end; background:linear-gradient(180deg,#101115,#08090b); }.nl-compare { display:grid; gap:12px; }.nl-compare div { padding:25px 28px; border:1px solid var(--line); border-radius:20px; color:var(--muted); }.nl-compare span,.nl-compare strong { display:block; }.nl-compare span { margin-bottom:8px; font-size:12px; letter-spacing:.15em; text-transform:uppercase; }.nl-compare strong { color:var(--text); font-size:19px; line-height:1.4; }.nl-compare .is-next { border-color:rgba(201,169,97,.45); background:rgba(201,169,97,.06); }
.nl-days { display:grid; grid-template-columns:repeat(10,1fr); gap:10px; margin-top:55px; }.nl-days span { aspect-ratio:1; display:grid; place-items:center; border:1px solid var(--line); border-radius:12px; color:var(--muted); font:500 clamp(10px,1.1vw,14px) "Avenir Next Condensed","Trebuchet MS",sans-serif; }.nl-days .is-active { color:#15120d; border-color:var(--gold); background:linear-gradient(145deg,#f2e9d7,#c9a961); }.nl-progress__note { max-width:680px; margin:24px 0 0; color:var(--muted); font-size:16px; line-height:1.5; }
.nl-early { margin:0 clamp(20px,7vw,110px); padding:clamp(35px,6vw,75px); display:grid; grid-template-columns:1.1fr .9fr; gap:50px; align-items:end; border:1px solid rgba(201,169,97,.35); border-radius:32px; background:linear-gradient(135deg,rgba(201,169,97,.08),rgba(255,255,255,.02)); }.nl-early p:last-child { color:var(--muted); font-size:18px; line-height:1.6; margin:0; }
.nl-final { min-height:80svh; padding:100px 20px; box-sizing:border-box; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; }.nl-final p:not(.nl-eyebrow) { color:var(--muted); font-size:19px; }.nl-final .nl-button { margin-top:20px; }.nl-footer { padding:24px clamp(20px,7vw,110px); display:flex; justify-content:space-between; gap:20px; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
.reveal { opacity:0; transform:translateY(30px); transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1); }.reveal.visible { opacity:1; transform:translateY(0); }
@media (max-width:820px) { .nl-nav { height:64px; }.nl-nav__cta { padding:9px 14px; font-size:14px; }.nl-hero { grid-template-columns:1fr; padding-top:110px; }.nl-board-wrap { width:min(92vw,520px); justify-self:center; transform:none; }.nl-steps,.nl-contrast,.nl-early { grid-template-columns:1fr; }.nl-days { grid-template-columns:repeat(5,1fr); }.nl-card { min-height:220px; }.nl-card h3 { margin-top:50px; }.nl-footer { flex-direction:column; }.nl-early { gap:28px; } }
@media (max-width:420px) { .nl-logo { font-size:15px; }.nl-hero h1 { font-size:42px; }.nl-actions { align-items:stretch; flex-direction:column; }.nl-text-link { text-align:center; }.nl-button { width:100%; }.nl-board__caption { font-size:9px; }.nl-days { gap:7px; }.nl-days span { border-radius:9px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.reveal { opacity:1; transform:none; transition:none; } }
