@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body { margin: 0; background: var(--canvas); color: var(--ink); font-family: "Plus Jakarta Sans", Arial, sans-serif; font-size: 14px; line-height: 1.55; }
  img { display: block; max-width: 100%; }
  a { color: inherit; text-decoration: none; }
  button, input, select, textarea { font: inherit; }
  button { cursor: pointer; }
  h1, h2, h3, h4, p { margin: 0; }
  h1, h2, h3, h4 { font-family: "Playfair Display", Georgia, serif; font-weight: 600; line-height: 1.12; }
  ul { padding: 0; margin: 0; list-style: none; }
}

.container { width: min(var(--max), calc(100% - 48px)); margin-inline: auto; }
.site-main { min-height: 60vh; padding-top: 120px; }
.material-symbols-outlined { font-size: 18px; line-height: 1; vertical-align: middle; font-variation-settings: 'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24; }
.eyebrow { color: var(--secondary); font-size: 10px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.muted { color: var(--muted); }
.serif { font-family: "Playfair Display", Georgia, serif; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

@media (max-width: 767px) {
  .container { width: min(100% - 32px, var(--max)); }
  .site-main { padding-top: 112px; }
}