@media (max-width:900px){
  .hero{
    --hero-nav-height:112px;
    display:block;
    height:auto;
    min-height:0;
    padding:var(--hero-nav-height) 0 0;
    background:#030608;
  }
  .hero video{
    position:relative;
    display:block;
    inset:auto;
    width:100%;
    height:auto;
    max-width:100%;
    max-height:calc(100svh - var(--hero-nav-height));
    aspect-ratio:16 / 9;
    object-fit:contain;
    object-position:center;
    transform:none;
    background:#030608;
  }
  .hero::after{display:none}
  .heroContent{
    width:90%;
    margin:0 auto;
    padding:30px 0 38px;
    background:#030608;
  }
}
@media (max-width:720px){
  .hero{--hero-nav-height:106px}
}