.hero-section {
  width: 100%;
  height: 100vh;
  background: url("../images/alloy-steel-bg.png");
  background-size: cover;
  background-position: bottom bottom !important;
  background-repeat: no-repeat;
  position: relative;
  z-index: 10;
}

@media screen and (max-width: 768px) {
  .hero-section {
    height: 90vh;
  }
  .hero-container {
    padding-top: 75%;
  }
  .hero-container h2 {
    font-size: 2.7rem;
  }
  .hero-container p {
    font-size: 18px;
  }
}
@media screen and (max-width: 580px) {
  .hero-container {
    padding-top: 85%;
  }
  .hero-container h2 {
    font-size: 2rem;
  }
}
@media screen and (max-width: 450px) {
  .hero-container {
    padding-top: 100%;
  }
  .hero-container h2 {
    font-size: 2rem;
  }
  .heading h2 {
    font-size: 1.9rem;
  }
}