/* TEXT REVEAL EFFECT
v. 0.1
su-di-me.php
*/
.reveal-section {
    min-height: 100%;
}

.reveal-text {
    font-size: clamp(1.2rem, 2vw, 1.6rem);
    line-height: 1.6;
                max-width: 900px;
                margin: 0 auto;
                text-align: left;
}

@keyframes reveal {
                from {
                    opacity: 0.15;
                    filter: blur(6px);
                    transform: translateY(12px);
                }

                to {
                    opacity: 1;
                    filter: blur(0);
                    transform: translateY(0);
                }
}

.reveal-text>span {
    display: block;
    margin-bottom: 0.75em;
    animation: reveal 1s ease-out both;
    animation-timeline: view();
    will-change: opacity, transform, filter;
}
.reveal-text>li {
    display: block;
    margin-bottom: 0em;
    animation: reveal 1s ease-out both;
    animation-timeline: view();
    will-change: opacity, transform, filter;
}

/* range per frase */
.reveal-text>span:nth-of-type(1), .reveal-text>li:nth-of-type(1) {
                animation-range: cover 10% cover 30%;
            }

.reveal-text>span:nth-of-type(2), .reveal-text>li:nth-of-type(2) {
                animation-range: cover 18% cover 38%;
            }

.reveal-text>span:nth-of-type(3), .reveal-text>li:nth-of-type(3) {
                animation-range: cover 26% cover 46%;
            }

.reveal-text>span:nth-of-type(4), .reveal-text>li:nth-of-type(4) {
                animation-range: cover 34% cover 54%;
            }

.reveal-text>span:nth-of-type(5), .reveal-text>li:nth-of-type(5) {
    animation-range: cover 45% cover 65%;
}

.reveal-text>span:nth-of-type(6), .reveal-text>li:nth-of-type(6) {
    animation-range: cover 60% cover 67%;
}

.reveal-text>span:nth-of-type(7), .reveal-text>li:nth-of-type(7) {
    animation-range: cover 67% cover 75%;
}