.hero-section {
  background-image: url("../images/hero.webp");
  height: 65vh;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.parallax-bg {
  background-image: url("../images/agents.jpg");
  display: flex;
  align-items: end;
  width: 100%;
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 100%;
}

.solutions-bg {
  background-image: url("../images/solutions.jpg");
  background-attachment: fixed;
}

.insurance-bg {
  background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
    url("../images/insurance.jpg");
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
}

.quote-bg {
  background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)),
    url("../images/quote.jpg");
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
}

.grid-span-2 {
  grid-column: span 2 / auto;
}

@media screen and (max-width: 767px) {
  .parallax-bg {
    height: 100%;
  }
}
@media screen and (orientation: landscape) {
  .hero-section {
    height: 450px;
  }
}

@media screen and (orientation: landscape) and (max-width: 767px) {
  .hero-section {
    height: 390px;
  }
}