:root { color-scheme: dark; --bg:#07080a; --panel:#111319; --ink:#f7f4ed; --muted:#aeb3bd; --line:rgba(255,255,255,.12); --accent:#f2c665; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:radial-gradient(900px 500px at 70% -10%,rgba(255,210,115,.13),transparent 65%),var(--bg); color:var(--ink); font:500 16px/1.65 "Space Grotesk",system-ui,sans-serif; }
a { color:inherit; }
.wrap { width:min(1100px,calc(100% - 40px)); margin:auto; }
nav { height:76px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:flex; align-items:center; gap:10px; font-weight:700; text-decoration:none; font-size:1.1rem; }
.brand img { width:34px; height:34px; }
.nav-links { display:flex; align-items:center; gap:22px; }
.nav-links a { color:var(--muted); text-decoration:none; font-size:.92rem; }
.button { display:inline-flex; align-items:center; justify-content:center; padding:12px 20px; border-radius:999px; background:var(--ink); color:#090a0c!important; text-decoration:none; font-weight:700; }
.hero { padding:100px 0 80px; max-width:850px; }
.eyebrow { color:var(--accent); text-transform:uppercase; letter-spacing:.16em; font-size:.78rem; font-weight:700; }
h1 { margin:14px 0 22px; max-width:800px; font-size:clamp(2.7rem,7vw,5.6rem); line-height:.98; letter-spacing:-.055em; }
.lede { max-width:690px; color:#d1d4da; font-size:clamp(1.1rem,2vw,1.3rem); }
.hero-actions { display:flex; gap:14px; margin-top:32px; flex-wrap:wrap; }
.secondary { background:transparent; color:var(--ink)!important; border:1px solid var(--line); }
.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; padding:20px 0 92px; }
.card { padding:28px; border:1px solid var(--line); border-radius:24px; background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018)); }
.card h2 { margin:0 0 10px; font-size:1.28rem; }
.card p { margin:0; color:var(--muted); }
.story { display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; padding:80px 0; border-top:1px solid var(--line); }
.story h2 { margin:0; font-size:clamp(2rem,4vw,3.2rem); line-height:1.05; letter-spacing:-.035em; }
.story p { margin:0 0 18px; color:#c7cad1; }
.related { padding:70px 0; border-top:1px solid var(--line); }
.related h2 { font-size:1rem; color:var(--muted); }
.related-links { display:flex; flex-wrap:wrap; gap:12px; }
.related-links a { padding:10px 15px; border:1px solid var(--line); border-radius:999px; text-decoration:none; }
footer { display:flex; justify-content:space-between; gap:25px; padding:34px 0 50px; border-top:1px solid var(--line); color:var(--muted); font-size:.86rem; }
footer div { display:flex; gap:16px; }
@media (max-width:760px) { .nav-links a:not(.button){display:none}.hero{padding-top:65px}.grid{grid-template-columns:1fr}.story{grid-template-columns:1fr;gap:28px}footer{flex-direction:column} }