/* ============================================================
 * MODERNISATION V2 - Selecteurs reels du theme materialize
 * Charge APRES custom.css pour avoir la priorite max
 * ============================================================ */

:root {
    --c-primary: #03a9f4;
    --c-primary-dark: #0288d1;
    --c-primary-light: #e1f5fe;
    --c-text: #1a1a1a;
    --c-text-muted: #6b7280;
    --c-bg: #ffffff;
    --c-bg-soft: #f8fafc;
    --c-border: #e5e7eb;
    --c-shadow-sm: 0 1px 2px 0 rgba(0,0,0,0.05);
    --c-shadow: 0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -1px rgba(0,0,0,0.04);
    --c-shadow-lg: 0 20px 25px -5px rgba(0,0,0,0.08), 0 10px 10px -5px rgba(0,0,0,0.02);
    --c-shadow-xl: 0 25px 50px -12px rgba(3,169,244,0.18);
    --c-ease: cubic-bezier(0.16, 1, 0.3, 1);
    --c-radius: 16px;
}

/* --- INTER en force partout (bat Roboto du theme parent) --- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300..800&display=swap');

html, body,
body *:not(.material-icons):not([class*="fa-"]):not([class*="flaticon"]) {
    font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif !important;
}

/* Smoothing global */
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; scroll-behavior: smooth; }

/* --- TITRES fluides et plus impactants --- */
h1 { font-size: clamp(3rem, 6vw + 1rem, 5.5rem) !important; line-height: 1.05 !important; letter-spacing: -0.03em !important; font-weight: 800 !important; }
h2,
h2.wp-block-heading,
.page-title h1 { font-size: clamp(2.5rem, 4vw + 1rem, 4rem) !important; letter-spacing: -0.02em !important; font-weight: 800 !important; line-height: 1.15 !important; margin-bottom: 2.5rem !important; }
h3,
h3.wp-block-heading { font-size: clamp(1.875rem, 2.5vw + 0.5rem, 2.625rem) !important; letter-spacing: -0.01em !important; font-weight: 700 !important; line-height: 1.25 !important; margin-bottom: 1.25rem !important; }
h4 { font-size: clamp(1.5rem, 1.5vw + 0.5rem, 1.875rem) !important; font-weight: 700 !important; margin-bottom: 1rem !important; }
p, li { font-size: clamp(1.125rem, 0.5vw + 1rem, 1.375rem) !important; line-height: 1.7 !important; color: #374151; }

/* --- HEADER fixe avec GLASSMORPHISM des le chargement --- */
.header-wrapper.navbar-fixed-top {
    transition: all 0.4s var(--c-ease) !important;
    background: rgba(255,255,255,0.85) !important;
    backdrop-filter: saturate(180%) blur(14px);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    box-shadow: 0 1px 0 rgba(0,0,0,0.04), 0 8px 24px -8px rgba(0,0,0,0.08) !important;
    border-bottom: 1px solid rgba(255,255,255,0.3);
}
.header-wrapper.navbar-fixed-top.is-scrolled {
    background: rgba(255,255,255,0.95) !important;
    box-shadow: 0 1px 0 rgba(0,0,0,0.06), 0 10px 30px -10px rgba(0,0,0,0.12) !important;
}

/* --- MENU LINKS avec underline animee --- */
.main-menu .menu-item > a,
.menu.nav.navbar-nav > li > a {
    position: relative;
    transition: color 0.25s var(--c-ease) !important;
    font-weight: 500 !important;
}
.main-menu .menu-item > a::after,
.menu.nav.navbar-nav > li > a::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 6px;
    width: 0;
    height: 2px;
    background: var(--c-primary);
    border-radius: 2px;
    transition: width 0.3s var(--c-ease), left 0.3s var(--c-ease);
}
.main-menu .menu-item:hover > a::after,
.main-menu .menu-item.current-menu-item > a::after,
.menu.nav.navbar-nav > li:hover > a::after {
    width: calc(100% - 24px);
    left: 12px;
}

