:root { color-scheme: light; --ink:#241e2d; --muted:#625a67; --plum:#593f68; --coral:#efbcb4; --paper:#fbf8f6; --card:#fff; --line:#e9e0e3; --teal:#2f6f70; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:var(--plum); text-underline-offset:3px; }
a:focus-visible { outline:3px solid var(--teal); outline-offset:4px; border-radius:4px; }
.site-header,footer { max-width:1120px; margin:auto; display:flex; align-items:center; gap:24px; padding:24px 28px; }
.site-header { justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { color:var(--ink); font-size:1.25rem; font-weight:800; letter-spacing:.08em; text-decoration:none; }
.brand-mark { display:inline-flex; width:34px; height:34px; align-items:center; justify-content:center; margin-right:8px; color:#fff; background:var(--plum); border-radius:11px; }
nav { display:flex; gap:22px; font-weight:600; }
nav a { text-decoration:none; }
nav a[aria-current="page"] { text-decoration:underline; text-decoration-thickness:2px; }
main { max-width:1120px; margin:auto; padding:0 28px 70px; }
.hero { padding:92px 0 70px; max-width:780px; }
.eyebrow { color:var(--teal); font-size:.8rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
h1,h2,h3 { line-height:1.18; letter-spacing:-.025em; }
h1 { margin:16px 0 22px; font-size:clamp(2.5rem,6vw,5rem); }
.hero>p:not(.eyebrow),.lede { font-size:1.25rem; color:var(--muted); max-width:760px; }
.actions { display:flex; align-items:center; flex-wrap:wrap; gap:22px; margin-top:36px; }
.button { display:inline-block; padding:12px 20px; background:var(--plum); color:white; border-radius:12px; font-weight:700; text-decoration:none; }
.button:hover { background:#3f2a4d; }
.text-link { font-weight:700; }
.grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.grid article,.callout { padding:26px; border:1px solid var(--line); border-radius:22px; background:var(--card); box-shadow:0 8px 24px #5940640c; }
.grid h2 { font-size:1.2rem; margin:20px 0 8px; }
.grid p { color:var(--muted); margin:0; }
.icon { color:var(--teal); font-size:.8rem; font-weight:800; letter-spacing:.12em; }
.disclaimer { color:var(--muted); margin-top:34px; font-size:.9rem; }
.document { max-width:850px; padding-top:62px; }
.document h1 { font-size:clamp(2.5rem,5vw,4rem); }
.document h2 { margin:40px 0 10px; font-size:1.4rem; }
.document h3 { margin:22px 0 6px; font-size:1.05rem; }
.document p { margin:8px 0 18px; }
.document code { overflow-wrap:anywhere; padding:2px 5px; border-radius:4px; background:#f0eaf0; }
.callout { margin-top:38px; border-left:5px solid var(--teal); }
.callout h2 { margin:0 0 10px; }
footer { border-top:1px solid var(--line); color:var(--muted); font-size:.9rem; }
footer span { margin-right:auto; }
@media(max-width:700px) { .site-header,footer { padding:18px; } main { padding:0 18px 48px; } .hero { padding:55px 0 42px; } .grid { grid-template-columns:1fr; } .document { padding-top:36px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
