.hero-section {
  margin-bottom: 155px;

  @media (max-width: 768px) {
    margin-bottom: 60px;
  }
}

.hero-section-container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 95px;

  @media (max-width: 768px) {
    flex-direction: column-reverse;
    padding:0px;
    gap: 36px;
  }
}

.hero-section-text-container {
  max-width: 414px;
  gap: 40px;
}

.hero-section-text-header {

}

.hero-section-image {
  width: 597px;
  box-shadow: 0 4px 50.4px 0 rgba(62, 60, 93, 0.46);
}

/* Section Accolades*/
.section-accolades {
  margin-bottom: 94px;

  @media (max-width: 768px) {
    margin-bottom: 60px;
  }
}

/* Section One */
.section-one {
  margin-bottom: 92px;

  @media (max-width: 768px) {
    margin-bottom: 60px;
  }
}

.section-one-image {
  width: 624px;
}

.section-one-container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 87px;

  @media (max-width: 768px) {
    flex-direction: column;
    gap: 30px;
  }
}

.section-one-text-container {
  max-width: 445px;
  gap: 32px;
}

.section-one-text-header {
  max-width: 392px;
}


/* Section Two */
.section-two {
  margin-bottom: 195px;

  @media (max-width: 768px) {
    margin-bottom: 70px;
  }
}

.section-two-container {
  justify-content: center;
  align-items: center;
  gap: 50px;

  @media (max-width: 768px) {
    align-items: start;
  }
}

.section-two-cards-container {
  gap: 24px;

  @media (max-width: 768px) {
    width: 100%;
  }
}

/* Section Three */
.section-three {
  margin-bottom: 147px;

  @media (max-width: 768px) {
    margin-bottom: 90px;
  }
}

.section-three-container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 91px;

  @media (max-width: 768px) {
    flex-direction: column;
    gap: 30px;
  }

  @media (min-width: 769px) and (max-width: 1439px) {
    gap: 55px;
  }
}

.wave-graphic {
  display: none;
  position: absolute;
  z-index: -1;
  width: 983.003px;
  height: 1248.072px;
  top: -650px;
  left: -310px;
}

.section-three-text-container {
  max-width: 439px;
  width: 100%;
  gap: 32px;

  @media (min-width: 769px) and (max-width: 1439px) {
    max-width: 375px;
  }
}

.section-three-text-container-text {
  max-width: 395px;
}

.section-three-icon-text-container {
  max-width: 620px;
  flex-wrap: wrap;
  gap: 30px;
}

.section-three-icon-text-row {
  gap: 22px;
}

.section-three-icon {
  width: 61px;
}

.section-three-icon-text {
  max-width: 204px;
  color: var(--dark-blue);
  font-family: var(--font-outfit);
  font-size: 25px;
  font-weight: 500;
  line-height: 29px;

  @media (max-width: 768px) {
    max-width: 252px;
    width: 100%;
  }

  @media (min-width: 769px) and (max-width: 1439px) {
    font-size: 20px;
    line-height: 21px;
  }
}

/* Section Four */
.section-four {
  margin-bottom: 108px;

  @media (max-width: 768px) {
    margin-bottom: 85px;
  }
}

.section-four-container {
  justify-content: center;
  align-items: center;
  gap: 96px;

  @media (max-width: 768px) {
    gap: 30px;
  }
}

.section-four-header-container {
  max-width: 682px;
  text-align: center;
  gap: 28px;

  @media (max-width: 768px) {
    text-align: start;
  }
}

.section-four-header-text {
  max-width: 580px;
}

.section-four-main-container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 54px;

  @media (max-width: 768px) {
    flex-direction: column-reverse;
  }
}

.section-four-text-panel-container {
  max-width: 520px;
  width: 100%;
}

.section-four-image {
  width: 580px;
}


/* Section Five */
.section-five {
  margin-bottom: 130px;

  @media (max-width: 768px) {
    margin-bottom: 98px;
  }
}

.section-five-container {
  justify-content: center;
  align-items: center;
  gap: 100px;

  @media (max-width: 768px) {
    align-items: left;
    gap: 61px;
  }
}

.section-five-icon-text-container {
  display: flex;
  flex-direction: row;
  gap: 30px;

  @media (max-width: 768px) {
    flex-direction: column;
  }
}

.section-five-icon-row {
  justify-content: center;
  align-items: center;
  gap: 30px;

  @media (max-width: 768px) {
    justify-content: start;
  }
}

.section-five-icon {
  width: 73px;

  @media (max-width: 768px) {
    width: 61px;
  }
}

