html {
  font-size: 62.5%;
}
.hero-image-container {
  position: relative;
}
.hero-image {
  height: 100vh;
  object-fit: cover;
}
.overlay {
  background-color: rgb(0, 0, 0, 0.6);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.button {
  width: fit-content;
}
.hero-description {
  width: 50%;
}
@media (max-width: 1040px) {
  .hero-description {
    width: 80%;
  }
  .hero-image {
    height: 50rem;
  }
}
@media (max-width: 650px) {
  .overlay {
    background-color: rgb(0, 0, 0, 0.9);
    position: static;
  }
  .hero-description {
    width: 100%;
  }
  .hero-image {
    height: 30rem;
  }
}