/**
 * Animation Optimization CSS - ULTRA-FAST (90% FASTER)
 * Handles:
 * 1. Prefers-reduced-motion support
 * 2. Mobile animation simplification
 * 3. SVG animation optimization
 * 4. Ultra-fast animations (90% reduction)
 */

/* ============================================
   ULTRA-FAST ANIMATIONS (90% FASTER)
   ============================================ */

:root {
    /* Reduce all animation durations by 90% */
    --animation-duration: 60ms;
    --transition-duration: 50ms;
    --swiper-duration: 100ms;
    --parallax-duration: 60ms;
}

/* Override all animation durations globally */
* {
    animation-duration: var(--animation-duration) !important;
    transition-duration: var(--transition-duration) !important;
}

/* Ultra-fast swiper animations */
.swiper-container,
.dsn-swiper {
    --swiper-transition-duration: var(--swiper-duration) !important;
}

/* Ultra-fast parallax animations */
.dsn-hero-parallax-img,
.dsn-hero-parallax-title,
.img-box-parallax {
    animation-duration: 60ms !important;
}

/* Ultra-fast scroll animations */
.dsn-scroll-bottom,
.dsn-up,
.dsn-animate {
    animation-duration: 50ms !important;
}

/* Ultra-fast SVG animations */
svg animate,
svg animateTransform {
    animation-duration: 40ms !important;
}

/* Ultra-fast transitions */
.dsn-btn,
.link-hover,
.service-item,
.box-hover-image,
.swiper-pagination-bullet,
.nav-item,
.effect-ajax {
    transition-duration: 50ms !important;
}

