/* Self-hosted variable fonts. Files live in /fonts/ — copy new ones there and
   update the url() below if you ever swap a typeface. */
@font-face {
  font-family: 'Schibsted Grotesk Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 400 900;
  src: url('/fonts/schibsted-grotesk.woff2') format('woff2-variations');
}
@font-face {
  font-family: 'Instrument Sans Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 400 900;
  src: url('/fonts/instrument-sans.woff2') format('woff2-variations');
}
@font-face {
  font-family: 'Martian Mono Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 400 900;
  src: url('/fonts/martian-mono.woff2') format('woff2-variations');
}

:root {
  --font-display:
    'Schibsted Grotesk Variable', ui-sans-serif, system-ui, sans-serif;
  --font-body: 'Instrument Sans Variable', ui-sans-serif, system-ui, sans-serif;
  --font-utility:
    'Martian Mono Variable', ui-monospace, SFMono-Regular, monospace;

  --fs-display: clamp(2.6rem, 1.6rem + 3.4vw, 4.4rem); /* h1 hero */
  --fs-h1: clamp(2.1rem, 1.5rem + 2.2vw, 3.1rem);
  --fs-h2: clamp(1.6rem, 1.3rem + 1.1vw, 2.1rem);
  --fs-h3: 1.25rem;
  --fs-lead: clamp(
    1.06rem,
    1rem + 0.35vw,
    1.22rem
  ); /* hero summary, section intros */
  --fs-body: 1rem;
  --fs-sm: 0.9rem;
  --fs-label: 0.72rem; /* utility face */
}

body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: 1.65;
  letter-spacing: 0;
}

h1,
h2,
h3 {
  font-family: var(--font-display);
  font-weight: 600;
  line-height: 1.1;
  margin: 0;
}
h1 {
  font-size: var(--fs-h1);
  letter-spacing: -0.03em;
}
h2 {
  font-size: var(--fs-h2);
  letter-spacing: -0.02em;
}
h3 {
  font-size: var(--fs-h3);
  letter-spacing: -0.01em;
}

.fs-display {
  font-size: var(--fs-display);
  letter-spacing: -0.03em;
  line-height: 1.05;
}
.fs-lead {
  font-size: var(--fs-lead);
  color: var(--ink-2);
  max-width: var(--measure);
}
.eyebrow,
.fs-label {
  font-family: var(--font-utility);
  font-size: var(--fs-label);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--ink-3);
}

[data-metric] {
  font-variant-numeric: tabular-nums;
}