/* Resources page typography overrides. Keep these after the generated stylesheet. */
.resource-hero h1 {
  max-width: 780px;
  font-size: clamp(3.5rem, 6.8vw, 7rem);
  line-height: .88;
}

.resource-hero .large-copy {
  max-width: 520px;
  font-size: clamp(1.35rem, 2.55vw, 2rem);
  line-height: 1.24;
}

.resource-hero-copy .button-row {
  margin-top: 30px;
}

.resource-hero-note strong {
  font-size: clamp(2rem, 3.2vw, 2.6rem);
  line-height: .98;
}

.resource-hero-note p {
  max-width: 360px;
  font-size: 1rem;
  line-height: 1.65;
}

@media (max-width: 680px) {
  .resource-hero {
    gap: 42px;
    padding: 56px 22px 62px;
  }

  .resource-hero h1 {
    max-width: 100%;
    margin-top: 18px;
    font-size: clamp(3.35rem, 15vw, 4.8rem);
    line-height: .88;
  }

  .resource-hero .large-copy {
    max-width: 100%;
    margin-bottom: 0;
    font-size: clamp(1.55rem, 6.7vw, 2rem);
    line-height: 1.24;
  }

  .resource-hero-copy .button-row {
    gap: 10px;
    margin-top: 28px;
  }

  .resource-hero-copy .button {
    padding: 12px 14px;
    font-size: 13px;
  }

  .resource-hero-note strong {
    font-size: clamp(2rem, 8vw, 2.55rem);
  }

  .resource-hero-note p {
    max-width: none;
    font-size: 1rem;
  }
}