/* Performance optimization overrides */

/* Reduce GPU layer creation and force hardware acceleration only where needed */
.orb {
  will-change: transform;
  transform: translate3d(0, 0, 0); /* Force GPU layer */
}

/* Optimize animations to use transform and opacity only */
@keyframes floatY {
  0%, 100% { 
    transform: translate3d(0, 0, 0); 
  }
  50% { 
    transform: translate3d(0, -12px, 0); /* Reduced movement */
  }
}

/* Reduce motion for better performance */
@media (prefers-reduced-motion: reduce) {
  .orb {
    animation: none !important;
  }
  
  .reveal {
    opacity: 1 !important;
    transform: none !important;
  }
  
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Optimize card hover effects */
.card, .service-card, .pricing-card {
  transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;
  will-change: auto; /* Only activate when needed */
}

.card:hover, .service-card:hover, .pricing-card:hover {
  will-change: transform, box-shadow;
}

/* Optimize backdrop filters */
.site-header {
  backdrop-filter: blur(4px); /* Reduced blur for better performance */
  -webkit-backdrop-filter: blur(4px);
}

/* Reduce shadow complexity */
:root {
  --shadow-card: 0 4px 12px rgba(16, 24, 40, 0.04); /* Reduced complexity */
  --shadow-hover: 0 6px 16px rgba(16, 24, 40, 0.08);
}

/* Optimize transition overlay */
.transition-overlay {
  contain: layout style paint; /* CSS containment for better performance */
}

/* Optimize robot and chat elements */
.robot-bubble, .robot-hint {
  will-change: opacity, transform;
  contain: layout style paint;
}

/* Reduce filter complexity */
.orb-1, .orb-2, .orb-3 {
  filter: blur(16px); /* Reduced from 24px */
  opacity: 0.4; /* Slightly reduced opacity */
}

/* Optimize scroll-triggered animations */
.reveal {
  will-change: opacity, transform;
}

.reveal.is-visible {
  will-change: auto; /* Remove will-change after animation */
}

/* Performance-focused button optimizations */
.btn {
  transition: transform 0.12s ease-out, box-shadow 0.12s ease-out; /* Faster transitions */
}

.btn:hover {
  will-change: transform, box-shadow;
}

/* Optimize canvas elements */
canvas {
  will-change: contents;
}

/* Reduce animation complexity on mobile */
@media (max-width: 768px) {
  .orb {
    animation-duration: 12s; /* Slower animations on mobile */
  }
  
  .card, .service-card, .pricing-card {
    transition-duration: 0.15s; /* Faster transitions */
  }
  
  /* Disable complex effects on mobile */
  .card:hover, .service-card:hover, .pricing-card:hover {
    transform: translateY(-2px) !important; /* Simpler hover effect */
  }
}

/* Memory leak prevention */
.timeline-item.visible,
.reveal.is-visible,
.animated {
  will-change: auto; /* Remove will-change after animations complete */
}

/* Optimize video elements */
video {
  will-change: auto;
}

video:hover, video:focus {
  will-change: transform;
}

/* Optimize intersection observer targets */
[data-target], .stat-number, .timeline-item {
  contain: layout style;
}

/* Reduce paint complexity */
.mesh {
  opacity: 0.6; /* Reduced from higher values */
  mix-blend-mode: normal; /* Simplified blending */
}

/* Critical performance fix for page transitions */
.transition-overlay.is-active {
  contain: strict; /* Strict containment during transitions */
  will-change: contents;
}

.transition-overlay:not(.is-active) {
  contain: layout style paint;
  will-change: auto;
}
