:root {
  --ink: #20201e;
  --muted: #6f6f67;
  --paper: #f6f4ef;
  --surface: #fffefa;
  --line: #e4e0d7;
  --accent: #5f7044;
  --accent-dark: #3f512b;
  --max-width: 980px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.65;
}

a { color: inherit; }
a:hover { color: var(--accent); }
a:focus-visible { outline: 3px solid rgba(95, 112, 68, .45); outline-offset: 3px; }

.site-main {
  margin: 0 auto;
  max-width: var(--max-width);
  min-height: 75vh;
  padding: 4.5rem 1.5rem 6rem;
}

.site-main h1,
.site-main h2 {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: normal;
  line-height: 1.15;
}

.site-main h1 {
  font-size: clamp(2.35rem, 6vw, 4.5rem);
  margin: .25rem 0 1.25rem;
}

.site-main h2 {
  font-size: 1.6rem;
  margin: 0 0 .35rem;
}

.eyebrow {
  color: var(--accent);
  font-size: .72rem;
  font-weight: bold;
  letter-spacing: .16em;
  margin: 0;
  text-transform: uppercase;
}

article {
  background: var(--surface);
  border-top: 1px solid var(--line);
  margin-top: 1.75rem;
  padding: 1.5rem 0 0;
}

article a { text-decoration: none; }
article p { color: var(--muted); margin: .35rem 0 0; }

@media (max-width: 520px) {
  .site-main { padding-top: 3rem; }
  .site-main h1 { font-size: 2.8rem; }
}