/* =========================================================
   HERO SECTION
========================================================= */

.hero {
  position: relative;
  height: 88vh;
  background: #000;
  overflow: hidden;
  border-radius: 15px;
}

/* Media wrapper */
.hero-media {
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* Poster & video */
.hero-poster,
.hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Poster always visible first */
.hero-poster {
  z-index: 1;
}

/* Video fades in above poster */
.hero-video {
  z-index: 2;
  opacity: 0;
  transition: opacity 1.2s ease;
  will-change: opacity;
}

.hero-video.is-playing {
  opacity: 1;
}

/* Content always on top */
.hero-content {
  position: relative;
  z-index: 3;
}

/* Mobile height */
@media (max-width: 900px) {
  .hero {
    height: 70vh;
  }
}