/* Sunny Container Sales — entry animation system
 *
 * .sn-reveal           : initial hidden state
 * .sn-reveal-up/-down/-left/-right/-scale/-blur : motion variant
 * .is-in               : final visible state (added by JS via IntersectionObserver)
 * --sn-delay           : per-element transition-delay (set by JS for stagger groups)
 * data-sn-stagger="80" : on a parent, sets sequential --sn-delay (ms) for child .sn-reveal
 *
 * Loader handoff: while html.sunny-loading is present, reveals are suppressed.
 * Reduced motion: short fade only, no transforms.
 */

:root {
    --sn-reveal-duration: 720ms;
    --sn-reveal-easing: cubic-bezier(.2, .7, .2, 1);
    --sn-reveal-distance: 28px;
}

.sn-reveal {
    opacity: 0;
    transition:
        opacity     var(--sn-reveal-duration) var(--sn-reveal-easing) var(--sn-delay, 0ms),
        transform   var(--sn-reveal-duration) var(--sn-reveal-easing) var(--sn-delay, 0ms),
        filter      var(--sn-reveal-duration) var(--sn-reveal-easing) var(--sn-delay, 0ms);
    will-change: transform, opacity;
}

.sn-reveal-up    { transform: translate3d(0, var(--sn-reveal-distance), 0); }
.sn-reveal-down  { transform: translate3d(0, calc(var(--sn-reveal-distance) * -1), 0); }
.sn-reveal-left  { transform: translate3d(var(--sn-reveal-distance), 0, 0); }
.sn-reveal-right { transform: translate3d(calc(var(--sn-reveal-distance) * -1), 0, 0); }
.sn-reveal-scale { transform: scale(.94); transform-origin: center; }
.sn-reveal-blur  { filter: blur(10px); }
.sn-reveal-zoom  { transform: scale(1.04); }

.sn-reveal.is-in {
    opacity: 1;
    transform: none;
    filter: none;
}

/* Yellow highlighter sweep on the hero "situation" underline */
.sn-highlight {
    transform-origin: left center;
    transform: scaleX(0);
    transition: transform 900ms cubic-bezier(.2, .7, .2, 1) var(--sn-delay, 450ms);
}
.sn-highlight.is-in { transform: scaleX(1); }

/* Subtle initial drift on the hero image */
.sn-reveal-hero-img {
    opacity: 0;
    transform: scale(1.06);
    transition:
        opacity   1100ms var(--sn-reveal-easing) var(--sn-delay, 250ms),
        transform 1400ms var(--sn-reveal-easing) var(--sn-delay, 250ms);
}
.sn-reveal-hero-img.is-in {
    opacity: 1;
    transform: scale(1);
}

/* Suppress all reveal motion while the page loader is on screen */
html.sunny-loading .sn-reveal,
html.sunny-loading .sn-highlight,
html.sunny-loading .sn-reveal-hero-img {
    transition: none !important;
}

/* Reduce motion: instant, no transforms */
@media (prefers-reduced-motion: reduce) {
    .sn-reveal,
    .sn-highlight,
    .sn-reveal-hero-img {
        transition: none !important;
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
    }
}