.hero-intro {
  opacity: 1;
}

.hero-intro .hero_heading,
.hero-intro .hero_sub-text,
.hero-intro .hero_cta-block {
  animation: hero-intro-slide 480ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.hero-intro .hero_sub-text {
  animation-delay: 80ms;
}

.hero-intro .hero_cta-block {
  animation-delay: 160ms;
}

@keyframes hero-intro-slide {
  from {
    opacity: 0;
    transform: translate3d(-24px, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-intro .hero_heading,
  .hero-intro .hero_sub-text,
  .hero-intro .hero_cta-block {
    animation: none;
  }
}