:root { font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:#e7edf9; background:#0b1220; color-scheme:dark;}
* {box-sizing:border-box}
body {margin:0; min-height:100vh; background: radial-gradient(ellipse at top,#172b4a 0%,#0b1220 62%);}
a {color:#7dd3fc; text-underline-offset:3px}
a:hover {color:#bef0ff}
header {border-bottom:1px solid #ffffff18; background:#0e1729ba; backdrop-filter: blur(12px)}
nav {margin:auto; max-width:950px; padding:18px 24px; display:flex; gap:20px; align-items:center; flex-wrap:wrap;}
nav .brand {color:white; font-weight:800; font-size:1.08rem; text-decoration:none; margin-right:auto}
nav a {color:#c5d3e6; font-size:.94rem; text-decoration:none}
main {max-width:875px; margin:40px auto; padding:0 20px 56px}
article {padding:32px clamp(20px,4vw,52px); background:#132035; border:1px solid #ffffff21; border-radius:22px; box-shadow:0 20px 70px #04091460; line-height:1.78;}
article h1 {font-size:clamp(1.75rem,4vw,2.55rem); margin-top:0; letter-spacing:-.035em; line-height:1.2}
article h2 {font-size:1.13rem; color:#ffffff; margin:32px 0 8px; border-top:1px solid #ffffff14; padding-top:22px}
article p {color:#d7e2ef; margin:10px 0 14px}
article ul, article ol {padding-left:24px;color:#d7e2ef}
article li {margin:6px 0}
article strong {color:#fff}
article .meta {color:#a9c0db;font-size:.9rem}
footer {margin:24px auto 0;max-width:950px;padding:20px 24px 38px;color:#8da8c8; font-size:.85rem}
.hero {padding:36px 38px;background:#132035;border:1px solid #ffffff1d;border-radius:22px}
.hero h1{font-size:2.4rem; margin:0 0 12px}
.hero p{color:#becde0; max-width:60ch}
.cards {display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:15px;margin-top:20px}
.card {display:block;padding:24px;border:1px solid #ffffff21;border-radius:16px;background:#16273f;text-decoration:none;color:#fff}
.card h2{margin:0 0 9px;font-size:1.15rem}
.card p{margin:0;font-size:.92rem;line-height:1.5;color:#9eb7d5}
.notice {margin-top:20px;color:#fcd34d;font-size:.9rem}
@media (max-width:620px) { nav {gap:12px} main {margin:20px auto} .hero{padding:25px} article{padding:25px 21px} }