@media (max-width: 767px) {
    .is-scrolled #site-header {
        transform: translate3d(0, -118.76px, 0);
    } 

    .is-scroll-top #site-header {
        transform: translate3d(0, 0, 0);
        top: 0 !important;
        position: fixed;
        top: 0;
        z-index: 9999;
    } 

    .is-scroll-top.scrolled-past-90dvh #site-header {
        background-color: var(--e-global-color-4287c34);
    }
}

.hidden-on-scroll {
    transition: all .2s ease;
} 

.scrolled-past-90dvh .hidden-on-scroll {
    visibility: hidden;
    opacity: 0;
} 

.visible-on-scroll {
    visibility: hidden;
    opacity: 0;
    display: none;
    transition: all .2s ease;

} 

.scrolled-past-100dvh .visible-on-scroll {
    visibility: visible;
    opacity: 1;
    display: block;
} 

@media (max-width: 767px) {
    .visible-on-scroll {
        visibility: visible;
        opacity: 1;
        display: block;
    } 
}

#site-header {
    @media (max-width: 767px) {
        transform: translate3d(0, 0, 0);
        transition: all .2s ease;
    }
}

/* .scrolled-past-90dvh.sticky #site-header {
    @media (max-width: 767px) {
        opacity: 0;
        visibility: hidden
    }
} */

.sticky #site-header {
    @media (max-width: 767px) {
        position: fixed;
        top: 0;
        z-index: 9999;
        opacity: 1;
        visibility: visible;
    }
}

.admin-bar {
    #site-header {
        top: 32px;
    }
}

::selection {
    color: #fff, 0;
    background: rgba(#02004D, 0.2);
}

a {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

.burger-button {
    .elementor-button-icon {
        outline: unset;
        border: unset;
    }
}

.elementor-button-wrapper {
    outline: unset;
    border: unset;
}


.elementor-popup-modal {
    .dialog-close-button  {
        z-index: 99999;
        outline: unset;
        border: unset;
    }
}

.page-id-56,
.page-id-1613,
.gestion-conseillee-visible,
.nos-clients-visible {

    &.is-scroll-top {
        #site-header {
            @media (max-width: 767px) {
            transform: translate3d(0, 0, 0);
            top: 0 !important;
            }
        }
    }

    &.is-scroll-top {
        &.scrolled-past-90dvh {
            #site-header {
                background-color: #3D3B3A;
            }
        }
    }

    header {
        .elementor-element {

            .elementor-widget-theme-site-logo img {
                filter: brightness(0) invert(1);
            }
    
            .elementor-nav-menu--main {
                .elementor-item {
                 
                        color: #fff !important;
                    
                }
            }


            #lang-menu {
                ul {
                    li {
                       &:first-child {
                        &:after {
                            
                            color: #fff;
                      
                        }
                       } 
                    }
                }
            }
    
            .elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before, .elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after {
                background-color: #fff;
            }
        }
        
    }
}

.page-id-56,
.page-id-1613,
.gestion-conseillee-visible,
.nos-clients-visible {
    #burger-menu {
        svg {
            fill: #fff;
            color: #fff;
        }
    }
}



@media (min-width: 1920px) {
    header {
        .elementor-element {
            .e-con-inner {
                max-width: unset;
                padding-left: 100px;
                padding-right: 100px;
            }
        }
    
    }
}

::selection {
    background: rgba(#beaf88, 0.2);
}

.en-savoir-plus {
    .elementor-button-content-wrapper {
        align-items: center;
    }
    .elementor-button-icon {
        font-size: 43px;  
    }
}


.contactez-nous {
    &.white {
        &:hover {
            .elementor-button {
                &.elementor-button-link {
                    border-color: transparent;
                    background-color: #fff;
                }
                
            }
    
            .elementor-button-text {
                color: #3D3B3A;
            }
            .elementor-button-icon {

                transform: scale(1.15);


                svg {
                    path {
                        stroke: #3D3B3A;
                    }    
                }
            }
        }
    }
    &.gold {

        &:hover {
            .elementor-button {
                &.elementor-button-link {
                    border-color: transparent;
                    background-color: #fff;
                }
                
            }
    
            .elementor-button-text {
                color: #3D3B3A;
            }
            .elementor-button-icon {

                transform: scale(1.15);

                svg {
                    path {
                        stroke: #3D3B3A;
                    }    
                }
            }
        }
    }

    .elementor-button-content-wrapper {
        align-items: center;
    }
    .elementor-button-icon {
        font-size: 17px;  
        transition: transform .3s;
    }
}

.btn-icn-round-left {

    &.maps {

        .elementor-button-text {
            background-image: linear-gradient(#beaf88, #beaf88);
            background-position: 0 100%;
            background-repeat: no-repeat;
            background-size: 0 1px;
            display: inline-block;
            margin-right: var(--spacing-16);
            transition: background-size .3s;
            vertical-align: -.1em;
        }

        &:hover {

            .elementor-button-text {
                color: #beaf88 !important;
                background-size: 100% 1px;
            }

        }

        .elementor-button-icon {
            font-size: 30px; 
        }  
    }

    .elementor-button-content-wrapper {
        align-items: center;
    }

    .elementor-button-icon {
        font-size: 43px; 
    }  


}

.client-button {
    cursor: pointer;
    @media (min-width: 768px) {
        &.active {
            background-color: rgba(255,255,255,0.1);
        }
    }
}

.client-content {
        visibility: visible;
        opacity: 1;
        transition: opacity 0.5s ease-in;

    &.hidden {
        visibility: hidden;
        opacity: 0;
        height: 0;
    }
}

.element-approche {
    z-index: 0;

    .line {
        width: 2px;
        background-color: #beaf88;
        margin: -30px 0 0 0;
        

        &.h-70 {
            height: 70px;
        }

        &.h-130 {
            height: 130px;
            @media (max-width: 767px) {
                height: 70px;
            }
        }
    }

    .bullet {
        width: 10px;
        height: 10px;
        border-radius: 10px;
        background-color: #beaf88;
        display: block;
        margin: -5px 0 0 -5px;
    }
}

.nos-solutions {
    &:after {
        content:'';
        height: 200px;
        background: rgb(255,255,255);
        background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(250,245,237,1) 100%);
        z-index: 1;
    }
}

.pays {
    cursor: pointer;
}

#background-container {
    background-size: cover;
    background-position: bottom center;
    transition: background-image 0.30s ease-in; /* Transition en douceur sur 0.5s */
    &:after {
        content:'';
        height: 170px;
        background: rgb(255,255,255);
        background: linear-gradient(180deg, rgba(255,255,255,0) 0%,   rgba(61,59,58,1) 100%);
    }
}

