/* ================= Base typography & document ================= */
body {
  font-family: var(--f-sans);
  background: var(--c-bg);
  color: var(--c-ink);
  font-size: var(--fs-body);
}

.container {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}

.eyebrow {
  font-family: var(--f-sans);
  font-size: var(--fs-micro);
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--c-sage);
}

.eyebrow--on-dark { color: var(--c-gold-soft); }
.eyebrow--gold { color: var(--c-gold); }
.eyebrow--berry { color: var(--c-berry); }

h1, .h1, h2, .h2, h3, .h3 {
  font-family: var(--f-display);
  font-weight: 600;
  line-height: 1.08;
  color: var(--c-ink);
}

h1, .h1 { font-size: var(--fs-h1); font-weight: 600; }
h2, .h2 { font-size: var(--fs-h2); }
h3, .h3 { font-size: var(--fs-h3); font-weight: 600; }

.lead {
  font-size: var(--fs-lead);
  line-height: 1.5;
  color: var(--c-ink-soft);
}

html { scroll-behavior: smooth; }
html.has-lenis { scroll-behavior: auto; } /* Lenis animates anchor jumps itself */
section[id] { scroll-margin-top: 96px; }

.section-pad { padding-block: var(--sp-2xl); }
@media (max-width: 720px) {
  .section-pad { padding-block: var(--sp-xl); }
}

.section-head {
  max-width: 640px;
  margin-bottom: var(--sp-lg);
}
.section-head .eyebrow { display: block; margin-bottom: var(--sp-xs); }
.section-head h2 { margin-bottom: var(--sp-sm); }

/* Two-column head: title on the left, lead on the right (desktop) */
.section-head--split {
  max-width: none;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  align-items: end;
  gap: 1rem clamp(2rem, 5vw, 5rem);
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
}
.section-head--split h2 { font-size: clamp(2.1rem, 3.2vw + 0.8rem, 4rem); margin-bottom: 0; line-height: 1.02; }
.section-head--split .lead { max-width: 46ch; }
@media (max-width: 820px) {
  .section-head--split { grid-template-columns: 1fr; }
}

.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;
}

.skip-link {
  position: fixed;
  top: -100px;
  left: 1rem;
  background: var(--c-ink);
  color: var(--c-cream);
  padding: 0.75rem 1.25rem;
  border-radius: var(--radius-sm);
  z-index: 1000;
  transition: top var(--dur-fast) var(--ease-out);
}
.skip-link:focus { top: 1rem; }

::selection {
  background: var(--c-sage);
  color: var(--c-cream);
}

/* Divider dot used between meta items */
.dot::before {
  content: "\00B7";
  margin-inline: 0.5em;
  opacity: 0.5;
}