/* ========================================
   ADVANCED ANIMATION UTILITIES
   ======================================== */

/* Animation Utility Classes */
.animate-fade { opacity: 0; }
.animate-slide-up { opacity: 0; transform: translateY(60px); }
.animate-slide-down { opacity: 0; transform: translateY(-60px); }
.animate-slide-left { opacity: 0; transform: translateX(-60px); }
.animate-slide-right { opacity: 0; transform: translateX(60px); }
.animate-zoom { opacity: 0; transform: scale(0.8); }
.animate-zoom-out { opacity: 0; transform: scale(1.2); }
.animate-rotate { opacity: 0; transform: rotate(-10deg) scale(0.9); }
.animate-flip { opacity: 0; transform: perspective(1000px) rotateY(-20deg); }
.animate-blur { opacity: 0; filter: blur(10px); }
.animate-scale { opacity: 0; transform: scale(0.95); }

/* Performance Optimizations */
.will-animate {
  will-change: transform, opacity;
}

.gpu-accelerate {
  transform: translateZ(0);
  backface-visibility: hidden;
  perspective: 1000px;
}

/* Ken Burns Effect for Hero */
@keyframes kenBurns {
  0% { transform: scale(1) translateZ(0); }
  100% { transform: scale(1.15) translateZ(0); }
}

.ken-burns {
  animation: kenBurns 20s ease-out infinite alternate;
  will-change: transform;
  backface-visibility: hidden;
}

/* Stagger Animation Delays */
.stagger-1 { animation-delay: 0.1s; }
.stagger-2 { animation-delay: 0.2s; }
.stagger-3 { animation-delay: 0.3s; }
.stagger-4 { animation-delay: 0.4s; }
.stagger-5 { animation-delay: 0.5s; }

/* Button Micro-Interactions */
.btn-pulse {
  animation: btnPulse 2s ease-in-out infinite;
}

@keyframes btnPulse {
  0%, 100% { transform: scale(1); box-shadow: 0 8px 25px rgba(212,175,55,0.4); }
  50% { transform: scale(1.05); box-shadow: 0 12px 35px rgba(212,175,55,0.6); }
}

.btn-hover-lift {
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
}

.btn-hover-lift:hover {
  transform: translateY(-5px) scale(1.02);
  box-shadow: 0 15px 40px rgba(212,175,55,0.5);
}

/* Card 3D Lift Effect */
.card-3d {
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.4s ease;
  transform-style: preserve-3d;
}

.card-3d:hover {
  transform: translateY(-12px) rotateX(2deg) rotateY(2deg) scale(1.02);
  box-shadow: 0 25px 60px rgba(212,175,55,0.25);
}

/* Image Hover Effects */
.img-zoom-hover {
  overflow: hidden;
  position: relative;
}

.img-zoom-hover img {
  transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), filter 0.4s ease;
  will-change: transform;
}

.img-zoom-hover:hover img {
  transform: scale(1.15);
  filter: brightness(1.1);
}

/* Text Stagger Animation */
.text-stagger {
  display: inline-block;
  opacity: 0;
  transform: translateY(20px);
}

/* Icon Float Animation */
@keyframes iconFloat {
  0%, 100% { transform: translateY(0px) rotate(0deg); }
  25% { transform: translateY(-8px) rotate(2deg); }
  75% { transform: translateY(-8px) rotate(-2deg); }
}

.icon-float {
  animation: iconFloat 3s ease-in-out infinite;
}

/* Shimmer Effect */
@keyframes shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

.shimmer {
  background: linear-gradient(90deg, 
    rgba(212,175,55,0.1) 0%, 
    rgba(255,224,130,0.3) 50%, 
    rgba(212,175,55,0.1) 100%);
  background-size: 200% 100%;
  animation: shimmer 3s ease-in-out infinite;
}

/* Glow Pulse */
@keyframes glowPulse {
  0%, 100% { box-shadow: 0 0 20px rgba(212,175,55,0.3); }
  50% { box-shadow: 0 0 40px rgba(212,175,55,0.6), 0 0 60px rgba(212,175,55,0.4); }
}

.glow-pulse {
  animation: glowPulse 2s ease-in-out infinite;
}

/* Fade In Animations */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(40px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInDown {
  from { opacity: 0; transform: translateY(-40px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInLeft {
  from { opacity: 0; transform: translateX(-40px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes fadeInRight {
  from { opacity: 0; transform: translateX(40px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes zoomIn {
  from { opacity: 0; transform: scale(0.8); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes rotateIn {
  from { opacity: 0; transform: rotate(-10deg) scale(0.9); }
  to { opacity: 1; transform: rotate(0) scale(1); }
}

/* Scroll-triggered animations */
.scroll-fade-in {
  opacity: 0;
  transition: opacity 0.8s ease-out;
}

.scroll-fade-in.visible {
  opacity: 1;
}

/* Navbar Slide Down */
@keyframes navSlideDown {
  from { transform: translateY(-100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

.nav-slide-down {
  animation: navSlideDown 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

/* Mobile Menu Stagger */
.mobile-menu-item {
  opacity: 0;
  transform: translateX(-30px);
}

.mobile-menu-item.show {
  animation: slideInLeft 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

@keyframes slideInLeft {
  to { opacity: 1; transform: translateX(0); }
}

/* Gallery Modal Scale */
@keyframes modalScaleIn {
  from { opacity: 0; transform: scale(0.8); }
  to { opacity: 1; transform: scale(1); }
}

.modal-scale-in {
  animation: modalScaleIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

/* Letter Stagger for CTA */
.letter-stagger {
  display: inline-block;
  opacity: 0;
  transform: translateY(30px) rotate(-5deg);
}

/* Parallax Layers */
.parallax-slow { transform: translateZ(-1px) scale(2); }
.parallax-medium { transform: translateZ(-0.5px) scale(1.5); }
.parallax-fast { transform: translateZ(0); }

/* Exit Animations */
@keyframes fadeOut {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes slideDown {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: 0; transform: translateY(40px); }
}

@keyframes scaleDown {
  from { opacity: 1; transform: scale(1); }
  to { opacity: 0; transform: scale(0.8); }
}

@keyframes blurOut {
  from { opacity: 1; filter: blur(0); }
  to { opacity: 0; filter: blur(10px); }
}

/* Reduced Motion Support */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  
  .ken-burns,
  .btn-pulse,
  .icon-float,
  .shimmer,
  .glow-pulse {
    animation: none !important;
  }
}