.section-five-icon-text {
  max-width: 183px;
  font-weight: 700;

  @media (max-width: 768px) {
    max-width: 100%;
  }
}



/* Section Six */
.section-six {
  margin-bottom: 125px;

  @media (max-width: 768px) {
    margin-bottom: 106px;
  }
}

.section-six-container {
  justify-content: center;
  align-items: center;
  gap: 40px;
}

.section-six-testimonial-container {
  width: 100%;
}

/* Section Seven */
.section-seven-container {
  display: flex;
  flex-direction: row;
  gap:150px;

  @media (max-width: 768px) {
    flex-direction: column;
    gap: 50px;
  }

  @media (min-width: 769px) and (max-width: 1439px) {
    gap: 55px;
  }
}

.section-seven-text-container {
  max-width: 483px;
  width: 100%;
  /* padding: 0 125px; */
  /* gap: 150px; */

  @media (max-width: 768px) {
    padding: 0;
  }

  @media (min-width: 769px) and (max-width: 1439px) {
    max-width: 430px;
    padding: 0;
  }
}

.section-seven-text-container-text {
  font-size: 18px;
  line-height: 28px;
  margin: 0;

  @media (max-width: 768px) {
    font-size: 16px;
  }
}

.section-seven-text-container-cta {
  background-color: var(--dark-blue);
  color: white;
  border-radius: 4px;
  width: 230px;
  height: 57px;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 8px;

  @media (max-width: 768px) {
    width: 100%;
    font-weight: 400;
  }
}

.section-seven-text-container-cta-icon {
  width: 20px;
}

.section-seven-carousel-container {
  gap: 22px;
}



/* RESPONSIVE LAYER*/


@media (max-width: 768px) {
  .hero-section-container,
  .section-one-container,
  .section-three-container,
  .section-four-main-container {
    width: 100%;
  }

  /* .hero-section-image,
  .section-one-image,
  .section-four-image {
    width: 100%;
    max-width: 624px;
    height: auto;
    content: url('/_assets/_redesign/images/jpl-modern-originator-hero-MB.png');
  } */

  .section-three-icon-text-container {
    width: 100%;
    max-width: 100%;
  }

  .section-four-text-panel-container {
    width: 100%;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .hero-section-container {
    gap: 40px;
  }

  .hero-section-text-container {
    max-width: 44%;
  }

  .hero-section-image {
    width: min(50vw, 500px);
    height: auto;
  }

  .section-one-container,
  .section-three-container,
  .section-four-main-container {
    gap: 42px;
  }

  .section-one-image {
    width: min(48vw, 520px);
    height: auto;
  }

  .section-one-text-container {
    max-width: 44%;
  }

  .section-two-cards-container {
    width: 100%;
  }

  .section-three-text-container {
    max-width: 44%;
  }

  .section-three-icon-text-container {
    max-width: 52%;
    gap: 22px;
  }

  .section-four-image {
    width: min(48vw, 520px);
    height: auto;
  }

  .section-four-text-panel-container {
    max-width: 44%;
  }

  .section-seven-text-container {
    padding: 0;
    max-width: 46%;
  }
}

@media (min-width: 1025px) and (max-width: 1919px) {
  .hero-section-container {
    gap: clamp(55px, 7vw, 95px);
  }

  .hero-section-image {
    width: min(47vw, 597px);
    height: auto;
  }

  .section-one-container {
    gap: clamp(55px, 7vw, 87px);
  }

  .section-one-image {
    width: min(47vw, 624px);
    height: auto;
  }

  .section-three-container {
    gap: clamp(55px, 7vw, 91px);
  }

  .section-three-icon-text-container {
    max-width: 620px;
  }

  .section-four-main-container {
    gap: clamp(40px, 5vw, 54px);
  }

  .section-four-image {
    width: min(46vw, 580px);
    height: auto;
  }

  .section-seven-text-container {
    padding: 0;
    max-width: 483px;
  }
}

@media (min-width: 1920px) and (max-width: 2559px) {
  .hero-section-container {
    gap: 110px;
  }

  .hero-section-image {
    width: 620px;
  }

  .section-one-container {
    gap: 100px;
  }

  .section-one-image {
    width: 650px;
  }

  .section-four-main-container {
    gap: 70px;
  }

  .section-four-image {
    width: 620px;
  }
}

@media (min-width: 2560px) {
  .hero-section-container {
    gap: 130px;
  }

  .hero-section-image {
    width: 650px;
  }

  .section-one-container {
    gap: 120px;
  }

  .section-one-image {
    width: 680px;
  }

  .section-four-main-container {
    gap: 85px;
  }

  .section-four-image {
    width: 650px;
  }
}