/* Atualização 037 — agenda estável e vídeo do hero guiado pelo scroll */
.hero-stage.has-scroll-video {
  height: var(--hero-stage-height, 320svh) !important;
  min-height: var(--hero-stage-height, 320svh) !important;
  max-height: none !important;
  overflow: visible !important;
  overflow-anchor: none;
}

.hero-stage.has-scroll-video > .hero {
  position: sticky !important;
  inset-block-start: 0 !important;
  top: 0 !important;
  height: 100svh !important;
  min-height: 100svh !important;
  max-height: 100svh !important;
  overflow: hidden !important;
}

.hero--scroll-video .hero-scroll-video,
.hero--scroll-video.hero-has-scrolled .hero-scroll-video {
  display: block !important;
  position: absolute !important;
  z-index: 2 !important;
  inset: 86px 0 auto !important;
  width: 100% !important;
  height: calc(100% - 86px) !important;
  max-width: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
  opacity: 0 !important;
  filter: none !important;
  transform: none !important;
  transition: opacity .18s ease !important;
  pointer-events: none !important;
}

.hero--scroll-video .hero-scroll-video.is-video-ready { opacity: 1 !important; }
.hero--scroll-video .hero-scroll-video.is-video-ready ~ .hero-grain { display: none !important; }
.hero--scroll-video:has(.hero-scroll-video.is-video-ready) .hero-art { opacity: 0 !important; }
.hero--scroll-video .hero-cinema-mask,
.hero--scroll-video .hero-light-sweep,
.hero--scroll-video .hero-gradient-glow,
.hero--scroll-video .hero-grain { display: none !important; }

/* O hover movimenta o card, mas nunca troca as cores de seu conteúdo. */
.shows .show-row,
.shows .show-row:hover,
.shows .show-row:focus-within {
  color: var(--theme-shows-text, #070907) !important;
}
.shows .show-row:hover time,
.shows .show-row:focus-within time {
  color: color-mix(in srgb, var(--theme-shows-text, #070907) 55%, transparent) !important;
}
.shows .show-row:hover time b,
.shows .show-row:focus-within time b { color: inherit !important; }
.shows .show-row:hover > div p,
.shows .show-row:focus-within > div p {
  color: var(--theme-shows-text, #070907) !important;
}
.shows .show-row:hover > div h3,
.shows .show-row:focus-within > div h3 {
  color: color-mix(in srgb, var(--theme-shows-text, #070907) 58%, transparent) !important;
}
.shows .show-row:hover .tag,
.shows .show-row:focus-within .tag {
  color: var(--theme-shows-text, #070907) !important;
  border-color: #999 !important;
}
.shows .show-row:hover .arrow,
.shows .show-row:focus-within .arrow { color: var(--pink) !important; }
.shows .show-row:hover a,
.shows .show-row:hover span,
.shows .show-row:focus-within a,
.shows .show-row:focus-within span { color: inherit; }

@media (max-width: 760px) {
  .hero--scroll-video .hero-scroll-video,
  .hero--scroll-video.hero-has-scrolled .hero-scroll-video {
    inset-block-start: 68px !important;
    top: 68px !important;
    height: calc(100% - 68px) !important;
    object-fit: contain !important;
  }
  .shows .show-row:hover { padding-left: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  .hero--scroll-video .hero-scroll-video { transition: none !important; }
}
