.reveal-up {
  opacity: 0;
  transform: translateY(18px);
  transition:
    opacity 500ms ease-out,
    transform 500ms ease-out;
}

.reveal-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.delay-1 {
  transition-delay: 120ms;
}

.delay-2 {
  transition-delay: 220ms;
}

.reveal-grid .grid-item {
  opacity: 0;
  transform: translateY(18px);
  transition:
    opacity 500ms ease-out,
    transform 500ms ease-out;
}

.reveal-grid.is-visible .grid-item {
  opacity: 1;
  transform: translateY(0);
}

/* Magnetic hover hint */
[data-magnetic] {
  position: relative;
  will-change: transform;
  transition: transform var(--transition-fast);
}