/* Siliveri Systems — the film hero. Loads after w1/hero.css and only adds what a film needs:
   a full-bleed cover crop, a slow drift that keeps the frame alive, and a cinematic shadow for the words. */
.hero{background:#060c10}
.hero-poster,.hero-poster img,.hero-film{position:absolute;inset:0;width:100%;height:100%}
.hero-poster img,.hero-film{object-fit:cover;object-position:88% 50%}
/* the film fades in over its own first frame once it is really playing, so nothing ever flashes */
.hero-film{opacity:0;transition:opacity 1.2s ease}
html.film-ready .hero-film{opacity:1}
/* a slow push-in on the whole stage: the camera breathes even between the film's own moves */
@media (prefers-reduced-motion:no-preference){
  .stage{animation:hero-drift 26s ease-in-out infinite alternate}
}
/* the drift also leans the frame right, so the subject stays clear of the headline */
@keyframes hero-drift{from{transform:scale(1.1) translate3d(5%,0,0)}to{transform:scale(1.14) translate3d(6%,0,0)}}
.stage{transform:scale(1.1) translate3d(5%,0,0)}
@media (max-width:760px){.stage{animation:none}}
/* the words sit on a cinematic shadow on the left; the film owns the right */
.scrim{background:
  linear-gradient(90deg,rgba(4,9,12,.9) 0,rgba(4,9,12,.68) 30%,rgba(4,9,12,.18) 56%,rgba(4,9,12,0) 72%),
  linear-gradient(0deg,rgba(4,9,12,.78) 0,rgba(4,9,12,0) 26%),
  linear-gradient(180deg,rgba(4,9,12,.6) 0,rgba(4,9,12,0) 20%)}
.copy h1{text-shadow:0 6px 48px rgba(0,0,0,.45)}
@media (max-width:760px){
  /* phones: frame the slits and the photon spray in the top half, above the words, and let the bottom fall to black */
  .hero-poster img,.hero-film{object-position:72% 50%}
  .stage{transform:translate3d(0,-21%,0);-webkit-mask-image:linear-gradient(#000 72%,transparent 79%);mask-image:linear-gradient(#000 72%,transparent 79%)}
  .scrim{background:linear-gradient(0deg,rgba(4,9,12,.96) 0,rgba(4,9,12,.85) 40%,rgba(4,9,12,.2) 66%,rgba(4,9,12,.45) 100%)}
}