/* Mobile Performance Optimizations */

/* Disable smooth scrolling and heavy effects on mobile */
@media (max-width: 768px), (pointer: coarse) {
  * {
    /* Force hardware acceleration */
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }

  /* Disable smooth scrolling behaviors and ScrollSmoother */
  html {
    scroll-behavior: auto !important;
    -webkit-overflow-scrolling: touch;
    overflow-y: auto !important;
  }

  body {
    overflow-x: hidden;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    position: relative !important;
  }

  /* Ensure ScrollSmoother wrapper doesn't interfere */
  #smooth-wrapper,
  #smooth-content {
    transform: none !important;
    will-change: auto !important;
    height: auto !important;
    overflow: visible !important;
  }
}

/* Disable expensive animations on mobile devices */
@media (max-width: 768px) {
  /* Reduce or disable transform animations that cause repaints */
  .animation-border-360::before,
  .animation-border-360::after {
    animation: none !important;
  }
  
  /* Simplify complex animations */
  .scroller-x,
  .scroller-y {
    animation-duration: 60s !important; /* Slower animations */
    animation-play-state: paused !important; /* Pause on mobile */
  }
  
  /* Disable expensive CSS filters and effects */
  .blend-background,
  .gradient-border {
    filter: none !important;
    backdrop-filter: none !important;
  }
  
  /* Optimize transforms for better performance */
  .gsap-fade-in,
  .gsap-reveal,
  .gsap-text-animation,
  .gsap-image-reveal,
  .gsap-zoom {
    transform: translateZ(0) !important; /* Force hardware acceleration */
    will-change: auto !important; /* Let browser decide */
  }
  
  /* Reduce complex box-shadows */
  .card,
  .btn,
  .form-control {
    box-shadow: none !important;
  }
  
  /* Simplify hover effects */
  .btn:hover,
  .card:hover {
    transform: none !important;
    transition: none !important;
  }
  
  /* Optimize video elements */
  video {
    transform: translateZ(0);
    backface-visibility: hidden;
  }
  
  /* Reduce transition complexity */
  * {
    transition-duration: 0.2s !important;
  }
  
  /* Disable parallax effects */
  [data-speed] {
    transform: none !important;
  }
}

/* Low-end device optimizations */
@media (max-width: 480px) {
  /* Disable all animations on very small screens */
  * {
    animation: none !important;
    transition: none !important;
  }
  
  /* Force simple rendering */
  .hero-2,
  .hero-3,
  .hero-5 {
    transform: none !important;
    filter: none !important;
  }
  
  /* Optimize images */
  img {
    transform: translateZ(0);
    image-rendering: optimizeSpeed;
  }
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  
  /* Disable ScrollSmoother effects */
  #smooth-wrapper,
  #smooth-content {
    transform: none !important;
  }
}

/* Performance optimizations for all devices */
.performance-optimized {
  /* Use transform instead of changing layout properties */
  transform: translateZ(0);
  backface-visibility: hidden;
  perspective: 1000px;
}

/* Optimize frequently animated elements */
.orbit,
.pulser,
.ticker {
  will-change: transform;
  transform: translateZ(0);
}

/* Optimize scroll performance */
.scroll-container {
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
}

/* Reduce paint complexity */
.complex-background {
  background-attachment: scroll !important;
}