:root {
  color-scheme: light;
  --paper: #fbf9f3;
  --ink: #22251e;
  --muted: #4f574c;
  --forest: #24372d;
  --link: #255744;
  --rule: #d9dcd0;
}
*, *::before, *::after { box-sizing: border-box; }
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font: 1.06rem/1.65 "Atkinson Hyperlegible Next", system-ui, sans-serif;
}
main { flex: 1; }
a { color: var(--link); text-underline-offset: .22em; }
a:focus-visible { outline: 3px solid #a95309; outline-offset: 4px; }
.shell { width: min(66rem, calc(100% - 3rem)); margin-inline: auto; }
.site-header, .site-footer { border-block-end: 1px solid var(--rule); }
.site-footer { border-block: 1px solid var(--rule) 0; padding-block: 1.4rem; color: var(--muted); font-size: .9rem; }
.header-inner, nav { display: flex; flex-wrap: wrap; align-items: baseline; gap: .7rem 1.4rem; }
.header-inner { justify-content: space-between; padding-block: 1.25rem; }
.brand { font-weight: 750; color: var(--ink); text-decoration: none; }
nav a { font-size: .96rem; text-decoration-thickness: 1px; }
nav a[aria-current="page"] { font-weight: 750; }
.hero { background: var(--forest); color: #fff9eb; }
.hero-inner { padding-block: clamp(3rem, 9vw, 6rem); }
h1, h2 { font-family: "Source Sans 3", system-ui, sans-serif; line-height: 1.13; }
h1 { max-width: 19ch; margin: 0 0 1.1rem; font-size: clamp(2.45rem, 6.7vw, 4.85rem); letter-spacing: -.045em; }
h2 { margin: 0 0 .75rem; font-size: clamp(1.35rem, 3.5vw, 1.75rem); letter-spacing: -.023em; }
p { margin: 0 0 1rem; }
.hero p { max-width: 53ch; color: #e9eee3; font-size: clamp(1rem, 2.8vw, 1.25rem); }
.button { display: inline-block; margin-top: .65rem; padding: .65rem 1rem; background: #f6df9a; color: #26271b; font-weight: 740; }
.content { padding-block: clamp(2.5rem, 6vw, 4rem); }
.home-content { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.7rem; }
.legal { max-width: 49rem; }
.legal .intro { font-size: 1.17rem; color: var(--muted); }
.legal section { border-block-start: 1px solid var(--rule); padding-top: 1.6rem; margin-top: 1.8rem; }
dt { font-weight: 700; }
dd { margin: .25rem 0 1rem; }
code { overflow-wrap: anywhere; color: var(--link); }
.skip { position: absolute; inset: .75rem auto auto .75rem; transform: translateY(-200%); padding: .5rem; background: var(--paper); }
.skip:focus { transform: none; }
@media (max-width: 40rem) {
  .shell { width: calc(100% - 2rem); }
  .home-content { grid-template-columns: 1fr; gap: 1.25rem; }
}