/* ==========================================================================
   Animation keyframes & reveal utility classes
   ========================================================================== */

/* Scroll reveal (JS toggles .in-view via IntersectionObserver) */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s ease, transform 0.7s cubic-bezier(.21,.9,.32,1);
}
.reveal.in-view { opacity: 1; transform: translateY(0); }

.reveal-zoom { opacity: 0; transform: scale(0.92); transition: opacity 0.6s ease, transform 0.6s ease; }
.reveal-zoom.in-view { opacity: 1; transform: scale(1); }

.reveal-left { opacity: 0; transform: translateX(-32px); transition: opacity 0.7s ease, transform 0.7s ease; }
.reveal-left.in-view { opacity: 1; transform: translateX(0); }

.reveal-right { opacity: 0; transform: translateX(32px); transition: opacity 0.7s ease, transform 0.7s ease; }
.reveal-right.in-view { opacity: 1; transform: translateX(0); }

.reveal-stagger.in-view .stagger-child {
  animation: staggerFade 0.6s ease forwards;
}
.stagger-child { opacity: 0; }
.reveal-stagger.in-view .stagger-child:nth-child(1) { animation-delay: 0.05s; }
.reveal-stagger.in-view .stagger-child:nth-child(2) { animation-delay: 0.15s; }
.reveal-stagger.in-view .stagger-child:nth-child(3) { animation-delay: 0.25s; }
.reveal-stagger.in-view .stagger-child:nth-child(4) { animation-delay: 0.35s; }

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

/* Hero background ambient motion */
@keyframes floatY {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-14px); }
}
@keyframes driftX {
  0% { transform: translateX(-6%); }
  50% { transform: translateX(6%); }
  100% { transform: translateX(-6%); }
}
.float-anim { animation: floatY 4.5s ease-in-out infinite; }
.drift-anim { animation: driftX 9s ease-in-out infinite; }

/* Route dash animation for hero illustration */
@keyframes dashMove {
  to { stroke-dashoffset: -400; }
}
.route-path {
  stroke-dasharray: 10 10;
  animation: dashMove 14s linear infinite;
}

@keyframes moveAlongRoute {
  0% { offset-distance: 0%; }
  100% { offset-distance: 100%; }
}
.route-marker {
  offset-path: path('M20,180 C120,40 220,300 320,120 S 520,40 560,140');
  animation: moveAlongRoute 8s ease-in-out infinite alternate;
}

@keyframes pinPulse {
  0% { transform: scale(1); opacity: 1; }
  70% { transform: scale(2.4); opacity: 0; }
  100% { opacity: 0; }
}
.pin-pulse { animation: pinPulse 2.4s ease-out infinite; }

/* Timeline current-step pulse ring */
@keyframes pulseRing {
  0% { box-shadow: 0 0 0 0 rgba(229,57,53,0.35); }
  70% { box-shadow: 0 0 0 12px rgba(229,57,53,0); }
  100% { box-shadow: 0 0 0 0 rgba(229,57,53,0); }
}

/* Skeleton shimmer */
@keyframes skeletonShimmer {
  0% { background-position: 100% 50%; }
  100% { background-position: 0 50%; }
}

/* Toast enter/exit */
@keyframes toastIn {
  from { opacity: 0; transform: translateY(16px) scale(0.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes toastOut {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to { opacity: 0; transform: translateY(10px) scale(0.96); }
}
.toast { animation: toastIn 0.35s ease forwards; }
.toast.toast--out { animation: toastOut 0.3s ease forwards; }

/* Loader truck bounce */
@keyframes truckBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
.loader-truck { animation: truckBounce 1s ease-in-out infinite; }
@keyframes wheelSpin {
  to { transform: rotate(360deg); }
}
.loader-wheel { animation: wheelSpin 1s linear infinite; transform-origin: center; }

/* Counter fade for numbers as they tick (subtle) */
.counter { display: inline-block; }

/* Simple fade utility used for JS-driven page transitions */
.fade-in { animation: fadeIn 0.5s ease both; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

.zoom-in { animation: zoomIn 0.5s ease both; }
@keyframes zoomIn { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } }

.slide-up { animation: slideUp 0.5s ease both; }
@keyframes slideUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }