body {
    background: linear-gradient(120deg, #2980b9, #8e44ad);
    font-family: Arial, sans-serif;
    overflow: hidden;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    margin: 0;
    background-size: 200% 200%;
    animation: gradient 15s ease infinite;
}

.container {
    text-align: center;
}

.title {
    font-size: 4em;
    font-weight: bold;
    animation: slideIn 2s forwards;
}

.slogan {
    font-size: 2em;
    opacity: 0;
    animation: slideIn 2s 1s forwards;
}

.info-text {
    font-size: 2em;
    opacity: 0;
    animation: slideIn 2s 2s forwards;
}

@keyframes slideIn {
    0% {
        transform: translateY(-3em);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

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

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}