/*
Theme Name: BeTheme Child
Template: betheme
Version: 1.0.0
*/
/* =========================================================
   SOUS-MENUS DESKTOP — US SAINTES HANDBALL
   ========================================================= */

@media only screen and (min-width: 1240px) {

    /* Couleurs inspirées du logo */
    :root {
        --fox-orange: #f57c00;
        --fox-orange-light: #ff9800;
        --fox-blue: #0b2a63;
        --fox-blue-dark: #061b45;
        --fox-white: #ffffff;
    }

    .menu_wrapper #menu .menu-main > li.menu-item-has-children {
        position: relative;
    }

    /* =====================================================
       SOUS-MENU PRINCIPAL
       ===================================================== */

    .menu_wrapper #menu .menu-main > li > ul.sub-menu {
        display: block !important;
        position: absolute;

        /*
         * Aucun espace entre le menu et le sous-menu.
         * Le léger recouvrement évite la perte du hover.
         */
        top: calc(100% - 2px);
        left: 50%;
        z-index: 99999;

        width: 320px;
        min-width: 320px;
        padding: 10px;
        margin: 0;

        background:
            linear-gradient(
                145deg,
                rgba(6, 27, 69, 0.98),
                rgba(11, 42, 99, 0.98)
            );

        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 14px;

        box-shadow:
            0 25px 60px rgba(0, 0, 0, 0.4),
            0 0 30px rgba(245, 124, 0, 0.18);

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transform:
            translateX(-50%)
            translateY(8px)
            scale(0.97);

        transform-origin: top center;

        transition:
            opacity 0.2s ease,
            visibility 0.2s ease,
            transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
    }

    /*
     * Zone invisible qui relie le menu au sous-menu.
     * Même s'il reste un petit écart dans BeTheme,
     * le hover n'est plus perdu.
     */
    .menu_wrapper #menu .menu-main > li > ul.sub-menu::after {
        content: "";
        position: absolute;
        right: 0;
        bottom: 100%;
        left: 0;
        height: 12px;
    }

    .menu_wrapper #menu .menu-main > li.menu-item-has-children:hover > ul.sub-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;

        transform:
            translateX(-50%)
            translateY(0)
            scale(1);
    }

    /* Trait coloré en haut du sous-menu */
    .menu_wrapper #menu .menu-main > li > ul.sub-menu::before {
        content: "";
        position: absolute;
        top: 0;
        right: 18px;
        left: 18px;

        height: 3px;

        background:
            linear-gradient(
                90deg,
                var(--fox-orange),
                var(--fox-orange-light),
                var(--fox-blue)
            );

        border-radius: 0 0 10px 10px;

        box-shadow:
            0 0 15px rgba(245, 124, 0, 0.42),
            0 0 20px rgba(11, 42, 99, 0.30);
    }

    /* =====================================================
       LIGNES DU SOUS-MENU
       ===================================================== */

    .menu_wrapper #menu ul.sub-menu > li {
        position: relative;
        display: block;
        width: 100%;
        margin: 0;
        padding: 0;

        border: 0;
        background: transparent;
    }

    .menu_wrapper #menu ul.sub-menu > li:not(:last-child) {
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    }

    .menu_wrapper #menu ul.sub-menu > li > a {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;

        width: 100%;
        min-height: 46px;
        padding: 11px 16px 11px 18px;
        margin: 0;

        color: rgba(255, 255, 255, 0.82);
        background: transparent;

        border-radius: 9px;

        font-size: 13px;
        font-weight: 600;
        line-height: 1.35;
        letter-spacing: 0.15px;
        text-transform: none;

        overflow: hidden;

        transition:
            color 0.2s ease,
            background 0.25s ease,
            transform 0.25s ease,
            padding-left 0.25s ease;
    }

    .menu_wrapper #menu ul.sub-menu > li > a span {
        position: relative;
        z-index: 2;

        display: block;
        width: 100%;
        padding: 0;
        border: 0;

        color: inherit;
        line-height: inherit;
    }

    /* Barre verticale en dégradé */
    .menu_wrapper #menu ul.sub-menu > li > a::before {
        content: "";
        position: absolute;
        top: 9px;
        bottom: 9px;
        left: 0;

        width: 3px;

        background:
            linear-gradient(
                180deg,
                var(--fox-orange),
                var(--fox-orange-light),
                var(--fox-blue)
            );

        border-radius: 0 5px 5px 0;

        transform: scaleY(0);
        transform-origin: center;

        transition: transform 0.25s ease;
    }

    /* Fond coloré animé */
    .menu_wrapper #menu ul.sub-menu > li > a::after {
        content: "";
        position: absolute;
        inset: 0;

        z-index: 1;

        background:
            linear-gradient(
                90deg,
                rgba(245, 124, 0, 0.20),
                rgba(255, 152, 0, 0.14),
                rgba(11, 42, 99, 0.10)
            );

        opacity: 0;
        transform: translateX(-15px);

        transition:
            opacity 0.25s ease,
            transform 0.3s ease;
    }

    .menu_wrapper #menu ul.sub-menu > li:hover > a {
        color: var(--fox-white);
        padding-left: 25px;

        transform: translateX(3px);

        box-shadow:
            inset 0 0 0 1px rgba(255, 255, 255, 0.06),
            0 5px 20px rgba(11, 42, 99, 0.10);
    }

    .menu_wrapper #menu ul.sub-menu > li:hover > a::before {
        transform: scaleY(1);
    }

    .menu_wrapper #menu ul.sub-menu > li:hover > a::after {
        opacity: 1;
        transform: translateX(0);
    }

    /* =====================================================
       ANIMATION D'OUVERTURE
       ===================================================== */

    .menu_wrapper #menu .menu-main > li > ul.sub-menu > li {
        opacity: 0;
        transform: translateY(6px);

        transition:
            opacity 0.22s ease,
            transform 0.25s ease;
    }

    .menu_wrapper #menu .menu-main > li:hover > ul.sub-menu > li {
        opacity: 1;
        transform: translateY(0);
    }

    .menu_wrapper #menu .menu-main > li:hover > ul.sub-menu > li:nth-child(1) {
        transition-delay: 0.02s;
    }

    .menu_wrapper #menu .menu-main > li:hover > ul.sub-menu > li:nth-child(2) {
        transition-delay: 0.04s;
    }

    .menu_wrapper #menu .menu-main > li:hover > ul.sub-menu > li:nth-child(3) {
        transition-delay: 0.06s;
    }

    .menu_wrapper #menu .menu-main > li:hover > ul.sub-menu > li:nth-child(4) {
        transition-delay: 0.08s;
    }

    .menu_wrapper #menu .menu-main > li:hover > ul.sub-menu > li:nth-child(5) {
        transition-delay: 0.1s;
    }

    .menu_wrapper #menu .menu-main > li:hover > ul.sub-menu > li:nth-child(6) {
        transition-delay: 0.12s;
    }

    /* =====================================================
       SOUS-SOUS-MENU ACADEMY
       ===================================================== */

    .menu_wrapper #menu ul.sub-menu li.menu-item-has-children {
        position: relative;
    }

    .menu_wrapper #menu ul.sub-menu li.menu-item-has-children > ul.sub-menu {
        display: block !important;
        position: absolute;
        top: -10px;

        /*
         * Recouvrement de 2px pour éviter un trou
         * entre les deux sous-menus.
         */
        left: calc(100% - 2px);
        z-index: 100000;

        width: 330px;
        min-width: 330px;
        padding: 10px;
        margin: 0;

        background:
            linear-gradient(
                145deg,
                rgba(16, 16, 26, 0.99),
                rgba(11, 42, 99, 0.99)
            );

        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 14px;

        box-shadow:
            0 25px 60px rgba(0, 0, 0, 0.45),
            0 0 25px rgba(11, 42, 99, 0.16);

        opacity: 0;
        visibility: hidden;
        pointer-events: none;

        transform:
            translateX(10px)
            scale(0.97);

        transform-origin: left top;

        transition:
            opacity 0.2s ease,
            visibility 0.2s ease,
            transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
    }

    .menu_wrapper #menu ul.sub-menu li.menu-item-has-children:hover > ul.sub-menu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;

        transform:
            translateX(0)
            scale(1);
    }

    /* Zone de liaison vers le sous-sous-menu */
    .menu_wrapper #menu ul.sub-menu li.menu-item-has-children > ul.sub-menu::after {
        content: "";
        position: absolute;
        top: 0;
        right: 100%;
        bottom: 0;
        width: 12px;
    }

    .menu_wrapper #menu ul.sub-menu .menu-arrow {
        position: relative;
        z-index: 3;

        margin-left: 12px;

        color: rgba(255, 255, 255, 0.45);
        font-size: 12px;

        transition:
            color 0.2s ease,
            transform 0.25s ease;
                margin-bottom: 20px;
    }

    .menu_wrapper #menu ul.sub-menu li.menu-item-has-children:hover > a .menu-arrow {
        color: var(--fox-blue);
        transform: translateX(4px);
    }

    /* Toggles réservés au mobile */
    .menu_wrapper #menu ul.sub-menu > li > .menu-toggle {
        display: none !important;
    }

    /* =====================================================
       LIEN PRINCIPAL ACTIF AU SURVOL
       ===================================================== */

    .menu_wrapper #menu .menu-main > li.menu-item-has-children > a > span {
        position: relative;
    }

    .menu_wrapper #menu .menu-main > li.menu-item-has-children > a > span::after {
        content: "";
        position: absolute;
        right: 0;
        bottom: -8px;
        left: 0;

        height: 3px;

        background:
            linear-gradient(
                90deg,
                var(--fox-orange),
                var(--fox-orange-light),
                var(--fox-blue)
            );

        border-radius: 10px;

        box-shadow:
            0 0 12px rgba(245, 124, 0, 0.38),
            0 0 12px rgba(11, 42, 99, 0.30);

        transform: scaleX(0);
        transform-origin: center;

        transition: transform 0.3s ease;
    }

    .menu_wrapper #menu .menu-main > li.menu-item-has-children:hover > a > span::after {
        transform: scaleX(1);
    }
}
#Top_bar .menu > li > a {
    padding: 60px 0 25px 0!important;
}
/* Cartes partenaires générées avec Muffin Builder */
.mcb-wrap-inner > .partner-card {
    box-sizing: border-box;
    min-width: 0;
    margin-bottom: 20px;
}

