/* Scroll Stagger Cards — bidirecional */
.scroll-stagger {
  --ssc-offset: 80px;
  --ssc-duration: 1100ms;
  --ssc-ease: var(--ease-out-soft, cubic-bezier(0.22, 1, 0.36, 1));
}

.scroll-stagger > .scroll-stagger__item,
.scroll-stagger > .pain-card,
.scroll-stagger > .incluso-feature,
.scroll-stagger > .contact-card {
  opacity: 0 !important;
  transform: translate3d(0, var(--ssc-offset), 0) !important;
  transition:
    opacity var(--ssc-duration) var(--ssc-ease),
    transform var(--ssc-duration) var(--ssc-ease) !important;
  will-change: opacity, transform;
  animation: none !important;
}

.scroll-stagger > .scroll-stagger__item.is-shown,
.scroll-stagger > .pain-card.is-shown,
.scroll-stagger > .incluso-feature.is-shown,
.scroll-stagger > .contact-card.is-shown {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) !important;
}

@media (hover: hover) {
  .scroll-stagger > .pain-card.is-shown:hover {
    transform: translateY(-4px) translateX(2px) !important;
  }

  .scroll-stagger > .incluso-feature.is-shown:hover {
    transform: translateY(-5px) !important;
  }

  .scroll-stagger > .contact-card.is-shown:hover {
    transform: translateY(-4px) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .scroll-stagger > .scroll-stagger__item,
  .scroll-stagger > .pain-card,
  .scroll-stagger > .incluso-feature,
  .scroll-stagger > .contact-card {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto;
  }
}