@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap');

:root {
    --brand-green: #10B981; /* Modern Green */
    --brand-green-dark: #059669; /* Darker Green for hover */
    --brand-slate-dark: #0F172A;
    --brand-slate-light: #475569; 
    --bg-light: #F8FAFC;
    --brand-blue: #1E40AF; /* Modern Blue (blue-800) */
    --brand-blue-dark: #1E3A8A; /* Darker Blue (blue-900) */
    --text-light: #E2E8F0; /* Light Gray for text (slate-200) */
}

body {
    font-family: 'Outfit', sans-serif;
    background-color: var(--bg-light);
    color: var(--brand-slate-dark);
    padding-top: 0; /* Plus d'espace en haut, le header flotte par-dessus */
}

/* --- MENU MOBILE --- */
#mobile-menu {
    /* Le fond vert est maintenant appliqué directement dans le HTML via Tailwind */
    /* La bordure supérieure n'est plus nécessaire avec le fond vert continu */
}

#mobile-menu a {
    /* Les styles de base sont maintenant gérés par les classes Tailwind dans le HTML */
}

/* Style pour le lien actif dans le menu mobile */
#mobile-menu a.active {
    background-color: white; /* Fond blanc pour se démarquer */
    color: var(--brand-green-dark); /* Texte vert foncé */ 
}

#mobile-menu a.active:hover {
    transform: translateY(-3px); /* Léger soulèvement pour le lien actif mobile au survol */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); /* Ombre pour le lien actif mobile au survol */
}

#mobile-menu a:hover {
    background-color: #f1f5f9; /* slate-100 */
}

/* Animations pour l'apparition au défilement */
.animate-on-scroll {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.animate-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Style pour les onglets de la page membre */
.tab-content {
    display: none;
}
.tab-content.active {
    display: block;
}

/* Style pour le logo pour améliorer la netteté */
.logo-sharp {
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
    backface-visibility: hidden;
    transform: translateZ(0);
}

/* --- FOOTER --- */
footer {
    background-color: var(--brand-slate-dark); /* Bleu Marine Profond (#0F172A) */
    color: #94A3B8; /* Gris clair (slate-400) pour le texte par défaut */
}

footer h3 {
    color: white; /* Titres en blanc */
}

footer a {
    color: #94A3B8; /* Liens en gris clair (slate-400) */
    transition: color 0.3s ease;
}

footer a:hover {
    color: #60A5FA; /* Effet bleu clair au survol (blue-400) */
}

footer .border-t {
    border-color: #334155; /* Ligne de séparation plus sombre (slate-700) */
}