/* =========================================================
   PGS 3D - Motion
   Scroll reveals, hover micro-states, reduced-motion safety.
   ========================================================= */

.pgs3d-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity 0.8s var(--pgs-ease-out-expo),
    transform 0.8s var(--pgs-ease-out-expo);
  transition-delay: calc(var(--i, 0) * 90ms);
}
.pgs3d-reveal--scale {
  transform: translateY(20px) scale(0.96);
}
.pgs3d-reveal--slide-left  { transform: translateX(-40px); opacity: 0; }
.pgs3d-reveal--slide-right { transform: translateX(40px);  opacity: 0; }

.pgs3d-reveal.is-in,
.pgs3d-reveal--scale.is-in,
.pgs3d-reveal--slide-left.is-in,
.pgs3d-reveal--slide-right.is-in {
  opacity: 1;
  transform: none;
}

/* SVG-dashed connector line for the How-It-Works section, draws in on reveal */
.pgs3d-connector {
  position: absolute;
  inset: 50% 0 auto 0;
  height: 2px;
  background-image: repeating-linear-gradient(
    to right,
    rgba(13, 148, 136, 0.35) 0 8px,
    transparent 8px 16px
  );
  transform-origin: left center;
  transform: scaleX(0);
  transition: transform 1.6s var(--pgs-ease-out-expo);
  z-index: 0;
}
.pgs3d-connector.is-in { transform: scaleX(1); }

/* Universal reduced-motion safety - supersede everything */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .pgs3d-reveal,
  .pgs3d-reveal--scale,
  .pgs3d-reveal--slide-left,
  .pgs3d-reveal--slide-right {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .pgs3d-connector { transform: scaleX(1) !important; }
}