.hero { padding: clamp(58px, 7vw, 110px) 0; background: linear-gradient(135deg, var(--paper) 0%, var(--white) 62%); }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); align-items: center; gap: clamp(32px, 4vw, 60px); }
.hero h1 { width: 100%; max-width: min(100%, 16em); margin: 0 0 26px; overflow-wrap: anywhere; font-size: clamp(2rem, 3.35vw, 3.45rem); word-break: normal; }
.hero__copy { min-width: 0; max-width: 100%; }
.hero__copy > p:not(.eyebrow) { max-width: min(100%, 42rem); }
.hero__media { min-width: 0; margin: 0; }
.hero__media img { width: 100%; aspect-ratio: 4 / 5; border-radius: 180px 180px 20px 20px; object-fit: cover; box-shadow: var(--shadow); }

@media (max-width: 960px) {
  .hero__grid { grid-template-columns: minmax(0, 1fr); }
  .hero h1 { max-width: 22em; }
  .hero__media img { max-height: 520px; aspect-ratio: 16 / 10; border-radius: 110px 110px 14px 14px; }
}

@media (max-width: 720px) {
  .hero h1 { max-width: 100%; font-size: clamp(1.85rem, 8.5vw, 2.65rem); }
  .hero__media img { max-height: 420px; }
}