[data-reveal] {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.9s var(--ease), transform 0.9s var(--ease);
    transition-delay: var(--d, 0ms);
}

[data-reveal].is-in {
    opacity: 1;
    transform: none;
}

[data-split] .split-char {
    display: inline-block;
    transform: translateY(110%) rotate(8deg);
    opacity: 0;
    transition: transform 0.8s var(--ease), opacity 0.5s ease;
    transition-delay: var(--i, 0ms);
    will-change: transform;
}

[data-split].is-in .split-char {
    transform: translateY(0) rotate(0);
    opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
    [data-reveal],
    [data-split] .split-char {
        opacity: 1;
        transform: none;
        transition: none;
    }
}
