@keyframes fade-in {
  from { opacity: 0 }
  to { opacity: 1 }
}

@keyframes slide-up {
  from { opacity: 0; transform: translateY(28px) }
  to { opacity: 1; transform: translateY(0) }
}

.anim-fade { animation: fade-in .7s ease both }
.anim-up { animation: slide-up .7s ease both .1s }
.anim-up-2 { animation: slide-up .7s ease both .25s }
.anim-up-3 { animation: slide-up .7s ease both .4s }

.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .65s ease, transform .65s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

.step-img {
  transition: transform .4s ease, box-shadow .4s ease;
}
.step-img:hover {
  transform: translateY(-4px);
  box-shadow: 0 25px 60px -12px rgba(0, 0, 0, .18);
}