:root { --bg0:#06131f; --bg1:#071a2a; --stroke:#203a55; --text:#e9f2ff; --muted:#a8b7c9; --accent:#55c3ff; --shadow:0 12px 40px rgba(0,0,0,.35); --r:18px; }
* { box-sizing:border-box; }
body { margin:0; color:var(--text); font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; background:radial-gradient(1000px 600px at 20% 10%,rgba(66,135,245,.18),transparent 60%),radial-gradient(900px 500px at 85% 20%,rgba(0,255,213,.10),transparent 60%),linear-gradient(180deg,var(--bg0),var(--bg1)); min-height:100vh; line-height:1.65; }
.wrap { max-width:1100px; margin:22px auto; padding:0 18px; }
.card { background:rgba(8,22,36,.58); border:1px solid rgba(32,58,85,.75); border-radius:var(--r); box-shadow:var(--shadow); }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px; }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--text); }
.logo { width:100px; height:110px; object-fit:contain; display:block; }
.brand-name { font-size:clamp(1.1rem,3vw,1.625rem); font-weight:700; line-height:1.2; }
.btn { border:1px solid var(--stroke); border-radius:12px; padding:10px 12px; text-decoration:none; }
a { color:var(--accent); overflow-wrap:anywhere; text-underline-offset:3px; }
a:hover { text-decoration:underline; }
a:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
main { margin-top:16px; padding:clamp(20px,4vw,44px); overflow-wrap:anywhere; }
h1 { font-size:clamp(1.8rem,5vw,2.5rem); line-height:1.2; margin:0 0 24px; }
h2 { font-size:1.35rem; line-height:1.35; margin:32px 0 12px; }
h3 { font-size:1.1rem; margin:24px 0 10px; }
p { margin:0 0 16px; }
ul { padding-left:24px; }
li { margin:8px 0; }
.footer { padding:20px 4px; color:var(--muted); font-size:.9rem; }
.footer nav { display:flex; gap:20px; flex-wrap:wrap; }
.footer a { display:inline-block; padding:8px 0; }
.skip-link { position:absolute; top:-100px; left:16px; padding:12px; background:var(--bg0); z-index:10; }
.skip-link:focus { top:8px; }
@media (max-width:600px) { .wrap { margin:12px auto; padding:0 12px; } .topbar { flex-wrap:wrap; } .logo { width:72px; height:76px; } .btn { min-height:44px; } }