@keyframes gradient-wave {
    0% {background-position: 0% 50%;}
    50% {background-position: 100% 50%;}
    100% {background-position: 0% 50%;}
}

.gradient-bg {
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient-wave 15s ease infinite;
}

html {
    scroll-behavior: smooth;
}
/* @keyframes typing {
    0% { width: 0; }
    15% {width: 25%;}
    30% { width: 50%; }
    45% { width: 75%;}
    55% { width: 100%;}
    75% { width: 90%;}
    100% { width: 20%; }
} */

@keyframes blink {
    50% { border-color: transparent; }
}

#typing-text {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    border-right: 2px solid white;
    animation: typing 4s steps(20) infinite, blink 0.7s step-end infinite;
    padding-bottom: 19px;
}