/* ============================================================
   iTruck India — Animation Helpers
   animations.css
   ============================================================ */

/* Reveal and entrance animations */
.anim-fade-up,
.anim-fade-left,
.anim-fade-right,
.anim-scale {
  opacity: 0;
  transition: opacity 0.75s ease, transform 0.75s ease;
  will-change: opacity, transform;
}

.anim-fade-up { transform: translateY(30px); }
.anim-fade-left { transform: translateX(-30px); }
.anim-fade-right { transform: translateX(30px); }
.anim-scale { transform: scale(0.95); }

.anim-in,
.anim-fade-up.in-view,
.anim-fade-left.in-view,
.anim-fade-right.in-view,
.anim-scale.in-view {
  opacity: 1;
  transform: translateX(0) translateY(0) scale(1);
}

/* Reveal delay helpers */
.anim-d1 { transition-delay: 0.1s; }
.anim-d2 { transition-delay: 0.2s; }
.anim-d3 { transition-delay: 0.3s; }
.anim-d4 { transition-delay: 0.4s; }
.anim-d5 { transition-delay: 0.5s; }
.anim-d6 { transition-delay: 0.6s; }

/* Map route draw animation */
@keyframes drawLine {
  from { stroke-dashoffset: 100%; }
  to { stroke-dashoffset: 0; }
}

/* Hero particle float animation */
@keyframes particleFloat {
  0% { transform: translateY(0); opacity: 0.5; }
  50% { transform: translateY(-14px); opacity: 0.9; }
  100% { transform: translateY(0); opacity: 0.5; }
}

/* Smooth fade helper for reveal elements */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.75s ease, transform 0.75s ease;
}

.reveal.in-view {
  opacity: 1;
  transform: translateY(0);
}