/**
 * Invictus Law - Animation Utilities
 * Slow, intentional, luxurious motion
 */

/* Reveal on scroll */
.animate-reveal {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity var(--duration-slow) var(--ease-smooth),
    transform var(--duration-slow) var(--ease-smooth);
}

.animate-reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger delay utilities */
.animate-delay-1 { transition-delay: 100ms; }
.animate-delay-2 { transition-delay: 200ms; }
.animate-delay-3 { transition-delay: 300ms; }
.animate-delay-4 { transition-delay: 400ms; }
.animate-delay-5 { transition-delay: 500ms; }
.animate-delay-6 { transition-delay: 600ms; }

/* Smooth transitions */
.transition-smooth {
  transition: opacity var(--duration-normal) var(--ease-smooth),
    transform var(--duration-normal) var(--ease-smooth);
}

/* Glow on hover - panels, cards */
.glow-hover {
  transition: box-shadow var(--duration-fast) var(--ease-smooth),
    transform var(--duration-fast) var(--ease-smooth),
    border-color var(--duration-fast) var(--ease-smooth);
}

.glow-hover:hover {
  box-shadow: 0 0 24px var(--color-accent-glow-subtle);
}

/* Focus glow for accessibility */
.glow-focus:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--color-bg-primary),
    0 0 0 4px var(--color-accent);
}

/* SVG stroke animation - logo paths */
.svg-stroke-animate path,
.svg-stroke-animate line {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: strokeReveal var(--duration-hero) var(--ease-smooth) forwards;
}

.svg-stroke-animate path:nth-child(1) { animation-delay: 0ms; }
.svg-stroke-animate path:nth-child(2) { animation-delay: 100ms; }
.svg-stroke-animate path:nth-child(3) { animation-delay: 200ms; }
.svg-stroke-animate line { animation-delay: 300ms; }

@keyframes strokeReveal {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-12px);
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .animate-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  
  .svg-stroke-animate path,
  .svg-stroke-animate line {
    stroke-dashoffset: 0;
    animation: none;
  }
}
