.hero-bg {
  background-image: linear-gradient(90deg, rgba(3, 37, 70, .98) 0%, rgba(5, 41, 76, .92) 35%, rgba(5, 38, 70, .42) 55%, rgba(5, 38, 70, .06) 100%), url('assets/images/hero-custom-parts.png');
  background-position: center, right 48%;
  background-repeat: no-repeat;
  background-size: cover, min(1080px, 70vw) auto;
}

@media (min-width: 1051px) {
  .hero { height: clamp(440px, 32vw, 520px); }
  .hero-copy { width: min(60%, 690px); }
}