/* Optionnel : Changer l'opacité pour un fade-in plus subtil */
.fadein {
    opacity: 0;
    transition: opacity 0 linear;
}

.fadein.active {
    opacity: 1;
}


.arrow-down,
.arrow-right {
    svg {
        overflow: visible;
    }
}

.arrow-down {
    &.black {
        &:hover {
            .elementor-button-icon {
                transform: scale(1.15);

                svg {
                    path {

                        &:first-child {
                            fill: #3D3B3A;
                        }
                        &:last-child {
                            stroke: #fff;
                        }
                    }
                }

                        g[data-name="Ellipse 21"] circle {
                            fill: #3D3B3A; /* Remplir le cercle avec du rouge */
                        }

                        g {

                            fill: #3D3B3A; /* Remplir le cercle avec du rouge */

                            g {
                            
                                

                                path {
                                    stroke: #fff;
                                }
                            }
                        }
            } 
        }
    }

    .elementor-button-icon{
            transition: transform .3s;
    }
   
}

.arrow-right {
    
    .elementor-button-text {
        background-image: linear-gradient(#3D3B3A, #3D3B3A);
        background-position: 0 100%;
        background-repeat: no-repeat;
        background-size: 0 1px;
        display: inline-block;
        margin-right: var(--spacing-16);
        transition: background-size .3s;
        vertical-align: -.1em;
    }

    &.gold {

        &:hover {

            .elementor-button-text {
                color: #3D3B3A;
                background-size: 100% 1px;
            }

            .elementor-button-icon {
                transform: scale(1.15);

                g[data-name="Ellipse 21"] circle {
                    fill: #3D3B3A; /* Remplir le cercle avec du rouge */
                }

                g {

                    fill: #3D3B3A;
                    
                    path {
                        stroke: #3D3B3A;
                    }

                    g {
                        circle {
                            stroke: #3D3B3A;
                        }

                        path {
                            stroke: #fff;
                        }
                    }
                }
            } 
        }
    }

    &.to-white {

        .elementor-button-text {
            background-image: linear-gradient(#fff, #fff);
            background-position: 0 100%;
            background-repeat: no-repeat;
            background-size: 0 1px;
            display: inline-block;
            margin-right: var(--spacing-16);
            transition: background-size .3s;
            vertical-align: -.1em;
        }

        &:hover {

            .elementor-button-text {
                color: #fff !important;
                background-size: 100% 1px;
            }

            .elementor-button-icon {
                transform: scale(1.15);

                g[data-name="Ellipse 21"] circle {
                    fill: #fff; /* Remplir le cercle avec du rouge */
                }

                g {

                    fill: #fff;
                    
                    path {
                        stroke: #fff;
                    }

                    g {
                        circle {
                            stroke: #fff;
                        }

                        path {
                            stroke: #3D3B3A;
                        }
                    }
                }
            } 
        }
    }

    .elementor-button-icon{
            transition: transform .3s;
    }
}

#lang-menu {
    ul {
        li {
           &:first-child {
            &:after {
                content: '/';
                display: inline-block;
                border: none;
                color: #3D3B3A;
                margin-top: -7px;
                font-family: "Outfit", Sans-serif;
                font-size: 12px;
                font-weight: 600;
                text-transform: uppercase;
                line-height: 15px;
                letter-spacing: 1.2px;
            }
           } 
        }
    }
}


a[href^="tel:"] {
    color: #fff;
}


.fade-delay {
    opacity: 0;
    /* transform: translate3d(0, 100%, 0); */
    /* transition: opacity 0.5s ease, transform 0.5s ease; */
    animation-fill-mode: forwards;
}

.fade-delay.in-view {
    animation: fadeInUp 0.5s ease forwards;
    animation-delay: 0s; /* Délai de 2 secondes */
}
 


/* typos zoom 90% */
.size-ok

.fs16-lh20-ls1-6 {
    font-size: 14.4px; 
    line-height: 18px; 
    letter-spacing: 1.44px;
}


.fs30-lh36 {
    font-size: 27px; 
    line-height: 32.4px;
}

.fs16-lh24 {
    font-size: 13px; 
    line-height: 19px;
}

.fs14-lh-24 {
    font-size: 11px; 
    line-height: 18px;
}

.fs30-lh35 {
    font-size: 27px; 
    line-height: 31.5px;
}

.button {
    font-size: 13px;
    line-height: 20px;
    letter-spacing: 1.05px;
}

.fs34-lh-48 {
    font-size: 27.5px;
    line-height: 39px;
}