/* --- HERO / PAGE TITLE plus moderne --- */
.page-title {
    min-height: clamp(280px, 35vh, 420px) !important;
    display: flex !important;
    align-items: center !important;
    position: relative;
}
.page-title::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(3,169,244,0.25) 0%, rgba(0,0,0,0.4) 60%, rgba(0,0,0,0.6) 100%);
    z-index: 1;
}
.page-title .title-overlay-color { background: transparent !important; }
.page-title .container { position: relative; z-index: 2; }
.page-title h1 {
    color: #fff !important;
    text-shadow: 0 2px 24px rgba(0,0,0,0.3);
}

/* --- STATS : transformer les nombres en gradient anime --- */
div[style*="font-size:42px"][style*="font-weight:bold"] {
    font-size: clamp(2.5rem, 5vw, 4rem) !important;
    background: linear-gradient(135deg, var(--c-primary) 0%, var(--c-primary-dark) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: -0.04em;
    margin-bottom: 8px;
}

/* Conteneurs de stats : leur donner du peps */
div[style*="display:flex"][style*="justify-content:space-between"][style*="flex-wrap:wrap"] > div[style*="flex:1"] {
    padding: 24px 16px !important;
    background: var(--c-bg-soft);
    border-radius: var(--c-radius);
    border: 1px solid var(--c-border);
    transition: all 0.4s var(--c-ease);
}
div[style*="display:flex"][style*="justify-content:space-between"][style*="flex-wrap:wrap"] > div[style*="flex:1"]:hover {
    transform: translateY(-4px);
    box-shadow: var(--c-shadow-lg);
    border-color: var(--c-primary);
}

/* --- LISTES (Nos valeurs) avec puces modernes bleues --- */
.entry-content ul,
.page-content ul,
.wp-block-list {
    list-style: none !important;
    padding-left: 0 !important;
}
.entry-content ul > li,
.page-content ul > li,
.wp-block-list > li {
    position: relative;
    padding-left: 1.75rem !important;
    margin-bottom: 0.75rem !important;
}
.entry-content ul > li::before,
.page-content ul > li::before,
.wp-block-list > li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.6em;
    width: 8px;
    height: 8px;
    background: linear-gradient(135deg, var(--c-primary), var(--c-primary-dark));
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(3,169,244,0.15);
}

/* --- BOUTONS plus modernes et impactants --- */
.btn,
.btn-large,
.wp-block-button__link {
    border-radius: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    padding: 12px 28px !important;
    text-transform: none !important;
    box-shadow: 0 4px 14px 0 rgba(3,169,244,0.25) !important;
    transition: all 0.3s var(--c-ease) !important;
    position: relative;
    overflow: hidden;
}
.btn:hover,
.btn-large:hover,
.wp-block-button__link:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 24px 0 rgba(3,169,244,0.35) !important;
}
.btn::after,
.btn-large::after,
.wp-block-button__link::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
    transform: translateX(-100%);
    transition: transform 0.6s var(--c-ease);
}
.btn:hover::after,
.btn-large:hover::after,
.wp-block-button__link:hover::after {
    transform: translateX(100%);
}

/* --- IMAGES dans le contenu : radius + ombre + zoom au hover --- */
.wp-block-image {
    overflow: hidden !important;
    border-radius: var(--c-radius) !important;
    box-shadow: var(--c-shadow) !important;
}
.wp-block-image img {
    transition: transform 0.6s var(--c-ease) !important;
    display: block;
    width: 100%;
    height: auto;
}
.wp-block-image:hover img {
    transform: scale(1.04);
}

/* --- SECTIONS : espacement aere --- */
section.section,
.section-padding {
    padding-top: clamp(3rem, 6vw, 6rem) !important;
    padding-bottom: clamp(3rem, 6vw, 6rem) !important;
}

/* --- CONTAINERS plus larges et confortables --- */
.entry-content,
.page-content {
    max-width: 1100px;
    margin: 0 auto;
}

/* --- LOGOS DE MARQUE : grid moderne avec hover --- */
.entry-content a img,
.page-content figure {
    transition: all 0.3s var(--c-ease);
}

/* --- SCROLLBAR custom --- */
* { scrollbar-width: thin; scrollbar-color: var(--c-primary) #f1f5f9; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: #f1f5f9; }
*::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--c-primary), var(--c-primary-dark));
    border-radius: 10px;
    border: 2px solid #f1f5f9;
}

