/* 
 * animations.css
 * Functional animations only
 */

/* ---------- KEYFRAMES ---------- */

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(2rem); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

@keyframes scroll {
  0%   { opacity: 1; transform: translateY(0); }
  50%  { opacity: 0.5; transform: translateY(0.8rem); }
  100% { opacity: 0; transform: translateY(1.6rem); }
}

@keyframes arrow {
  0%   { opacity: 0; transform: translateY(-0.5rem) rotate(45deg); }
  50%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(0.5rem) rotate(45deg); }
}

/* ---------- SCROLL REVEAL ---------- */
.reveal {
  opacity: 0;
  transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.5, 0, 0, 1);
}

.reveal.active,
.reveal.revealed {
  opacity: 1;
  transform: translateY(0) !important;
}

.reveal-up   { transform: translateY(3rem); }
.reveal-down { transform: translateY(-3rem); }
.reveal-left { transform: translateX(-3rem); }
.reveal-right{ transform: translateX(3rem); }