/* ── 滚动触发动画（由 includes/footer.php 引入）── */
.on-scroll {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: transform, opacity;
}
.on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0);
}
/* 变种方向效果 */
.on-scroll.slide-left  { transform: translateX(-48px); }
.on-scroll.slide-right { transform: translateX(48px); }
.on-scroll.slide-left.is-visible,
.on-scroll.slide-right.is-visible { transform: translateX(0); }
.on-scroll.zoom-in   { transform: scale(0.94); }
.on-scroll.zoom-in.is-visible { transform: scale(1); }
.on-scroll.flip-up   { transform: rotateX(-12deg); transform-origin: bottom; }
.on-scroll.flip-up.is-visible { transform: rotateX(0); }
.on-scroll.dur-500   { transition-duration: 0.5s; }
.on-scroll.dur-900   { transition-duration: 0.9s; }
.on-scroll.dur-1200  { transition-duration: 1.2s; }
/* 尊重用户系统"减少动态效果"偏好 */
@media (prefers-reduced-motion: reduce) {
    .on-scroll { opacity: 1 !important; transform: none !important; transition: none !important; }
}