/* ===== OPTIMIZACIONES DE RENDIMIENTO PARA DISPOSITIVOS MÓVILES ===== */

/* Optimizaciones para dispositivos móviles */
@media (max-width: 768px) {
    /* Desactivar partículas flotantes en móvil */
    .particles-container {
        display: none !important;
    }

    /* Simplificar el fondo animado para móviles */
    .animated-background {
        background: var(--color-dark) !important;
        animation: none !important;
    }

    .stars-background,
    .nebula,
    .shooting-star,
    .gradient-overlay {
        display: none !important;
    }    /* Simplificar el cubo 3D en dispositivos móviles pero NO eliminarlo */
    .cube {
        animation: rotateCube 45s infinite linear !important; /* Más lento en móviles */
        transition: transform 0.3s ease !important;
    }

    .cube-container:hover .cube {
        transform: rotateX(15deg) rotateY(15deg) !important;
    }

    /* Desactivar efectos de desenfoque (backdrop-filter) - consumen muchos recursos */
    .header,
    .nav-list,
    .feature-item,
    .cube-face,
    .service-card,
    .client-card,
    .team-member,
    .process-step,
    .contact-card,
    .btn-secondary,
    .footer-social .social-link,
    .intro-overlay,
    .modal-content,
    .business-card {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(10, 10, 10, 0.9) !important; /* Reemplaza el efecto de desenfoque con un fondo oscuro sólido */
    }

    /* Reducir sombras, brillos y reflejos */
    .service-icon::before,
    .member-avatar::before,
    .process-number::before,
    .header::before,
    .hero-visual::after,
    .hero-visual::before,
    .section-divider::before,
    .client-card::after {
        opacity: 0.2 !important;
        animation: none !important;
        box-shadow: none !important;
        filter: none !important;
    }

    /* Eliminar por completo efectos de brillo intensos */
    [class*="glow"]::before, 
    [class*="glow"]::after,
    .btn::before,
    .btn::after {
        display: none !important;
    }

    /* Desactivar animaciones de cartas y elementos UI en reposo */
    .service-card,
    .client-card,
    .team-member,
    .process-step,
    .contact-card,
    .reveal,
    .reveal-fast,
    .feature-item {
        animation: none !important;
        transform: none !important;
        transition: transform 0.3s ease !important; /* Transición mínima para hover */
        will-change: auto !important; /* Desactiva will-change para ahorrar memoria */
    }

    /* Optimizar textos con degradados (muy pesados en renderizado) */
    .section-title h2,
    .hero-text h1,
    .logo-text,
    .intro-logo,
    .footer-logo-text,
    .hero-text .highlight,
    [class*="-gradient-text"] {
        background: var(--color-primary) !important;
        background-image: none !important;
        -webkit-background-clip: text !important;
        background-clip: text !important;
        animation: none !important;
        text-shadow: none !important;
    }

    /* Desactivar completamente animaciones y efectos de iconos */
    .feature-item i,
    .contact-card h3 i,
    .footer-heart,
    .service-icon,
    .member-avatar,
    .process-number,
    .last-client-card .client-logo-container,
    [class*="animated-"],
    [class*="floating-"] {
        animation: none !important;
        transform: none !important;
        filter: none !important;
    }

    /* Eliminar completamente transformaciones 3D y animaciones de tarjetas */
    .business-card,
    .rotating-card,
    .floating-element {
        transform: none !important;
        animation: none !important;
        transition: transform 0.3s ease !important;
        perspective: none !important;
        transform-style: flat !important;
    }

    /* Desactivar todas las ondas y animaciones radiales */
    .whatsapp-btn::after,
    .whatsapp-btn::before,
    .whatsapp-button::before,
    .whatsapp-button::after,
    .scroll-top::before,
    .scroll-top::after,
    [class*="ripple"],
    [class*="wave"] {
        animation: none !important;
        display: none !important;
    }

    /* Reducir las animaciones de entrada/reveal */
    .intro-overlay {
        transition: opacity 0.3s linear !important;
    }
    
    /* Optimizar imágenes y fondos */
    img, video, .bg-image {
        transform: translateZ(0) !important; /* Forzar aceleración por hardware */
    }

    /* Mejorar rendimiento de la barra de navegación */
    .header.scrolled {
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3) !important;
        animation: none !important;
    }
    
    /* Optimizar scrolling */
    html {
        scroll-behavior: auto !important; /* Desactivar scroll suave en móviles */
    }
}

