/* --- VARIABLES GLOBALES (À intégrer dans votre fichier principal si nécessaire) --- */
:root {
    --primary: #c21e1e;
    --background: #fcfbfb;
    --surface: #ffffff;
    --border: #e5e1e1;
    --text-main: #000000;
    --text-muted: #4b5563;
    --font-sans: 'Inter', sans-serif;
    --font-serif: 'Playfair Display', serif;
}

html.dark {
    --background: #171111;
    --surface: #261c1c;
    --border: #382929;
    --text-main: #ffffff;
    --text-muted: #94a3b8;
}

/* --- UTILITAIRES DE BASE --- */
.container { 
    max-width: 1280px; 
    margin: 0 auto; 
    padding: 0 1rem; 
}
.fill-1 { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
a { text-decoration: none; color: inherit; }

/* --- CONTENEUR GLOBAL DU FOOTER --- */
.site-footer { 
    border-top: 1px solid var(--border); 
    background-color: #fff; 
    padding: 6rem 0 2rem; 
    transition: background-color 0.2s; 
    font-family: var(--font-sans);
}

html.dark .site-footer { 
    background-color: var(--background); 
}

/* --- GRILLE PRINCIPALE --- */
.footer-grid { 
    display: grid; 
    grid-template-columns: 1fr; 
    gap: 4rem; 
    margin-bottom: 4rem; 
}

.footer-col { 
    display: flex; 
    flex-direction: column; 
    gap: 1.5rem; 
}

/* --- COLONNE LOGO & BRANDING --- */
.footer-brand { 
    display: flex; 
    align-items: center; 
    gap: 0.75rem; 
    color: var(--text-main); 
    font-weight: 900; 
    font-size: 1.5rem; 
    font-family: var(--font-serif); 
}

.footer-brand-desc { 
    color: var(--text-muted); 
    font-weight: 700; 
    font-size: 0.875rem; 
    line-height: 1.625; 
}

/* --- TITRES DES COLONNES (h5) --- */
.footer-col h5 { 
    color: var(--text-main); 
    font-weight: 900; 
    text-transform: uppercase; 
    letter-spacing: 0.1em; 
    font-size: 0.75rem; 
}

/* --- LISTES DE LIENS --- */
.footer-links { 
    list-style: none; 
    display: flex; 
    flex-direction: column; 
    gap: 0.75rem; 
    font-weight: 700; 
    font-size: 0.875rem; 
    color: var(--text-muted); 
}

.footer-links a:hover { 
    color: var(--primary); 
}

.footer-links .active { 
    color: var(--primary); 
}

/* --- ZONE COORDONNÉES DE CONTACT --- */
.footer-contact-text { 
    font-weight: 700; 
    font-size: 0.875rem; 
    color: var(--text-muted); 
    line-height: 2; 
}

.footer-contact-text a { 
    color: var(--text-main); 
    font-weight: 700; 
    transition: color 0.2s; 
}

.footer-contact-text a:hover { 
    color: var(--primary); 
}

/* --- BANDEAU INFÉRIEUR (Mentions / Copyright) --- */
.footer-bottom { 
    padding-top: 2.5rem; 
    border-top: 1px solid #f1f5f9; 
    text-align: center; 
    font-size: 10px; 
    color: #94a3b8; 
    font-weight: 700; 
    text-transform: uppercase; 
    letter-spacing: 0.1em; 
}

html.dark .footer-bottom { 
    border-top: 1px solid #334155; 
}

/* --- MEDIA QUERIES RESPONSIVES --- */
@media (min-width: 768px) {
    .footer-grid { 
        grid-template-columns: repeat(2, 1fr); 
    }
}

@media (min-width: 1024px) {
    .container { 
        padding: 0 2rem; 
    }
    .footer-grid { 
        grid-template-columns: repeat(4, 1fr); 
        gap: 4rem; 
    }
}