/* SEC-2026-07-02: HD-only video background layer over the still image.
   Loads only from /human-design/index.html. On browsers where the video
   fails/prefers-reduced-motion, the static calc-bg.webp (via calc-bg.css)
   stays visible as the fallback. */

.hd-bgfx__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  z-index: 0;
  pointer-events: none;
  /* faint fade-in once metadata is ready — set by the tiny inline script */
  opacity: 0;
  transition: opacity .55s ease-out;
}

.hd-bgfx__video.is-ready {
  opacity: 1;
}

/* The existing __vign overlay lives at z-index:auto in body flow but is a
   sibling of __video inside __bgfx. Both are position:absolute. To keep the
   vignette ON TOP of the video (so text readability stays), promote it. */
.hd-bgfx__vign {
  z-index: 1;
}

/* Respect users who dislike auto-motion: hide the video, keep the image. */
@media (prefers-reduced-motion: reduce) {
  .hd-bgfx__video { display: none !important; }
}