.hero-section.with-slider.ecs-home-slider-has-wistia {
  --ecs-home-slider-content-height: 470px;
  --ecs-home-hero-min-height: 590px;
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.ecs-home-slider-backgrounds,
.ecs-home-slider-background {
  position: absolute;
  inset: 0;
}

.ecs-home-slider-backgrounds {
  z-index: 0;
  pointer-events: none;
}

.ecs-home-slider-background {
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease, visibility 0s linear .2s;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.ecs-home-slider-background::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: rgba(4, 22, 39, var(--ecs-home-video-overlay, .45));
}

/* Add extra contrast behind the copy on Wistia-backed slides only. The
 * gradient is intentionally strongest in the upper-left content area and
 * dissolves to transparent before it reaches the opposite side. */
.ecs-home-slider-background::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background: radial-gradient(
    ellipse 78% 88% at 0% 0%,
    rgba(4, 22, 39, .94) 0%,
    rgba(4, 22, 39, .86) 20%,
    rgba(4, 22, 39, .58) 42%,
    rgba(4, 22, 39, .22) 62%,
    rgba(4, 22, 39, 0) 82%
  );
}

.ecs-home-slider-background.is-active {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

.ecs-home-slider-background wistia-player {
  position: absolute !important;
  inset: 50% auto auto 50% !important;
  width: 100vw !important;
  height: 56.25vw !important;
  min-width: 177.78vh !important;
  min-height: 100% !important;
  transform: translate(-50%, -50%) !important;
  display: block !important;
}

.hero-section.with-slider.ecs-home-slider-has-wistia > .hero-clients,
.hero-section.with-slider.ecs-home-slider-has-wistia > .is-style-gl-s6 {
  position: relative;
  z-index: 3;
}

/* Keep one consistent hero footprint for video and standard slides. This
 * remains in place after initialization so the section cannot jump when the
 * graphic is hidden or restored. */
.hero-section.with-slider.ecs-home-slider-has-wistia .hero-clients {
  min-height: var(--ecs-home-hero-min-height);
}

.hero-section.with-slider.ecs-home-slider-has-wistia .hero-slider,
.hero-section.with-slider.ecs-home-slider-has-wistia .hero-slider .slick-list,
.hero-section.with-slider.ecs-home-slider-has-wistia .hero-slider .slick-track,
.hero-section.with-slider.ecs-home-slider-has-wistia .hero-slider .hero-slider-slide {
  min-height: var(--ecs-home-slider-content-height);
}

.hero-section.with-slider .hero-clients-logos {
  transition: opacity .15s ease, visibility 0s linear .15s;
}

.hero-section.with-slider.ecs-home-slider-video-active .hero-clients-logos {
  opacity: 0;
  visibility: hidden;
  transition-delay: 0s;
  pointer-events: none;
}

/* Keep the exact same content column used by ordinary Lottie slides. Hiding
 * the artwork must not allow the Wistia slide text to expand into its space. */
@media (min-width: 1004px) {
  .hero-section.with-slider.ecs-home-slider-video-active .hero-content {
    flex: 0 0 580px;
    width: 580px;
    max-width: 580px;
  }

  /* Preserve the invisible artwork column as a layout spacer on desktop so
   * the content margins and wrapping remain identical across every slide. */
  .hero-section.with-slider.ecs-home-slider-video-active .hero-clients-logos {
    flex: 1 0 0;
  }
}

.hero-section.with-slider .hero-slider-slide.ecs-slide-has-wistia,
.hero-section.with-slider .hero-slider-slide.ecs-slide-has-wistia h1,
.hero-section.with-slider .hero-slider-slide.ecs-slide-has-wistia .small-kicker,
.hero-section.with-slider .hero-slider-slide.ecs-slide-has-wistia .banner-text,
.hero-section.with-slider .hero-slider-slide.ecs-slide-has-wistia .banner-text * {
  color: #fff;
  transition-property: none !important;
}

.header-section.ecs-home-slider-light-header:not(.shrink) {
  background: transparent;
}

.header-section.ecs-home-slider-light-header:not(.shrink) .dark-logo {
  opacity: 0;
  visibility: hidden;
}

.header-section.ecs-home-slider-light-header:not(.shrink) .white-logo {
  opacity: 1;
  visibility: visible;
}

/* Prevent the Lottie artwork from painting or continuing to animate while a
 * video-backed slide is active. */
.hero-section.with-slider.ecs-home-slider-video-active .hero-clients-logos,
.hero-section.with-slider.ecs-home-slider-video-active .hero-clients-logos * {
  animation-play-state: paused !important;
}

/* Slick fade mode deliberately sets negative inline left values on slides two
 * through six. Those offsets place every slide over slide one. Never override
 * them with left: 0, or only the first slide remains in the viewport. */
.hero-section.with-slider .hero-slider,
.hero-section.with-slider .hero-slider .slick-list,
.hero-section.with-slider .hero-slider .slick-track {
  transition: none !important;
}

.hero-section.with-slider .hero-slider .slick-list {
  overflow: hidden;
}

.hero-section.with-slider .hero-slider .hero-slider-slide {
  filter: blur(0);
  transform: none !important;
  transition: filter .9s ease-in-out !important;
  will-change: opacity, filter;
}

.hero-section.with-slider .hero-slider .hero-slider-slide.ecs-slide-blur-out,
.hero-section.with-slider .hero-slider .hero-slider-slide.ecs-slide-blur-in {
  filter: blur(18px);
}

.hero-section.with-slider .hero-slider.slick-initialized .slick-slide {
  display: block !important;
  transform: none !important;
}

.hero-section.with-slider .hero-slider.slick-initialized .slick-slide:not(.slick-current) {
  pointer-events: none;
}

.hero-section.with-slider .hero-slider.slick-initialized .slick-slide.slick-current,
.hero-section.with-slider .hero-slider.slick-initialized .slick-slide.slick-active {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto;
}

.hero-section.with-slider .hero-slider.slick-initialized .slick-slide.slick-current > *,
.hero-section.with-slider .hero-slider.slick-initialized .slick-slide.slick-active > * {
  opacity: 1;
  visibility: visible;
}

@media (max-width: 1003px) {
  .hero-section.with-slider.ecs-home-slider-has-wistia {
    --ecs-home-slider-content-height: 420px;
    --ecs-home-hero-min-height: 720px;
  }

  /* Standard slides stack the artwork below the content at this breakpoint.
   * Video slides can remove that hidden row without changing content margins. */
  .hero-section.with-slider.ecs-home-slider-video-active .hero-clients-logos {
    display: none;
  }

  .hero-section.with-slider.ecs-home-slider-video-active .hero-content {
    flex: 1 1 100%;
    width: 100%;
    max-width: none;
  }
}

@media (max-width: 767px) {
  .hero-section.with-slider.ecs-home-slider-has-wistia {
    --ecs-home-slider-content-height: 390px;
    --ecs-home-hero-min-height: 650px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-section.with-slider .hero-slider .hero-slider-slide {
    transition-duration: .01ms !important;
    filter: none !important;
  }
}


/* Optional image that visually replaces a heading word. The original word
 * remains in the accessibility tree through .screen-reader-text. */
.hero-section.with-slider .ecs-home-slider-visual-word {
  display: inline-flex;
  align-items: center;
  vertical-align: baseline;
  height: var(--ecs-visual-word-height, 78px);
  max-width: 100%;
  margin-inline: .08em;
  padding-block: .10em .04em;
  line-height: 1;
}

.hero-section.with-slider .ecs-home-slider-visual-word img {
  display: block;
  width: auto;
  height: 100%;
  max-width: min(100%, 8em);
  object-fit: contain;
}

@media (max-width: 1200px) {
  .hero-section.with-slider .ecs-home-slider-visual-word { height: min(var(--ecs-visual-word-height, 78px), 72px); }
}
@media (max-width: 1003px) {
  .hero-section.with-slider .ecs-home-slider-visual-word { height: min(var(--ecs-visual-word-height, 78px), 63px); }
}
@media (max-width: 767px) {
  .hero-section.with-slider .ecs-home-slider-visual-word { height: min(var(--ecs-visual-word-height, 78px), 54px); }
}
@media (max-width: 459px) {
  .hero-section.with-slider .ecs-home-slider-visual-word { height: min(var(--ecs-visual-word-height, 78px), 48px); }
}

/* Wistia-only accent treatment. The section-level active-video class is
 * switched with the current slide, so ordinary Lottie slides keep their
 * original kicker and navigation-dot colors. */
.hero-section.with-slider.ecs-home-slider-video-active
  .hero-slider-slide.ecs-slide-has-wistia.slick-current
  .small-kicker {
  color: #ec7614 !important;
}

.hero-section.with-slider.ecs-home-slider-video-active
  .hero-slider
  .slick-dots li button::before {
  border-color: #ec7614 !important;
}

