.elementor-kit-10{--e-global-color-primary:#009DA5;--e-global-color-secondary:#292929;--e-global-color-text:#2E2E2E;--e-global-color-accent:#FFAD4A;--e-global-color-abf1108:#0F4F79;--e-global-color-ad9c81a:#41B9BF;--e-global-color-088d11e:#FBBC72;--e-global-color-ffd862f:#AD498F;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-size:3em;--e-global-typography-primary-font-weight:700;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-size:2em;--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Poppins";--e-global-typography-text-font-size:1.2em;--e-global-typography-text-font-weight:300;--e-global-typography-accent-font-family:"Poppins";--e-global-typography-accent-font-weight:500;--e-global-typography-accent-text-transform:uppercase;--e-global-typography-accent-font-style:normal;background-color:#000000;color:var( --e-global-color-text );font-family:"proxima-nova", Sans-serif;font-weight:400;}.elementor-kit-10 button,.elementor-kit-10 input[type="button"],.elementor-kit-10 input[type="submit"],.elementor-kit-10 .elementor-button{background-color:var( --e-global-color-secondary );font-family:"proxima-nova", Sans-serif;font-size:1em;font-weight:bold;text-transform:uppercase;color:var( --e-global-color-astglobalcolor4 );}.elementor-kit-10 e-page-transition{background-color:#FFBC7D;}.elementor-kit-10 a{font-family:"Gotham", Sans-serif;}.elementor-kit-10 h1{color:var( --e-global-color-astglobalcolor2 );font-family:"forma-djr-display", Sans-serif;font-weight:700;}.elementor-kit-10 h2{color:var( --e-global-color-secondary );font-family:"kepler-std", Sans-serif;}.elementor-kit-10 h3{color:var( --e-global-color-secondary );font-family:"forma-djr-display", Sans-serif;}.elementor-kit-10 h5{font-family:"forma-djr-display", Sans-serif;}.elementor-kit-10 h6{font-family:"forma-djr-display", Sans-serif;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */:root{
  --ics-teal: #41B9BF;
  --ics-orange: #F5A623;

  --text: #ffffff;
  --muted: rgba(255,255,255,0.22);
  --pill-border: rgba(255,255,255,0.28);
  --radius: 999px;

  /* Pill sizing */
  --row-h: 64px;
  --pill-max-w: 460px;
  --pill-stroke: 2px;

  /* FIX: stronger optical alignment (adjust if needed) */
  --pill-nudge: -3px;
}

.ics-services{
  background: transparent !important;
  color: var(--text);
  padding: 0 !important;
  margin: 0 !important;
}

.ics-services__inner{
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(26px, 4vw, 70px);
  align-items: center;
}

@media (max-width: 900px){
  .ics-services__inner{ grid-template-columns: 1fr; }
}

/* LEFT */
.ics-services .ics-services__title{
  margin: 0 0 14px 0 !important;
  font-family: forma-djr-display, system-ui, -apple-system, Segoe UI, Arial, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.04 !important;
  font-size: clamp(34px, 4vw, 48px) !important;
  color: #41B9BF !important;
}

.ics-services .ics-services__copy{
  margin: 0 !important;
  max-width: 60ch;
  font-family: proxima-nova, system-ui, -apple-system, Segoe UI, Arial, sans-serif !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  font-size: clamp(17px, 1.2vw, 18px) !important;
  color: rgba(255,255,255,0.86) !important;
}

/* RIGHT */
.ics-services__scroller{
  position: relative;
  width: 100%;
  max-width: 560px;
  margin-left: auto;
  height: 320px;
  background: transparent !important;
}

@media (max-width: 900px){
  .ics-services__scroller{
    max-width: 620px;
    margin-left: 0;
    height: 300px;
  }
}

.ics-services__track-wrap{
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: 22px;
  background: transparent !important;
}

.ics-services__track{
  list-style: none;
  padding: 0;
  margin: 0;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  will-change: transform;
  transform: translate3d(0,0,0);
}

/* Items */
.ics-services__item{
  height: var(--row-h);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;

  font-family: proxima-nova, system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  font-size: clamp(20px, 2vw, 30px);
  font-weight: 400;
  letter-spacing: -0.01em;
  color: var(--muted);
  white-space: nowrap;
  user-select: none;
}

/* FIX: Use top offset (not transform) so it truly “sits” higher */
.ics-services__label{
  display: inline-block;
  line-height: 1.05 !important;
  position: relative;
  top: var(--pill-nudge);
}

/* Active */
.ics-services__item.is-active{
  color: rgba(255,255,255,0.98);
  font-weight: 700;
}

.ics-services__item.is-final.is-active{
  color: var(--ics-orange);
  font-weight: 800;
}

/* Pill */
.ics-services__pill{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(100%, var(--pill-max-w));
  height: var(--row-h);
  border-radius: var(--radius);
  border: var(--pill-stroke) solid var(--pill-border);
  background: transparent !important;
  pointer-events: none;
  z-index: 4;
}

.ics-services__scroller.is-final-active .ics-services__pill{
  border-color: rgba(245,166,35,0.95);
}

/* Fades */
.ics-services__fade{
  position: absolute;
  left: 0;
  width: 100%;
  height: 90px;
  z-index: 5;
  pointer-events: none;
}

.ics-services__fade--top{
  top: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0) 100%);
}

.ics-services__fade--bottom{
  bottom: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0) 100%);
}
.ics-services__label { top: -17px !important; }




