@media (max-width: 720px) {
  .hero,
  .hero-stage,
  .hero-portal,
  .hero-portal img {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }

  .hero {
    min-height: 100svh;
    contain: paint;
  }

  .hero-backdrop img {
    filter: none;
    opacity: .28;
    transform: scale(1) translateZ(0) !important;
  }

  .hero-word {
    mix-blend-mode: normal;
    text-shadow: 0 14px 42px rgba(0, 0, 0, .38);
  }

  .hero-portal {
    will-change: auto;
  }

  .hero-portal::after {
    box-shadow: none;
  }

  .hero-portal figcaption {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background: rgba(26, 22, 18, .82);
  }
}