/* ===== OPTIMIZACIONES PARA PREFERENCIA DE MOVIMIENTO REDUCIDO ===== */
@media (prefers-reduced-motion: reduce) {
    /* Desactivar globalmente todas las animaciones y transiciones */
    * {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        animation-delay: 0s !important;
        animation-fill-mode: both !important;
        transition: none !important;
        scroll-behavior: auto !important;
        transform: none !important;
    }

    /* Eliminar completamente todos los elementos puramente decorativos y de animación */
    .particles-container,
    .stars-background,
    .nebula,
    .shooting-star,
    .gradient-overlay,
    .service-card::before,
    .service-icon::before,
    .member-avatar::before,
    .process-number::before,
    .header::before,
    .header::after,
    .whatsapp-btn::after,
    .whatsapp-btn::before,
    .scroll-top::before,
    .scroll-top::after,
    [class*="floating-"],
    [class*="animated-"],
    [class*="wave-"],
    [class*="glow-"],
    [class*="ripple-"],
    .hero-visual::before,
    .hero-visual::after,
    .section-divider::before,
    .section-divider::after {
        display: none !important;
        opacity: 0 !important;
    }

    /* Mantener el cubo en una posición estática pero con una visualización más simple */
    .cube {
        animation: none !important;
        transform: rotateX(0deg) rotateY(0deg) !important;
        transition: none !important;
        box-shadow: none !important;
    }

    .cube-face {
        box-shadow: none !important;
        opacity: 0.8 !important;
    }

    /* Eliminar efectos de desenfoque y usar fondos más simples */
    .header,
    .nav-list,
    .feature-item,
    .cube-face,
    .service-card,
    .client-card,
    .team-member,
    .process-step,
    .contact-card,
    .btn-secondary,
    .footer-social .social-link,
    .modal-content,
    .intro-overlay,
    .business-card {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background-color: rgba(10, 10, 10, 0.9) !important;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
    }

    /* Simplificar todos los textos con degradados */
    .section-title h2,
    .hero-text h1,
    .logo-text,
    .intro-logo,
    .footer-logo-text,
    .hero-text .highlight,
    h1, h2, h3, h4, h5, h6,
    [class*="-gradient-text"],
    [class*="-animated-text"] {
        background: var(--color-primary) !important;
        -webkit-background-clip: text !important;
        background-clip: text !important;
        animation: none !important;
        text-shadow: none !important;
        transform: none !important;
    }

    /* Eliminar todos los efectos hover animados */
    .btn:hover,
    .nav-link:hover,
    .service-card:hover,
    .client-card:hover,
    .team-member:hover,
    .process-step:hover,
    .contact-card:hover,
    .social-link:hover,
    .business-card:hover,
    a:hover {
        transform: none !important;
        box-shadow: inherit !important;
        filter: brightness(1.1) !important; /* Solo un ligero cambio de brillo en hover */
        transition: filter 0.1s ease !important;
    }

    /* Simplificar botones y eliminar efectos decorativos */
    .btn::before,
    .btn::after,
    .client-link::before,
    .contact-card::before,
    .social-link::before,
    [class*="-decorative"] {
        display: none !important;
    }

    /* Simplificar intro */
    .intro-overlay {
        animation: none !important;
        transition: opacity 0.2s linear !important;
    }

    .intro-loader {
        animation: none !important;
        border: 2px solid var(--color-primary) !important;
    }

    /* Eliminar efectos de parallax */
    [data-parallax],
    [data-speed],
    [data-rellax-speed] {
        transform: none !important;
    }

    /* Simplificar todas las imágenes y elementos visuales */
    img, 
    video, 
    .bg-image,
    .client-logo {
        filter: none !important;
        transform: none !important;
        transition: none !important;
    }

    /* Desactivar todas las animaciones scroll */
    .reveal,
    .reveal-fast,
    .reveal-slow,
    [class*="fade-"],
    [class*="slide-"] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    
    /* Eliminar animación del scroll-progress */
    .scroll-progress {
        transition: none !important;
    }
}