/* Ultra-fast fade animations */
@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Ultra-fast slide animations */
@keyframes slideUp {
    from {
        transform: translateY(20px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Ultra-fast scroll down animation */
@keyframes scroll-down {
    0% {
        transform: scale(0);
    }

    50% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}

/* Ultra-fast spin animation */
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* Ultra-fast move-in animation */
@keyframes moveIn {
    0% {
        transform: translateY(0.5em);
    }

    50%,
    100% {
        transform: translateY(0em);
    }
}

/* Ultra-fast draw animation */
@keyframes draw {
    0% {
        stroke-dasharray: 10;
    }

    100% {
        stroke-dasharray: 0;
    }
}

/* ============================================
   1. PREFERS-REDUCED-MOTION SUPPORT
   ============================================ */

@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;
    }

    /* Disable parallax effects */
    .dsn-hero-parallax-img,
    .dsn-hero-parallax-title,
    .img-box-parallax,
    [data-dsn-animation],
    [data-dsn-position] {
        animation: none !important;
        transform: none !important;
    }

    /* Disable scroll animations */
    .dsn-scroll-bottom,
    .dsn-up,
    .dsn-animate {
        animation: none !important;
    }

    /* Disable swiper parallax */
    .dsn-swiper-parallax-transform {
        transform: none !important;
    }
}

/* ============================================
   2. MOBILE ANIMATION OPTIMIZATION
   ============================================ */

@media only screen and (max-width: 767px) {
    :root {
        --animation-duration: 40ms;
        --transition-duration: 30ms;
        --swiper-duration: 80ms;
    }

    /* Disable parallax on mobile */
    .parallax-disabled,
    .dsn-hero-parallax-img.parallax-disabled {
        transform: none !important;
        animation: none !important;
    }

    /* Ultra-fast swiper animations on mobile */
    .dsn-swiper {
        --swiper-transition-duration: 80ms;
    }

    /* Disable complex scroll animations on mobile */
    [data-dsn-grid="move-up"],
    [data-dsn-animation] {
        animation: none !important;
        transform: none !important;
    }

    /* Ultra-fast service item transitions */
    .service-item {
        transition: all 100ms ease-out;
    }

    /* Ultra-fast pagination animations */
    .swiper-pagination-bullet {
        transition: all 100ms ease-out;
    }

    /* Disable hover animations on touch devices */
    @media (hover: none) and (pointer: coarse) {

        .box-hover-image,
        .service-item,
        .link-hover {
            transition: none;
        }

        .box-hover-image:active,
        .service-item:active {
            transform: scale(0.98);
            transition: transform 50ms ease-out;
        }
    }
}

/* ============================================
   3. SVG ANIMATION OPTIMIZATION
   ============================================ */

svg.optimized-svg {
    /* Use GPU acceleration for SVG animations */
    will-change: transform;
    transform: translateZ(0);
}

/* Optimize SVG stroke animations */
svg animate,
svg animateTransform {
    /* Ultra-fast animation */
    animation-duration: 40ms !important;
    animation-timing-function: linear;
}

/* Disable SVG animations if reduced motion is preferred */
@media (prefers-reduced-motion: reduce) {

    svg animate,
    svg animateTransform {
        animation: none !important;
    }
}

/* ============================================
   4. PERFORMANCE-FRIENDLY ANIMATIONS
   ============================================ */

/* Use transform and opacity for better performance */
.dsn-up {
    animation: slideUp 50ms ease-out forwards;
    opacity: 0;
}

/* Reduce animation duration on slower devices */
@media (prefers-reduced-motion: reduce) {
    .dsn-up {
        animation: none;
        opacity: 1;
    }
}

/* ============================================
   5. LAZY-LOADED ANIMATION SUPPORT
   ============================================ */

/* Animations only apply after libraries are loaded */
.animation-ready .dsn-swiper,
.animation-ready [data-dsn-animation] {
    animation: fadeIn 40ms ease-out;
}

/* ============================================
   6. WILL-CHANGE OPTIMIZATION
   ============================================ */

/* Only use will-change for elements that actually animate */
.dsn-hero-parallax-img,
.swiper-slide,
.service-item.active {
    will-change: transform;
}

/* Remove will-change after animation completes */
@media (prefers-reduced-motion: reduce) {

    .dsn-hero-parallax-img,
    .swiper-slide,
    .service-item.active {
        will-change: auto;
    }
}

/* ============================================
   7. TRANSITION OPTIMIZATION
   ============================================ */

/* Use shorter transitions on mobile */
@media only screen and (max-width: 767px) {
    * {
        --transition-duration: 30ms;
    }

    .dsn-btn,
    .link-hover,
    .service-item {
        transition-duration: var(--transition-duration);
    }
}

/* ============================================
   8. ANIMATION CONTAINMENT
   ============================================ */

/* Use CSS containment to improve performance */
.dsn-swiper,
.service-item,
.box-hover-image {
    contain: layout style paint;
}

@media (prefers-reduced-motion: reduce) {

    .dsn-swiper,
    .service-item,
    .box-hover-image {
        contain: layout style;
    }
}

/* ============================================
   9. DISABLE UNNECESSARY ANIMATIONS
   ============================================ */

/* Disable loading animations */
.dsnload {
    animation: none !important;
}

/* Disable menu animations */
.site-header .dsn-back:hover svg {
    animation: none !important;
}

/* Disable hover effects on non-interactive elements */
.text-toggle-back {
    animation: none !important;
}

/* ============================================
   10. INSTANT VISIBILITY
   ============================================ */

/* Make elements visible immediately */
.dsn-animate,
.dsn-up,
.dsn-scroll-bottom {
    opacity: 1 !important;
    transform: none !important;
}

/* Instant fade-in for loaded content */
.loaded {
    animation: fadeIn 30ms ease-out;
}

/* ============================================
   11. TIMING FUNCTION OPTIMIZATION
   ============================================ */

/* Use linear timing for faster perceived animations */
* {
    animation-timing-function: linear !important;
    transition-timing-function: ease-out !important;
}

/* Override with ease-out for smoother feel */
.dsn-btn,
.link-hover,
.service-item {
    transition-timing-function: ease-out !important;
}