/* selectraven 1.13.1 — keep the autoplay hero media in one stage and remove scroll-transition collisions. */
.hero-sticky > .hero-poster,
.hero-sticky > .hero-video {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  transform-origin: center center;
}

.hero-sticky > .hero-poster { z-index: 1; }
.hero-sticky > .hero-video { z-index: 2; }
.hero-sticky > .hero-shade { z-index: 3; }
.hero-sticky > .hero-copy { z-index: 4; }

/* Clear the media before the collection copy reaches the reading area. */
.hero-sticky > .hero-media,
.hero-sticky > .hero-shade {
  clip-path: inset(
    0 0 min(100%, calc(var(--hero-progress) * 150%)) 0
    round 0 0 calc(var(--hero-progress) * 72px) calc(var(--hero-progress) * 72px)
  ) !important;
}

/* Finish the opening headline before the collection title arrives. */
.hero-sticky > .hero-copy {
  opacity: clamp(0, calc((.36 - var(--hero-progress)) * 4.5), 1) !important;
}

.hero-sticky > .hero-next-stage {
  opacity: clamp(0, calc((var(--hero-progress) - .38) * 3), 1) !important;
}

.hero-stage-heading > p {
  opacity: clamp(0, calc((var(--hero-progress) - .56) * 4), 1) !important;
}

.hero-stage-heading > h2 {
  opacity: clamp(0, calc((var(--hero-progress) - .48) * 4.5), 1) !important;
}

.hero-stage-heading > span {
  opacity: clamp(0, calc((var(--hero-progress) - .64) * 4.2), 1) !important;
}

.hero-stage-heading .hero-stage-discover {
  opacity: clamp(0, calc((var(--hero-progress) - .70) * 4.8), 1) !important;
}

@media (max-width: 767px) {
  .hero-sticky > .hero-poster,
  .hero-sticky > .hero-video {
    inset: 0 !important;
  }

  .hero-sticky > .hero-copy {
    opacity: clamp(0, calc((.34 - var(--hero-progress)) * 4.8), 1) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-sticky > .hero-media {
    transform: none !important;
  }
}
