.hero-video-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.hero-video-overlay > div {
  position: absolute;
  inset: 0;
}

/* Black 25% opacity */
.hero-video-overlay .black-overlay {
  background: rgba(0, 0, 0, 0.25);
  z-index: 1;
}

/* Main gradient from background to transparent - THIS IS THE KEY! */
.hero-video-overlay .gradient-overlay {
  background: linear-gradient(to top, hsl(222, 47%, 11%), hsla(222, 47%, 11%, 0.3), transparent);
  opacity: 0.9;
  z-index: 2;
}

/* Blue overlay with blend mode */
.hero-video-overlay .blend-overlay {
  background: rgba(30, 58, 138, 0.2);
  mix-blend-mode: overlay;
  z-index: 3;
}

/* Content sections background */
main {
  background-color: hsl(222, 47%, 11%);
}

section {
  background-color: hsl(222, 47%, 11%);
}