:root { color-scheme: light; --ink:#252942; --accent:#514491; --paper:#fff; --soft:#f6f5fc; --line:#e7e5ef; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; text-underline-offset:.22em; }
a:hover { color:var(--accent); }
a:focus-visible, summary:focus-visible { outline:3px solid var(--accent); outline-offset:5px; border-radius:2px; }
header, footer { max-width:1160px; margin:auto; padding:24px 32px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { font-size:28px; font-weight:750; letter-spacing:-1.2px; text-decoration:none; }
nav { display:flex; gap:24px; flex-wrap:wrap; }
header nav a { padding:12px 0; font-size:15px; }
[aria-current="page"] { color:var(--accent); font-weight:650; }
.hero { background:var(--soft); padding:56px max(32px,calc((100vw - 1096px)/2)); }
.eyebrow { color:var(--accent); font-size:13px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; }
h1 { max-width:900px; margin:16px 0 24px; font-size:clamp(36px,5vw,64px); line-height:1.12; letter-spacing:-2px; }
.hero p:not(.eyebrow) { max-width:680px; font-size:19px; line-height:1.65; }
.actions { display:flex; flex-wrap:wrap; gap:16px; margin-top:28px; }
.button { display:inline-flex; align-items:center; min-height:48px; padding:12px 20px; border-radius:999px; background:var(--accent); color:white; text-decoration:none; font-weight:650; }
.button:hover { background:#403477; color:#fff; }
.button.secondary { background:white; color:var(--accent); border:1px solid var(--line); }
.content { display:grid; grid-template-columns:220px minmax(0,1fr); gap:64px; max-width:1160px; margin:auto; padding:56px 32px 40px; }
.contents { display:block; position:sticky; top:24px; align-self:start; font-size:14px; }
.contents h2 { font-size:14px; margin:0 0 18px; }
.contents ol { padding-left:20px; }
.contents li { margin:0 0 12px; line-height:1.5; }
.contents a { display:inline-block; padding:4px 0; }
article { min-width:0; }
section { margin-bottom:38px; scroll-margin-top:24px; }
h2 { font-size:25px; line-height:1.3; letter-spacing:-.6px; margin:0 0 16px; }
p,li { font-size:16px; line-height:1.85; overflow-wrap:anywhere; }
article p { margin:0 0 14px; }
article ul,article ol { padding-left:24px; }
.wide { max-width:860px; margin:auto; padding:56px 32px; }
.note { border-left:3px solid var(--accent); padding-left:20px; }
footer { border-top:1px solid var(--line); font-size:13px; line-height:1.7; }
.skip { position:absolute; top:-100px; left:16px; z-index:10; padding:12px; background:#fff; }
.skip:focus { top:12px; }
@media(max-width:700px) { header,footer { padding:20px 24px; } header nav { gap:16px; } .hero { padding:36px 24px; } h1 { letter-spacing:-1px; } .content { display:block; padding:32px 24px; } .contents { position:static; margin-bottom:40px; } .wide { padding:36px 24px; } h2 { font-size:23px; } footer { align-items:flex-start; flex-direction:column; gap:12px; } }
@media(max-width:360px) { header { align-items:flex-start; gap:12px; flex-direction:column; } }