:root {
  color-scheme: light;
  --ink: #14241d;
  --muted: #5f6e66;
  --paper: #f5f1e8;
  --card: #fffdf8;
  --line: #d8d1c1;
  --accent: #12634d;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--paper); font: 17px/1.65 system-ui, sans-serif; }
header, footer { display: flex; align-items: center; gap: 1.25rem; padding: 1rem max(1.25rem, calc((100vw - 72rem) / 2)); border-bottom: 1px solid var(--line); background: var(--card); }
footer { justify-content: space-between; border-top: 1px solid var(--line); border-bottom: 0; }
.brand { color: var(--ink); font-size: 1.35rem; font-weight: 800; text-decoration: none; }
nav { display: flex; flex: 1; flex-wrap: wrap; gap: .85rem; }
nav a, .language { white-space: nowrap; }
a { color: var(--accent); text-underline-offset: .2em; }
main { width: min(48rem, calc(100% - 2.5rem)); margin: 3rem auto 5rem; }
h1 { max-width: 18ch; margin: 1rem 0; font: 800 clamp(2.25rem, 6vw, 4.5rem)/.98 Georgia, serif; letter-spacing: -.035em; }
h2 { margin: 0 0 .75rem; font: 750 1.35rem/1.2 system-ui, sans-serif; }
.lede { max-width: 42rem; color: var(--muted); font-size: 1.25rem; }
.version { color: var(--muted); font-size: .9rem; }
.status { padding: .85rem 1rem; border-left: .25rem solid #b56a14; background: #fff3d7; }
section { margin-top: 1rem; padding: 1.5rem; border: 1px solid var(--line); border-radius: .75rem; background: var(--card); }
section p { margin: 0; }
@media (max-width: 48rem) {
  header { align-items: flex-start; flex-wrap: wrap; }
  nav { order: 3; flex: 0 0 100%; width: 100%; min-width: 0; overflow: visible; flex-wrap: wrap; gap: .65rem 1rem; }
  .language { margin-left: auto; }
  h1 { font-size: clamp(1.75rem, 7.4vw, 2.25rem); }
  main { margin-top: 2rem; }
}
