@font-face {
  font-family: 'DM Sans';
  src: url('/fonts/dm-sans.ttf') format('truetype');
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: 'Playfair Display';
  src: url('/fonts/playfair.ttf') format('truetype');
  font-weight: 400 900;
  font-display: swap;
}
:root { color: #093c3e; background: #faf9f6; font-family: 'DM Sans', sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; }
a { color: inherit; text-underline-offset: 4px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
header, footer { max-width: 1140px; margin-inline: auto; padding: 28px 32px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
header a, footer a { display: inline-flex; align-items: center; min-height: 44px; }
.wordmark { font-family: 'Playfair Display', Georgia, serif; font-size: 36px; letter-spacing: -.04em; text-decoration: none; }
.home-link { font-size: 16px; }
main { max-width: 760px; padding: 52px 32px 72px; margin-inline: auto; }
h1, h2 { font-family: 'Playfair Display', Georgia, serif; font-weight: 400; text-wrap: balance; }
h1 { font-size: clamp(44px, 7vw, 64px); line-height: 1.1; letter-spacing: -.03em; margin: 0 0 18px; }
.updated { font-size: 14px; margin: 0 0 28px; }
.intro { font-size: 22px; line-height: 1.5; margin: 0; }
section { margin-top: 44px; }
h2 { font-size: 29px; line-height: 1.25; letter-spacing: -.02em; margin: 0 0 16px; }
p { font-size: 18px; line-height: 1.7; margin: 0 0 16px; overflow-wrap: break-word; }
section p:last-child { margin-bottom: 0; }
footer { border-top: 1px solid #c6d4d1; font-size: 16px; }
.skip-link { position: absolute; left: 16px; top: 16px; transform: translateY(-180%); background: #093c3e; color: white; padding: 12px 18px; z-index: 2; }
.skip-link:focus { transform: translateY(0); }
@media (max-width: 600px) {
  header, footer { padding: 20px 24px; }
  main { padding: 36px 24px 56px; }
  h2 { font-size: 27px; }
  footer { flex-wrap: wrap; gap: 8px 24px; }
}