/* Conteneur intérieur de la colonne */
.mcb-wrap-inner > .partner-card > .mcb-column-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    height: 155px;
    padding: 25px;
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    box-shadow: 0 7px 25px rgba(0, 0, 0, 0.07);
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease;
}

/* Effet au survol */
.mcb-wrap-inner > .partner-card:hover > .mcb-column-inner {
    border-color: rgba(0, 0, 0, 0.2);
    box-shadow: 0 13px 35px rgba(0, 0, 0, 0.13);
    transform: translateY(-5px);
}

/* Éléments internes ajoutés par BeTheme */
.mcb-wrap-inner > .partner-card .image_frame,
.mcb-wrap-inner > .partner-card .image_wrapper,
.mcb-wrap-inner > .partner-card .image_wrapper > a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    margin: 0;
}

/* Logo */
.mcb-wrap-inner > .partner-card img {
    display: block;
    width: auto !important;
    max-width: 180px !important;
    height: auto !important;
    max-height: 95px !important;
    margin: 0 auto;
    object-fit: contain;
    filter: grayscale(15%);
    transition:
        filter 0.25s ease,
        transform 0.25s ease;
}

/* Animation du logo */
.mcb-wrap-inner > .partner-card:hover img {
    filter: grayscale(0);
    transform: scale(1.04);
}

