@font-face {
    font-family: 'TT Supermolot Neue Trial Regular';
    src: url('fonts/tt-supermolot-neue-trl/TT Supermolot Neue Trial Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


body {
    margin: 0;
    padding: 0;
    background-image: url('WeshSchoolBackground.jpg'); /* Image de fond */
    background-size: cover; /* L'image couvre toujours toute la surface */
    background-position: left center; /* Fixe le côté gauche de l'image */
    background-repeat: no-repeat; /* Empêche la répétition de l'image */
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    font-family: 'TT Supermolot Neue Trial Thin', sans-serif;
}

.logo-container {
    display: flex;
    flex-direction: column; /* Place le logo et le texte en colonne */
    align-items: center; /* Centre horizontalement le logo et le texte */
    justify-content: center; /* Centre verticalement le contenu */
    flex: 1; /* Prend tout l'espace disponible verticalement */
    margin-top: -20vh; /* Remonte l'ensemble du logo et le texte */
}

.center-image {
    max-width: 90%; /* Rétrécit l'image si la largeur devient trop petite */
    max-height: 90%; /* Limite la hauteur à 70% de la hauteur de la fenêtre */
    height: auto; /* Maintient le ratio de l'image */
}

.logo-text {
    font-family: 'TT Supermolot Neue Trial Regular', sans-serif; /* Police personnalisée */
    color: white; /* Couleur du texte */
    text-align: center; /* Centré sous le logo */
    font-size: clamp(0.5rem, 5vw, 2rem); /* Taille minimale : 1rem, idéale : 5vw, maximale : 2.5rem */
    margin-top: -2em; /* Espacement constant entre le logo et le texte */
}

.scrolling-text {
    position: absolute;
    bottom: 10%; /* Ajustez pour placer le texte entre le centre et le bas */
    width: 100%;
    color: white;
    font-size: 1.5rem;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    pointer-events: none; /* Empêche toute interaction avec le texte */
    font-family: 'TT Supermolot Neue Trial Regular', sans-serif; /* Utilise la police personnalisée */
}

.scrolling-text span {
    display: inline-block;
    animation: scroll 50s linear infinite; /* Durée de 50s comme dans votre code */
    transform: translateX(0); /* Commence directement à gauche */
}

@keyframes scroll {
    from {
        transform: translateX(0); /* Commence à gauche */
    }
    to {
        transform: translateX(-100%); /* Défile vers la gauche */
    }
}

/* Animation des éclairs blancs avec des durées aléatoires */
@keyframes white-flash {
    /* Série initiale de 2 éclairs rapides */
    0% {
        opacity: 0; /* Invisible */
    }
    1% {
        opacity: 0.9; /* Premier éclair intense */
    }
    2% {
        opacity: 0; /* Retour à invisible */
    }
    3% {
        opacity: 0.8; /* Deuxième éclair moyen */
    }
    4% {
        opacity: 0; /* Retour à invisible */
    }
    5% {
        opacity: 0.7; /* Troisième éclair long */
    }
    15% {
        opacity: 0; /* Retour à invisible */
    }

    /* Éclairs réguliers après la série initiale */
    15%, 20% {
        opacity: 0; /* Invisible */
    }
    21% {
        opacity: 0.9; /* Éclair intense */
    }
    23% {
        opacity: 0; /* Retour à invisible */
    }
    30%, 40% {
        opacity: 0; /* Invisible */
    }
    41% {
        opacity: 0.8; /* Éclair moyen */
    }
    45% {
        opacity: 0; /* Retour à invisible */
    }
    50%, 60% {
        opacity: 0; /* Invisible */
    }
    61% {
        opacity: 0.7; /* Éclair doux */
    }
    63% {
        opacity: 0; /* Retour à invisible */
    }
    70%, 80% {
        opacity: 0; /* Invisible */
    }
    81% {
        opacity: 0.9; /* Éclair intense */
    }
    85% {
        opacity: 0; /* Retour à invisible */
    }
    90%, 100% {
        opacity: 0; /* Invisible */
    }
}

/* Applique l'animation des éclairs */
.flash-effect {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: white; /* Éclair blanc */
    opacity: 0; /* Par défaut invisible */
    animation: white-flash 20s infinite; /* Animation répétée toutes les 10 secondes */
    pointer-events: none; /* Empêche toute interaction avec l'éclair */
    z-index: 1; /* Place l'éclair au-dessus du contenu */
}