/* ==========================================================================
   SCROLL STACK COMPONENT STYLES
   ========================================================================== */

.scroll-stack-scroller {
  position: relative;
  width: 100%;
  overflow: visible;
}

.scroll-stack-inner {
  position: relative;
  width: 100%;
  padding-top: 4vh;
  padding-bottom: 35vh; /* Runway so cards stack cleanly */
}

.scroll-stack-card {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  transform-origin: top center;
  will-change: transform, filter;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  transition: border-color 0.3s ease;
}

.scroll-stack-end {
  width: 100%;
  height: 1px;
  pointer-events: none;
}