/* Désactivation du masque BeTheme */
.mcb-wrap-inner > .partner-card .mask {
    display: none !important;
}

/* Désactivation de l’icône de lien BeTheme */
.mcb-wrap-inner > .partner-card .image_links {
    display: none !important;
}

/* Empêche les effets natifs de BeTheme */
.mcb-wrap-inner > .partner-card .image_wrapper img {
    opacity: 1 !important;
}

/* Tablette */
@media only screen and (max-width: 959px) {
    .mcb-wrap-inner > .partner-card {
        width: 50% !important;
    }
}

/* Mobile */
@media only screen and (max-width: 767px) {
    .mcb-wrap-inner > .partner-card {
        width: 100% !important;
    }

    .mcb-wrap-inner > .partner-card > .mcb-column-inner {
        height: 145px;
        padding: 22px;
    }

    .mcb-wrap-inner > .partner-card img {
        max-width: 170px !important;
        max-height: 90px !important;
    }
}
.mcb-wrap-inner > .partner-card {
    width: calc(25% - 18px) !important;
    margin: 0 9px 18px !important;
    box-sizing: border-box;
}
a.button.button_size_2.button_theme {
    background: #f57c00;
}
.button-animation-slide a.button.button_theme {
    transform-style: flat !important;
}
a.button.button_size_2.button_theme:hover {
    background-color: #0b2a63 !important;
    color: #fff !important;
}
.part-home {
    overflow: hidden;
}

.part-home .partners-slider {
    width: 100%;
    overflow: hidden;
    padding: 10px 0 25px;
}

.part-home .partners-slider__track {
    display: flex;
    width: max-content;
    gap: 18px;
    will-change: transform;
}

.part-home .partner-card {
    flex: 0 0 260px !important;
    width: 260px !important;
    margin: 0 !important;
}

@media screen and (max-width: 959px) {
    .part-home .partner-card {
        flex-basis: 220px !important;
        width: 220px !important;
    }
}

@media screen and (max-width: 767px) {
    .part-home .partner-card {
        flex-basis: 190px !important;
        width: 190px !important;
    }
}