/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 26 2026 | 17:43:57 */
/* =====================================
   VARIABLES GÉNÉRALES
   ===================================== */

.super-parent {
    --largeur-header: 680px;
    --largeur-logo-gauche: 200px;
    --largeur-logo-scroll: 160px;
    --duree-animation: 0.75s;
    --courbe-animation: cubic-bezier(0.22, 1, 0.36, 1);

    width: 100%;
    max-width: 100%;
    position: relative;
    z-index: 9999;
    overflow: visible !important;
}


/* =====================================
   CONTENEUR PRINCIPAL
   ===================================== */

.super-parent .header-parent {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    position: relative;
    overflow: visible !important;
}


/* =====================================
   IMAGE SITUÉE À GAUCHE
   ===================================== */

.super-parent:not(.elementor-sticky__spacer)
.image-header-gauche {
    width: var(--largeur-logo-gauche) !important;
    max-width: var(--largeur-logo-gauche) !important;
    flex: 0 0 var(--largeur-logo-gauche) !important;
    margin-right: auto !important;
    opacity: 1;
    visibility: visible;
    overflow: hidden;
    transform: translateX(0);
    pointer-events: auto;

    transition:
        width var(--duree-animation) var(--courbe-animation),
        max-width var(--duree-animation) var(--courbe-animation),
        flex-basis var(--duree-animation) var(--courbe-animation),
        margin var(--duree-animation) var(--courbe-animation),
        opacity 0.35s ease,
        transform 0.65s var(--courbe-animation),
        visibility 0s;
}

.super-parent .image-header-gauche img {
    display: block;
    width: var(--largeur-logo-gauche) !important;
    max-width: var(--largeur-logo-gauche) !important;
    height: auto;
}

.super-parent .image-header-gauche a,
.super-parent .image-header-scroll a {
    display: block;
    width: 100%;
    height: auto;
    position: relative;
    z-index: 2;
    pointer-events: auto;
}


/* =====================================
   DISPARITION DE L’IMAGE GAUCHE
   APRÈS LE DÉBUT DU SCROLL
   ===================================== */

html.header-a-defile
.super-parent:not(.elementor-sticky__spacer)
.image-header-gauche,

.super-parent.elementor-sticky--effects:not(.elementor-sticky__spacer)
.image-header-gauche {
    width: 0 !important;
    max-width: 0 !important;
    flex-basis: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    transform: translateX(-25px);
    pointer-events: none;

    transition:
        width var(--duree-animation) var(--courbe-animation),
        max-width var(--duree-animation) var(--courbe-animation),
        flex-basis var(--duree-animation) var(--courbe-animation),
        margin var(--duree-animation) var(--courbe-animation),
        padding var(--duree-animation) var(--courbe-animation),
        opacity 0.3s ease,
        transform 0.6s var(--courbe-animation),
        visibility 0s linear var(--duree-animation);
}


/* =====================================
   HEADER EXTENSIBLE : ÉTAT INITIAL
   ===================================== */

.super-parent .header-extensible {
    width: var(--largeur-header) !important;
    max-width: calc(100vw - 40px) !important;
    flex: 0 1 var(--largeur-header);
    margin-left: auto !important;
    margin-right: 0 !important;
    position: relative;
    overflow: visible !important;

    transition:
        width var(--duree-animation) var(--courbe-animation),
        max-width var(--duree-animation) var(--courbe-animation),
        flex-basis var(--duree-animation) var(--courbe-animation),
        border-radius var(--duree-animation) var(--courbe-animation),
        box-shadow var(--duree-animation) ease;

    will-change: width, max-width;
}


/* =====================================
   HEADER EXTENSIBLE APRÈS LE SCROLL
   ===================================== */

html.header-a-defile
.super-parent:not(.elementor-sticky__spacer)
.header-extensible,

.super-parent.elementor-sticky--effects:not(.elementor-sticky__spacer)
.header-extensible {
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: 100%;
    border-radius: 0;
    box-shadow: 0 10px 35px rgba(35, 42, 92, 0.12);
}


/* =====================================
   IMAGE DANS LE HEADER EXTENSIBLE
   MASQUÉE PAR DÉFAUT
   ===================================== */

.super-parent .image-header-scroll {
    width: 0 !important;
    max-width: 0 !important;
    flex: 0 0 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    transform: translateX(20px);
    pointer-events: none;

    transition:
        width var(--duree-animation) var(--courbe-animation),
        max-width var(--duree-animation) var(--courbe-animation),
        flex-basis var(--duree-animation) var(--courbe-animation),
        margin var(--duree-animation) var(--courbe-animation),
        opacity 0.4s ease,
        transform var(--duree-animation) var(--courbe-animation),
        visibility 0s linear var(--duree-animation);
}

.super-parent .image-header-scroll img {
    display: block;
    width: var(--largeur-logo-scroll) !important;
    max-width: var(--largeur-logo-scroll) !important;
    height: auto;
}


/* =====================================
   APPARITION DE L’IMAGE INTERNE
   APRÈS LE SCROLL
   ===================================== */

html.header-a-defile
.super-parent:not(.elementor-sticky__spacer)
.image-header-scroll,

.super-parent.elementor-sticky--effects:not(.elementor-sticky__spacer)
.image-header-scroll {
    width: var(--largeur-logo-scroll) !important;
    max-width: var(--largeur-logo-scroll) !important;
    flex-basis: var(--largeur-logo-scroll) !important;
    margin-right: 30px !important;
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    pointer-events: auto;

    transition:
        width var(--duree-animation) var(--courbe-animation),
        max-width var(--duree-animation) var(--courbe-animation),
        flex-basis var(--duree-animation) var(--courbe-animation),
        margin var(--duree-animation) var(--courbe-animation),
        opacity 0.5s ease 0.15s,
        transform var(--duree-animation) var(--courbe-animation),
        visibility 0s;
}


/* =====================================
   CORRECTION DES SOUS-MENUS ELEMENTOR
   ===================================== */

.super-parent .header-extensible,
.super-parent .elementor-widget-nav-menu,
.super-parent .elementor-widget-nav-menu > .elementor-widget-container,
.super-parent .elementor-nav-menu--main,
.super-parent .elementor-nav-menu__container,
.super-parent .elementor-nav-menu {
    overflow: visible !important;
}

.super-parent .elementor-widget-nav-menu {
    position: relative;
    z-index: 10000;
}

.super-parent .elementor-nav-menu--main {
    position: relative;
    z-index: 10000;
}

.super-parent .elementor-nav-menu--main .sub-menu,
.super-parent .elementor-nav-menu--main ul ul {
    position: absolute;
    z-index: 10001 !important;
}

.super-parent.elementor-sticky,
.super-parent.elementor-sticky--active,
.super-parent.elementor-sticky--effects {
    overflow: visible !important;
}


/* =====================================
   HEADER MOBILE : MASQUÉ SUR DESKTOP
   ===================================== */

.super-parent .header-mobile {
    display: none !important;
    background-color: transparent !important;
    overflow: visible !important;

    transition:
        background-color 0.65s ease,
        box-shadow 0.65s ease;
}


/* =====================================
   TABLETTE ET MOBILE : 1350 PX OU MOINS
   ===================================== */

