/* ============================================================
   ANIMOTION — Utility Classes
   Duration, delay, easing, iteration, fill-mode helpers
   ============================================================ */

/* Duration */
.animotion-duration-100 { animation-duration: 100ms !important; }
.animotion-duration-200 { animation-duration: 200ms !important; }
.animotion-duration-300 { animation-duration: 300ms !important; }
.animotion-duration-400 { animation-duration: 400ms !important; }
.animotion-duration-500 { animation-duration: 500ms !important; }
.animotion-duration-600 { animation-duration: 600ms !important; }
.animotion-duration-700 { animation-duration: 700ms !important; }
.animotion-duration-800 { animation-duration: 800ms !important; }
.animotion-duration-1000 { animation-duration: 1s !important; }
.animotion-duration-1200 { animation-duration: 1.2s !important; }
.animotion-duration-1500 { animation-duration: 1.5s !important; }
.animotion-duration-2000 { animation-duration: 2s !important; }
.animotion-duration-2500 { animation-duration: 2.5s !important; }
.animotion-duration-3000 { animation-duration: 3s !important; }
.animotion-duration-5000 { animation-duration: 5s !important; }

/* Delay */
.animotion-delay-0 { animation-delay: 0ms !important; }
.animotion-delay-100 { animation-delay: 100ms !important; }
.animotion-delay-200 { animation-delay: 200ms !important; }
.animotion-delay-300 { animation-delay: 300ms !important; }
.animotion-delay-400 { animation-delay: 400ms !important; }
.animotion-delay-500 { animation-delay: 500ms !important; }
.animotion-delay-600 { animation-delay: 600ms !important; }
.animotion-delay-700 { animation-delay: 700ms !important; }
.animotion-delay-800 { animation-delay: 800ms !important; }
.animotion-delay-1000 { animation-delay: 1s !important; }
.animotion-delay-1200 { animation-delay: 1.2s !important; }
.animotion-delay-1500 { animation-delay: 1.5s !important; }
.animotion-delay-2000 { animation-delay: 2s !important; }
.animotion-delay-3000 { animation-delay: 3s !important; }

/* Easing */
.animotion-ease-linear { animation-timing-function: linear !important; }
.animotion-ease-in { animation-timing-function: ease-in !important; }
.animotion-ease-out { animation-timing-function: ease-out !important; }
.animotion-ease-in-out { animation-timing-function: ease-in-out !important; }
.animotion-ease-spring { animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275) !important; }
.animotion-ease-bounce { animation-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55) !important; }
.animotion-ease-elastic { animation-timing-function: cubic-bezier(0.68, -0.6, 0.32, 1.6) !important; }
.animotion-ease-smooth { animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important; }
.animotion-ease-sharp { animation-timing-function: cubic-bezier(0.4, 0, 0.6, 1) !important; }
.animotion-ease-decelerate { animation-timing-function: cubic-bezier(0, 0, 0.2, 1) !important; }
.animotion-ease-accelerate { animation-timing-function: cubic-bezier(0.4, 0, 1, 1) !important; }
.animotion-ease-overshoot { animation-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1) !important; }

/* Iteration Count */
.animotion-once { animation-iteration-count: 1 !important; }
.animotion-twice { animation-iteration-count: 2 !important; }
.animotion-thrice { animation-iteration-count: 3 !important; }
.animotion-infinite { animation-iteration-count: infinite !important; }

/* Fill Mode */
.animotion-fill-none { animation-fill-mode: none !important; }
.animotion-fill-forwards { animation-fill-mode: forwards !important; }
.animotion-fill-backwards { animation-fill-mode: backwards !important; }
.animotion-fill-both { animation-fill-mode: both !important; }

/* Direction */
.animotion-normal { animation-direction: normal !important; }
.animotion-reverse { animation-direction: reverse !important; }
.animotion-alternate { animation-direction: alternate !important; }
.animotion-alternate-reverse { animation-direction: alternate-reverse !important; }

/* Play State */
.animotion-running { animation-play-state: running !important; }
.animotion-paused { animation-play-state: paused !important; }

/* GPU Optimization */
.animotion-gpu {
  will-change: transform, opacity;
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  .animotion-respect-motion,
  .animotion-respect-motion * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Stagger Delays (for child elements) */
.animotion-stagger > *:nth-child(1) { animation-delay: 0ms; }
.animotion-stagger > *:nth-child(2) { animation-delay: 50ms; }
.animotion-stagger > *:nth-child(3) { animation-delay: 100ms; }
.animotion-stagger > *:nth-child(4) { animation-delay: 150ms; }
.animotion-stagger > *:nth-child(5) { animation-delay: 200ms; }
.animotion-stagger > *:nth-child(6) { animation-delay: 250ms; }
.animotion-stagger > *:nth-child(7) { animation-delay: 300ms; }
.animotion-stagger > *:nth-child(8) { animation-delay: 350ms; }
.animotion-stagger > *:nth-child(9) { animation-delay: 400ms; }
.animotion-stagger > *:nth-child(10) { animation-delay: 450ms; }

.animotion-stagger-100 > *:nth-child(1) { animation-delay: 0ms; }
.animotion-stagger-100 > *:nth-child(2) { animation-delay: 100ms; }
.animotion-stagger-100 > *:nth-child(3) { animation-delay: 200ms; }
.animotion-stagger-100 > *:nth-child(4) { animation-delay: 300ms; }
.animotion-stagger-100 > *:nth-child(5) { animation-delay: 400ms; }
.animotion-stagger-100 > *:nth-child(6) { animation-delay: 500ms; }
.animotion-stagger-100 > *:nth-child(7) { animation-delay: 600ms; }
.animotion-stagger-100 > *:nth-child(8) { animation-delay: 700ms; }
.animotion-stagger-100 > *:nth-child(9) { animation-delay: 800ms; }
.animotion-stagger-100 > *:nth-child(10) { animation-delay: 900ms; }