:root { --beam-speed: 6s; }

.show-beam {
  animation: sweep var(--beam-speed) ease-in-out infinite alternate;
  will-change: transform;
}

.beam-center { animation-delay: calc(var(--beam-speed) / -3); }
.beam-right { animation-delay: calc(var(--beam-speed) / -1.7); }

@keyframes sweep {
  from { transform: rotate(-27deg) translateX(-5vw); }
  to { transform: rotate(24deg) translateX(8vw); }
}

.beam-center {
  animation-name: sweep-center;
}

@keyframes sweep-center {
  from { transform: rotate(17deg) translateX(7vw); }
  to { transform: rotate(-15deg) translateX(-6vw); }
}

@media (prefers-reduced-motion: reduce) {
  .show-beam { animation: none; }
}

@media (min-width: 721px) {
  .production-showcase .show-content {
    position: static;
    padding: 68px 10vw 0;
  }

  .production-showcase h2 {
    position: relative;
    z-index: 2;
    max-width: 510px;
    margin-top: 20px;
    font-size: clamp(46px, 5.4vw, 76px);
  }

  .production-showcase .video-wall {
    left: 67%;
    top: 19%;
    width: min(42vw, 600px);
  }

  .production-showcase .service-list {
    position: absolute;
    z-index: 3;
    left: 10vw;
    right: 10vw;
    bottom: 58px;
    max-width: none;
    grid-template-columns: repeat(4, 1fr);
  }

  .production-showcase .service-list article {
    min-height: 104px;
    border-right: 1px solid rgba(213, 241, 247, .45);
  }

  .production-showcase .service-list article:last-child { border-right: 0; }
}

@media (max-width: 720px) {
  .production-showcase .show-content {
    position: static;
  }

  .production-showcase .show-stage {
    background-position: center center;
  }

  .production-showcase .video-wall {
    left: 50%;
    top: 20%;
    transform: translateX(-50%);
  }

  .production-showcase .show-truss { left: -18%; width: 136%; }

  .production-showcase .service-list {
    position: absolute;
    z-index: 3;
    left: 7vw;
    right: 7vw;
    bottom: 26px;
  }
}