/* Shahmeer Custom Sections - shared scroll entrance animation for every widget.
   Elements fade + rise into place the first time they scroll into view. */

/* Default state: fully visible. Nothing here hides content by default -
   if JS never runs (blocked, errors, editor iframe, etc.) the widget is
   still shown, just without the entrance animation. */
.scs-phone-showcase,
.scs-dual-phone-slider,
.scs-triple-phone-slider,
.scs-stacked-cards,
.scs-phone-stack,
.scs-responsive-devices-slider,
.scs-desktop-monitor-slider {
    opacity: 1;
    transform: none;
}

/* Only elements JS has explicitly armed for animation start hidden.
   This class is added by scs-scroll-reveal.js right before it starts
   observing, so the hidden state only ever exists when JS is confirmed
   running and about to reveal the element. */
.scs-anim-pending {
    opacity: 0;
    transform: translateY(45px);
    transition: opacity 1.4s cubic-bezier(0.22, 1, 0.36, 1), transform 1.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.scs-anim-pending.scs-in-view {
    opacity: 1;
    transform: translateY(0);
}