/* Styles personnalisés pour recréer l'ambiance "cyberpunk/terminal" */
body {
    font-family: 'Share Tech Mono', monospace;
    background-color: #0D0221;
    /* Effet de "scanlines" comme sur un vieil écran CRT */
    background-image: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
    background-size: 100% 4px, 3px 100%;
}

/* Effets de lueur (glow) pour les textes et le logo */
.text-glow-pink { text-shadow: 0 0 5px rgba(244, 114, 182, 0.8), 0 0 10px rgba(244, 114, 182, 0.6); }
.text-glow-cyan { text-shadow: 0 0 5px rgba(103, 232, 249, 0.8), 0 0 10px rgba(103, 232, 249, 0.6); }
.text-glow-green { text-shadow: 0 0 5px rgba(52, 211, 153, 0.8), 0 0 10px rgba(52, 211, 153, 0.6); }
.text-glow-purple { text-shadow: 0 0 5px rgba(192, 132, 252, 0.8), 0 0 10px rgba(192, 132, 252, 0.6); }
.text-glow-yellow { text-shadow: 0 0 5px rgba(250, 204, 21, 0.8), 0 0 10px rgba(250, 204, 21, 0.6); }

.img-glow {
    filter: drop-shadow(0 0 4px rgba(236, 72, 153, 0.7)) drop-shadow(0 0 8px rgba(139, 92, 246, 0.5));
}

/* Animation de clignotement pour le curseur */
.cursor::after {
    content: '_';
    animation: blink 1s step-end infinite;
}

@keyframes blink {
    50% { opacity: 0; }
}

/* Style pour les cartes avec une petite rotation au survol */
.timeline-card {
    transition: transform 0.3s ease-in-out;
    width: 280px; /* Largeur de base pour les cartes, doublée */
}

.timeline-card:hover {
    transform: scale(1.05) rotate(2deg);
}

/* Animation de clignotement pour le bouton de jeu */
.button-blink {
    animation: blink-animation 1.5s infinite;
}

@keyframes blink-animation {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 5px rgba(52, 211, 153, 0);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 0 15px rgba(52, 211, 153, 0.7);
    }
}

/* NOUVELLE ANIMATION : Clignotement pour le bouton de téléchargement */
.button-blink-pink {
    animation: blink-pink-animation 1.5s infinite 0.5s; /* 0.5s de délai */
}

@keyframes blink-pink-animation {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 5px rgba(244, 114, 182, 0);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 0 15px rgba(244, 114, 182, 0.7);
    }
}

/* NOUVELLE ANIMATION : Clignotement pour le bouton de l'outil */
.button-blink-purple {
    animation: blink-purple-animation 1.5s infinite;
}

@keyframes blink-purple-animation {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 5px rgba(192, 132, 252, 0);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 0 15px rgba(192, 132, 252, 0.7);
    }
}