
.promo-island {
  padding: 12rem 0 10rem;
  margin-top: 16rem
}

@media (max-width: 1023.5px) {
  .promo-island {
    padding: 10rem 0 0
  }
}

@media (max-width: 767.5px) {
  .promo-island {
    margin-top: 6rem;
    padding: 6rem 0 0
  }
}

.promo-island:before {
  content: "";
  display: block;
  width: 100vw;
  background: #f7f7f7;
  position: absolute;
  z-index: -1;
  top: 0;
  height: calc(100% - 40rem)
}

@media (max-width: 1023.5px) {
  .promo-island:before {
    height: calc(100% - 25rem)
  }
}

.promo-island h2 {
  padding-bottom: 4rem
}

@media (max-width: 639.5px) {
  .promo-island h2 {
    padding-bottom: 2rem
  }
}

.promo-island--testimonial {
  display: flex;
  align-items: center
}

@media (max-width: 639.5px) {
  .promo-island--testimonial {
    display: block
  }
}

.promo-island .testimonial .testimonial__visual-wrapper {
  justify-content: flex-start;
  margin: 0
}

.promo-island .testimonial__img-wrapper > div {
  width: 300px;
  height: 300px
}

@media (max-width: 767.5px) {
  .promo-island .testimonial__img-wrapper > div {
    width: 200px;
    height: 200px
  }
}

@media (max-width: 639.5px) {
  .promo-island .testimonial__img-wrapper > div {
    width: 110px;
    height: 110px
  }
}

.promo-island .testimonial__img {
  max-height: 300px
}

@media (max-width: 767.5px) {
  .promo-island .testimonial__img {
    max-height: 220px
  }
}

@media (max-width: 639.5px) {
  .promo-island .testimonial__img {
    max-height: 130px
  }
}

.promo-island .testimonial .testimonial__content-wrapper {
  padding: 2rem;
  max-width: unset;
  margin: 0
}

@media (max-width: 639.5px) {
  .promo-island .testimonial .testimonial__content-wrapper {
    padding: 2rem 0 0
  }
  .promo-island .testimonial .testimonial__content-wrapper cite {
    margin: 0 0 2rem
  }
}

.promo-island .testimonial__name {
  background-color: transparent;
  color: #333;
  padding: 0
}

.promo-island .testimonial__function {
  display: block;
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  color: #5c2d91;
  background-color: transparent;
  padding: 0
}

.promo-island--flex {
  display: flex;
  gap: 2rem 4rem;
  align-items: stretch;
  flex-wrap: wrap;
  margin-bottom: 4rem
}

@media (max-width: 1023.5px) {
  .promo-island--flex {
    gap: 4rem 4rem
  }
}

@media (max-width: 639.5px) {
  .promo-island--flex {
    gap: 2rem 4rem;
    margin-bottom: 2rem
  }
}

.promo-island--flex .cell {
  position: relative
}

@media (min-width: 1024px) {
  .promo-island--flex .medium-8 {
    width: calc((100% - 20px) / 3 * 2)
  }
  .promo-island--flex .medium-4 {
    width: calc((100% - 80px) / 3)
  }
}

@media (max-width: 1219.5px) {
  .promo-island--flex .medium-4 {
    width: calc((100% - 80px) / 3)
  }
  .promo-island--flex .medium-8 {
    width: 100%;
    border-bottom: 2px solid #c1c1c3;
    padding-bottom: 4rem;
    margin-bottom: 2rem
  }
  .promo-island--flex .medium-8 + .medium-4 {
    width: 100%;
    padding-left: 10px;
    margin-top: 0
  }
}

@media (max-width: 1023.5px) {
  .promo-island--flex .medium-8 {
    margin-bottom: 0
  }
  .promo-island--flex .medium-4 {
    width: 100%
  }
}

@media (max-width: 639.5px) {
  .promo-island--flex .medium-8 {
    padding-bottom: 0
  }
  .promo-island--flex .medium-8 + .medium-4 {
    padding-left: 0
  }
}

.promo-island--text {
  padding-left: 4rem;
  margin-top: 2rem
}

.promo-island--text h3 {
  padding-bottom: 2rem
}

@media (min-width: 1220px) {
  .promo-island--text:before {
    content: "";
    display: block;
    width: 2px;
    height: 100%;
    background: #dadadb;
    position: absolute;
    left: -22px;
    top: 0
  }
}

@media (max-width: 639.5px) {
  .promo-island--text {
    margin-top: 0
  }
}

.promo-island--card {
  border-radius: 10px;
  background-color: #fff;
  box-shadow: 0 30px 45px 0 #2e164829;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  align-items: flex-start;
  padding: 4rem
}

@media (max-width: 639.5px) {
  .promo-island--card {
    padding: 2rem
  }
}

.promo-island--card__image {
  width: 100px;
  height: 100px;
  border-radius: 1rem;
  margin-bottom: 1.5rem
}

.promo-island--card h3 {
  flex: 1;
  padding-bottom: 0
}

.promo-island .arrow {
  color: #5c2d91
}

.promo-island .form__button--submit {
  box-shadow: 0 10px 30px 0 #5c2D913D, 0 8px 10px -2px #391D5829, 0 12px 10px -8px #00000029;
  margin-top: 0
}

@media (max-width: 639.5px) {
  .promo-island .form__button--submit {
    width: 100%
  }
}