@media screen and (max-width: 1350px) {

    .super-parent {
        position: relative;
        z-index: 99999 !important;
        overflow: visible !important;
    }

    .super-parent .header-parent {
        position: relative;
        overflow: visible !important;
    }

    /* Masquer les éléments du header desktop. */

    .super-parent .image-header-gauche {
        display: none !important;
    }

    .super-parent .header-extensible,

    html.header-a-defile
    .super-parent:not(.elementor-sticky__spacer)
    .header-extensible,

    .super-parent.elementor-sticky--effects
    .header-extensible {
        display: none !important;
    }

    /* Afficher le header mobile. */

    .super-parent .header-mobile {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        position: relative;
        z-index: 1;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        background-color: transparent !important;
        overflow: visible !important;

        /*
         * Pas de "isolation: isolate" ici :
         * le menu fullscreen doit pouvoir passer devant la page.
         */
        isolation: auto;

        transition:
            background-color 0.65s ease,
            box-shadow 0.65s ease;
    }

    /* Fond du header mobile après le scroll. */

    html.header-a-defile
    .super-parent:not(.elementor-sticky__spacer)
    .header-mobile,

    .super-parent.elementor-sticky--effects:not(.elementor-sticky__spacer)
    .header-mobile {
        background-color: #232A5C !important;
        box-shadow: 0 8px 30px rgba(35, 42, 92, 0.18);
    }

    /* Logo mobile. Le lien doit être défini dans Elementor. */

    .super-parent
    .header-mobile
    .elementor-widget-image {
        position: relative;
        z-index: 2;
        pointer-events: auto !important;
    }

    .super-parent
    .header-mobile
    .elementor-widget-image > .elementor-widget-container {
        position: relative;
        z-index: 2;
        pointer-events: auto !important;
    }

    .super-parent
    .header-mobile
    .elementor-widget-image a {
        display: block;
        position: relative;
        z-index: 2;
        pointer-events: auto !important;
    }

    .super-parent
    .header-mobile
    .elementor-widget-image img {
        display: block;
        position: relative;
        pointer-events: auto !important;
    }

    /* Widget du menu fullscreen. */

    .super-parent
    .header-mobile
    .elementor-widget-ucaddon_fullscreen_navigation_menu {
        position: relative;
        z-index: 3;
        overflow: visible !important;
    }

    .super-parent
    .header-mobile
    .elementor-widget-ucaddon_fullscreen_navigation_menu
    > .elementor-widget-container {
        position: relative;
        overflow: visible !important;
    }

    #uc_fullscreen_navigation_menu_elementor_bf6c359 {
        position: relative;
        z-index: 100000 !important;
        overflow: visible !important;
    }

    #uc_fullscreen_navigation_menu_elementor_bf6c359
    .ue_menu_wrapper,

    #uc_fullscreen_navigation_menu_elementor_bf6c359
    .ue-input-wrapper-align,

    #uc_fullscreen_navigation_menu_elementor_bf6c359
    .ue-input-wrapper {
        position: relative;
        overflow: visible !important;
    }

    /* Bouton hamburger. */

    #uc_fullscreen_navigation_menu_elementor_bf6c359
    .ue-input-wrapper {
        z-index: 100002 !important;
        pointer-events: auto !important;
    }

    #uc_fullscreen_navigation_menu_elementor_bf6c359
    .checkbox-toggle {
        z-index: 100004 !important;
        cursor: pointer;
        pointer-events: auto !important;
    }

    #uc_fullscreen_navigation_menu_elementor_bf6c359
    .ue_hamburger {
        z-index: 100003 !important;
        cursor: pointer;
        pointer-events: auto !important;
    }

    /* Panneau plein écran fermé. */

    #uc_fullscreen_navigation_menu_elementor_bf6c359
    .ue_menu {
        position: fixed !important;
        inset: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        height: 100dvh !important;
        z-index: 100001 !important;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    /* Panneau plein écran ouvert par le widget. */

    #uc_fullscreen_navigation_menu_elementor_bf6c359.menu-opened
    .ue_menu {
        display: flex !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    #uc_fullscreen_navigation_menu_elementor_bf6c359.menu-opened
    .ue_menu > .ue_inner_menu {
        width: 100%;
        min-height: 100vh;
        min-height: 100dvh;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    #uc_fullscreen_navigation_menu_elementor_bf6c359.menu-opened
    .ue_inner_menu-box {
        visibility: visible !important;
        pointer-events: auto !important;
    }

    /* Le bouton de fermeture reste au-dessus du panneau. */

    #uc_fullscreen_navigation_menu_elementor_bf6c359.menu-opened
    .ue-input-wrapper {
        position: relative;
        z-index: 100005 !important;
    }
}


/* =====================================
   ACCESSIBILITÉ
   ===================================== */

@media (prefers-reduced-motion: reduce) {

    .super-parent .header-extensible,
    .super-parent .image-header-gauche,
    .super-parent .image-header-scroll,
    .super-parent .header-mobile,
    #uc_fullscreen_navigation_menu_elementor_bf6c359 .ue_menu {
        transition: none !important;
    }
}


@media screen and (max-width: 1350px) {
    /* La copie de réserve Elementor garde sa place, mais ne capte aucun clic. */
    .super-parent.elementor-sticky__spacer {
        pointer-events: none !important;
        z-index: 0 !important;
    }

    .super-parent.elementor-sticky__spacer .header-mobile {
        visibility: hidden !important;
        pointer-events: none !important;
    }

    .super-parent.elementor-sticky__spacer .header-mobile * {
        pointer-events: none !important;
    }
}