The animated title block style

the-animated-title-block-style.css

/* https://cdn.jsdelivr.net/npm/splitting@1.0.6/dist/splitting.min.css */

selector .is-animated-heading {
  visibility: hidden;
}

selector .is-animated-heading.is-animated {
  visibility: visible;
}

selector .is-animated .char {
  animation               : fadeInUp20 .35s cubic-bezier(0.3, 0, 0.7, 1) both;
  animation-delay         : calc(50ms * var(--char-index));
}

@keyframes fadeInUp20 {
  0% {
    opacity           : 0;
    transform         : translateY(20px);
  }

  100% {
    opacity           : 1;
    transform         : translateY(0);
  }
}