/* Give evaluation breadth its own visual weight between highlights and detail. */
.evals-page .program-hero {
  padding-bottom: 0;
}

.evals-page .eval-scale {
  margin-top: 56px;
}

:is(.evals-page, .evidence-windows) .eval-overview-heading .eyebrow {
  margin-bottom: 12px;
  color: var(--accent-text);
}

:is(.evals-page, .evidence-windows) .eval-overview-heading :is(h2, h3) {
  font-size: clamp(30px, 3.3vw, 46px);
  line-height: 1.12;
  letter-spacing: -.04em;
  text-wrap: balance;
}

:is(.evals-page, .evidence-windows) .eval-overview-heading :is(h2, h3) + p {
  max-width: 760px;
  margin-top: 14px;
  color: var(--muted-text);
  font: 400 clamp(16px, 1.4vw, 19px)/1.55 var(--sans);
  text-wrap: pretty;
}

:is(.evals-page, .evidence-windows) .eval-scale-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 28px 0 0;
  padding: 36px 0;
  border-top: 4px solid var(--accent);
  background: var(--accent-pale);
}

:is(.evals-page, .evidence-windows) .eval-scale-metrics > div {
  display: flex;
  flex-direction: column-reverse;
  justify-content: flex-end;
  gap: 16px;
  min-width: 0;
  padding: 0 clamp(20px, 2.5vw, 36px);
}

:is(.evals-page, .evidence-windows) .eval-scale-metrics > div + div {
  border-left: 1px solid var(--rule);
}

:is(.evals-page, .evidence-windows) .eval-scale-metrics dt {
  color: var(--ink);
  font: 500 clamp(18px, 1.8vw, 25px)/1.25 var(--sans);
  letter-spacing: -.025em;
  text-wrap: balance;
}

:is(.evals-page, .evidence-windows) .eval-scale-metrics dd {
  margin: 0;
  color: var(--ink);
  font: 600 clamp(64px, 7.8vw, 112px)/1 var(--sans);
  letter-spacing: -.06em;
  font-variant-numeric: lining-nums tabular-nums;
}

.evals-page .eval-explore {
  margin-top: 64px;
  padding-top: 36px;
  border-top: 1px solid var(--rule);
}

@media (max-width: 700px) {
  .evals-page .eval-scale {
    margin-top: 40px;
  }

  :is(.evals-page, .evidence-windows) .eval-scale-metrics {
    grid-template-columns: 1fr;
    margin-top: 24px;
    padding: 0 24px;
  }

  :is(.evals-page, .evidence-windows) .eval-scale-metrics > div {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    padding: 26px 0;
  }

  :is(.evals-page, .evidence-windows) .eval-scale-metrics > div + div {
    border-left: 0;
    border-top: 1px solid var(--rule);
  }

  :is(.evals-page, .evidence-windows) .eval-scale-metrics dd {
    grid-column: 1;
    grid-row: 1;
    font-size: clamp(54px, 14vw, 88px);
  }

  :is(.evals-page, .evidence-windows) .eval-scale-metrics dt {
    grid-column: 2;
    grid-row: 1;
    font-size: clamp(17px, 4.6vw, 23px);
    text-wrap: pretty;
  }

  .evals-page .eval-explore {
    margin-top: 40px;
    padding-top: 28px;
  }
}

@media print {
  :is(.evals-page, .evidence-windows) .eval-scale-metrics {
    break-inside: avoid;
  }
}

/* The homepage intro supplies the space above this nested subsection. */
.evidence-windows .eval-overview-heading h3 {
  margin: 0;
  font-family: var(--sans);
  font-weight: 400;
}

.evidence-windows .eval-overview-heading .eyebrow {
  font: 10px/1.5 var(--mono);
  letter-spacing: 1.5px;
  text-transform: uppercase;
}
