:root { color-scheme: dark; --bg: #070c14; --surface: #101a27; --line: rgba(161, 187, 211, .16); --text: #f4f8fb; --muted: #a7b7c8; --accent: #00e5a3; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; color: var(--text); background: radial-gradient(ellipse at 15% 0%, rgba(0, 229, 163, .09), transparent 35%), var(--bg); font-family: Inter, system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--accent); text-underline-offset: .2em; }
a:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 3px; }
.site-header { border-bottom: 1px solid var(--line); background: rgba(7, 12, 20, .88); }
.nav { width: min(1080px, calc(100% - 48px)); min-height: 76px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: inline-flex; align-items: center; gap: 12px; color: var(--text); text-decoration: none; font-size: 1.05rem; font-weight: 800; letter-spacing: -.03em; }
.brand img { width: 38px; height: 38px; border-radius: 11px; }
.home-link { color: var(--muted); text-decoration: none; font-size: .9rem; font-weight: 600; }
.home-link:hover, .site-footer a:hover { color: var(--accent); }
.shell { width: min(900px, calc(100% - 48px)); margin: auto; padding: 72px 0 80px; }
.hero { padding: 0 0 44px; border-bottom: 1px solid var(--line); margin-bottom: 26px; }
.eyebrow { display: inline-block; margin: 0 0 20px; color: var(--accent); font-size: .75rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
h1 { margin: 0 0 18px; font-size: clamp(2.7rem, 6vw, 4.6rem); line-height: 1.04; letter-spacing: -.055em; }
.lead { margin: 0 0 12px; color: var(--muted); line-height: 1.7; }
.lead.compact { max-width: 62ch; margin-bottom: 0; font-size: 1.08rem; }
.card { padding: 28px 32px; margin-bottom: 14px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(145deg, rgba(19, 31, 45, .95), rgba(13, 22, 34, .95)); }
h2 { margin: 0 0 14px; color: var(--text); font-size: 1.13rem; line-height: 1.35; letter-spacing: -.02em; }
p, li { color: #c1cdd9; font-size: .96rem; line-height: 1.8; }
.card p { margin: 0 0 14px; }
.card p:last-child { margin-bottom: 0; }
ul { margin: 0; padding-left: 1.3rem; }
li { padding-left: .25rem; margin: .35rem 0; }
li::marker { color: var(--accent); }
strong { color: var(--text); }
.site-footer { border-top: 1px solid var(--line); }
.site-footer div { width: min(1080px, calc(100% - 48px)); margin: auto; padding: 28px 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; color: var(--muted); font-size: .85rem; }
.site-footer a { color: var(--muted); text-decoration: none; }
@media (max-width: 600px) { .nav, .shell, .site-footer div { width: calc(100% - 32px); } .nav { min-height: 68px; } .shell { padding: 48px 0 56px; } .hero { padding-bottom: 32px; } .card { padding: 23px 20px; border-radius: 15px; } .home-link { font-size: .82rem; } }
