.hero-video-stage{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  background:#050b1d;
}
.hero-bg-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  opacity:0;
  transform:scale(1.035);
  filter:saturate(.72) contrast(1.08);
  transition:opacity 1.25s ease,transform 8s linear;
}
.hero-bg-video--portrait{object-position:center 35%}
.hero-bg-video.is-active{opacity:.9;transform:scale(1)}
.hero-video-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.76) 0%,rgba(0,0,0,.48) 37%,rgba(0,0,0,.12) 68%,transparent 100%);
}
.hero>.container,.hero>.orb{position:relative;z-index:2}
.hero:after{z-index:1;pointer-events:none}
.hero-grid{grid-template-columns:minmax(0,650px) 1fr}
.hero-copy{padding:34px 38px 34px 0;text-shadow:0 3px 20px rgba(0,0,0,.5)}
.hero-copy>p{color:#c5d1e6}
.hero .metrics span{color:#8fa2c4}
.hero .btn-ghost{background:rgba(8,20,48,.74);color:#fff;border-color:rgba(255,255,255,.15);backdrop-filter:blur(9px)}
@media(max-width:950px){
  .hero-grid{grid-template-columns:1fr}
  .hero-copy{max-width:720px}
}
@media(max-width:640px){
  .hero-bg-video.is-active{opacity:.82}
  .hero-video-overlay{background:linear-gradient(180deg,rgba(0,0,0,.66),rgba(0,0,0,.34) 58%,rgba(0,0,0,.62))}
  .hero-copy{padding:20px 0;text-shadow:0 3px 18px rgba(0,0,0,.72)}
}
@media(prefers-reduced-motion:reduce){
  .hero-bg-video{transition:none;transform:none}
  .hero-bg-video:not(:first-child){display:none}
}