/* ===== OPTIMIZACIONES PARA DISPOSITIVOS DE BAJA POTENCIA ===== */
.reduce-animations {
    /* Clase que puede ser aplicada a body via JavaScript cuando se detecta un dispositivo de baja potencia */

    /* Eliminar completamente partículas y fondos animados */
    .particles-container,
    .stars-background,
    .nebula,
    .shooting-star,
    .gradient-overlay,
    [class*="animated-bg"],
    [class*="floating-"],
    [class*="nebula-"] {
        display: none !important;
        visibility: hidden !important;
    }

    /* Simplificar radicalmente el cubo 3D o eliminarlo */
    .cube {
        animation: none !important;
        transform: rotateX(0deg) rotateY(0deg) !important;
        box-shadow: none !important;
        opacity: 0.8 !important;
    }
    
    .cube-container:hover .cube {
        transform: none !important;
    }

    /* Eliminar todos los efectos de desenfoque (muy pesados en GPU) */
    .header,
    .nav-list, 
    .feature-item,
    .cube-face,
    .service-card,
    .client-card,
    .team-member, 
    .process-step,
    .contact-card,
    .btn-secondary,
    .footer-social .social-link,
    .modal-content,
    .business-card,
    [class*="glass-"],
    [class*="blur-"] {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background-color: rgba(10, 10, 10, 0.9) !important;
    }

    /* Eliminar todos los efectos de sombras complejas y animaciones decorativas */
    .service-card::before,
    .service-card::after,
    .service-icon::before,
    .service-icon::after,
    .member-avatar::before,
    .member-avatar::after,
    .process-number::before,
    .process-number::after,
    .header::before,
    .header::after,
    .whatsapp-btn::after,
    .whatsapp-btn::before,
    .scroll-top::before,
    .scroll-top::after,
    .feature-item i,
    .service-icon,
    .hero-visual::before,
    .hero-visual::after,
    .section-divider::before,
    .section-divider::after,
    [class*="glow-"],
    [class*="shine-"],
    [class*="wave-"],
    [class*="ripple-"],
    [class*="pulse-"],
    [class*="decorative-"] {
        display: none !important;
        animation: none !important;
        opacity: 0 !important;
    }

    /* Simplificar todos los textos con degradado (usar colores sólidos) */
    .section-title h2,
    .hero-text h1,
    .logo-text,
    .intro-logo,
    .footer-logo-text,
    .hero-text .highlight,
    [class*="gradient-text"],
    [class*="animated-text"] {
        background: var(--color-primary) !important;
        animation: none !important;
        transition: none !important;
        -webkit-background-clip: text !important;
        background-clip: text !important;
        text-shadow: none !important;
    }

    /* Eliminar por completo animaciones en todas las tarjetas y elementos UI */
    .service-card,
    .client-card,
    .team-member,
    .process-step,
    .contact-card,
    .business-card,
    .reveal,
    .reveal-fast,
    .feature-item,
    .btn,
    [class*="card"],
    [class*="animated"] {
        animation: none !important;
        transform: none !important;
        transition: transform 0.2s ease !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    }

    /* Simplificar efectos de hover a un mínimo absoluto */
    .service-card:hover,
    .client-card:hover,
    .team-member:hover,
    .process-step:hover,
    .contact-card:hover,
    .business-card:hover,
    .btn:hover,
    .nav-link:hover,
    a:hover {
        transform: translateY(-5px) !important; /* Reducir la animación a la mitad */
        box-shadow: 0 6px 14px rgba(0, 0, 0, 0.2) !important;
        filter: brightness(1.05) !important;
    }
    
    /* Optimizar imágenes y uso de GPU */
    img, 
    video, 
    .bg-image {
        transform: translateZ(0) !important; /* Forzar aceleración por hardware cuando sea necesario */
        will-change: auto !important; /* No reservar memoria si no es necesario */
    }
    
    /* Simplificar intro */
    .intro-overlay {
        transition: opacity 0.2s linear !important;
    }
    
    .intro-loader {
        animation: spin 1.5s linear infinite !important; /* Reducir framerate de la animación */
        box-shadow: none !important;
    }
    
    .intro-loader::after {
        display: none !important; /* Eliminar el segundo spinner */
    }
    
    /* Desactivar parallax y efectos de scroll */
    [data-parallax],
    [data-speed],
    [data-rellax-speed] {
        transform: none !important;
    }
    
    /* Eliminar todas las keyframes y animaciones complejas */
    @keyframes fadeIn { to { opacity: 1; } }
    @keyframes fadeOut { to { opacity: 0; } }
    
    /* Mejorar scrolling */
    html {
        scroll-behavior: auto !important;
    }
    
    /* Optimización de fuentes */
    body {
        text-rendering: optimizeSpeed !important;
    }
    
    /* Reducir opacidad de elementos visuales no esenciales */
    .decoration,
    .background-pattern,
    .accent-visual {
        opacity: 0.3 !important;
    }
}

/* ===== OPTIMIZACIONES ESPECÍFICAS PARA BATERÍAS BAJAS ===== */
@media (max-width: 768px) and (prefers-reduced-data: reduce) {
    /* Selector moderno para preferencias de reducción de datos */
    .particles-container,
    .cube-container,
    .animated-background,
    video,
    [class*="animated-"],
    [class*="parallax-"] {
        display: none !important;
    }
}

/* ===== OPTIMIZACIONES DE CARGA INICIAL ===== */
/* Aplicar optimizaciones mientras la página está cargando */
.js-loading {
    .particles-container,
    .animated-background,
    .cube,
    .intro-overlay,
    [class*="animated-"] {
        display: none !important;
    }
}