/* Activated only when the existing two-column hero exceeds the viewport. */
@media (min-width: 761px) {
  .hero.hero--height-fit {
    box-sizing: border-box;
    height: var(--hero-viewport-height);
    min-height: var(--hero-viewport-height);
  }

  .hero.hero--height-fit .hero-inner {
    transform: scale(var(--hero-height-scale));
    transform-origin: top center;
  }
}