@font-face {
  font-family: "Alegreya";
  src: url("../assets/fonts/Alegreya-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Alegreya";
  src: url("../assets/fonts/Alegreya-Italic.ttf") format("truetype");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Alegreya";
  src: url("../assets/fonts/Alegreya-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Alegreya Sans";
  src: url("../assets/fonts/AlegreyaSans-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Alegreya Sans";
  src: url("../assets/fonts/AlegreyaSans-Italic.ttf") format("truetype");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Alegreya Sans";
  src: url("../assets/fonts/AlegreyaSans-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

html {
  font-family: var(--font-serif);
  font-size: var(--fs-base);
  color: var(--ink);
  text-rendering: optimizeLegibility;
  font-kerning: normal;
}

body {
  line-height: var(--leading-normal);
}

h1, h2, h3, h4, p {
  margin: 0;
}

h1 {
  font-size: var(--fs-display);
  line-height: var(--leading-tight);
  font-weight: 400;
  letter-spacing: -0.015em;
}

h2 {
  font-size: var(--fs-xl);
  line-height: var(--leading-snug);
  font-weight: 700;
}

h3 {
  font-size: var(--fs-lg);
  line-height: var(--leading-snug);
  font-weight: 700;
}

h4 {
  font-family: var(--font-sans);
  font-size: var(--fs-sm);
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
}

p + p {
  margin-top: var(--space-2);
}

em,
.instruction,
.section-intro {
  font-style: italic;
}

.smallcaps {
  font-variant-caps: small-caps;
  letter-spacing: 0.06em;
}

.kicker,
.eyebrow,
.micro-label {
  font-family: var(--font-sans);
  font-weight: 700;
  letter-spacing: var(--tracking-wider);
  text-transform: uppercase;
}

.kicker {
  font-size: var(--fs-xs);
}

.eyebrow {
  font-size: var(--fs-xxs);
}

.micro-label {
  font-size: 7.5pt;
}

.page-title {
  color: #102849;
}

.field-tool-title {
  font-size: 44pt;
  line-height: 0.95;
  color: #102849;
}

.field-tool-subtitle {
  margin-top: var(--space-2);
  font-family: var(--font-sans);
  font-size: var(--fs-lg);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--olive-dark);
}

.section-heading {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  color: currentColor;
}

.section-heading__text {
  font-family: var(--font-serif);
  font-size: var(--fs-md);
  font-weight: 700;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.section-intro {
  margin-top: var(--space-2);
  max-width: 95%;
  font-size: var(--fs-sm);
  line-height: 1.45;
}

.quote {
  font-style: italic;
  color: var(--ink-soft);
}

.quote cite {
  display: block;
  margin-top: var(--space-1);
  font-style: italic;
  font-size: var(--fs-xs);
}

.header-text,
.footer-text {
  font-family: var(--font-sans);
  font-size: 7.5pt;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.footer-motto {
  font-style: italic;
  font-size: 8pt;
  color: var(--ink-soft);
}

.page-number {
  font-family: var(--font-serif);
  font-size: 9pt;
}
