:root {
    --background-color: #101419;
    --accent-color: #8A2BE2; /* couleur de pédale */
    --glow-color: rgba(138, 43, 226, 0.1);
    --accent-glow-strong: rgba(138, 43, 226, 0.7);
    --accent-glow-medium: rgba(138, 43, 226, 0.3);
    --mouse-x: 50vw;
    --mouse-y: 50vh;
}
/* bon carlos ton régime là */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none; /* pas toucher */
    z-index: -1; /* non plus tes vieux doigts pleins de gras là */
    background-color: var(--background-color);
    background-image: radial-gradient(circle at var(--mouse-x) var(--mouse-y), var(--glow-color) 0%, transparent 300px); /* nouveau */
}    

     
.hacker-font {
    font-family: 'Fira Code', 'Courier New', Courier, monospace;
}
.title, .subtitle, p {
    color: #e0e0e0;
    transition: text-shadow 0.3s ease;
}
.title.main-title {
    color: var(--accent-color);
    font-size: 3.5rem;
    text-shadow: 0 0 8px var(--accent-glow-strong), 0 0 20px var(--accent-glow-medium);
    position: relative;
    animation: glitch 5s infinite steps(1);
}
/* faut modif les couleurs fin brfff */
@keyframes glitch {
    0%, 100% { text-shadow: 0 0 8px var(--accent-glow-strong); transform: skewX(0); }
    49% { text-shadow: 0 0 8px var(--accent-glow-strong); }
    50% { text-shadow: 0.05em 0 0 rgba(0, 114, 6, 1), -0.05em 0 0 rgba(174, 0, 255, 1); transform: skewX(-5deg); }
    51% { text-shadow: 0 0 8px var(--accent-glow-strong); }
    52% { text-shadow: -0.05em 0 0 rgba(247, 0, 255, 1), 0.05em 0 0 rgba(0, 114, 6, 1); transform: skewX(5deg); }
    53% { text-shadow: 0 0 8px var(--accent-glow-strong); transform: skewX(0); }
}
/* fdp d'anorexique de merde carlos */
.subtitle {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    border-right: 3px solid var(--accent-color);
    max-width: 100%; /* Il reste gentiment dans l'écran */
}

/* iPhone & autres cucks*/
@media (max-width: 600px) {
    .subtitle,
    .subtitle * {
        animation: none !important;
        border-right: none !important;
        white-space: normal !important;
        overflow: visible !important;
        width: auto !important;
    }
}
@keyframes blink-caret {
    from, to { border-color: transparent; }
    50% { border-color: var(--accent-color); }
}
/* jsp */
#presentation {
    position: relative;
    z-index: 1;
}
.button.is-accent-glow {
    background-color: transparent;
    border-color: var(--accent-color);
    color: var(--accent-color);
    text-shadow: 0 0 5px var(--glow-color);
    box-shadow: 0 0 10px var(--glow-color), inset 0 0 5px var(--glow-color);
    transition: all 0.3s ease;
    margin-top: 2rem;
}
.button.is-accent-glow:hover {
    background-color: var(--accent-color);
    box-shadow: 0 0 20px var(--button-shadow-color), inset 0 0 10px var(--button-shadow-color);
    color: #fff;
}
.section {
    /* ça on touche pas sinon ça casse vrm le site */
    background-color: transparent;
}
.hero.is-fullheight {
    background-color: transparent;
}
.hacker-box {
    background-color: rgba(20, 24, 30, 0.5);
    border: 1px solid #333;
    /* sucez ???? SOUMIS PASSION CACA */
    overflow: hidden; 
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    color: #e0e0e0;
}
.hacker-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.4);
    border-color: var(--accent-color);
}
.hacker-box .title, .has-text-accent {
    color: var(--accent-color) !important;
}
.section-title {
    text-shadow: 0 0 5px var(--glow-color);
}
.hacker-box .image img {
    /* pour les cucks */
    object-fit: cover;
}
@media (hover: none) {
    body::before {
        background-image: none;
        background-color: var(--background-color);
    }
}