/**
 * Surcharges thème clair pour les pages secondaires
 * (elles conservent encore du CSS inline historique dark)
 */
body {
    background-color: var(--bg, #F6F7F9) !important;
    color: var(--text, #12141A) !important;
    font-family: var(--font-body, "Outfit", sans-serif) !important;
}

h1, h2, h3, h4,
.section-title,
.btn,
.nav-item {
    font-family: var(--font-display, "Syne", sans-serif) !important;
    text-transform: none !important;
}

/* Masquer l’ancien header/menu s’il reste en doublon avant injection */
body > header:not(.site-header),
body > .mobile-menu:not(#mobileMenu) {
    display: none !important;
}

/* Burger + menu mobile : ignorer les CSS inline legacy (display:none) */
.site-header .menu-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    color: var(--text, #12141A) !important;
    font-size: 1.6rem !important;
    cursor: pointer !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 1003 !important;
}

@media (min-width: 960px) {
    .site-header .menu-toggle {
        display: none !important;
    }
}

#mobileMenu.mobile-menu {
    display: flex !important;
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 1001 !important;
    background: var(--bg, #F6F7F9) !important;
    padding: calc(var(--header-h, 72px) + 24px) 24px 40px !important;
    flex-direction: column !important;
    gap: 8px !important;
    transform: none !important;
    border: none !important;
    color: var(--text, #12141A) !important;
}

#mobileMenu.mobile-menu[hidden] {
    display: none !important;
}

#mobileMenu.mobile-menu:not(.is-open):not(.active) {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

#mobileMenu.mobile-menu.is-open,
#mobileMenu.mobile-menu.active {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
}

#mobileMenu .nav-link,
#mobileMenu .mobile-accordion-btn,
#mobileMenu a {
    color: var(--text, #12141A) !important;
}

body.nav-open .site-header .menu-toggle {
    display: flex !important;
    color: var(--text, #12141A) !important;
}

.section,
.page-content,
main {
    background: transparent;
}

.section-title,
.hero-title,
h1, h2 {
    color: var(--text, #12141A) !important;
}

p, .hero-desc, .section-subtitle, .text-muted {
    color: var(--text-muted, #5A606C) !important;
}

.card,
.service-card,
.portfolio-card,
.testi-card,
.reason-card,
.value-card,
.team-member,
.news-card,
.event-card {
    background: var(--bg-elevated, #fff) !important;
    border-color: var(--border, #E2E5EB) !important;
    color: var(--text, #12141A) !important;
}

.btn:not(.btn-primary):not(.btn-on-dark):not(.btn-secondary):not(.btn-on-dark-outline):not(.btn-ghost) {
    background: var(--primary, #FDC02A) !important;
    color: #12141A !important;
    border: none !important;
    border-radius: 999px !important;
}

footer:not(.site-footer) {
    display: none !important;
}

/* Espacer le contenu sous le header fixe */
body > .hero,
body > .page-hero,
body > section:first-of-type,
body > .banner,
body > .page-banner,
body > main,
body > .content-wrapper {
    margin-top: 0;
}

.form-control,
.contact-form input,
.contact-form textarea,
.contact-form select,
input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
    background: #F6F7F9 !important;
    border: 1px solid #E2E5EB !important;
    color: #12141A !important;
    border-radius: 10px !important;
}

.form-control:focus,
.contact-form input:focus,
.contact-form textarea:focus {
    border-color: var(--primary, #FDC02A) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(253, 192, 42, 0.2) !important;
}

.form-label,
label {
    color: #12141A !important;
    text-transform: none !important;
}

.contact-form,
.form-card,
.info-card {
    background: #fff !important;
    border: 1px solid #E2E5EB !important;
    color: #12141A !important;
}


/* Anciens page-hero : compact + lisibilité */
.page-hero {
    min-height: 0 !important;
    padding: calc(var(--header-h, 72px) + 32px) 5% 32px !important;
    margin-bottom: 0 !important;
    background-attachment: scroll !important;
}

.page-hero .page-hero-content {
    max-width: 640px;
    margin-inline: auto;
}

.page-hero .page-title,
.page-hero h1 {
    color: #fff !important;
    font-size: clamp(1.65rem, 4vw, 2.4rem) !important;
    margin: 10px 0 12px !important;
    line-height: 1.15 !important;
}

.page-hero .page-subtitle,
.page-hero .breadcrumb,
.page-hero .breadcrumb a {
    color: rgba(255, 255, 255, 0.85) !important;
}

.page-hero .page-subtitle {
    font-size: clamp(0.92rem, 2vw, 1.05rem) !important;
    margin: 0 auto !important;
    max-width: 520px !important;
    line-height: 1.55 !important;
}

.page-hero .breadcrumb .current {
    color: var(--primary, #FDC02A) !important;
}

.page-hero + .filters,
.page-hero + .section,
.page-hero + .container {
    margin-top: 24px !important;
}

/* Pop-ups légaux : forcer le style unifié (écrase le CSS inline dark des pages secondaires) */
.legal-modal-overlay {
    background: rgba(18, 20, 26, 0.55) !important;
    backdrop-filter: blur(8px) !important;
    z-index: 10000 !important;
    font-family: var(--font-body, "Outfit", sans-serif) !important;
}

.legal-modal-content {
    background: #FFFFFF !important;
    border: 1px solid #E2E5EB !important;
    border-radius: 20px !important;
    color: #12141A !important;
    box-shadow: 0 24px 64px rgba(18, 20, 26, 0.18) !important;
    padding: 0 !important;
}

.legal-modal-close {
    background: #F6F7F9 !important;
    border: 1px solid #E2E5EB !important;
    color: #12141A !important;
}

.legal-modal-close:hover {
    background: var(--primary, #FDC02A) !important;
    color: #12141A !important;
}

.legal-modal-content h2,
.legal-modal-content h3 {
    font-family: var(--font-display, "Syne", sans-serif) !important;
    color: #12141A !important;
    text-transform: none !important;
}

.legal-modal-content p,
.legal-content-text {
    font-family: var(--font-body, "Outfit", sans-serif) !important;
    color: #5A606C !important;
}