:root { font-family: "Segoe UI", Roboto, Arial, sans-serif; color:#172033; background:#f4f7fb; }
* { box-sizing:border-box; }
body { margin:0; background:#f4f7fb; }
main { width:min(860px, calc(100% - 32px)); margin:40px auto; }
article { background:#fff; border:1px solid #e2e8f0; border-radius:16px; padding:clamp(24px, 5vw, 48px); box-shadow:0 18px 46px rgba(15,23,42,.08); }
h1 { margin:0 0 8px; color:#0f172a; font-size:clamp(28px, 5vw, 40px); }
h2 { margin:30px 0 10px; color:#0f172a; font-size:20px; }
p, li { color:#475569; line-height:1.65; }
ul { padding-left:22px; }
.meta { margin:0 0 28px; color:#64748b; font-size:14px; }
a { color:#0b63b6; }
nav { display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; padding-top:22px; border-top:1px solid #e2e8f0; }
@media (max-width:520px) { main { margin:18px auto; width:min(100% - 20px, 860px); } article { border-radius:12px; } }