/* ==========================================================================
   NIGAM PHARMACHEM INDUSTRIES - ANIMATIONS & TRANSITIONS
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. KEYFRAME ANIMATIONS
   -------------------------------------------------------------------------- */

/* Slow Hero Floating Effect */
@keyframes floatSlow {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-12px) rotate(1deg);
  }
}

/* Molecular Pulse Effect */
@keyframes molecularPulse {
  0%, 100% {
    transform: scale(1);
    opacity: 0.8;
  }
  50% {
    transform: scale(1.04);
    opacity: 1;
  }
}

/* Glowing Border Pulse */
@keyframes borderGlow {
  0%, 100% {
    border-color: rgba(18, 199, 165, 0.2);
    box-shadow: 0 0 15px rgba(18, 199, 165, 0.1);
  }
  50% {
    border-color: rgba(18, 199, 165, 0.6);
    box-shadow: 0 0 25px rgba(18, 199, 165, 0.3);
  }
}

/* Timeline Progress Line Fill */
@keyframes lineExpand {
  from {
    width: 0;
  }
  to {
    width: 80%;
  }
}

/* Fade In Slide Up */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* --------------------------------------------------------------------------
   2. SCROLL REVEAL CLASSES (TRIGGERED BY INTERSECTIONOBSERVER)
   -------------------------------------------------------------------------- */
.reveal {
  opacity: 0;
  transform: translateY(35px);
  transition: opacity 600ms cubic-bezier(0.2, 0.8, 0.2, 1),
              transform 600ms cubic-bezier(0.2, 0.8, 0.2, 1);
  will-change: opacity, transform;
}

.reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

.reveal-delay-1 {
  transition-delay: 150ms;
}

.reveal-delay-2 {
  transition-delay: 300ms;
}

.reveal-delay-3 {
  transition-delay: 450ms;
}

.reveal-delay-4 {
  transition-delay: 600ms;
}

/* --------------------------------------------------------------------------
   3. ACCESSIBILITY - PREFERS REDUCED MOTION
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .reveal {
    opacity: 1 !important;
    transform: none !important;
  }

  .hero-visual img {
    animation: none !important;
  }
}
