.hero-mobile-img { display: none; }

@media (max-width: 900px) {
  .hero {
    display: block;
    height: auto;
    min-height: 940px;
    padding-top: min(92vw, 420px);
    background: #151513;
  }

  .hero > .hero-desktop-img { display: none; }

  .hero > .hero-mobile-img {
    display: block;
    position: absolute;
    inset: 0 0 auto 0;
    width: 100%;
    height: min(92vw, 420px);
    object-fit: cover;
    object-position: center center;
  }

  .hero-shade {
    background: linear-gradient(180deg, transparent 20%, rgba(21,21,19,.25) 36%, #151513 45%, #151513 100%);
  }

  .hero-content {
    margin: 0;
    padding: 42px 22px 150px;
    width: 100%;
  }

  .hero h1 { font-size: clamp(3rem, 13vw, 4.8rem); }
  .hero-copy { margin: 22px 0 28px; }
}

@media (max-width: 420px) {
  .hero { min-height: 920px; }
  .hero-content { padding-top: 34px; }
}