.reveal {
  opacity: 0;
  transform: translateY(1.5rem);
  transition: opacity 600ms ease, transform 600ms ease;
}

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

.reveal.is-viewport.delay-200 {
  transition-delay: 200ms;
}

.reveal.is-viewport.delay-400 {
  transition-delay: 400ms;
}

.reveal.is-viewport.delay-600 {
  transition-delay: 600ms;
}

.reveal.is-viewport.delay-800 {
  transition-delay: 800ms;
}

.reveal.is-viewport.delay-1000 {
  transition-delay: 1000ms;
}

.reveal.is-viewport.delay-1200 {
  transition-delay: 1200ms;
}

.reveal.is-viewport.delay-n {
  transition-delay: calc(600ms + (var(--n, 0) * 0.2s));
}