/* Full-width carousel; keep transforms and clipping off this ancestor so fixed backgrounds work. */
.marpa-home-hero {
  position: relative;
  box-sizing: border-box;
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: clamp(500px, 85vh, 700px);
  margin-inline: calc(50% - 50vw) !important;
  padding: 0 !important;
  background-color: #17202b;
  isolation: isolate;
}

.elementor > .e-con.e-con-full.marpa-home-hero {
  padding: 0 !important;
}

.marpa-home-hero__slide {
  position: absolute !important;
  inset: 0;
  display: flex !important;
  width: 100% !important;
  min-height: 100%;
  justify-content: center;
  overflow: visible;
  background-color: #17202b;
  background-position: center right;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed !important;
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 1200ms ease,
    visibility 0s linear 1200ms;
  visibility: hidden;
  z-index: 0;
}

.marpa-home-hero__slide--intro {
  background-image:
    linear-gradient(90deg, rgb(8 16 27 / 82%), rgb(8 16 27 / 58%) 48%, rgb(8 16 27 / 22%)),
    url("../images/home-hero-intro.png");
}

.marpa-home-hero__slide--principle {
  background-image:
    linear-gradient(90deg, rgb(8 16 27 / 82%), rgb(8 16 27 / 58%) 48%, rgb(8 16 27 / 22%)),
    url("../images/home-hero-principle.png");
}

.marpa-home-hero__slide.is-active {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
  transition:
    opacity 1200ms ease,
    visibility 0s;
  z-index: 1;
}

.marpa-home-hero__slide.is-leaving {
  opacity: 0;
  pointer-events: none;
  transition: opacity 1200ms ease;
  visibility: visible;
  z-index: 2;
}

.marpa-home-hero__content {
  position: relative;
  width: min(100%, 1400px) !important;
  max-width: 1400px !important;
  margin-inline: auto;
  padding: clamp(72px, 9vh, 120px) clamp(24px, 5vw, 80px) !important;
  z-index: 1;
}

.marpa-home-hero__title {
  width: 100%;
  max-width: 1250px;
}

.marpa-home-hero__title .elementor-heading-title {
  color: #fff !important;
  font-size: clamp(38px, 4.2vw, 68px);
  font-weight: 500;
  line-height: 1.08;
}

.marpa-home-hero__description {
  width: min(100%, 850px);
}

.marpa-home-hero__description p {
  color: #fff !important;
  font-size: clamp(16px, 1.25vw, 20px);
  line-height: 1.5;
}

.marpa-home-hero__tagline .elementor-heading-title {
  color: #fff !important;
  font-size: clamp(18px, 1.6vw, 22px);
  font-weight: 600;
  letter-spacing: 0.04em;
}

.marpa-home-hero .elementor-widget-heading .elementor-heading-title,
.marpa-home-hero .marpa-home-hero__description,
.marpa-home-hero .marpa-home-hero__description p,
.marpa-home-hero .marpa-home-hero__description p *,
.marpa-home-hero .elementor-button,
.marpa-home-hero .elementor-button .elementor-button-text {
  color: #fff !important;
}

.marpa-home-hero__actions {
  width: auto !important;
  flex-wrap: wrap;
  gap: 14px;
}

@media (max-width: 767px) {
  .marpa-home-hero {
    min-height: 620px;
  }

  .marpa-home-hero__slide {
    background-position: center center;
  }

  .marpa-home-hero__slide--intro {
    background-image:
      linear-gradient(90deg, rgb(8 16 27 / 82%), rgb(8 16 27 / 58%) 48%, rgb(8 16 27 / 22%)),
      url("../images/home-hero-intro-mobile.png");
  }

  .marpa-home-hero__slide--principle {
    background-image:
      linear-gradient(90deg, rgb(8 16 27 / 82%), rgb(8 16 27 / 58%) 48%, rgb(8 16 27 / 22%)),
      url("../images/home-hero-principle-mobile.png");
  }

  .marpa-home-hero__content {
    padding: 68px 20px !important;
  }

  .marpa-home-hero__title .elementor-heading-title {
    font-size: clamp(36px, 9vw, 50px);
  }

  .marpa-home-hero__description p {
    font-size: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .marpa-home-hero__slide {
    transition: none;
  }
}