/* The mobile opening has its own portrait edit and space to see the footage. */
@media (max-width: 760px) {
  .hero {
    min-height: max(680px, calc(100svh - 95px));
    max-height: none;
  }
  .hero-screen img,
  .hero-screen video {
    object-position: center;
  }
  .hero-screen:before {
    background: linear-gradient(180deg, #0002 0%, #0003 24%, #0008 64%, #000a 100%);
  }
  .hero:after {
    background: linear-gradient(180deg, #0000 0%, #0002 27%, #0007 55%, #000b 100%);
  }
  .hero-layout {
    min-height: inherit;
    justify-content: flex-end;
    padding-top: 170px;
    padding-bottom: 90px;
  }
  .hero-copy {
    width: 100%;
  }
}

@media (max-width: 760px) and (max-height: 720px) {
  .hero {
    min-height: max(600px, calc(100svh - 74px));
  }
  .hero-layout {
    padding-top: 90px;
    padding-bottom: 48px;
  }
}