:root { --ink: #10304f; --muted: #53687f; --line: rgb(28 76 124 / .12); --navy: #1c4c7c; --blue: #2a7cc4; --lime: #5ce1e6;
  --display: "Bricolage Grotesque", system-ui, sans-serif; --text: "Geist", system-ui, sans-serif; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #fff; color: var(--ink); font: 400 17px/1.7 var(--text); -webkit-font-smoothing: antialiased; }
a { color: var(--blue); text-underline-offset: 3px; }
.wrap { width: min(100% - 40px, 820px); margin-inline: auto; }
.top { position: sticky; top: 0; z-index: 5; background: rgb(255 255 255 / .86); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border-bottom: 1px solid var(--line); }
.top .wrap { width: min(100% - 40px, 1080px); display: flex; align-items: center; justify-content: space-between; height: 72px; }
.logo { display: inline-flex; align-items: center; gap: 10px; font: 600 19px/1 var(--display); letter-spacing: -.02em; color: var(--ink); text-decoration: none; }
.logo img { height: 30px; width: auto; display: block; }
.back { display: inline-flex; align-items: center; height: 44px; padding: 0 20px; border-radius: 999px; background: var(--navy); color: #fff; text-decoration: none; font: 500 15px/1 var(--text); transition: transform .3s; }
.back:hover { transform: translateY(-2px); }
main { padding: 72px 0 96px; }
.eyebrow { font-size: 14px; font-weight: 500; color: var(--blue); margin: 0; }
h1 { margin: 14px 0 0; font: 600 clamp(36px, 6vw, 60px)/1.04 var(--display); letter-spacing: -.04em; }
.updated { margin: 16px 0 0; color: var(--muted); font-size: 15px; }
h2 { margin: 56px 0 0; font: 600 24px/1.2 var(--display); letter-spacing: -.02em; }
h2 small { display: block; margin-bottom: 6px; font: 500 13px/1 var(--text); letter-spacing: 0; color: var(--blue); }
p, li { color: var(--muted); } p { margin: 14px 0 0; } ul { margin: 14px 0 0; padding-left: 20px; } li { margin-top: 6px; }
strong { color: var(--ink); font-weight: 500; }
dl { margin: 18px 0 0; display: grid; grid-template-columns: 220px 1fr; border-top: 1px solid var(--line); }
dt, dd { margin: 0; padding: 12px 0; border-bottom: 1px solid var(--line); } dt { color: var(--ink); font-weight: 500; } dd { color: var(--muted); }
footer { border-top: 1px solid var(--line); padding: 28px 0 40px; font-size: 14px; color: var(--muted); }
footer .wrap { width: min(100% - 40px, 1080px); display: flex; flex-wrap: wrap; gap: 8px 22px; }
footer a { color: var(--muted); }
@media (max-width: 600px) { dl { grid-template-columns: 1fr; } dt { border-bottom: 0; padding-bottom: 0; } main { padding: 48px 0 72px; } }
