/* Optimized font stack - only Geist and Inter are loaded */
html { 
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji"; 
}
.font-geist { 
  font-family: 'Geist', 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif !important; 
}
/* Removed 15+ unused font classes to reduce CSS size and improve performance */
@keyframes shimmer {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

@keyframes sphereFadeIn {
  0% { 
    opacity: 0;
    transform: scale(0.9);
  }
  100% { 
    opacity: 1;
    transform: scale(1);
  }
}

#sphere-canvas {
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1.5s cubic-bezier(0.16, 1, 0.3, 1);
  /* Removed will-change - causes flickering in Safari */
  background: transparent !important;
  border: none !important;
  outline: none !important;
  /* Safari-specific fixes */
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

#sphere-canvas.loaded {
  opacity: 1;
  transform: scale(1);
}

/* Smooth Glass Scrollbar */
.overflow-y-auto::-webkit-scrollbar {
  width: 8px;
}

.overflow-y-auto::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 10px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.overflow-y-auto::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 10px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: background 0.3s ease;
}

.overflow-y-auto::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.3);
}

/* Premium Modal Animations - Apple Standard */
/* Safari fix: Don't animate backdrop-filter, it causes flickering */
@keyframes modalFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes modalSlideUp {
  from {
    opacity: 0;
    transform: translateY(30px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Apply backdrop-filter separately (not animated) - Safari fix */
[id$="Modal"]:not(.hidden) {
  animation: modalFadeIn 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  /* Safari flickering fix - hardware acceleration */
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

[id$="Modal"]:not(.hidden) > div {
  animation: modalSlideUp 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  /* Safari flickering fix */
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Safari flickering fixes - Comprehensive coverage */

/* Fix for all elements with backdrop-blur (using attribute selector) */
[class*="backdrop-blur"] {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Ensure webkit prefix for backdrop-filter */
[class*="backdrop-blur-xl"] {
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
}

[class*="backdrop-blur-sm"] {
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

[class*="backdrop-blur-md"] {
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

/* Safari fix for mobile menu */
#mobile-nav {
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Safari fix for elements with hover transforms */
a[class*="hover:scale"],
a[class*="hover:-translate"] {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Safari fix for shimmer animation elements */
[style*="animation: shimmer"] {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Safari fix for images with group-hover transforms */
.group img[class*="group-hover:scale"] {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Safari fix for text elements with transforms */
[class*="group-hover:scale-105"] {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Safari fix for transition-all elements (common in feature cards) */
[class*="transition-all"][class*="hover:scale"] {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Safari fix for fixed background - prevents flickering */
[style*="background-image"] {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: transform;
  /* Force hardware acceleration for background */
  -webkit-perspective: 1000;
  perspective: 1000;
}

/* Safari fix for fixed positioned elements with backgrounds */
.fixed[style*="background-image"],
div.fixed[class*="bg-cover"] {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  /* Prevent repaints on scroll */
  -webkit-perspective: 1000;
  perspective: 1000;
  /* Isolate the background layer */
  isolation: isolate;
  /* Safari-specific: prevent background flicker */
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  /* Force GPU layer for background - prevents flickering during scroll */
  -webkit-will-change: transform;
  will-change: transform;
}

/* Safari fix for main content container - prevents flicker when scrolling over backdrop-blur */
.max-w-7xl {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Safari fix: Create proper stacking context for backdrop-blur containers */
[class*="backdrop-blur-xl"][class*="bg-white"] {
  position: relative;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  /* Create new layer to prevent background repaint */
  isolation: isolate;
}

/* Safari-specific: Force GPU acceleration for animated elements */
@supports (-webkit-backdrop-filter: blur(1px)) {
  /* Safari-specific optimizations */
  [class*="backdrop-blur"] {
    isolation: isolate;
    /* Create new stacking context to prevent background flicker */
    position: relative;
    z-index: 1;
  }
  
  /* Reduce flicker on hover transitions */
  * {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  
  /* Fix for body to prevent background flickering */
  body {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    /* Prevent background repaints */
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  
  /* Additional Safari fix: prevent background image flicker on scroll */
  html {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}