/* ========================================
   MOBILE PERFORMANCE OPTIMIZATIONS
   Fast Animations & Quick Execution
   ======================================== */

/* ========================================
   DISABLE HEAVY ANIMATIONS ON MOBILE
   ======================================== */

@media (max-width: 991px) {
    /* Disable floating shapes on mobile - heavy performance cost */
    .floating-shapes,
    .floating-shape {
        display: none !important;
    }
    
    /* Disable background animations */
    .features-bg-elements,
    .feature-orb,
    .gradient-orb,
    .about-bg-wrapper,
    .about-gradient-orb,
    .about-pattern-dots {
        display: none !important;
    }
    
    /* Simplify hero animations */
    .hero-content.animate-slide-up {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
    
    /* Fast carousel transitions */
    .carousel-fade .carousel-item {
        transition: opacity 0.3s ease !important;
    }
    
    /* Remove complex transforms */
    .card-inner,
    .feature-card-inner,
    .service-card,
    .client-card-ultra {
        transform: none !important;
        transform-style: flat !important;
    }
    
    /* Disable hover effects on mobile */
    .feature-card-ultra:hover .feature-card-inner,
    .service-card:hover,
    .client-card-ultra:hover .card-inner,
    .dashboard-card:hover,
    .image-card:hover,
    .video-card:hover,
    .document-card:hover {
        transform: none !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important;
    }
    
    /* Simplify gradients */
    .hero-overlay {
        background: rgba(102, 126, 234, 0.85) !important;
    }
    
    /* Remove blur effects */
    .feature-orb,
    .gradient-orb {
        filter: none !important;
    }
    
    /* Fast counter animations */
    .counter {
        animation-duration: 0.5s !important;
    }
    
    /* Disable parallax effects */
    [data-parallax] {
        transform: none !important;
    }
}

/* ========================================
   FAST SCROLLING BANNER
   ======================================== */

@media (max-width: 991px) {
    .scrolling-banner {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
        background-size: 100% 100% !important;
        animation: none !important;
        padding: 8px 0;
    }
    
    .scrolling-content {
        animation: scrollTextFast 20s linear infinite !important;
        font-size: 12px;
    }
    
    @keyframes scrollTextFast {
        from { transform: translateX(0); }
        to { transform: translateX(-100%); }
    }
    
    .scroll-item {
        margin-right: 30px;
    }
    
    .scroll-item i {
        animation: none !important;
    }
}

@media (max-width: 576px) {
    .scrolling-content {
        animation: scrollTextFast 15s linear infinite !important;
        font-size: 11px;
    }
    
    .scroll-item {
        margin-right: 20px;
    }
}

/* ========================================
   FAST HERO CAROUSEL
   ======================================== */

@media (max-width: 991px) {
    /* Faster carousel interval */
    #heroCarousel {
        transition: all 0.3s ease !important;
    }
    
    .carousel-item {
        transition: transform 0.3s ease !important;
    }
    
    /* Remove fade effect on mobile for speed */
    .carousel-fade .carousel-item {
        opacity: 1 !important;
    }
    
    .carousel-fade .carousel-item.active {
        opacity: 1 !important;
    }
    
    /* Simplify hero background */
    .hero-slide {
        background-size: cover !important;
        background-position: center !important;
        background-attachment: scroll !important;
    }
    
    /* Remove hero animations */
    .hero-badge,
    .hero-title,
    .hero-description,
    .hero-buttons {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}

/* ========================================
   FAST FEATURE CARDS
   ======================================== */

@media (max-width: 991px) {
    .features-section-ultra {
        padding: 40px 0;
    }
    
    .feature-card-ultra {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
    
    .feature-icon-ultra {
        animation: none !important;
    }
    
    .icon-glow {
        display: none !important;
    }
    
    .feature-hover-line {
        display: none !important;
    }
    
    /* Remove AOS animations */
    [data-aos] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* ========================================
   FAST ABOUT SECTION
   ======================================== */

@media (max-width: 991px) {
    .about-section-ultra,
    .about-section-ultra-v2 {
        padding: 40px 0;
    }
    
    .about-main-card,
    .about-ultra-card {
        animation: none !important;
    }
    
    .card-decoration {
        display: none !important;
    }
    
    .badge-glow {
        display: none !important;
    }
    
    .title-word {
        animation: none !important;
    }
}

/* ========================================
   FAST SERVICES SECTION
   ======================================== */

@media (max-width: 991px) {
    .services-section {
        padding: 40px 0;
    }
    
    .service-card {
        animation: none !important;
        transition: none !important;
    }
    
    .service-card:hover {
        transform: none !important;
    }
    
    .service-overlay {
        display: none !important;
    }
    
    .image-zoom {
        overflow: hidden;
    }
    
    .image-zoom img {
        transform: none !important;
        transition: none !important;
    }
}

/* ========================================
   FAST CLIENTS SECTION
   ======================================== */

@media (max-width: 991px) {
    .clients-section-ultra {
        padding: 40px 0;
    }
    
    .client-card-ultra {
        animation: none !important;
    }
    
    .card-inner {
        transform: none !important;
        transition: none !important;
    }
}

/* ========================================
   DISABLE GPU-HEAVY EFFECTS
   ======================================== */

@media (max-width: 991px) {
    /* Remove 3D transforms */
    .card-tilt,
    .gpu-accelerated {
        transform: none !important;
        transform-style: flat !important;
        perspective: none !important;
    }
    
    /* Remove backdrop filters */
    [style*="backdrop-filter"] {
        backdrop-filter: none !important;
    }
    
    /* Simplify box shadows */
    .card,
    .btn,
    .feature-card-ultra,
    .service-card {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    }
}

/* ========================================
   INSTANT TRANSITIONS
   ======================================== */

@media (max-width: 991px) {
    /* Fast transitions for all elements */
    * {
        transition-duration: 0.15s !important;
    }
    
    /* Instant animations */
    @keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }
    
    @keyframes slideUp {
        from { transform: translateY(10px); opacity: 0; }
        to { transform: translateY(0); opacity: 1; }
    }
    
    /* Override slow animations */
    .animate-slide-up,
    .fade-in,
    .slide-up {
        animation-duration: 0.2s !important;
    }
}

/* ========================================
   REDUCE REPAINTS & REFLOWS
   ======================================== */

@media (max-width: 991px) {
    /* Use transform instead of position changes */
    .back-to-top {
        will-change: transform;
        transform: translateZ(0);
    }
    
    /* Contain layout changes */
    .container,
    .row,
    section {
        contain: layout style;
    }
    
    /* Optimize images */
    img {
        will-change: auto;
        transform: translateZ(0);
    }
}

/* ========================================
   HEADER OPTIMIZATIONS
   ======================================== */

@media (max-width: 991px) {
    /* Fast topbar */
    .topbar {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
        animation: none !important;
    }
    
    .topbar-item i {
        animation: none !important;
    }
    
    /* Fast navbar */
    .header-main {
        transition: box-shadow 0.2s ease !important;
    }
    
    .nav-link {
        transition: all 0.15s ease !important;
    }
    
    .nav-link::before,
    .nav-link::after {
        transition: all 0.15s ease !important;
    }
    
    /* Fast mobile menu */
    .navbar-menu {
        transition: right 0.25s ease !important;
    }
    
    .mobile-toggle span {
        transition: all 0.2s ease !important;
    }
}

/* ========================================
   BUTTON OPTIMIZATIONS
   ======================================== */

@media (max-width: 991px) {
    .btn,
    .btn-nav,
    .action-btn {
        transition: all 0.15s ease !important;
    }
    
    .btn:hover,
    .btn:active {
        transform: none !important;
    }
    
    .btn::before,
    .btn::after {
        transition: all 0.15s ease !important;
    }
}

/* ========================================
   FORM OPTIMIZATIONS
   ======================================== */

@media (max-width: 991px) {
    input,
    textarea,
    select {
        transition: border-color 0.15s ease !important;
    }
    
    input:focus,
    textarea:focus,
    select:focus {
        transition: all 0.15s ease !important;
    }
}

/* ========================================
   MODAL OPTIMIZATIONS
   ======================================== */

@media (max-width: 991px) {
    .modal {
        transition: opacity 0.2s ease !important;
    }
    
    .modal-content {
        transition: transform 0.2s ease !important;
    }
}

/* ========================================
   LOADING OPTIMIZATIONS
   ======================================== */

@media (max-width: 991px) {
    /* Fast skeleton loaders */
    .skeleton-loader {
        animation: loading 1s infinite !important;
    }
    
    @keyframes loading {
        0% { background-position: 200% 0; }
        100% { background-position: -200% 0; }
    }
    
    /* Fast spinners */
    .loading-spinner {
        animation: spin 0.6s linear infinite !important;
    }
    
    @keyframes spin {
        from { transform: rotate(0deg); }
        to { transform: rotate(360deg); }
    }
}

/* ========================================
   CRITICAL PERFORMANCE RULES
   ======================================== */

@media (max-width: 991px) {
    /* Disable expensive CSS properties */
    * {
        filter: none !important;
        backdrop-filter: none !important;
        mix-blend-mode: normal !important;
    }
    
    /* Keep only essential shadows */
    .card,
    .btn,
    .modal-content {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    }
    
    /* Remove text shadows */
    h1, h2, h3, h4, h5, h6, p, span {
        text-shadow: none !important;
    }
    
    /* Simplify borders */
    * {
        border-radius: 8px !important;
    }
    
    .btn,
    .badge,
    .pill {
        border-radius: 25px !important;
    }
}

/* ========================================
   WILL-CHANGE OPTIMIZATION
   ======================================== */

@media (max-width: 991px) {
    /* Only animate what's necessary */
    .navbar-menu.active {
        will-change: transform;
    }
    
    .carousel-item.active {
        will-change: opacity;
    }
    
    /* Remove will-change after animation */
    .navbar-menu:not(.active) {
        will-change: auto;
    }
}

/* ========================================
   REDUCED MOTION OVERRIDE
   ======================================== */

@media (max-width: 991px) and (prefers-reduced-motion: reduce) {
    * {
        animation: none !important;
        transition: none !important;
    }
}

/* ========================================
   END OF MOBILE PERFORMANCE
   ======================================== */