/* --- SELECTION TEXTE --- */
::selection { background: var(--c-primary); color: #fff; }

/* --- FOCUS ACCESSIBLE --- */
*:focus-visible {
    outline: 2px solid var(--c-primary);
    outline-offset: 3px;
    border-radius: 4px;
}

/* --- VIEW TRANSITIONS entre pages --- */
@view-transition { navigation: auto; }
::view-transition-old(root) {
    animation: 250ms cubic-bezier(0.4,0,0.2,1) both c-fade-out;
}
::view-transition-new(root) {
    animation: 400ms var(--c-ease) both c-fade-in;
}
@keyframes c-fade-out {
    to { opacity: 0; transform: translateY(-12px); }
}
@keyframes c-fade-in {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* --- ANIMATIONS AU SCROLL (CSS pur, fallback automatique)
   Limitee aux IMAGES et CARDS pour eviter le fantome de chevauchement
   sur les titres avec parallax/bg fixe --- */
@supports (animation-timeline: view()) {
    .wp-block-image,
    .cotrans-job-card,
    div[style*="display:flex"][style*="justify-content:space-between"] > div[style*="flex:1"] {
        animation: c-fade-up linear both;
        animation-timeline: view();
        animation-range: entry 0% cover 30%;
    }
    @keyframes c-fade-up {
        from { opacity: 0; transform: translateY(40px) scale(0.97); }
        to   { opacity: 1; transform: translateY(0) scale(1); }
    }
}

/* --- INPUTS modernes --- */
input[type=text], input[type=email], input[type=tel], input[type=number],
input[type=password], input[type=search], textarea {
    border-radius: 8px !important;
    border: 1px solid var(--c-border) !important;
    padding: 12px 16px !important;
    transition: all 0.2s var(--c-ease) !important;
    background: var(--c-bg) !important;
}
input[type=text]:focus, input[type=email]:focus, input[type=tel]:focus,
input[type=number]:focus, input[type=password]:focus, input[type=search]:focus,
textarea:focus {
    border-color: var(--c-primary) !important;
    box-shadow: 0 0 0 3px rgba(3,169,244,0.15) !important;
    outline: none !important;
}

/* --- FOOTER : style plus modere --- */
.footer-two-wrapper {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
}

/* --- BACK TO TOP : bouton plus moderne --- */
.back-top {
    background: var(--c-primary) !important;
    color: #fff !important;
    box-shadow: 0 8px 24px -4px rgba(3,169,244,0.5) !important;
    width: 48px !important;
    height: 48px !important;
}
.back-top:hover {
    background: var(--c-primary-dark) !important;
    transform: translateY(-4px);
}

/* --- LIENS texte dans le contenu : sous-ligne animee --- */
.entry-content p > a,
.page-content p > a {
    color: var(--c-primary) !important;
    text-decoration: none !important;
    background-image: linear-gradient(90deg, var(--c-primary), var(--c-primary));
    background-size: 100% 1px;
    background-position: 0 100%;
    background-repeat: no-repeat;
    transition: all 0.3s var(--c-ease);
}
.entry-content p > a:hover,
.page-content p > a:hover {
    color: var(--c-primary-dark) !important;
    background-size: 100% 2px;
}

/* --- RESPECT prefers-reduced-motion --- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ============================================================
 * FIXES UTILISATEUR (27 mai 2026)
 * ============================================================ */

/* FIX 1 + 5 : Header transparent par defaut, glassmorphism uniquement au scroll
   (s'applique a TOUTES les pages, pas seulement l'accueil) */
.header-wrapper.navbar-fixed-top {
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border-bottom: none !important;
    transition: all 0.4s var(--c-ease) !important;
}
.header-wrapper.navbar-fixed-top.is-scrolled {
    background: rgba(255,255,255,0.85) !important;
    -webkit-backdrop-filter: saturate(180%) blur(14px) !important;
    backdrop-filter: saturate(180%) blur(14px) !important;
    box-shadow: 0 1px 0 rgba(0,0,0,0.04), 0 8px 24px -8px rgba(0,0,0,0.08) !important;
    border-bottom: 1px solid rgba(255,255,255,0.3) !important;
}

/* FIX 2 : Pas de fond blanc sur le 1er niveau du menu au hover.
   Le sous-menu garde son fond pour rester lisible. */
.main-menu > ul > li > a:hover,
.main-menu .menu-item-depth-0 > a:hover,
.menu.nav.navbar-nav > li > a:hover,
.menu.nav.navbar-nav > li:hover > a {
    background: transparent !important;
    background-color: transparent !important;
}

/* FIX 3 : Restaurer un footer compact (j'avais ajoute trop de padding) */
.footer-two-wrapper {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
}

/* FIX 4 : Titre du hero des pages interieures plus gros + breadcrumb plus visible */
.page-title h1,
.page-title .title-content h1 {
    font-size: clamp(2.5rem, 6vw + 1rem, 5rem) !important;
    font-weight: 800 !important;
    letter-spacing: -0.03em !important;
    line-height: 1.05 !important;
}
.page-title .breadcrumb,
.page-title nav,
.page-title .breadcrumbs,
.page-title ul.breadcrumb {
    font-size: clamp(0.95rem, 0.5vw + 0.85rem, 1.125rem) !important;
    font-weight: 500 !important;
    margin-top: 12px !important;
}
.page-title .breadcrumb a,
.page-title nav a {
    color: rgba(255,255,255,0.95) !important;
}

/* FIX 6 : Permettre d'enlever le cadre (radius + ombre) sur une image precise.
   Ajouter "no-frame" dans "Avance > Classe CSS additionnelle" du bloc image. */
.wp-block-image:not(.no-frame) {
    overflow: hidden;
    border-radius: var(--c-radius);
    box-shadow: var(--c-shadow);
}
.wp-block-image.no-frame {
    overflow: visible !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}
.wp-block-image.no-frame img {
    border-radius: 0 !important;
}

/* ============================================================
 * FIXES V2 (apres inspection DOM)
 * ============================================================ */

/* FIX 3 : Le titre du hero (h1 dans le child theme, h2 dans le parent par fallback) */
.page-title h1,
.page-title h2,
.page-title .container > h1,
.page-title .container > h2 {
    font-size: clamp(2.5rem, 6vw + 1rem, 5rem) !important;
    font-weight: 800 !important;
    letter-spacing: -0.03em !important;
    line-height: 1.05 !important;
    color: #fff !important;
    text-shadow: 0 2px 24px rgba(0,0,0,0.35);
    margin: 0 !important;
}

/* FIX 3 : Breadcrumb .tt-breadcrumb (la vraie classe) */
.page-title .tt-breadcrumb,
.tt-breadcrumb ul.breadcrumb {
    font-size: clamp(0.95rem, 0.5vw + 0.85rem, 1.125rem) !important;
    font-weight: 500 !important;
    margin-top: 16px !important;
    list-style: none !important;
}
.tt-breadcrumb ul.breadcrumb li {
    display: inline-block !important;
    padding-left: 0 !important;
}
.tt-breadcrumb ul.breadcrumb li::before {
    display: none !important;
}
.tt-breadcrumb ul.breadcrumb li + li::before {
    content: '/' !important;
    display: inline-block !important;
    margin: 0 8px;
    color: rgba(255,255,255,0.6) !important;
    background: none !important;
    width: auto !important;
    height: auto !important;
    box-shadow: none !important;
    position: static !important;
}
.tt-breadcrumb ul.breadcrumb a,
.tt-breadcrumb ul.breadcrumb li {
    color: rgba(255,255,255,0.95) !important;
}
.tt-breadcrumb ul.breadcrumb a:hover {
    color: #fff !important;
}

/* FIX 3 : Restaurer l'overlay assombri du hero (j'avais mis transparent) */
.page-title .title-overlay-color {
    background: linear-gradient(135deg, rgba(3,169,244,0.25) 0%, rgba(0,0,0,0.45) 60%, rgba(0,0,0,0.65) 100%) !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
}
.page-title::before { display: none !important; } /* on supprime le double overlay */
.page-title { position: relative; }
.page-title > .container { position: relative; z-index: 2; }

/* FIX 4 : Le back-to-top et boutons floating ne doivent PAS heriter de mes styles boutons */
.btn-floating,
.back-top,
a.tt-scroll.back-top {
    border-radius: 50% !important;
    padding: 0 !important;
    width: 48px !important;
    height: 48px !important;
    box-shadow: 0 8px 24px -4px rgba(0,0,0,0.25) !important;
    animation: none !important;
    background: var(--c-primary) !important;
    color: #fff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.btn-floating::after,
.back-top::after,
.btn-floating::before,
.back-top::before {
    display: none !important;
}
.btn-floating:hover,
.back-top:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 32px -4px rgba(3,169,244,0.5) !important;
    background: var(--c-primary-dark) !important;
}

/* Pas d'animation breathe sur boutons round/floating */
.btn-floating, .back-top {
    animation: none !important;
}

/* FIX 4 : Footer compact + structure preservee */
.footer-section.footer-two-wrapper {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.footer-section .footer-logo-wrapper {
    padding: 3rem 0 1rem 0 !important;
    position: relative;
}
.footer-section .footer-copyright {
    padding: 1rem 0 2rem 0 !important;
}
.footer-section .footer-copyright hr {
    border: none !important;
    border-top: 1px solid rgba(255,255,255,0.15) !important;
    margin: 0 0 1.5rem 0 !important;
}
.footer-section .copyright,
.footer-section .copyright a {
    color: rgba(255,255,255,0.75) !important;
    font-size: 0.9rem !important;
}
.footer-section .copyright a:hover {
    color: var(--c-primary) !important;
}
.footer-section .social-links-wrap a {
    color: rgba(255,255,255,0.75) !important;
    font-size: 1.25rem !important;
    transition: color 0.2s var(--c-ease);
}
.footer-section .social-links-wrap a:hover {
    color: var(--c-primary) !important;
}
.footer-section .footer-logo img {
    max-width: 200px;
    height: auto;
}

/* Le back-top dans le footer : bien positionne */
.footer-logo-wrapper .back-top {
    position: absolute;
    top: -24px;
    left: 50%;
    transform: translateX(-50%);
}
.footer-logo-wrapper .back-top:hover {
    transform: translateX(-50%) translateY(-4px) !important;
}

/* ============================================================
 * FIXES V3
 * ============================================================ */

/* Glassmorphism : selectors plus larges et plus specifiques pour battre le theme parent sur toutes les pages */
body .header-wrapper.navbar-fixed-top.is-scrolled,
body nav.navbar.is-scrolled,
body .header-wrapper.is-scrolled,
.header-wrapper.is-scrolled nav.navbar {
    background: rgba(255,255,255,0.85) !important;
    background-color: rgba(255,255,255,0.85) !important;
    -webkit-backdrop-filter: saturate(180%) blur(14px) !important;
    backdrop-filter: saturate(180%) blur(14px) !important;
    box-shadow: 0 1px 0 rgba(0,0,0,0.04), 0 8px 24px -8px rgba(0,0,0,0.08) !important;
    border-bottom: 1px solid rgba(255,255,255,0.3) !important;
    transition: all 0.4s var(--c-ease) !important;
}

/* Quand non scrolle : transparence forcee, partout */
body .header-wrapper.navbar-fixed-top:not(.is-scrolled),
body nav.navbar:not(.is-scrolled),
body .header-wrapper:not(.is-scrolled) nav.navbar {
    background: transparent !important;
    background-color: transparent !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    box-shadow: none !important;
    border-bottom: none !important;
}

/* Footer : police plus grande */
.footer-section .copyright,
.footer-section .copyright a,
.footer-section .copyright span {
    font-size: 1rem !important;
    line-height: 1.6 !important;
}
.footer-section .social-links-wrap a {
    font-size: 1.5rem !important;
}

/* Espace entre le bouton back-top et le logo COTRANS */
.footer-section .footer-logo-wrapper {
    padding-top: 5rem !important;
}
.footer-section .footer-logo-wrapper .back-top {
    top: -28px !important;
}
.footer-section .footer-logo img {
    max-width: 220px;
    margin-top: 0.5rem;
}

/* ============================================================
 * FIX V4 : Glassmorphism final
 * Le theme parent applique #fff a .navbar-default. On l'ecrase
 * en mettant le nav interne TRANSPARENT et le wrapper externe
 * en glassmorphisme. Specificite max via html body.
 * ============================================================ */

/* Le nav interne (.navbar.navbar-default) est TOUJOURS transparent
   (sinon il bloque l'effet du wrapper externe) */
html body .header-wrapper .navbar,
html body .header-wrapper .navbar-default,
html body nav.navbar.navbar-default {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Le wrapper externe : transparent au top, glassmorphism au scroll */
html body .header-wrapper.navbar-fixed-top {
    background: transparent !important;
    background-color: transparent !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    box-shadow: none !important;
    border-bottom: none !important;
    transition: all 0.4s var(--c-ease) !important;
}

html body .header-wrapper.navbar-fixed-top.is-scrolled {
    background: rgba(255,255,255,0.75) !important;
    background-color: rgba(255,255,255,0.75) !important;
    -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
    backdrop-filter: saturate(180%) blur(20px) !important;
    box-shadow: 0 1px 0 rgba(0,0,0,0.04), 0 8px 24px -8px rgba(0,0,0,0.08) !important;
    border-bottom: 1px solid rgba(255,255,255,0.3) !important;
}

/* ============================================================
 * FIX V5 : Glassmorphism sur .navbar-default (qui a son propre stacking context)
 * Le backdrop-filter sur .header-wrapper ne fonctionnait pas correctement.
 * .navbar-default a position:relative + z-index:10000 => contexte de pile garanti.
 * ============================================================ */

/* Annule les transparences agressives precedentes sur le nav */
html body .header-wrapper.navbar-fixed-top .navbar.navbar-default {
    background: transparent !important;
    background-color: transparent !important;
    transition: background-color 0.4s var(--c-ease), backdrop-filter 0.4s var(--c-ease), box-shadow 0.4s var(--c-ease) !important;
    isolation: isolate;
}

/* AU SCROLL : glassmorphism direct sur le nav (qui a deja un stacking context) */
html body .header-wrapper.navbar-fixed-top.is-scrolled .navbar.navbar-default,
html body .header-wrapper.is-scrolled nav.navbar.navbar-default {
    background: rgba(255,255,255,0.7) !important;
    background-color: rgba(255,255,255,0.7) !important;
    -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
    backdrop-filter: saturate(180%) blur(20px) !important;
    box-shadow: 0 1px 0 rgba(0,0,0,0.04), 0 8px 24px -8px rgba(0,0,0,0.08) !important;
    border-bottom: 1px solid rgba(255,255,255,0.4) !important;
}

/* On retire le glassmorphism du wrapper externe (ne marchait pas) */
html body .header-wrapper.navbar-fixed-top.is-scrolled {
    background: transparent !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    box-shadow: none !important;
    border-bottom: none !important;
}

/* ============================================================
 * FIX V6 : Annule le fond blanc au hover sur les li du menu top-level
 * Le theme parent applique : #home.home .header-wrapper.navbar-fixed-top
 * .navbar-default li:hover { background-color: #FFF; }
 * On ecrase avec specificite egale + !important
 * ============================================================ */

#home.home .header-wrapper.navbar-fixed-top .navbar-default li:hover,
body.home .header-wrapper.navbar-fixed-top .navbar-default li:hover,
body .header-wrapper.navbar-fixed-top .navbar-default > .container li:hover,
body .header-wrapper .navbar-default ul.menu > li:hover,
body .header-wrapper .navbar-default .main-menu > ul > li:hover {
    background: transparent !important;
    background-color: transparent !important;
}

/* On garde le hover pour les sous-menus (dropdown-content) qui en ont besoin */
body .header-wrapper .navbar-default .dropdown-content li:hover {
    background-color: var(--c-primary-light) !important;
}

/* ============================================================
 * FIX V8 : Le V7 colorait TOUS les liens du menu en blanc,
 * meme ceux des sous-menus deroulants. On restreint au 1er niveau via >
 * ============================================================ */

/* Annule la coloration blanche aggressive du V7 */
html body .header-wrapper.navbar-fixed-top:not(.is-scrolled) .main-menu a,
html body .header-wrapper.navbar-fixed-top:not(.is-scrolled) .menu.nav a,
html body .header-wrapper.navbar-fixed-top:not(.is-scrolled) .menu.nav > li > a,
html body .header-wrapper.navbar-fixed-top:not(.is-scrolled) .main-menu .menu-item > a,
html body .header-wrapper.navbar-fixed-top:not(.is-scrolled) .navbar-default li > a {
    color: inherit;
    text-shadow: none;
}

/* DEFAULT : liens TOP LEVEL toujours sombres, sans shadow, partout sauf home top */
html body .header-wrapper.navbar-fixed-top .menu.nav.navbar-nav > li > a,
html body .header-wrapper.navbar-fixed-top .main-menu > ul > li > a,
html body .header-wrapper.navbar-fixed-top ul.menu > li > a {
    color: var(--c-text) !important;
    text-shadow: none !important;
    transition: color 0.3s var(--c-ease), text-shadow 0.3s var(--c-ease) !important;
}

/* UNIQUEMENT sur la HOME au TOP : liens TOP LEVEL blancs + shadow (lisibles sur hero) */
html body.home .header-wrapper.navbar-fixed-top:not(.is-scrolled) .menu.nav.navbar-nav > li > a,
html body.home .header-wrapper.navbar-fixed-top:not(.is-scrolled) .main-menu > ul > li > a,
html body.home .header-wrapper.navbar-fixed-top:not(.is-scrolled) ul.menu > li > a {
    color: #ffffff !important;
    text-shadow: 0 1px 12px rgba(0,0,0,0.55), 0 1px 3px rgba(0,0,0,0.4) !important;
}

/* Les sous-menus (dropdown-content / dropdown-menu) gardent leur style natif :
   texte sombre lisible sur fond blanc */
html body .header-wrapper .dropdown-content a,
html body .header-wrapper .dropdown-content li > a,
html body .header-wrapper .dropdown-menu a,
html body .header-wrapper .dropdown-menu li > a,
html body .header-wrapper .navbar-default .dropdown-content li > a {
    color: var(--c-text) !important;
    text-shadow: none !important;
}

/* ============================================================
 * FIX V9 (revu) : Breadcrumb en position absolue centre verticalement
 * sur le h2, sans toucher au h2 lui-meme.
 * ============================================================ */
.page-title > .container {
    position: relative !important;
}
.page-title h1,
.page-title h2 {
    /* on ne touche PAS au titre - il garde sa taille naturelle */
    padding-right: 280px; /* reserve la place pour le breadcrumb a droite */
    text-transform: none !important; /* annule le capitalize du theme parent */
}
.page-title .tt-breadcrumb {
    position: absolute !important;
    top: 50% !important;
    right: 15px !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    white-space: nowrap !important;
}
.page-title .tt-breadcrumb ul.breadcrumb {
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}
.page-title .tt-breadcrumb ul.breadcrumb li {
    display: inline-block !important;
    white-space: nowrap !important;
}
@media (max-width: 768px) {
    .page-title h1,
    .page-title h2 { padding-right: 0; }
    .page-title .tt-breadcrumb {
        position: static !important;
        transform: none !important;
        margin-top: 12px !important;
    }
}

/* --- Espace au-dessus du logo (header trop colle en haut) ---
 * Le theme parent applique deja .header-center-menu .navbar-header { padding: 15px 0 25px }
 * On augmente nettement le haut, uniquement quand on est en HAUT de page
 * (au scroll, .is-scrolled/.sticky reprennent la version compacte du theme). */
@media (min-width: 768px) {
    .header-wrapper.navbar-fixed-top:not(.is-scrolled):not(.sticky) .navbar-header {
        padding-top: 42px !important;
        transition: padding-top 0.4s var(--c-ease) !important;
    }
}
@media (max-width: 767px) {
    .header-wrapper.navbar-fixed-top:not(.is-scrolled):not(.sticky) .navbar-header {
        padding-top: 22px !important;
    }
}