

.type-display-lg,
.type-display,
.type-h1,
.type-h2,
.type-h3,
.type-metric,
.type-ordinal,
.type-insight-title {
  font-variant-numeric: lining-nums;
  font-optical-sizing: auto;
}

.type-display-lg {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2.75rem, 1.93rem + 3.51vw, 5rem);
  line-height: 1.04;
  letter-spacing: -0.032em;
  color: var(--color-text-primary);
  text-wrap: balance;
}

.type-display {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2.5rem, 1.85rem + 2.77vw, 4rem);
  line-height: 1.06;
  letter-spacing: -0.028em;
  color: var(--color-text-primary);
  text-wrap: balance;
}

.type-h1 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2.125rem, 1.62rem + 2.16vw, 3.25rem);
  line-height: 1.1;
  letter-spacing: -0.024em;
  color: var(--color-text-primary);
  text-wrap: balance;
}

.type-h2 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(1.5rem, 1.29rem + 0.9vw, 2rem);
  line-height: 1.18;
  letter-spacing: -0.02em;
  color: var(--color-text-primary);
  text-wrap: balance;
}

.type-h3 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(1.1875rem, 1.1rem + 0.38vw, 1.4375rem);
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--color-text-primary);
  text-wrap: balance;
}

.type-body {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: clamp(1.0625rem, 1.04rem + 0.11vw, 1.125rem);
  line-height: 1.65;
  color: var(--color-text-secondary);
  max-width: var(--body-max-width);
  text-wrap: pretty;
}

.type-body-sm {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: clamp(0.9375rem, 0.915rem + 0.094vw, 1rem);
  line-height: 1.6;
  color: var(--color-text-secondary);
  text-wrap: pretty;
}

.type-label {
  font-family: var(--font-mono);
  font-weight: 400;
  font-size: 0.75rem;
  line-height: 1.4;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--color-text-tertiary);
}

.type-label--marked {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  color: var(--color-accent-text);
}

.type-label--marked::before {
  content: "";
  flex: 0 0 auto;
  width: 32px;
  height: 1px;
  background: var(--color-accent);
}

.type-metric {
  font-family: var(--font-display);
  font-weight: 400;

  font-size: clamp(3rem, 1.8rem + 5.1vw, 6.5rem);
  line-height: 0.92;
  letter-spacing: -0.042em;
  color: var(--color-text-primary);

  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: 'tnum' 1, 'lnum' 1;
}

.type-ordinal {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2.25rem, 1.986rem + 1.127vw, 3rem);
  line-height: 1;
  letter-spacing: 0;
  color: var(--color-accent);
  font-variant-numeric: tabular-nums lining-nums;
}

.type-body-md {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: clamp(1rem, 0.978rem + 0.094vw, 1.0625rem);
  line-height: 1.65;
  color: var(--color-text-secondary);
  max-width: var(--body-max-width);
  text-wrap: pretty;
}

.type-body-md + .type-body-md { margin-top: var(--space-4); }

.type-insight-title {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(1.75rem, 1.42rem + 1.41vw, 2.75rem);
  line-height: 1.18;
  letter-spacing: -0.025em;
  color: var(--color-text-primary);
  text-wrap: balance;
}

.type-body + .type-body,
.type-body-sm + .type-body-sm {
  margin-top: var(--space-4);
}

.metric__asat {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-text-tertiary);
  margin-top: var(--space-2);
}
