.hero-home {
  padding: 54px 0 42px;
}

.hero-home .hero-grid {
  grid-template-columns: minmax(0, 1fr) minmax(340px, 460px);
  gap: clamp(42px, 7vw, 104px);
  align-items: center;
}

.hero-home .hero-image {
  width: min(100%, 460px);
  min-height: 0;
  aspect-ratio: 1122 / 1402;
  justify-self: end;
  background: #f3f3f3;
}

.hero-home .hero-image img {
  object-position: center top;
}

@media (max-width: 800px) {
  .hero-home {
    padding-top: 34px;
  }

  .hero-home .hero-grid {
    gap: 32px;
  }

  .hero-home .hero-image {
    width: min(100%, 500px);
    justify-self: start;
  }
}