/* Home hero backdrop: marketing-site centurion, training silhouettes, and fire embers. Home page only. */
.home-hero{background:#0b0a08;isolation:isolate}
.home-hero .home-legion,
.home-hero .home-embers,
.home-hero-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.home-hero .home-legion{
  z-index:0;
  opacity:.38;
  mix-blend-mode:screen;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 88%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 12%,#000 88%,transparent 100%);
  filter:blur(.55px);
}
.home-hero-art{z-index:1;display:flex;justify-content:center;align-items:flex-start;overflow:hidden}
.home-hero-art img{
  display:block;width:min(150%,720px);max-width:none;height:auto;margin-top:.4rem;opacity:.62;
  mask-image:radial-gradient(closest-side,#000 48%,transparent 100%);
  -webkit-mask-image:radial-gradient(closest-side,#000 48%,transparent 100%);
  mix-blend-mode:lighten;
  transform:translate3d(var(--px,0px),var(--py,0px),0) perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
}
.home-hero.fire-on .home-hero-art img{filter:saturate(1.05) contrast(1.03)}
.home-hero .home-embers{z-index:3}
.home-hero:before{
  content:"";position:absolute;inset:0;z-index:4;pointer-events:none;
  background:radial-gradient(circle at 50% 40%,rgba(255,170,50,.42),rgba(255,110,20,.12) 42%,transparent 68%);
  opacity:0;
}
.home-hero.tap-glow:before{animation:heroTapGlow 1s ease-in-out}
@keyframes heroTapGlow{0%{opacity:.9}55%{opacity:.35}100%{opacity:0}}
.home-hero:after{
  content:"";position:absolute;inset:0;z-index:4;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(11,11,13,.06) 0%,rgba(11,11,13,.12) 34%,rgba(11,11,13,.62) 64%,rgba(11,11,13,.9) 84%,var(--bg,#0b0b0d) 100%),
    linear-gradient(90deg,transparent 0%,rgba(11,11,13,.12) 26%,rgba(11,11,13,.42) 50%,rgba(11,11,13,.12) 74%,transparent 100%);
}
.home-hero .hh{position:relative;z-index:5}
.home-hero .hh h1,.home-hero .hh .sub{text-shadow:0 2px 16px rgba(0,0,0,.98),0 0 6px rgba(0,0,0,.9),0 1px 0 rgba(0,0,0,.7)}
@media (min-width:680px){
  .home-hero{min-height:620px}
  .home-hero-art img{width:min(125%,720px);margin-top:0;opacity:.82}
}
@media (prefers-reduced-motion:reduce){
  .home-hero-art img{transform:none;filter:none}
  .home-hero:before,.home-hero.tap-glow:before{animation:none;opacity:0}
}