:root {
  --ink: #141a28; --ink-2: #222b3f; --vellum: #f2e8d4; --vellum-dim: #b9b09d; --or: #e7b54a; --gules: #b8322a;
  --line: rgba(242, 232, 212, 0.14);
}
* { box-sizing: border-box; }
html { background: var(--ink); color-scheme: dark; }
body { margin: 0; background: var(--ink); color: var(--vellum); font: 19px/1.6 'Grenze', Georgia, serif; }
main { max-width: 680px; margin: 0 auto; padding: 40px 16px 64px; }
a { color: var(--or); }
a:focus-visible { outline: 2px solid var(--or); outline-offset: 3px; border-radius: 4px; }
.back { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font: 600 16px 'Barlow Semi Condensed', system-ui, sans-serif; text-decoration: none; }
h1 { font: 800 clamp(44px, 9vw, 64px)/1 'Grenze Gotisch', Georgia, serif; margin: 16px 0 12px; color: var(--or); }
h2 { font: 600 28px/1.2 'Grenze Gotisch', Georgia, serif; margin: 40px 0 8px; }
.lede { font-size: 22px; color: var(--vellum); }
p, li { color: var(--vellum-dim); }
strong { color: var(--vellum); }
ol, ul { padding-left: 1.3em; }
li { margin: 6px 0; }
li::marker { color: var(--or); }
.cta { display: inline-flex; align-items: center; min-height: 48px; padding: 0 22px; margin-top: 12px; border-radius: 10px; background: var(--or); color: var(--ink); font: 700 18px 'Barlow Semi Condensed', system-ui, sans-serif; text-decoration: none; }
.cta:hover { background: #f0c565; }
footer { margin-top: 56px; padding-top: 16px; border-top: 1px solid var(--line); font: 500 15px 'Barlow Semi Condensed', system-ui, sans-serif; color: var(--vellum-dim); }
