/*
 * S-BEE ONE - Global Motion System
 * Smooth reveal animations for all sbee-* widgets.
 */

:root {
    --sbee-motion-duration: 720ms;
    --sbee-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --sbee-motion-distance: 14px;
}

/* Prevent horizontal overflow on all S-BEE sections (with or without animation). */
.sbee-icon-grid,
.sbee-video-grid,
.sbee-recent-projects,
.sbee-why-choose,
.sbee-stats-section,
.sbee-intro-block {
    overflow-x: clip;
}

body.sbee-motion-ready .sbee-reveal-item,
body.sbee-motion-ready .sbee-reveal-title {
    opacity: 0;
    transform: translate3d(0, var(--sbee-motion-distance), 0);
    will-change: transform, opacity;
    backface-visibility: hidden;
    transition:
        opacity var(--sbee-motion-duration) var(--sbee-motion-ease),
        transform var(--sbee-motion-duration) var(--sbee-motion-ease),
        box-shadow 220ms ease;
    transition-delay: var(--sbee-reveal-delay, 0ms);
}

body.sbee-motion-ready .sbee-reveal-item.is-visible,
body.sbee-motion-ready .sbee-reveal-title.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

/* Slightly more premium reveal for headings. */
body.sbee-motion-ready .sbee-reveal-title {
    transform: translate3d(0, 18px, 0);
    transition-duration: 760ms;
}

/* Respect users who prefer less motion. */
@media (prefers-reduced-motion: reduce) {
    body.sbee-motion-ready .sbee-reveal-item,
    body.sbee-motion-ready .sbee-reveal-title,
    body.sbee-motion-ready .sbee-reveal-item.is-visible,
    body.sbee-motion-ready .sbee-reveal-title.is-visible {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* === DISABLE ALL ANIMATIONS FOR STATS AND LOGO GRID === */
.sbee-stats-section .sbee-st-item,
.sbee-stats-section .sbee-st-title,
.sbee-stats-section .sbee-st-subtitle,
.sbee-logo-grid .sbee-lg-card,
.sbee-logo-grid .sbee-lg-title,
.sbee-logo-grid .sbee-lg-subtitle {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
}
