@media (min-width: 768px) {
  .kcs {
    margin-top: 50px;
  }

  .kcs__track .kcs__card {
    flex: 1 1 0;
  }
}

@media (max-width: 767px) {
  /* Elementor applique parfois un overflow qui annule position:sticky. */
  .e-con:has(.kcs--mobile-stack),
  .elementor-widget-wrap:has(.kcs--mobile-stack),
  .elementor-widget-kit-cartes-scroll,
  .elementor-widget-kit-cartes-scroll > .elementor-widget-container {
    overflow: visible !important;
  }

  .kcs--mobile-stack {
    --kcs-mobile-sticky-top: 140px;
    --kcs-mobile-card-gap: 80px;
    --kcs-mobile-stack-offset: 28px;
    position: relative;
  }

  .kcs--mobile-stack .kcs__sticky {
    position: sticky;
    top: var(--kcs-mobile-sticky-top);
    height: calc(100svh - var(--kcs-mobile-sticky-top) - 20px);
    min-height: 0;
    overflow: hidden;
    z-index: 2;
  }

  .kcs--mobile-stack .kcs__track {
    position: relative;
    display: block;
    width: min(100%, var(--kcs-card-width, 260px));
    height: min(var(--kcs-card-height), calc(100svh - var(--kcs-mobile-sticky-top) - 32px));
    margin-inline: auto;
  }

  .kcs--mobile-stack .kcs__card {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 100%;
    height: 100%;
    will-change: transform;
    backface-visibility: hidden;
    transform-style: preserve-3d;
  }

  .kcs--mobile-stack .kcs__card-inner {
    position: relative;
    height: 100%;
  }

  .kcs--mobile-stack .kcs__bottom {
    flex-shrink: 0;
    transform-origin: top left;
    transition: transform 320ms cubic-bezier(.22, 1, .36, 1);
  }

  .kcs--mobile-stack .kcs__card--stacked .kcs__bottom {
    transform: translateY(calc(-1 * var(--kcs-mobile-title-lift, 0px)))
      scale(var(--kcs-mobile-title-scale, 1));
  }

  .kcs--mobile-stack.kcs--hover .kcs__card:hover .kcs__card-inner {
    animation: none;
    transform: none;
  }
}

@media (max-width: 767px) {
  .kcs--mobile-stack.kcs--expanded .kcs__card {
    /* Le transform suit directement le scroll avec la pile ouverte par défaut. */
    transition: height 240ms ease;
  }
  .kcs--mobile-stack.kcs--expanded .kcs__track {
    transition: height 240ms ease;
  }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .kcs--mobile-stack .kcs__bottom { transition: none; transform: none; }
  .kcs--mobile-stack .kcs__sticky { position: relative; top: auto; height: auto; overflow: visible; }
  .kcs--mobile-stack .kcs__track { display: grid; gap: 16px; height: auto; }
  .kcs--mobile-stack .kcs__card { position: relative; height: var(--kcs-card-height); }
}
