.cta {
  background-color: var(--color-sand);
  margin-bottom: 48px;
  margin-top: 10px;
  overflow: hidden;
}

.cta .cta__wrapper {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-flow: row nowrap;
  overflow: hidden;
}

.cta .cta__details {
  -webkit-box-flex: 0;
          flex: 0 0 40%;
  padding: 5rem 3rem 5rem 5rem;
}

.cta .cta__details .button {
  margin: 24px 0;
}

.cta .cta__details .cta__accent {
  background: var(--color-mustard);
  height: 4px;
  margin-bottom: 24px;
  width: 48px;
}

.cta .cta__details .cta__heading {
  font-size: var(--font-size-heading-huge);
  margin-top: 24px;
}

.cta .cta__details .cta__text p {
  color: var(--color-black);
  font-family: var(--font-family-serif);
  font-style: normal;
  font-weight: normal;
  font-size: var(--font-size-body-large);
  line-height: 160%;
  margin: 24px 0;
}

.cta .cta__details .cta__text__new p {
  color: var(--color-black);
  font-family: var(--font-family-serif);
  font-style: normal;
  font-weight: normal;
  font-size: var(--font-size-body-large);
  line-height: 160%;
  margin: 24px 0;
}

.cta .cta__media {
  -webkit-box-flex: 1;
          flex: 1 0 auto;
}

.cta .cta__media .field,
.cta .cta__media .field__item,
.cta .cta__media .field article {
  height: 100%;
}

.cta .cta__media img {
  display: block;
  height: 100%;
  min-height: 575px;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}

.cta.cta__texture {
  background-image: url("/themes/custom/oef/images/cta_texture.svg");
  background-position: left bottom;
  background-repeat: no-repeat;
  background-size: auto;
}

.homepage .paragraph--type--stories-cta {
  margin-bottom: -47px;
  max-width: 100%;
  overflow: hidden !important;
  position: relative; /* Required for Safari to respect stacking order */
  -webkit-transform: translateZ(0); /* Forces hardware acceleration for smoother rendering */
  z-index: 1;
}

.oneearthfuture-org .homepage .paragraph--type--stories-cta, .pasocolombia-org .homepage .paragraph--type--stories-cta {
  margin-bottom: -47px;
  max-width: 100%;
  overflow: hidden !important;
  position: relative;
  /* Required for Safari to respect stacking order */
  -webkit-transform: translateZ(0);
  /* Forces hardware acceleration for smoother rendering */
  z-index: -2;
}

@media (min-width: 992px) and (max-width: 1279px) {
  .cta .cta__wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-flow: column;
  }

  .cta.cta__texture {
    background-position: 0 0;
    background-position: initial;
  }
}

@media (max-width: 991px) {
  .cta {
    margin-left: calc(var(--space-inset-x) * -1);
    min-width: 100vw;
  }

  .cta .cta__wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-flow: column;
  }

  .cta .cta__details {
    padding: 40px calc(var(--space-inset-x) * 2);
  }

  .cta .cta__details .cta__heading {
    margin: 24px 0;
  }

  .cta .cta__details .cta__text p {
    font-size: var(--font-size-body-large);
  }

  .cta .cta__details .button {
    margin: 24px 0 0 0;
  }

  .cta .cta__media img {
    min-height: auto;
  }

  .cta.cta__texture {
    background-position: 0 0;
    background-position: initial;
  }
}

@media (max-width: 767px) {
  .cta .cta__details {
    background-image: url("/themes/custom/oef/images/cta_texture_mobile.svg");
    background-position: left top;
    background-repeat: no-repeat;
    background-size: contain;
  }

  .cta .cta__details .cta__text p {
    font-size: var(--font-size-body);
  }

  .cta.cta__texture {
    background-image: none;
  }
}

@media (max-width: 424px) {
  .cta .cta__details {
    padding: 40px var(--space-inset-x);
  }
}