.text-container3 {
    /*font-size: 2.5em;*/
    white-space: nowrap;
    overflow: hidden;
    position: relative;
}

#animated-text .letter {
    opacity: 0;
    transform: translateZ(-1000px);
    display: inline-block;
    animation: come-from-far 1.5s forwards;
    position: relative;
}

#animated-text .letter::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background-color: rgba(255, 255, 0, 0.7); /* Couleur de la brillance */
    border-radius: 50%;
    transform: translate(-50%, -50%);
    filter: blur(20px);
    opacity: 0;
    animation: shine 1s forwards;
    animation-delay: var(--shine-delay, 0s); /* Utilisation de la variable pour le délai */
}

@keyframes come-from-far {
    0% {
        opacity: 0;
        transform: translateZ(-1000px);
        text-shadow: 0 0 50px rgba(255, 255, 255, 0.9);
    }
    50% {
        opacity: 0.5;
        transform: translateZ(-500px);
        text-shadow: 0 0 80px rgba(255, 255, 255, 1);
    }
    100% {
        opacity: 1;
        transform: translateZ(0);
        text-shadow: 0 0 100px rgba(255, 255, 255, 0.8);
    }
}

@keyframes shine {
    0% {
        width: 0;
        height: 0;
        opacity: 0;
    }
    50% {
        width: 30px; /* Ajuster selon l'effet désiré */
        height: 30px;
        opacity: 0.8;
    }
    100% {
        width: 50px;
        height: 50px;
        opacity: 0;
    }
}