/** * Scroll-triggered animation — "entrance" preset. * Cards/sections start hidden + shifted down, then fade/slide into place * once they cross the viewport (see storefront-scroll-entrance.js). * Only active while [data-cms-scroll-anim="entrance"] is on . * * Specificity intentionally beats skin `.m-template-* * { transition-duration:0.01ms }` * under prefers-reduced-motion (merchant §8 opt-in). */ body[data-cms-scroll-anim="entrance"] .cms-scroll-target { opacity: 0; transform: translateY(48px) scale(0.94); transition-property: opacity, transform !important; transition-duration: 700ms !important; transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1) !important; transition-delay: var(--cms-scroll-delay, 0ms) !important; will-change: opacity, transform; } body[data-cms-scroll-anim="entrance"] .cms-scroll-target.is-inview { opacity: 1; transform: translateY(0) scale(1); will-change: auto; }