/* =========================================
   FOOTER
   ========================================= */
footer {
    margin-top: auto !important;
    position: relative;
    z-index: 1; /* Réduit pour laisser la modale passer au-dessus */
}

#main-footer.site-footer {
    width: 100%;
    background-color: #0d0e15;
    z-index: 1;
    font-family: 'Inter', 'Poppins', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: #a0a0b5;
    position: relative;
    overflow: hidden;          /* ← CORRIGÉ : remplace visible/clip par hidden */
    box-shadow: 0 -50px 100px -50px rgba(0, 0, 0, 0.9);
    margin-top: 40px;
}


/* Lueur ancrée en bas au centre, qui déborde vers le haut */
#main-footer .footer-glow {
    position: absolute;
    bottom: -600px;
    left: 50%;
    transform: translateX(-50%);
    width: 1100px;
    height: 1100px;
    border-radius: 50%;
    background: radial-gradient(
        circle,
        rgba(138, 43, 226, 0.25) 0%,
        transparent 70%
    );
    pointer-events: none;
    z-index: -1;
    /* Ajoute ceci pour éviter tout débordement calculé */
    max-width: none;          
}

#main-footer .footer-container {
    padding:            80px 40px 50px;
    max-width:          1400px;
    margin:             0 auto;
    position:           relative;
    z-index:            1;
}

/* =========================================
   COLONNES DU PIED DE PAGE
   ========================================= */

#main-footer .footer-columns-section {
    display:            flex;
    justify-content:    space-between;
    align-items:        flex-start;
    gap:                40px;
    margin-bottom:      40px;
}

#main-footer .footer-column {
    display:            flex;
    flex-direction:     column;
    gap:                15px;
    width:              25%;
}

#main-footer .company-column {
    gap:                20px;
    width:              35%;
}

#main-footer .logo-link {
    display:            flex;
    align-items:        center;
    text-decoration:    none;
}

#main-footer .logo-icon {
    height:             28px;
    width:              auto;
}

#main-footer .company-description {
    font-size:          0.9rem;
    line-height:        1.6;
    max-width:          450px;
}

#main-footer .footer-text-muted {
    font-size:          0.95rem;
    color:              #6c6c80;
    margin:             0;
}

#main-footer .social-media-section {
    margin-top:         10px;
}

#main-footer .social-icons {
    display:            flex;
    align-items:        center;
    gap:                15px;
}

#main-footer .social-icon {
    display:            flex;
    align-items:        center;
    justify-content:    center;
    width:              40px;
    height:             40px;
    border-radius:      50%;
    border:             1px solid rgba(255, 255, 255, 0.1);
    background:         rgba(255, 255, 255, 0.05);
    color:              #ffffff;
    transition:         all 0.3s ease;
}

#main-footer .social-icon:hover {
    background:         rgba(138, 43, 226, 0.2);
    border:             1px solid rgba(138, 43, 226, 0.5);
    box-shadow:         0 0 10px rgba(138, 43, 226, 0.3);
}

#main-footer .social-icon svg {
    width:              20px;
    height:             20px;
}

#main-footer .column-title {
    color:              #ffffff;
    font-size:          1rem;
    font-weight:        700;
    margin-bottom:      10px;
    text-transform:     uppercase;
    letter-spacing:     0.5px;
}

#main-footer .footer-link-list {
    list-style:         none;
    margin:             0;
    padding:            0;
}

#main-footer .footer-link-list li {
    margin-bottom:      10px;
}

#main-footer .footer-link {
    text-decoration:    none;
    color:              #a0a0b5;
    font-size:          0.95rem;
    transition:         color 0.3s ease;
}

#main-footer .footer-link:hover {
    color:              #ffffff;
    text-shadow:        0 0 8px rgba(138, 43, 226, 0.5);
}

/* =========================================
   SÉPARATEUR NÉON
   ========================================= */

#main-footer .neon-mobile-separator {
    width:              100%;
    height:             1px;
    position:           relative;
    overflow:           hidden;
    margin:             30px 0;
    background-color:   rgba(138, 43, 226, 0.4);
    box-shadow:         0 0 8px rgba(138, 43, 226, 0.3);
}

#main-footer .neon-mobile-separator .neon-light {
    position:           absolute;
    top:                0;
    left:               -100px;
    width:              100px;
    height:             100%;
    background:         linear-gradient(
                            90deg,
                            transparent 0%,
                            rgba(255, 255, 255, 0.8) 50%,
                            transparent 100%
                        );
    box-shadow:         0 0 15px rgba(138, 43, 226, 1),
                        0 0 5px rgba(255, 255, 255, 0.8);
    animation:          neon-mobile-slide 8s linear infinite;
    border-radius: 20px;
}

@keyframes neon-mobile-slide {
    0%   { left: -100px; }
    100% { left: 100%; }
}

/* =========================================
   PIED DE PAGE INFÉRIEUR (Copyright & Légal)
   ========================================= */

#main-footer .footer-bottom-section {
    display:            flex;
    justify-content:    space-between;
    align-items:        center;
    width:              100%;
}

#main-footer .copyright-text {
    font-size:          0.85rem;
    color:              #a0a0b5;
    margin:             0;
}

#main-footer .legal-container {
    display:            flex;
    align-items:        center;
    gap:                15px;
}

#main-footer .legal-link {
    font-size:          0.85rem;
}

#main-footer .legal-separator {
    color:              #a0a0b5;
    font-size:          0.85rem;
}

/* =========================================
   RESPONSIVE (Mobile)
   ========================================= */

@media (max-width: 992px) {

    #main-footer .footer-glow {
        width:          500px;
        height:         500px;
        bottom:         -150px;
    }

    #main-footer .footer-container {
        padding:        60px 20px 40px;
    }

    #main-footer .footer-columns-section {
        flex-direction: column;
        align-items:    center;
        text-align:     center;
        gap:            50px;
    }

    #main-footer .footer-column,
    #main-footer .company-column {
        width:          100%;
        align-items:    center;
    }

    #main-footer .company-description {
        max-width:      100%;
    }

    #main-footer .footer-bottom-section {
        flex-direction: column;
        gap:            15px;
        text-align:     center;
    }
}