/*
 * Scroll and Animation Optimization
 * Reduces eye strain and improves scroll performance
 */

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Optimize smooth scroll wrapper */
#smooth-wrapper {
    will-change: auto;
}

#smooth-content {
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
}

/* Reduce animation intensity for WOW.js animations */
.wow {
    animation-duration: 0.6s !important; /* Reduced from default 1s */
    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important; /* Smoother easing */
}

/* Optimize fade animations - less jarring */
.fadeIn,
.fadeInUp,
.fadeInDown,
.fadeInLeft,
.fadeInRight {
    animation-duration: 0.5s !important;
    animation-timing-function: ease-out !important;
}

.fadeInUp {
    animation-name: optimizedFadeInUp !important;
}

.fadeInDown {
    animation-name: optimizedFadeInDown !important;
}

/* Gentler fade-in animations */
@keyframes optimizedFadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 20px, 0); /* Reduced from 30px */
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes optimizedFadeInDown {
    from {
        opacity: 0;
        transform: translate3d(0, -20px, 0); /* Reduced from -30px */
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

/* Optimize zoom animations */
.zoomIn {
    animation-duration: 0.4s !important;
    animation-timing-function: ease-out !important;
}

/* Reduce bounce effect - can be tiring */
.bounce,
.bounceIn,
.bounceInUp,
.bounceInDown {
    animation-duration: 0.6s !important;
    animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

/* Optimize slide animations */
.slideInUp,
.slideInDown,
.slideInLeft,
.slideInRight {
    animation-duration: 0.5s !important;
    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Reduce parallax intensity */
[data-speed] {
    will-change: transform;
    backface-visibility: hidden;
}

/* Optimize scroll-triggered animations */
.tj-fadein-right-on-scroll,
.tj-arrange-item,
.tj-arrange-item-2 {
    will-change: transform;
    backface-visibility: hidden;
}

/* Reduce motion blur on fast scrolling */
.swiper-slide,
.project-slider .swiper-slide,
.service-slider .swiper-slide {
    backface-visibility: hidden;
    transform: translateZ(0);
}

/* Optimize image parallax */
.img-parallax img {
    will-change: transform;
    backface-visibility: hidden;
    transform: translateZ(0);
}

/* Smoother transitions for hover effects */
.tj-hover-active-item,
.team-item,
.h6-project-item {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important; /* Smoother easing */
}

/* Reduce sticky panel animation intensity */
.tj-sticky-panel,
.tj-sticky-panel-2,
.tj-sticky-panel-3 {
    will-change: transform;
    backface-visibility: hidden;
}

/* Optimize GSAP scroll animations */
[data-gsap] {
    will-change: transform, opacity;
    backface-visibility: hidden;
}

/* Reduce text split animation intensity */
.text-anim,
.title-anim {
    will-change: transform, opacity;
}

.text-anim span,
.title-anim span {
    display: inline-block;
    backface-visibility: hidden;
}

/* Optimize progress bar animations */
.tj-progress-bar {
    transition: width 1.5s cubic-bezier(0.4, 0, 0.2, 1) !important; /* Smoother and slightly faster */
}

/* Reduce odometer animation speed */
.odometer {
    transition: all 0.5s ease-out !important;
}

/* Optimize marquee sliders - reduce speed perception */
.marquee-slider,
.client-slider,
.h7-team-marquee {
    backface-visibility: hidden;
    transform: translateZ(0);
}

/* Smoother swiper transitions */
.swiper-wrapper {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Reduce zoom-on-scroll intensity */
.zoom-on-scroll {
    will-change: transform;
    backface-visibility: hidden;
}

/* Optimize back-to-top button */
#tj-back-to-top {
    transition: all 0.3s ease-out !important;
}

/* Reduce service stack animation intensity */
.service-stack,
.project-stack {
    will-change: transform, opacity;
    backface-visibility: hidden;
}

/* Smoother scroll slider */
.tj-scroll-slider-item {
    will-change: transform;
    backface-visibility: hidden;
    transform: translateZ(0);
}

/* Optimize venobox (lightbox) animations */
.vbox-overlay {
    animation-duration: 0.3s !important;
}

/* Reduce preloader animation intensity */
.tj-preloader {
    transition: opacity 0.4s ease-out !important;
}

/* Performance optimization for mobile */
@media (max-width: 991px) {
    /* Disable heavy animations on mobile */
    .wow {
        animation-duration: 0.4s !important;
    }
    
    /* Reduce parallax on mobile */
    [data-speed] {
        transform: none !important;
    }
    
    /* Simplify scroll animations */
    .tj-fadein-right-on-scroll,
    .tj-arrange-item,
    .tj-arrange-item-2 {
        animation-duration: 0.3s !important;
    }
}

/* Accessibility: Respect user's motion preferences */
@media (prefers-reduced-motion: reduce) {
    #smooth-wrapper,
    #smooth-content {
        transform: none !important;
    }
    
    .wow,
    [class*="fadeIn"],
    [class*="slideIn"],
    [class*="zoomIn"],
    [class*="bounce"] {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}

/* Optimize GPU acceleration */
.animate__animated,
.wow,
[data-speed],
.swiper-slide {
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    perspective: 1000px;
    -webkit-perspective: 1000px;
}

/* Reduce flicker during animations */
* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}