/* Animation */

@keyframes fadeInUp {
    from {
        transform: translate3d(0,40px,0)
    }

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

@-webkit-keyframes fadeInUp {
    from {
        transform: translate3d(0,40px,0)
    }

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

/* Animations */
@-webkit-keyframes arrow_down {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes arrow_down {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    } 
}

.animated {
    animation-duration: 1s;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: both
}

.animatedFadeInUp {
    opacity: 0
}

.fadeInUp {
    opacity: 0;
    animation-name: fadeInUp;
    -webkit-animation-name: fadeInUp;
}

/* 화면 스크롤 시 애니메이션 */
.seq_animate_item {
    opacity: 0;
    transform: translateY(50px);
    transition: all 0.5s ease;
}

.seq_animate_item.animate {
    opacity: 1;
    transform: translateY(0);
}

[data-text-reveal] .text_reveal_char {
    display: inline-block;
    color: var(--white_30);
    transition: color 0.4s ease, opacity 0.4s ease;
    opacity: 0.95;
}

[data-text-reveal] .text_reveal_char.active {
    color: var(--white);
    opacity: 1;
}