[data-animate] {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

[data-animate].reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

[data-animate="fade-left"] {
  transform: translateX(40px);
}

[data-animate="fade-left"].reveal.is-visible {
  transform: translateX(0);
}

[data-animate="fade-left"].reveal.is-visible:hover {
  transform: translateX(0) translateY(-8px) scale(1.01);
}

[data-animate="fade-up"].reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
