/* 09-animations.css - Scroll reveal & motion animations */

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(40px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeDown {
  from { opacity: 0; transform: translateY(-40px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes slideLeft {
  from { opacity: 0; transform: translateX(60px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes slideRight {
  from { opacity: 0; transform: translateX(-60px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes zoomIn {
  from { opacity: 0; transform: scale(0.9); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes spin {
  to { transform: rotate(360deg); }
}

.reveal { opacity: 0; will-change: transform, opacity; }
.reveal.fade-up { transform: translateY(40px); }
.reveal.fade-down { transform: translateY(-40px); }
.reveal.slide-left { transform: translateX(60px); }
.reveal.slide-right { transform: translateX(-60px); }
.reveal.zoom { transform: scale(0.9); }

.reveal.in-view {
  animation-duration: 0.9s;
  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  animation-fill-mode: forwards;
}
.reveal.fade-up.in-view { animation-name: fadeUp; }
.reveal.fade-down.in-view { animation-name: fadeDown; }
.reveal.slide-left.in-view { animation-name: slideLeft; }
.reveal.slide-right.in-view { animation-name: slideRight; }
.reveal.zoom.in-view { animation-name: zoomIn; }

.reveal-delay-1 { animation-delay: 0.1s; }
.reveal-delay-2 { animation-delay: 0.2s; }
.reveal-delay-3 { animation-delay: 0.3s; }
.reveal-delay-4 { animation-delay: 0.4s; }

/* Hover lift utility */
.hover-lift { transition: transform var(--transition-base), box-shadow var(--transition-base); }
.hover-lift:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }

/* Counter animation target */
.counter { font-variant-numeric: tabular-nums; }

/* Parallax hero background */
.hero-bg { transition: transform 0.1s linear; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; animation: none !important; }
}