@media (min-width: 1101px) {
  .hero-grid { grid-template-columns: 50% 50%; }
  .hero h1 { font-size: 48px; white-space: nowrap; transform: scaleX(.90); transform-origin: left center; width: 111.12%; }
  .hero-art img { width: 765px; max-width: none; }
  .cta-left, .cta-right { mix-blend-mode: multiply; }
  .cta-left { width: auto; height: 128px; left: 38px; object-fit: contain; }
  .cta-right { width: auto; height: 148px; right: 34px; object-fit: contain; }
}

@media (max-width: 760px) {
  html, body { overflow-x: hidden; }
  .hero h1 { white-space: normal; transform: none; width: auto; }
}