.hero-section {
  position: relative;
  min-height: 100vh;
  display: grid;
  place-content: center;
}
.background--overlay-hero {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background: rgb(131,58,180);
  background: linear-gradient(30deg, rgba(131,58,180,.51) 0%, rgba(0,202,177,1) 50%, rgba(60,255,230,1) 100%);
  background: linear-gradient(30deg, rgba(250, 40, 40, 0.51) 0%, rgba(0,202,177,1) 50%, rgba(60,255,230,1) 100%);
  z-index: -1;
}
.bg--img-1 {
  position: absolute;
  bottom: 0;
  right: 0;
  height: 100%;
  mix-blend-mode: multiply;
  mix-blend-mode: luminosity;
  opacity: .8;
}
.hero--container {
  width: 100%;
  height: 100%;
  max-width: 1100px;
  z-index: 0;
  display: grid;
  place-content: center;
}
.hero-section-img {
  width: 70%;
  margin: 0 auto;
}

.cta-section {
  position: relative;
  min-height: 30vh;
  padding: 50px 24px;
  display: grid;
  /* place-content: center; */
  justify-items: center;
  font-family: 'Poppins', sans-serif;
}
.cta--container {
  width: 60%;
  height: 100%;
  max-width: 1100px;
  z-index: 0;
  display: grid;
  place-content: center;
  justify-content: start;
  max-width: 1100px;
}
.bg--img-2 {
  position: absolute;
  bottom: 0;
  right: 20%;
  height: 110%;
  mix-blend-mode: multiply;
  mix-blend-mode: luminosity;
  opacity: .8;
}
.cta-text {
  color: white;
  font-size: 32px;
  font-weight: 400;
}