:root {
  --font-display: "Baskerville", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --font-body: Georgia, "Times New Roman", serif;
  --font-ui: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

body {
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.7;
}

h1,
h2,
h3 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -0.02em;
}

h1 {
  font-size: clamp(2.6rem, 7vw, 5.4rem);
  max-width: 13ch;
}

h2 {
  font-size: clamp(2rem, 5vw, 3.5rem);
  max-width: 18ch;
}

h3 {
  font-size: 1.2rem;
}

p,
li,
input,
summary {
  font-size: clamp(1rem, 1.5vw, 1.1rem);
}

.eyebrow,
.button,
.retailer-link,
label,
.form-note,
.hero__caption,
.hero__note,
.section-cta__line,
summary {
  font-family: var(--font-ui);
}

.eyebrow {
  color: rgba(255, 255, 255, 0.76);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

.hero__subhead,
.section-intro,
.form-note,
.hero__note {
  font-size: clamp(1.05rem, 1.8vw, 1.2rem);
}

.prose p + p {
  margin-top: 1rem;
}

.prose em {
  font-style: italic;
}
