:root { color-scheme: light dark; --bg:#f7f8fc; --text:#17213a; --muted:#4f5c75; --panel:#fff; --border:#d8deea; --link:#4930af; }
@media(prefers-color-scheme:dark) { :root { --bg:#101326; --text:#f1f3fa; --muted:#bbc4da; --panel:#1c223a; --border:#38405c; --link:#c6b9ff; } }
* { box-sizing:border-box; } body { margin:0; background:var(--bg); color:var(--text); font:17px/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:var(--link); overflow-wrap:anywhere; text-underline-offset:3px; } a:focus-visible { outline:3px solid var(--link); outline-offset:4px; }
header,main,footer { max-width:940px; margin:auto; padding:30px; } header { display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid var(--border); }
.brand { font-weight:750; color:var(--text); text-decoration:none; } nav { display:flex; gap:22px; flex-wrap:wrap; }
main { padding-top:55px; padding-bottom:70px; min-height:65vh; } h1 { font-size:clamp(32px,5vw,52px); line-height:1.16; letter-spacing:-.03em; margin:0 0 32px; overflow-wrap:anywhere; } h2 { margin:44px 0 15px; font-size:25px; line-height:1.3; } p,li { max-width:76ch; } li+li { margin-top:10px; } footer { border-top:1px solid var(--border); color:var(--muted); font-size:14px; }
.eyebrow { font-size:13px; font-weight:700; letter-spacing:.12em; color:var(--muted); } .cards { padding:0; list-style:none; display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); } .cards li { margin:0; padding:24px; background:var(--panel); border:1px solid var(--border); border-radius:16px; } .cards p { font-size:15px; color:var(--muted); }
.skip { position:absolute; left:16px; top:-80px; padding:12px; background:var(--panel); } .skip:focus { top:8px; }
@media(max-width:580px) { header { align-items:flex-start; flex-direction:column; } header,main,footer { padding:24px; } main { padding-top:38px; } }