.ws-video-hero { isolation: isolate; background: #060813; }
.ws-hero-media { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.ws-hero-poster, .ws-hero-video { position: absolute; width: 100%; height: 100%; inset: 0; object-fit: cover; object-position: 65% center; }
.ws-hero-video { opacity: 0; transition: opacity 1s ease; }
.ws-video-live .ws-hero-video { opacity: 1; }
.ws-hero-shade { position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(5, 7, 17, .88) 0%, rgba(5, 7, 17, .7) 36%, rgba(5, 7, 17, .17) 76%),
              linear-gradient(0deg, #080a14 0%, transparent 28%, rgba(5, 7, 17, .1) 100%); }
.ws-home-hero .cz-hero-grid { opacity: .16; }
.ws-home-hero .cz-blob { opacity: .22; }
.ws-home-hero .cz-term { background: rgba(7, 11, 24, .78); }
.ws-home-hero .cz-term-bar { background: rgba(14, 19, 32, .84); }
.ws-video-toggle {
  display: inline-flex; align-items: center; gap: 8px; margin: 20px 0 0; padding: 8px 12px;
  min-height: 36px; color: #dce0f2; background: rgba(8, 12, 26, .65);
  border: 1px solid rgba(170, 178, 217, .28); border-radius: 8px;
  font: inherit; font-size: 13px; cursor: pointer;
}
.ws-video-toggle[hidden] { display: none; }
.ws-video-toggle:hover { color: #fff; border-color: #a39cff; }
.ws-video-toggle:focus-visible { outline: 2px solid #98e5ff; outline-offset: 4px; }
.ws-video-toggle [data-video-symbol] { width: 14px; text-align: center; font-size: 12px; }
@media (max-width: 900px) {
  .ws-hero-poster, .ws-hero-video { object-position: 68% center; }
  .ws-hero-shade { background: linear-gradient(90deg, rgba(5, 7, 17, .75), rgba(5, 7, 17, .38)), linear-gradient(0deg, #080a14 0%, transparent 35%); }
}
@media (prefers-reduced-motion: reduce) {
  .ws-hero-video { display: none; transition: none; }
  .ws-video-toggle { display: none; }
}

/* One fixed video background per page, below all interactive content. */
.ws-site-background { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
.ws-site-background .ws-hero-media { z-index: 0; }
.ws-site-background .ws-hero-shade { background: rgba(5, 3, 15, .84); }
.ws-site-background .ws-site-orbits { inset: 12% -8% 14% 46%; z-index: 1; opacity: .7; }
.ws-site-background.ws-background-paused .ws-orbit { animation-play-state: paused; }
@media (max-width: 900px) {
  .ws-site-background .ws-site-orbits { inset: 20% -45% 30% 25%; opacity: .45; }
}
