:root { color-scheme: dark; --bg:#0a0d12; --panel:#111722; --line:#263041; --text:#f4f6fa; --muted:#98a5b8; --accent:#7be0b8; }
* { box-sizing:border-box; }
html { min-height:100%; background:var(--bg); }
body { min-height:100vh; margin:0; color:var(--text); background:radial-gradient(circle at 70% 0%,#16263a 0,transparent 38%),var(--bg); font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; display:flex; flex-direction:column; }
a { color:inherit; }
.site-header, footer { width:min(1120px,calc(100% - 40px)); margin:0 auto; display:flex; align-items:center; justify-content:space-between; }
.site-header { min-height:88px; border-bottom:1px solid var(--line); }
.brand { font-weight:800; letter-spacing:.08em; text-decoration:none; }
.brand span { color:var(--accent); }
nav { display:flex; gap:24px; }
nav a { color:var(--muted); text-decoration:none; font-size:14px; }
nav a:hover, nav a[aria-current="page"] { color:var(--text); }
main { width:min(1120px,calc(100% - 40px)); margin:auto; }
.hero { max-width:780px; padding:92px 0 64px; }
.eyebrow { color:var(--accent); text-transform:uppercase; letter-spacing:.14em; font-size:12px; font-weight:700; }
h1 { margin:.2em 0; font-size:clamp(44px,7vw,82px); line-height:1.02; letter-spacing:-.045em; }
.lead { max-width:670px; color:var(--muted); font-size:clamp(18px,2.2vw,24px); }
.status { display:inline-flex; align-items:center; gap:10px; margin-top:20px; padding:10px 16px; border:1px solid #285d4c; border-radius:999px; background:#10251f; font-size:14px; }
.status span { width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 14px var(--accent); }
.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; padding-bottom:72px; }
article { padding:24px; background:rgba(17,23,34,.82); border:1px solid var(--line); border-radius:16px; }
article p, article small { margin:0; color:var(--muted); }
article strong { display:block; margin:8px 0; font-size:20px; }
.document { max-width:760px; padding:80px 0; }
.document h1 { font-size:clamp(42px,6vw,68px); }
.document > p:not(.eyebrow) { color:var(--muted); font-size:19px; }
.back { display:inline-block; margin-top:26px; color:var(--accent); text-decoration:none; }
footer { padding:28px 0; color:var(--muted); border-top:1px solid var(--line); font-size:13px; }
@media (max-width:700px) { .site-header { align-items:flex-start; flex-direction:column; justify-content:center; gap:8px; } nav { gap:14px; } .hero { padding-top:64px; } .grid { grid-template-columns:1fr; } footer { align-items:flex-start; flex-direction:column; gap:4px; } }