:root { --bg:#0f0f12; --fg:#f7f7f8; --muted:#a8a8ad; --brand:#ff2d55; --brand2:#ff8a00; }
* { box-sizing: border-box; }
html,body { margin:0; height:100%; background:radial-gradient(1200px 700px at 70% -10%, #1a1a1f 0, #0f0f12 60%); color:var(--fg); font:16px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Inter, sans-serif; }
.wrap { max-width:960px; margin:0 auto; padding:48px 20px 64px; }
.header { text-align:center; margin-bottom:28px; }
.logo { width:88px; height:88px; object-fit:contain; filter:drop-shadow(0 6px 16px rgba(0,0,0,.45)); }
h1 { margin:16px 0 8px; font-size:44px; letter-spacing:.3px; }
.tag { margin:0 auto; max-width:700px; color:var(--muted); }
.cta { display:flex; gap:12px; justify-content:center; margin:28px 0 36px; flex-wrap:wrap; }
.btn { padding:12px 18px; border-radius:12px; background:linear-gradient(90deg,var(--brand),var(--brand2)); color:#fff; text-decoration:none; font-weight:600; }
.btn.ghost { background:transparent; border:1px solid #2a2a31; color:#fff; }
.grid { display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
.card { background:#141419; border:1px solid #22232a; border-radius:14px; padding:18px; }
.card h3 { margin:0 0 6px; }
.foot { margin-top:56px; text-align:center; color:var(--muted); font-size:14px; }