/* =========================================================================
   SCROLL — CSS zum Baukasten scroll.js (pin / reveal)
   Quelle: /_shared/scroll.css → <site>/assets/shared/scroll.css
   -------------------------------------------------------------------------
   pin():   [data-pinwrap] > [data-pinsticky] > [data-pinrail]
            scroll.js setzt data-pin="on|off", --over (px) und --shift (px).
   reveal(): Elemente bekommen .is-in und --rd (Stagger-Delay).
   ========================================================================= */

[data-pinwrap][data-pin="on"] {
  height: calc(100svh + var(--over, 0px));
  min-height: 0;
}
[data-pinwrap][data-pin="on"] > [data-pinsticky] {
  position: sticky;
  top: 0;
  height: 100svh;
  overflow: hidden;
}
[data-pinwrap][data-pin="on"] [data-pinrail] {
  transform: translate3d(var(--shift, 0px), 0, 0);
  will-change: transform;
}
[data-pinwrap][data-pin="off"] [data-pinrail] {
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  [data-pinwrap] { height: auto !important; }
  [data-pinrail] { transform: none !important; }
}
