.animated-heading-wrapper {
    width: 100%;
    overflow: hidden;
}

.animated-heading-text {
    display: inline-block;
    --big-size: 200px;
    --small-size: 50px;
    --anim-duration: 2s;
    font-size: var(--small-size);
}

.animated-heading-text.is-animating {
    animation: shrinkHeadingAnim var(--anim-duration) ease-out forwards;
}

@keyframes shrinkHeadingAnim {
    0% {
        font-size: var(--big-size);
    }
    100% {
        font-size: var(--small-size);
    }
}