/*========================================================*/
/* STYLE POUR UN SÉPARATEUR CYBERPUNK - VERSION LARGE     */
/*========================================================*/

.separateur {
    border: none;
    /* On remplace la hauteur en 'rem' par une hauteur en 'px' pour une netteté parfaite */
    height: 1px;
    width: 70%;  /* On augmente significativement la largeur à 70% du conteneur */
    margin: 3.5rem auto;
    position: relative;
    
    /*
     * On ajuste le dégradé pour que la partie solide soit plus courte (de 40% à 60%)
     * et le fondu plus long, ce qui accentue l'effet "estompé" sur la nouvelle largeur.
     */
    background: linear-gradient(to right,
        transparent,
        rgba(255, 215, 0, 0.7) 40%,
        rgba(255, 215, 0, 0.7) 60%,
        transparent
    );

    /*
     * La lueur est conservée, elle s'appliquera naturellement à la nouvelle largeur.
     */
    box-shadow:
        0 0 8px rgba(255, 215, 0, 0.5),
        0 0 16px rgba(255, 165, 0, 0.3);
}

/*
 * On ajuste la position des glitches pour qu'ils restent harmonieux
 * avec la nouvelle dimension du séparateur.
 */
.separateur::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 30%; /* On ajuste la position relative */
    width: 50px;
    height: 1px;
    background-color: rgba(220, 40, 40, 0.9);
    filter: blur(1px);
}

.separateur::after {
    content: '';
    position: absolute;
    top: 2px;
    right: 30%; /* On ajuste la position relative */
    width: 60px;
    height: 1px;
    background: linear-gradient(to right,
        transparent,
        rgba(255, 255, 224, 0.6) 50%,
        transparent
    );
}