/* Performance optimizations for mobile scroll */

/* CSS Containment for better rendering performance */
section {
    content-visibility: auto;
    contain-intrinsic-size: 0 800px;
    contain: layout style paint;
}

/* GPU acceleration for animated elements */
.group,
.animate-fadeIn,
.float-animation,
#particle-canvas,
#navbar {
    will-change: transform;
    transform: translateZ(0);
}

/* Optimize card animations */
.group {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.group:hover {
    transform: translateY(-4px) translateZ(0);
}

/* Remove heavy effects on mobile */
@media (max-width: 768px) {
    /* Disable backdrop filters on mobile */
    .backdrop-blur-lg,
    .backdrop-blur-md,
    .backdrop-blur-sm {
        backdrop-filter: none !important;
        background-color: rgba(17, 24, 39, 0.95) !important;
    }
    
    /* Reduce shadows on mobile */
    .shadow-xl,
    .shadow-2xl {
        box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1) !important;
    }
    
    /* Disable parallax effects */
    .parallax {
        transform: none !important;
    }
    
    /* Optimize particle canvas on mobile */
    #particle-canvas {
        display: none;
    }
}

/* Optimize image rendering */
img {
    content-visibility: auto;
    contain-intrinsic-size: 100%;
}

/* Optimize font rendering */
body {
    text-rendering: optimizeSpeed;
    -webkit-font-smoothing: antialiased;
}

/* Reduce animation complexity on scroll */
@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;
    }
}