:root { color-scheme: dark; font-family: Inter, "Segoe UI", Arial, sans-serif; background: #07100b; color: #f4fff7; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 80% -5%, rgba(31,222,105,.2), transparent 32%), radial-gradient(circle at 5% 70%, rgba(111,89,255,.13), transparent 34%), #07100b; }
main { width: min(960px, calc(100% - 36px)); margin: 0 auto; padding: 52px 0 80px; }
.brand { display: flex; align-items: center; gap: 14px; margin-bottom: 56px; }
.brand img { width: 58px; height: 58px; }
.brand strong { display: block; font-size: 25px; letter-spacing: -.04em; }
.brand span { color: #91a097; font-size: 10px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.hero { display: grid; grid-template-columns: 1fr minmax(300px, .75fr); gap: 44px; align-items: center; }
.eyebrow { color: #79f2ad; font-size: 12px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
h1 { margin: 14px 0; font-size: clamp(48px, 8vw, 78px); line-height: .98; letter-spacing: -.065em; }
h2 { margin-top: 42px; font-size: 27px; letter-spacing: -.035em; }
p, li { color: #b2beb6; font-size: 16px; line-height: 1.7; }
.hero img { width: 100%; border: 1px solid rgba(255,255,255,.11); border-radius: 22px; box-shadow: 0 35px 80px rgba(0,0,0,.38); }
.actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.button { display: inline-flex; align-items: center; min-height: 44px; padding: 0 17px; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; color: #f3fff7; background: rgba(255,255,255,.045); font-weight: 750; text-decoration: none; }
.button.primary { border-color: transparent; color: #03140a; background: #79f2ad; }
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; margin-top: 28px; }
.card { padding: 20px; border: 1px solid rgba(255,255,255,.075); border-radius: 18px; background: rgba(255,255,255,.038); }
.card strong { display: block; margin-bottom: 8px; font-size: 18px; }
.card p { margin: 0; font-size: 13px; }
.policy { max-width: 800px; }
.policy h1 { font-size: clamp(42px, 7vw, 68px); }
code { padding: 2px 5px; border-radius: 5px; background: rgba(255,255,255,.07); }
footer { margin-top: 56px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.07); color: #7f8e85; font-size: 12px; }
@media (max-width: 760px) { .hero { grid-template-columns: 1fr; }.grid { grid-template-columns: 1fr; }.brand { margin-bottom: 38px; } }