/* VIDEO: make the video sit under the cover and fill the tile */
.ue-scroll-marquee .ue-scroll-marquee-item-video{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Ensure the cover sits above by default */
.ue-scroll-marquee .ue-scroll-marquee-item-video-cover,
.ue-scroll-marquee .ue-scroll-marquee-item-video-play-icon{
  position: absolute;
  inset: 0;
  z-index: 5;
  opacity: 1;
  transition: opacity .2s ease;
}

/* When we hover a video item, fade cover + play icon out */
.ue-scroll-marquee .ue-scroll-marquee-item.is-hover-playing
.ue-scroll-marquee-item-video-cover,
.ue-scroll-marquee .ue-scroll-marquee-item.is-hover-playing
.ue-scroll-marquee-item-video-play-icon{
  opacity: 0;
  pointer-events: none;
}







/* ===================================================
   WHITE VERSION OVERRIDES
   Wrapper container must have class: ics-light
=================================================== */

/* Left paragraph text */
.ics-light .ics-services__copy{
  color: rgba(11,15,18,.78) !important;
}

/* -------------------------------
   Inactive list items (black)
-------------------------------- */
.ics-light .ics-services__item,
.ics-light .ics-services__item *{
  color: rgba(11,15,18,.38) !important;
  opacity: 1 !important;
}

/* -------------------------------
   Active item (teal)
-------------------------------- */
.ics-light .ics-services__item.is-active,
.ics-light .ics-services__item.is-active *{
  color: #009DA5 !important;
  font-weight: 700 !important;
}

/* Optional: final highlighted item stays orange */
.ics-light .ics-services__item.is-final.is-active,
.ics-light .ics-services__item.is-final.is-active *{
  color: #F5A623 !important;
}

/* -------------------------------
   Highlight pill styling
-------------------------------- */
.ics-light .ics-services__pill{
  background: rgba(0,157,165,.12) !important;
  border-color: rgba(0,157,165,.55) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.10) !important;
}

/* If pill has inner label */
.ics-light .ics-services__label{
  color: #009DA5 !important;
}

/* -------------------------------
   Scroll fade overlays (WHITE)
-------------------------------- */
.ics-light .ics-services__fade--top{
  background: linear-gradient(to bottom,
    rgba(255,255,255,1) 0%,
    rgba(255,255,255,0) 100%
  ) !important;
}

.ics-light .ics-services__fade--bottom{
  background: linear-gradient(to top,
    rgba(255,255,255,1) 0%,
    rgba(255,255,255,0) 100%
  ) !important;
}
/* ===================================================
   WHITE VERSION OVERRIDES (strong)
   Wrapper container must have class: ics-light
=================================================== */

/* Left paragraph */
.ics-light .ics-services__copy{
  color: rgba(11,15,18,.78) !important;
}

/* 1) Force the RIGHT LIST AREA to muted black (covers a/span/em/strong/etc) */
.ics-light .ics-services :is(
  .ics-services__list,
  .ics-services__track,
  .ics-services__viewport,
  .ics-services__items,
  .ics-services__right
) *{
  color: rgba(11,15,18,.38) !important;
  opacity: 1 !important;
}

/* 2) Re-apply teal ONLY to the active item (and its children) */
.ics-light .ics-services :is(
  .is-active,
  .active
),
.ics-light .ics-services :is(
  .is-active,
  .active
) *{
  color: #009DA5 !important;
  font-weight: 700 !important;
}

/* Optional: keep orange if you use is-final */
.ics-light .ics-services .is-final.is-active,
.ics-light .ics-services .is-final.is-active *{
  color: #F5A623 !important;
}

/* Highlight pill */
.ics-light .ics-services__pill{
  background: rgba(0,157,165,.12) !important;
  border-color: rgba(0,157,165,.55) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.10) !important;
}

/* Fade overlays should be white on the white version */
.ics-light .ics-services__fade--top{
  background: linear-gradient(to bottom, #fff 0%, rgba(255,255,255,0) 100%) !important;
}
.ics-light .ics-services__fade--bottom{
  background: linear-gradient(to top, #fff 0%, rgba(255,255,255,0) 100%) !important;
}






/* ================================
   APPLE-STYLE POPUP EFFECT
   Background blurs first, popup fades in after
   ================================ */

/* Overlay/background blur */
.elementor-popup-modal {
  background: rgba(0, 0, 0, 0.35) !important;
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  animation: icsBackdropBlurIn 0.85s ease forwards;
}

/* Popup content fades in AFTER blur starts */
.elementor-popup-modal .dialog-widget-content {
  opacity: 0;
  transform: scale(0.985);
  filter: none !important;
  animation: icsPopupFadeIn 0.55s ease forwards;
  animation-delay: 0.35s;
}

/* Background blur in */
@keyframes icsBackdropBlurIn {
  from {
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
    background: rgba(0, 0, 0, 0);
  }

  to {
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    background: rgba(0, 0, 0, 0.35);
  }
}

/* Popup fade in only */
@keyframes icsPopupFadeIn {
  from {
    opacity: 0;
    transform: scale(0.985);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

.elementor-popup-modal.ics-closing {
  animation: icsBackdropBlurOut 0.65s ease forwards !important;
}

.elementor-popup-modal.ics-closing .dialog-widget-content {
  animation: icsPopupFadeOut 0.4s ease forwards !important;
}

@keyframes icsBackdropBlurOut {
  from {
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    background: rgba(0, 0, 0, 0.35);
  }

  to {
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
    background: rgba(0, 0, 0, 0);
  }
}

@keyframes icsPopupFadeOut {
  from {
    opacity: 1;
    transform: scale(1);
  }

  to {
    opacity: 0;
    transform: scale(0.985);
  }
}/* End custom CSS */