/* Xia Hero ScrollVideo — visual baseline.
   The hero bg is a <div> with a background image. We overlay a <video>
   inside it. The existing ::after gradient stays on top. */
.xia-hero__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  /* Override the theme's transform: scale(1.05) animation that pulls the bg
     out of the hero's clipping box. */
  transform: none !important;
}

.xia-hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  pointer-events: none;
  transform: none;
}

/* When the video is loaded and playing, hide the underlying bg image so
   the user sees only the video frame. The ::after gradient still darkens. */
.xia-hero__bg.has-video {
  background-image: none !important;
}