/*
 ██████   █████  ███████ ███████
 ██   ██ ██   ██ ██      ██
 ██████  ███████ ███████ █████
 ██   ██ ██   ██      ██ ██
 ██████  ██   ██ ███████ ███████
*/

/* ── Breakpoints reference ───────────────────────────────
   xs   480px   sm   600px   md   782px   lg    920px
   xl  1226px  xxl  1380px  max  1546px  2xl  1920px
──────────────────────────────────────────────────────── */

:root{
    --body-background:              var(--wp--preset--color--white);
    --eco-badge-light-background:   var(--wp--preset--color--white);
    --eco-badge-dark-background:    var(--wp--preset--color--dark);
    --header-height:                110px;
    --header-height-xs:             49px;
    --header-items-size:            49px;
    --logo-width-min:               100px;
    --logo-height:                  100px;
    --logo-width-max:               140px;
    --block-bridge-min-height:      360px;
    --block-bridge-max-height:      900px;
    --block-parallax-height:        360px;
    --banner-min-height:            80vh;
    --banner-max-height:            80vh;
    --global-gap:                   10px;
    --global-radius:                0px;
    --nav-submenu-width:            320px;
    --nav-pannel-bg:                var(--wp--preset--color--brand);
    --error:                       #dc3232;
    --fz-xs:                        calc(0.9 * var(--wp--preset--font-size--xs));
    --btn-default-height:           52px;

    /* Largeurs et hauteur des blocks */
    --block-min-height:             400px;

        /* Image dans la colonne */
        --block-img-xl-width:           40%;
        --block-img-max-width:          35%;
        --img-max-height:               747px;

        /* Texte dans la colonne */
        --block-text-xl-width:           60%;
        --block-text-max-width:          65%;

    /* Image deco */
    --img-deco:                     url(../../assets/svg/ground_blue2.svg);
    --img-deco2:                    url(../../assets/svg/train_blue.svg);

    --img-deco-height:              432px;
    --img-deco-width:               222px;

    /* Largeur picto */
    --picto-thumbnail:              150px;

    /* Ne pas modifier les valeurs en clamp */
    --container-padding-x:      clamp(16px, 3vw, 60px);
    --logo-width-fluid:         clamp(var(--logo-width-min), 15vw, var(--logo-width-max));

    /* Override les couleurs du bg du bouton en cas de has-gradient*/
    --b-btn-gradient:       linear-gradient(to right, var(--wp--preset--color--brand) 0%, var(--wp--preset--color--brand-dark-20) 51%);
    --b-btn-gradient-from:  var(--wp--preset--color--brand);
    --b-btn-gradient-to:    var(--wp--preset--color--brand-dark-20);
    --b-btn-gradient-text:  var(--wp--preset--color--white);
    --e-text-gradient:      linear-gradient(to right, var(--wp--preset--color--brand) 0%, var(--wp--preset--color--accent-1) 100%);
    
    --ln-paper:#F7F5F0;
    --ln-brand:             var(--wp--preset--color--brand); /*#1C2B4A;*/
    --ln-brand-soft:        var(--wp--preset--color--brand-light-30); /* #4A5A78;*/
    --ln-red:               var(--wp--preset--color--accent-1);
    --ln-track:#D8D3C7;
    --ln-white:             var(--wp--preset--color--white);
    --ln-bridge:            var(--space-md); /*40px;*/      /* débord horizontal des traits desktop, pour absorber le gap entre colonnes */
    --ln-bridge-v:          var(--space-md); /*40px;*/      /* débord vertical des raccords desktop (pos 5 ↔ pos 6) */
    --ln-head:              var(--space-md); /*40px;*/      /* hauteur de la zone contenant le point, desktop */
}

/* ─────────────────────────────────────────────────────
Override blocks
──────────────────────────────────────────────────────── */
.is-style-dark,
.is-style-switcher-dark,
.is-style-brand,
.is-style-switcher-brand{
	--b-text: 			var(--wp--preset--color--white)!important;
    --b-link:           var(--wp--preset--color--white)!important;
    --b-btn-text-hover: var(--wp--preset--color--white)!important;
    --b-nav:            var(--wp--preset--color--white)!important;
    .btn:not(.is-secondary){
        --b-btn-text-hover: var(--wp--preset--color--white)!important;
    }

    --b-border: var(--wp--preset--color--white-dark-30)!important;
    --b-heading: var(--wp--preset--color--white)!important;
    --b-heading-alt: var(--wp--preset--color--white-dark-20)!important;
    --b-link: var(--wp--preset--color--white)!important;
    --b-link-hover: var(--wp--preset--color--white)!important;
    --b-nav: var(--wp--preset--color--white)!important;
    --b-nav-hover: var(--wp--preset--color--white-dark-10)!important;
    --b-btn-bg: var(--wp--preset--color--dark)!important;
    --b-btn-text: var(--wp--preset--color--dark)!important;
    --b-btn-outline: var(--wp--preset--color--white)!important;
    --b-btn-bg-hover: var(--wp--preset--color--white-dark-10)!important;
    --b-btn-gradient-text: var(--wp--preset--color--dark)!important;
    --b-btn-gradient-from: var(--wp--preset--color--white)!important;
    --b-btn-gradient-to: var(--wp--preset--color--white-dark-10)!important;
    --b-btn-secondary-bg: var(--wp--preset--color--transparent)!important;
    --b-btn-secondary-text: var(--wp--preset--color--white)!important;
    --b-btn-secondary-outline: var(--wp--preset--color--white)!important;
    --b-btn-secondary-bg-hover: var(--wp--preset--color--white)!important;
    --b-btn-secondary-outline-hover: var(--wp--preset--color--white)!important;
    --b-btn-secondary-text-hover: var(--wp--preset--color--dark)!important;
    --b-svg-fill: var(--wp--preset--color--dark)!important;
    --b-icon-filter: invert(0%)!important;
    --b-svg-opacity: 1!important;
}

.is-style-light,
.is-style-muted{
	h2, h3 {
		--b-heading: var(--wp--preset--color--brand);	
		span{
		--b-heading-alt: var(--wp--preset--color--accent-1);	
		}
	}
}

/* ─────────────────────────────────────────────────────
Override boutons
──────────────────────────────────────────────────────── */
.elementor-button:not(.is-secondary):not(.has-gradient), 
footer .btn:not(.has-gradient){
    --b-btn-bg:                 var(--wp--preset--color--brand)!important;
    --b-btn-text:               var(--wp--preset--color--white)!important;
    --b-btn-text-hover:         var(--wp--preset--color--white)!important;
}

.elementor-button:not(.my-custom-card *):not(.has-gradient *).is-secondary, 
footer .btn:not(.has-gradient).btn:not(.is-secondary){
    --b-btn-secondary-text:     var(--wp--preset--color--brand)!important;
    --b-btn-secondary-outline:  var(--wp--preset--color--brand)!important;
}

.elementor-widget-button.has-gradient .elementor-button:not(.is-secondary), 
.elementor-button:not(.is-secondary).has-gradient,
footer .btn.has-gradient:not(.is-secondary){
    --b-btn-bg:                 var(--wp--preset--color--brand)!important;
    --b-btn-text:               var(--b-btn-gradient-text)!important;
    --b-btn-gradient-from:      var(--wp--preset--color--brand)!important;
    --b-btn-gradient-to:        var(--wp--preset--color--brand-dark-20)!important;
    --b-btn-gradient-text:      var(--wp--preset--color--white)!important;

    background-image:           var(--b-btn-gradient, linear-gradient(to right, var(--b-btn-gradient-from), var(--b-btn-gradient-to)))!important;
}

.elementor-widget-button.has-gradient .elementor-button.is-secondary,
.elementor-button:not(.my-custom-card *).is-secondary.has-gradient,
footer .btn.is-secondary.has-gradient{
    --b-btn-secondary-text:         var(--wp--preset--color--brand)!important;
    --b-btn-secondary-outline:      var(--b-btn-gradient)!important;
    --b-btn-secondary-text-hover:   var(--wp--preset--color--white)!important;

    --b-btn-secondary-bg-hover: var(--wp--preset--color--brand-light-20);
    --b-btn-secondary-outline-hover: var(--wp--preset--color--brand-light-20);
}

/* Styles des boutons */
.btn.is-secondary.has-gradient{
	background-image:none;
}



/* ─────────────────────────────────────────────────────
Resets des fichiers Elementor
──────────────────────────────────────────────────────── */
header#site-header.site-header{
    padding-block-end: 0;
    padding-block-start: 0;
    padding-inline-start: 0;
    padding-inline-end:0;
}
body a{
    color:unset;
}

.e-con[class*=is-style]{
    [type=button], 
    [type=submit], 
    button{
        color:inherit !important;
        border:1px solid inherit !important;
    }
}

[type=button], 
[type=submit], 
button{
    color:inherit !important;
    border:1px solid inherit !important;
}

/* ─────────────────────────────────────────────────────
Paramétrages du thème
──────────────────────────────────────────────────────── */

.eco-badge-container-light{
    background-color:   var(--eco-badge-light-background);  
}

.bg, .text-left, .text-right, .bridge, .parallax{
    --background-overlay:	"";

    &:not(.is-reverse){
        > *{
            @media (max-width: 1023px){ 
                --flex-direction: column;
            }
        }
    }
}
.e-con.e-grid > .e-con-inner:has(.logo img) {
    padding-top: 0;
    padding-bottom: 0;
}

body{
  background-color: var(--body-background);
}

main{
    @media (max-width:782px) {
        padding-inline: var(--container-padding-x);
    }
}

h2, h3, h4, h5, h6{
    font-family: var(--font-titles)!important;
}

.e-con.e-parent{
    .logo{
        width: var(--logo-content);
        height: var(--logo-content);
        align-items: center;
        align-content: center;
        margin: 0 auto;
        background-color: var(--wp--preset--color--accent-1-light-40);
        img{
            border-radius: 0;
            background-color: transparent;
            padding: var(--space-sm);
        }
    } 
}

.e-con{
    .elementor-widget-text-editor{
        h2{
            margin-bottom: 2rem;
        }
    }
}

.site-topbar-inner{
    justify-content:    flex-end;
    font-size:          var(--fz-xs);
}

main{
    @media (max-width:782px) {
        padding-inline: var(--container-padding-x);
    }
}

.site-topbar-inner{
    img{
        &:hover{
            background:none!important;
        }
    }
}

.bg, .text-left, .text-right, .bridge, .has-parallax {
    &:not(.is-reverse) {
        > * {
            @media (max-width: 1023px) {
                --flex-direction: column;
            }
        }
    }
}

.picto > *{
    width:  var(--picto-thumbnail);
    height: var(--picto-thumbnail);
}

main .text-left,
main .text-right{
    min-height: var(--block-min-height);
}

/* Ordre des éléments dans le bandeau */
header #barre-menu {
    .site-navigation-wrapper {
        .site-navigation{           order: 1; }
        .nav-toggle-open{           order: 3; }
        .header-elements-wrapper{   order: 2; }
    }
}

header #barre-menu { min-height: var(--header-height); }
header .site-banner {
    @media (max-width: 1379px){
        max-height:     var(--banner-max-height);
        min-height:     var(--banner-min-height);
    }
    @media (min-width: 1380px) and (max-width: 1545px){
        max-height:     calc(var(--banner-max-height) - 6vh);
        min-height:     calc(var(--banner-max-height) - 6vh);
    }
    @media (min-width: 1546x){
        max-height:     calc(var(--banner-max-height) - (var(--banner-max-height)) / 3);
        min-height:     calc(var(--banner-max-height) - (var(--banner-max-height)) / 3);
    }
}

/* Taille des boutons toggle */
.nav-toggle-open,
.nav-toggle-close {
    color:              var(--b-bg);
    background-color:   var(--b-heading-alt);
    width:              var(--header-items-size);
    height:             var(--header-items-size);

    > svg {
        fill:           var(--b-bg);
        stroke:         var(--b-bg);
    }

    &:hover,
    &:focus {
        background-color: var(--b-heading-alt);
        color:            var(--b-bg);
    }
}

.bandeau {
    .mag-logo-wrap {
        position:    relative;
    }
    &.scrolled #barre-menu{
        @media (max-width: 919px) {
            justify-content: space-between;
        }
    }
    #barre-menu {
        padding-inline:  var(--container-padding-x);
        @media (max-width: 919px) {
            justify-content: space-between;
            gap:             var(--global-gap);
        }
        @media (min-width: 920px){
            justify-content: space-around;
        }
        @media (min-width: 920px) and (max-width: 1225px){
            gap:             calc(var(--global-gap) / 2);
        }
        @media (min-width: 1226px) {
            gap:             var(--global-gap);
        }
    }
    #barre-menu .site-navigation-wrapper {
        @media (max-width: 1225px) { gap: var(--global-gap); }
        @media (min-width: 1226px) { gap: var(--space-sm); }

        .header-elements-wrapper {
            gap: var(--global-gap);
            .header-cta {
                gap: var(--global-gap);
            }
        }
    }
    .nav-menu,
    .menu-item > a {
        text-decoration: none;
        font-weight:     400;
        font-family:     var(--font-titles);
        @media (max-width: 919px) {                         font-size: var(--wp--preset--font-size--sm); gap: var(--global-gap); }
        @media (min-width: 920px) and (max-width: 1225px) { font-size: calc(0.7 * var(--wp--preset--font-size--xs)); gap: 0; }
        @media (min-width: 1226px) and (max-width: 2559px){ font-size: calc(0.8 * var(--wp--preset--font-size--xs)); gap: var(--space-xs); }
        @media (min-width: 2560px) {                        font-size: var(--wp--preset--font-size--xs); gap: var(--space-xs); }
    }
    .sub-menu {
        gap: var(--global-gap);
        .menu-item-has-children & { min-width: var(--nav-submenu-width); }
    }
    .nav-toggle-close {
        position: absolute;
        right:    16px;
        top:      16px;
        z-index:  10;
    }
    #site-navigation.is-open {
        align-items:     center;
        .nav-menu,
        .sub-menu    { gap: var(--global-gap); }

        .menu-item > a {
            font-size: var(--wp--preset--font-size--xs);
            text-align:      center;
            justify-content: center;
        }
    }
}

header {
    #site-navigation.is-open .sub-menu{
        background: transparent;
    }
    .bandeau:not(.scrolled) {
        .menu-item {
            &:hover > a,
            &:focus-within > a,
            &:has(.sub-menu:hover) > a {
                --b-nav-hover:    var(--wp--preset--color--white)!important;
                --b-bg:           var(--wp--preset--color--brand)!important;
                color:            var(--b-nav-hover)!important;
                background-color: var(--b-bg); /* var(--b-heading-alt); */
                transition:       background-color 0.3s ease;
                .nav-link-text{
                    background-color: transparent;
                }
            }
        }
        .sub-menu {
            background-color: var(--b-heading-alt);
            box-shadow:       var(--btn-default-sh);
            .menu-item > a {
                color: var(--b-bg);
                &:hover {
                    color:            var(--wp--preset--color--dark);
                    background-color: var(--wp--preset--color--brand-dark-50);
                }
            }
        }
    }
    .bandeau.scrolled {
        .nav-toggle-open.has-gradient, .nav-toggle-close.has-gradient {
            --b-btn-gradient:       linear-gradient(to right, var(--wp--preset--color--white) 0%, var(--wp--preset--color--white-dark-10) 51%);
            --b-btn-gradient-from:  var(--wp--preset--color--white);
            --b-btn-gradient-to:    var(--wp--preset--color--white-dark-20);
            --b-btn-gradient-text:  var(--wp--preset--color--black)!important;
            background-image: var(--b-btn-gradient, linear-gradient(to right, var(--b-btn-gradient-from), var(--b-btn-gradient-to)));
            background-color: var(--b-btn-bg) !important;
            color: var(--b-btn-gradient-text);
        }
        .menu-item {
            &:hover > a,
            &:focus-within > a,
            &:has(.sub-menu:hover) > a {
                --b-nav-hover:    var(--wp--preset--color--white)!important;
                --b-bg:           var(--wp--preset--color--brand)!important;
                color:            var(--b-nav-hover)!important;
                background-color: var(--b-bg); /* var(--b-heading-alt); */
                transition:       background-color 0.3s ease;
                .nav-link-text{
                    background-color: transparent;
                }
            }
        }
        .sub-menu {
            background-color: var(--b-heading-alt);
            box-shadow:       var(--btn-default-sh);
            .menu-item > a {
                color: var(--b-bg);
                &:hover {
                    color:            var(--wp--preset--color--white);
                    background-color: var(--wp--preset--color--brand);
                }
            }
        }
    }
    #site-navigation.is-open {
        --b-bg: var(--wp--preset--color--white);
        font-size: var(--wp--preset--font-size--lg);
        background: var(--nav-pannel-bg);
        color:      var(--b-bg);
        .menu-item:has(.sub-menu:hover) > a { background-color: transparent; }
    }
}

body header .site-banner {
    .banner-content {
        display:            flex;
        flex-direction:     column;
        justify-content:    center;
        align-items:        flex-start;

        @media (max-width: 782px) {
            width:          100%;
            padding-left:   var(--space-md);
            padding-top:    0;
            padding-right:  var(--space-md);
            padding-bottom: var(--space-md);
            position:       absolute;
            text-align:     center;
            gap:            var(--space-sm);
        }
        @media (min-width: 783px) {
            padding:        var(--space-xxl) var(--space-md) 0 var(--space-md);
            position:       absolute;
            gap:            var(--space-sm);
        }

        .diapo-cta-buttons {
            display:   flex;
            flex-wrap: wrap;
            gap:       var(--global-gap);

            @media (max-width: 782px) { justify-content: center; }
            @media (min-width: 783px) { justify-content: center; }

            .btn{
                min-width:200px;
                display: flex;
                justify-content: center;
            }
        }

        .banner-diapo-text {
            @media (max-width: 782px) {
                font-size: var(--wp--preset--font-size--sm);
            }
            @media (min-width: 783px) {
                font-size: var(--wp--preset--font-size--sm);
            }
        }
    }
}

header .site-banner.has-parallax {
    .image-switcher__item img {
        @media (min-width: 783px) {
            mask-image:         linear-gradient(to bottom, black 75%, transparent 90%);
            -webkit-mask-image: linear-gradient(to bottom, black 75%, transparent 90%);
        }
    }
}

/* Image switcher styles */
.image-switcher__nav {
    position:        absolute;
    display:         flex;
    justify-content: center;
    padding-block:   1rem;
    width:           100%;
    left:            0;
    bottom:          3vh;
    z-index:         3;
}
.image-switcher__dots {
    gap:        1rem;
}
.image-switcher__dot {
    width:         1rem;
    height:        1rem;
    border-radius: 50%;
}

/* Boutons réseaux sociaux */
.header-social-wrap{
    height:         var(--header-height);
    flex-direction: column;
    .social-links-wrap {
        justify-content: space-around;
        flex-direction: row;
        gap: var(--global-gap);
    }
}
.footer-social-wrap{
    .social-links-wrap {
        gap: var(--global-gap);
        @media (max-width: 782px) {
            justify-content: center;
        }
        @media (min-width: 783px) {
            justify-content: space-around;
        }
    }
}

header .site-banner .banner-content {
    h1{
        font-weight:    400;
        font-size:      calc(0.8 * var(--wp--preset--font-size--lg));
        line-height:    auto;
        font-family:    var(--font-titles);
        span {
            --b-heading-alt:    var(--wp--preset--color--white-dark-30)!important;
            color:              var(--wp--preset--color--white-dark-30)!important;
            font-family:        var(--font-body);
            font-size:          var(--wp--preset--font-size--xl);
        }
    }
    .banner-title {
        @media (max-width: 782px) {
            align-items: center;
            text-align:  center;
        }
        @media (min-width: 783px) {
            align-items: center;
            text-align:  center;
        }
    }
    .banner-cta {
        margin-top: var(--global-gap);
        @media (max-width: 782px) {
            justify-content: center;
        }
        @media (min-width: 783px) {
            justify-content: flex-start;
        }
    }
    .banner-diapo-text,
    .diapo-cta-container{
        @media (max-width: 782px) {
            margin:0 auto;
        }
        @media (min-width: 783px) {
            margin:0 auto;
        }
    }
    .diapo-cta-container{
        padding-top: var(--space-xs);
    }
}

/* Taille du logo dans le header*/
header {
    .mag-logo-wrap {
        height:     var(--header-height);
        width:      var(--logo-width-fluid);
    }
    .site-brand-text{
        font-family: var(--font-titles);
        font-size:   var(--wp--preset--font-size--md);
        font-weight: 600;
    }

    .mag-logo-wrap .mag-logo-wrap__default {
        width: var(--logo-width-fluid);
    }

    .mag-logo-wrap .mag-logo-wrap__scroll {
        height:      var(--logo-height);
        padding:     calc(var(--space-md) - var(--space-xs)) 0;

        img {
            width:  auto;
            height: calc(var(--logo-height) - calc(calc(var(--space-md) - var(--space-xs))) * 2);
        }
    }

    .bandeau.is-sticky-header.scrolled {
        .mag-logo-wrap__scroll {
            height:      var(--logo-height);
            img {
                width:  auto;
                height: calc(var(--logo-height) - calc(calc(var(--space-md) - var(--space-xs))) * 2);
            }
        }
    }
}


body header#site-header.site-header.is-boxed {
    @media (min-width: 783px) {
        .banner-content,
        .image-switcher__nav {
            padding-inline: var(--container-padding-x);
        }

        #barre-menu {
            padding-inline: var(--container-padding-x);
        }
    }
    @media (min-width: 920px) {
        margin-top: var(--space-md);
    }
}

body footer.site-footer.is-boxed:not(.dynamic-footer),
.site-footer{
    padding-inline: var(--container-padding-x);
    padding:        var(--container-padding-x);
}

body footer.site-footer.is-boxed:not(.dynamic-footer){
    overflow:       visible;
}

.site-footer {
    padding-block:  var(--space-sm);
    text-align:     left;

    @media (min-width: 783px) { text-align: center; }

    h3, p { text-align: left; 
    
    }

    .footer-brand {
        position:       relative;
        gap:            var(--space-lg);
        display:        flex;
        overflow:       visible;
        padding-top:    var(--space-lg);
        padding-bottom: var(--space-lg);

        @media (max-width: 929px) {
            flex-direction: column;
        }
        @media (min-width: 920px) {
            flex-direction: row;
        }
        img {
            margin:         0 auto;
            height:         auto;
            /*filter:         brightness(100);*/
            flex: 1;

            @media (max-width: 929px) {
                width:  calc(var(--logo-width-fluid) * 2);
                height: fit-content;
            }
            @media (min-width: 920px) {
                scale:0.8;
                width:  calc(var(--logo-width-fluid) - var(--space-lg));
                height: fit-content;
            }
        }

        .mag-logo-text {
            font-family: var(--font-titles);
            font-size:   var(--space-md);
            font-weight: 600;

            @media (max-width: 919px) { justify-content: center; }
        }
    }

    .footer-section {
        display:         flex;
        flex-direction:  column;
        justify-content: space-around;
        height:          stretch;
        gap:             var(--space-xs);
        margin:          0 auto;

    }

    .footer-config-wrap {
        align-items: start;
        display:        flex;
        flex-direction: column;
        row-gap:        var(--space-md);
        flex: 4;

        @media (min-width: 929px) {
            display:               grid;
            grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
            row-gap:               var(--space-xs);
            column-gap:            var(--space-md);
            justify-content:       center;
            justify-items:         center;
        }
    }

    .footer-cta {
        display:         flex;
        flex-direction: column;
        gap:             var(--space-sm);
        @media (max-width: 919px) {
            align-items:center;
        }
        @media (min-width: 920px) {
            align-items: flex-start;
        }
        justify-content: center;
        margin:          0 auto;
        width: 100%;

        .btn{
            min-width: 220px;
        }
        
    }

    .footer-contact-info {
        width:           100%;
        .footer-icon {
            width:  16px;
            height: 16px;

            svg { width: 16px; height: 16px; }
        }
    }

    .footer-address {
        justify-content: center;

        .footer-icon {
            margin-top: 6px;
            @media (max-width: 782px) { left: calc(-1 * var(--space-sm)); }
        }

        .adress { min-width: 0;
            @media (max-width: 919px) { text-align: center; }
            @media (min-width: 920px) { flex: 1; }
        }
    }

    .footer-address,
    .footer-tel,
    .footer-email{
        gap: var(--space-xs);
    }

    .footer-tel,
    .footer-email { 
        justify-content:flex-start; 
        align-items:    center;
        a{
            text-decoration: none;
            &:hover{
                text-decoration: underline;
            }
        }
    }

    .footer-contact-info,
    .social-links-wrap {
        justify-content: start;
        @media (max-width: 782px) {
            align-items: center;
            text-align:  center;
            width:       100%;
        }
    }

    .footer-social-wrap {
        display:        flex;
        flex-direction: column;
        align-items:    center;
        width:          100%;

        .social-links-wrap { flex-direction: row; }

        @media (max-width: 919px) {
            justify-content: center;
            text-align:      center;
        }
        @media (min-width: 920px) {
            justify-content: flex-end;
            border-inline:   solid 1px var(--wp--preset--color--brand);
        }
    }

    .footer-bar {
        /*padding-block: var(--space-xs);*/

        #footer-navigation {
            text-align:   center;
            /*padding:      var(--space-xs) 0;*/
            /*margin-block: var(--space-lg) 0;*/
            .footer-nav{
                
                @media (max-width: 782px) {
                    display:flex;
                    flex-direction: column;
                }
                @media (min-width: 783px) {
                    display:inline-flex;
                }
                .menu-item{
                    padding:var(--btn-default-pv, var(--space-xs)) var(--btn-default-ph, var(--space-md));
                }
            }
        }

        .footer-signature { justify-content: center; }
    }
}

/* Gestion du bridge */
.bridge{
    .e-con-inner{
        --padding-top: 0px;
        --padding-bottom: 0px;
        --padding-block-start: var(--_padding-block);
        --padding-block-end: var(--_padding-block);
    }

    @media (max-width: 1545px){
        gap:           var(--space-sm);
        min-height:    var(--block-bridge-min-height);
    }
    @media (min-width: 1546px){
        gap:           var(--space-md);
        min-height:    var(--block-bridge-max-height);
    }
    border-radius:      0;
    text-align:         center;
    
    h2, 
    h2.elementor-heading-title,
    p, a{ text-align: center; position:relative; z-index:1; }

    .e-con { justify-content: center; }
}

/* Gestion du parallax sur le bridge */
.bridge.has-parallax{ 
    gap:0; 
    border-radius: 0;
    text-align: center;
    h2, h2.elementor-heading-title{ text-align: center; }
    .e-con{ justify-content: center; }
    .parallax img{
        opacity:.5;
        filter:brightness(.8)
    }
}

/* Exceptions parallax */
.bridge.has-parallax .e-con.e-child{ 
    flex:none; 
}
.bridge.has-parallax .e-con-inner > .elementor-element{
    max-width: var(--content-narrow)!important;
}

@media (max-width: 900px) {
    body:not(header, footer) .e-grid.e-con-boxed > .e-con-inner {
        grid-template-columns: 1fr;
    }
    .e-con-full.e-flex:has(.elementor-widget-button) { flex-wrap: wrap; }
    .e-grid:has(.elementor-widget-tm-accordion-card),
    .e-con.e-flex:has(.elementor-widget-tm-accordion-card) {
        align-items: start;
    }
}

/* Gras sur les boutons et liens 
.elementor-button span, .elementor-button a, .elementor-button .elementor-button-text,
.card-link.is-style-filled, .card-link.is-style-secondary{
    font-weight:        bold;
}*/

/* Styles de formulaires */
.wpcf7-form {
    background-color: var(--wp--preset--color--brand-light-90);
    margin:           var(--space-sm) auto;
    padding:          var(--space-md);
    border-radius:    var(--card-radius);
    box-shadow:       var(--card-shadow);
    font-family:      var(--font-body);

    label {
        display:       block;
        margin-bottom: var(--space-sm);
        font-weight:   400;
        color:         var(--wp--preset--color--text);
    }

    input[type="text"],
    input[type="email"],
    input[type="tel"],
    select,
    textarea {
        padding:          var(--space-xs) var(--space-sm);
        margin-top:       calc(var(--space-xs) / 2);
        min-height:       var(--space-md);
        font-size:        var(--wp--preset--font-size--xs);
        border:           1px solid var(--wp--preset--color--text);
        border-radius:    var(--global-radius);
        background-color: var(--wp--preset--color--white);

        &:focus {
            border-color: var(--wp--preset--color--black);
        }
    }

    textarea {
        max-height: var(--space-xl);
    }

    input[type="submit"] {
        width:      100%;
        cursor:     pointer;
        transition: background-color 0.3s ease,
                    outline 0.2s ease,
                    box-shadow 0.2s ease;
    }
}

/* Messages d'erreur */
.wpcf7-not-valid-tip {
    color:       var(--error);
    font-size:   0.9em;
    font-weight: normal;
    display:     block;
    margin-top:  var(--space-xs);
}
/* Exceptions formulaires */
.wpcf7-response-output{
    color: var(--wp--preset--color--text)!important;
    background-color: transparent!important;
    border:none!important;
}


/*
 ███████ ████████ ██    ██ ██      ███████ ███████
 ██         ██     ██  ██  ██      ██      ██
 ███████    ██      ████   ██      █████   ███████
      ██    ██       ██    ██      ██           ██
 ███████    ██       ██    ███████ ███████ ███████
*/

main{
    margin:0 auto;
    padding-top:        0; /*var(--container-padding-x);*/
    padding-bottom:     0;
}

.e-con[class*=is-style] {
    border-radius:      0; /* var(--card-radius); */
}

/*
header .bandeau.is-sticky-header.scrolled #barre-menu{ box-shadow: var(--btn-default-sh); }
*/

.site-header[class*=is-style] {
    &::before {
        background: var(--wp--preset--color--gradient-1);
        @media (max-width: 782px) {
            top:    calc(-1 * var(--header-height-xs));
            height: calc(100% + var(--header-height-xs));
        }
        @media (min-width: 783px) {
            top:    calc(-1 * var(--header-height));
            height: calc(100% + var(--header-height));
        }
    }
    &.is-boxed {
        &::before {
            @media (min-width: 783px) {
                top:    var(--space-md);
                height: calc(100% + var(--header-height));
            }
        }
    }
}

.elementor-widget-image.img-broken{
    &::after{
        display:none;
    }
    img::after{ display:none; }
}

h2.elementor-heading-title, h2{
    font-size: calc(0.8 * var(--wp--preset--font-size--lg));
}

/*
  ██████  ██    ██ ███████ ██████  ██████  ██ ██████  ███████
 ██    ██ ██    ██ ██      ██   ██ ██   ██ ██ ██   ██ ██
 ██    ██ ██    ██ █████   ██████  ██████  ██ ██   ██ █████
 ██    ██  ██  ██  ██      ██   ██ ██   ██ ██ ██   ██ ██
  ██████    ████   ███████ ██   ██ ██   ██ ██ ██████  ███████
*/

/* Mettre les classes override ici */

#banner{
  position: relative;
}
#banner::before{
  content: '';
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: var(--b-btn-gradient);
  filter:brightness(0.8);
  opacity: 0.5;
  z-index: 1;
}

header #barre-menu .header-elements-wrapper .btn, 
header #barre-menu .header-elements-wrapper .is-primary, 
header #barre-menu .header-elements-wrapper .is-secondary{
    @media (max-width: 919px) {                         font-size: var(--wp--preset--font-size--sm); }
    @media (min-width: 920px) and (max-width: 1225px) { font-size: calc(0.7 * var(--wp--preset--font-size--xs)); }
    @media (min-width: 1226px) and (max-width: 2559px){ font-size: calc(0.8 * var(--wp--preset--font-size--xs)); }
    @media (min-width: 2560px) {                        font-size: var(--wp--preset--font-size--xs); }
}

header #barre-menu .header-elements-wrapper .is-secondary{
    &:hover{
        --b-btn-secondary-bg-hover:   var(--wp--preset--color--brand-light-20);
        --b-btn-secondary-outline-hover: var(--wp--preset--color--brand-light-20);
        --b-btn-secondary-outline:    var(--wp--preset--color--white);
        --b-btn-secondary-text-hover: var(--wp--preset--color--white);
    }
}

.bandeau.is-sticky-header .mag-logo--default{
  position: relative;
}
.bandeau.is-sticky-header .mag-logo--default::before{
  content: var(--background-overlay);
  position: absolute;
  display: block;
  background-image: url(../../assets/logo_white.webp);
  background-repeat: no-repeat;
  background-size: cover;
  left: 0px !important;
  top: 0px !important;
  width: 250px !important;
  height: 200px !important;
  z-index: 1;
}
#banner{
  height: var(--banner-min-height);
  margin-top: 0;
}

/* Gestion des largeurs */
.text-left,
.text-right{
    .image,
    .card{
        @media (max-width: 919px){ 
            width: 100%;
        }
        @media (min-width: 920px) and (max-width: 1023px){ 
            width: 90%;
        }
        @media (min-width: 1226px) and (max-width: 1545px){
            width:      var(--block-img-xl-width, 40%)!important;
            max-width:  var(--block-img-xl-width, 40%)!important;
        }
        @media (min-width: 1546px) and (max-width: 2559.98px){
            width:      var(--block-img-max-width, 35%)!important;
            max-width:  var(--block-img-max-width, 35%)!important;
        }
        @media (min-width: 2560px){
            width:      var(--block-img-max-width, 35%)!important;
            max-width:  var(--block-img-max-width, 35%)!important;  
        }
    }
    [class*=elementor-widget-tm-]{
        @media (max-width: 919px){ 
            width: 100%;
        }
        @media (min-width: 920px) and (max-width: 1023px){ 
            width: 90%;
        }
        @media (min-width: 1226px) and (max-width: 1545px){
            width:      var(--block-img-xl-width, 40%);
            max-width:  var(--block-img-xl-width, 40%);
        }
        @media (min-width: 1546px) and (max-width: 2559.98px){
            width:      var(--block-img-max-width, 35%);
            max-width:  var(--block-img-max-width, 35%);
        }
        @media (min-width: 2560px){
            width:      var(--block-img-max-width, 35%);
            max-width:  var(--block-img-max-width, 35%);  
        }
    }
    .image{
        img { max-height: var(--img-max-height); width:100%; }
    }
    .text{
        @media (max-width: 919px){ 
            width: 100%;
        }
        @media (min-width: 920px) and (max-width: 1023px){ 
            width: 90%;
        }
        @media (min-width: 1226px) and (max-width: 1545px){
            width: var(--block-text-xl-width, 60%)!important;
        }
        @media (min-width: 1546px){
            width: var(--block-text-max-width, 65%)!important;
        }
    }
}
.text-left{
    .text{
        padding-right:  0;
        @media (min-width: 2560px){
            padding-right:  0;
        }
    }
}
.text-right{
    .text{
        @media (min-width: 2560px){
            padding-right:  var(--space-xl);
        }
    }
}

/* Gestion des before */
.bg.text-left, 
.bg.text-right{
  position: relative;
  &::before{
    content: "" !important;
    position: absolute;
    display: block;
    background-repeat: no-repeat;
    background-position: left;
    background-size: contain;
  }
}
.bg.text-left::before{
    background-image: var(--img-deco);
    left:         20px !important;
    top:          20px !important;
    width:        250px !important;
    height:       200px !important;
    z-index:      0;
}
.bg.text-right::before{
    background-image: var(--img-deco2); 
    left:         calc(100% - 20px) !important;
    top:          150px !important;
    width:        278px !important;
    height:       266px !important;
    z-index:      0;
    transform:    translateX(-100%);
}

/* Logo */
.bandeau.is-sticky-header.scrolled{
    [class*=mag-logo]{
        img{
            filter:brightness(100);
        }
    }
}

/* Modifier la couleur du logo avant le is-scrolled */
.bandeau.is-sticky-header.is-style-switcher-dark{
    background: transparent;
}
.bandeau.is-sticky-header.is-style-switcher-dark{
    .mag-logo-wrap__default{
        img{
            filter:brightness(100);
        }
    }
}
.bandeau.is-sticky-header.scrolled{
    box-shadow: var(--sh-strong);
}

/* Modifier la couleur des boutons du header */
.bandeau.is-sticky-header.is-style-light{
    .btn:not(.is-secondary){
        --b-btn-bg:                 var(--wp--preset--color--brand);
        --b-btn-text:               var(--wp--preset--color--white);
        background-image:           none;
    }

    .btn.is-secondary{
        --b-btn-secondary-text:     var(--wp--preset--color--brand);
        --b-btn-secondary-outline:  var(--wp--preset--color--brand);
    }
}


/* Bloc avec les custom grids */
.bloc-grid{
    .e-con-inner{
        @media (max-width: 919px) {   
            --flex-direction: column;                      
            flex-direction: var(--flex-direction);
        }
        @media (min-width: 920px){ 
            --flex-direction: row;                           
            flex-direction:  var(--flex-direction);
        }
        @media (min-width: 920px) and (max-width: 1023px){ 
            width: 90% !important;
        }
    }

    .col-picto{
        @media (max-width: 919px) {  
            width:auto;
        }
    }

    .order-mq-1{
        @media (max-width: 919px) { 
            --var-order:1;
            order: var(--var-order);
        }
    }
    .order-mq-2{
        @media (max-width: 919px) { 
            --var-order:2;
            order: var(--var-order);
        }
    }
    .order-mq-3{
        @media (max-width: 919px) { 
            --var-order:3;
            order: var(--var-order);
        }
    }
    .elementor-widget-button{
        @media (max-width: 919px) { 
            text-align: left;
        }
    }
    .as-start:has(.elementor-widget-button){
        @media (min-width: 920px) { 
            margin-left: var(--space-md);
        }
    }
    .flex-col-2-5{
        position:relative;
        @media (min-width: 920px) { 
            &::before{
                position:absolute;
                content:"";
                top:0;
                width:2px;
                height: stretch;
                border-left-style:  solid;
                border-left-width:  2px;
                border-left-color:  var(--wp--preset--color--brand);
                left: calc(-1 * var(--space-md));
            }
            &::after{
                position:absolute;
                content:"";
                top:0;
                width:2px;
                height: stretch;
                border-right-style:  solid;
                border-right-width:  2px;
                border-right-color:  var(--wp--preset--color--brand);
                right: calc(-2 * var(--space-md));
            }
        }

    }
}

.eco-badge-container-dark{
    /*background:var(--b-btn-gradient);*/
    background: var(--wp--preset--color--dark);
}

/* Override des valeurs */
.e-con:not([class*=is-style-]):not([class*=is-style-] *), 
.e-con.is-banniere:not([class*=is-style-]):not([class*=is-style-] *){
    --b-heading:        var(--wp--preset--color--brand);
    --b-heading-alt:    var(--wp--preset--color--accent-1);
}

.e-con.is-style-muted{
    --b-bg: var(--wp--preset--color--brand-light-90);
}
.e-con {
    .tm-accordion-item summary.tm-accordion-summary:hover {
        --acc-bg-header-hover: var(--wp--preset--color--brand-light-80)!important;
    }
}

.tm-card-item.card-theme-brand{
    --card-text: var(--wp--preset--color--white)!important;
    --card-heading: var(--wp--preset--color--white)!important;
}

.tm-grid{
    .tm-card-item.card-theme-sans-light.card-style-default {
      --card-bg: var(--wp--preset--color--white);
    }
}

.card-footer-action{
    .card-link.is-style-simple{
        padding:0!important;
    }
}

.block-3-cards{
    .tm-card-item{
        transform: none;
        box-shadow: none;
    }
    .elementor-widget-tm-flexible-card.border{
        overflow: visible;
        position:relative;
        @media (min-width: 920px) { 
            &::before{
                position:absolute;
                content:"";
                top:0;
                width:2px;
                height: stretch;
                border-left-style:  solid;
                border-left-width:  2px;
                border-left-color:  var(--wp--preset--color--brand);
                left: calc(-1 * var(--space-md));
            }
            &::after{
                position:absolute;
                content:"";
                top:0;
                width:2px;
                height: stretch;
                border-right-style:  solid;
                border-right-width:  2px;
                border-right-color:  var(--wp--preset--color--brand);
                right: calc(-1 * var(--space-md));
            }
        }
        @media (max-width: 919px) { 
            &::before{
                position:absolute;
                content:"";
                left:0;
                width:100%;
                height: stretch;
                border-top-style:  solid;
                border-top-width:  2px;
                border-top-color:  var(--wp--preset--color--brand);
                top: calc(-1 * var(--space-xs));
            }
            &::after{
                position:absolute;
                content:"";
                left:0;
                width:100%;
                height: stretch;
                border-bottom-style:  solid;
                border-bottom-width:  2px;
                border-bottom-color:  var(--wp--preset--color--brand);
                bottom: calc(-1 * var(--space-xs));
            }
        }
    }
}

/* Block 4 colonnes (e-con-boxed) */
.block-4-cols {
  > .e-con-inner {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;

    @media (max-width: 919px) { 
        flex-wrap: wrap;
        gap: var(--space-lg)!important;
    }
    @media (min-width: 920px) {
        gap: var(--space-md)!important;
    }
    > .flex-col-1 {
        display: flex !important;
        flex-direction: column !important;
        min-height: 100% !important;
        justify-content: space-between !important;

        > .elementor-widget-text-editor {
            flex: 1 !important;
        }
        .icon-150{
            margin:  0!important;
            text-align: left!important;
        }
        @media (max-width: 919px) {
            gap: var(--space-sm)!important;
        }
        @media (min-width: 920px) {
            gap: var(--space-sm)!important;
        }
    }
  }
}

.chiffres{
    h3{
        font-size: var(--wp--preset--font-size--xs);
        span,
        span.texte-degrade{
            display:block;
            font-size: var(--wp--preset--font-size--lg);
            font-weight: bold;
        }
    }
}

.texte-degrade {
    background: var(--e-text-gradient);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.mag-partenaires-list{
    display:inline-flex;
    gap: var(--space-lg);
    justify-content: center;
    width:100%;
    .mag-partenaire-item:last-of-type{
        .mag-partenaire-logo{
            padding: var(--space-md);
        }
    }
}


/* Chronologie */
/*
.timeline{
    padding-top: var(--space-lg);
    padding-bottom: var(--space-lg);

    .ln-stop{
        position:           relative;
        font-family:        var(--font-titles); 
        color:              var(--ln-brand);
        padding:            0 var(--space-sm);
        text-align:         center;
    }
    .ln-stop *{box-sizing:border-box;}

    .ln-head{
        position:           relative;
        height:             var(--ln-head);
        margin-bottom:      var(--space-sm);
    }
    .ln-dot{
        position:           absolute;
        left:               50%;
        top:                50%;
        transform:          translate(-50%,-50%);
        width:              var(--space-sm);
        height:             var(--space-sm);
        border-radius:      50%;
        background:         var(--ln-white);
        border:             4px solid var(--ln-brand);
        z-index:            2;
    }

    .ln-stop--now .ln-dot{
        border-color:       var(--ln-red);
    }

    .ln-year{
        font-family:        var(--font-body); 
        font-weight:        700;
        font-size:          var(--wp--preset--font-size--md); 
        display:            block;
        margin-bottom:      6px;
    }
    .ln-now{
        display:            block;
        font-family:        var(--font-titles); 
        font-size:          var(--wp--preset--font-size--xs); 
        font-weight:        600;
        letter-spacing:     .12em;
        text-transform:     uppercase;
        color:              var(--ln-red);
        margin-top:         2px;
    }
    .ln-h{
        font-size:          var(--wp--preset--font-size--sm);
        font-weight:        600;
        margin:             0 0 6px;
        line-height:        1.3;
    }
    .ln-txt{
        margin:             0;
        font-size:          var(--wp--preset--font-size--xs); 
        line-height:        1.55;
        color:              var(--ln-brand-soft);
    }


    .ln-head::before,
    .ln-head::after{
        content:'';
        position:absolute;
        top:50%;
        height:4px;
        background:var(--ln-brand);
        transform:translateY(-50%);
        z-index:1;
        display:none;
    }
    .ln-line-left .ln-head::before{
        display:block;
        right:50%;
        width:calc(50% + var(--ln-bridge));
    }
    .ln-line-right .ln-head::after{
        display:block;
        left:50%;
        width:calc(50% + var(--ln-bridge));
    }

    .ln-turn{
        display:none;
        position:absolute;
        left:50%;
        width:4px;
        background:var(--ln-brand);
        transform:translateX(-50%);
        z-index:1;
    }
    .ln-turn-down .ln-turn{
        display:block;
        top:50%;
        height:var(--ln-bridge-v);
    }
    .ln-turn-up .ln-turn{
        display:block;
        bottom:50%;
        height:var(--ln-bridge-v);
    }

    .ln-row2{flex-direction:row-reverse;}

    @media (max-width:767px){
        gap:0!important;
        padding-top: var(--space-md);
        padding-bottom: var(--space-md);

        .ln-row2{flex-direction:row;} 

        .ln-stop{
            text-align:left;
            padding:0 0 34px 34px;
        }
        .ln-head{
            height:auto;
            margin:0;
            position:static;
        }
        .ln-dot{
            left:8px;
            top:8px;
            transform:none;
        }
        .ln-year{display:inline-block;margin-right:8px;font-weight:400;}
        .ln-now{display:inline;margin-left:6px;}

        .ln-head::before,.ln-head::after,.ln-turn{display:none !important;}

        .ln-stop::before{
            content:'';
            position:absolute;
            left:15px;
            top:-2px;
            width:2px;
            background:var(--ln-track);
            height:calc(100% + 4px);
            z-index:0;
        }
        .ln-first::before{top:14px;}
        .ln-last::before{height:16px;}
    }
} */

.timeline{
    .elementor-widget-tm-flexible-card{
        .card-content{
            text-align: center;
            width:100%;
            h3.card-title{
                font-family:        var(--font-body); 
                font-weight:        700;
                font-size:          var(--wp--preset--font-size--sm); /*22px;*/
                display:            block;
                margin-bottom:      6px;
                color:              var(--wp--preset--color--brand);
                span.now{
                    display:            block;
                    font-family:        var(--font-titles); /*'Barlow',Arial,sans-serif;*/
                    font-size:          var(--wp--preset--font-size--xs); /*10px;*/
                    font-weight:        600;
                    letter-spacing:     .12em;
                    text-transform:     uppercase;
                    color:              var(--ln-red);
                    margin-top:         2px;
                }
            }
            .card-body{
                h4{
                    margin:             0;
                    font-size:          var(--wp--preset--font-size--xs);
                    line-height:        1.55;
                    color:              var(--ln-brand-soft);
                }
                p{
                    margin:             0;
                    font-size:          calc(0.8 * var(--wp--preset--font-size--xs)); 
                    line-height:        1.55;
                }
            }
        }
    }
    .timeline-stop{
        position:   relative;
        min-height: 220px;
    }

    .timeline-stop{ overflow: visible;
        .tm-card-item{ 
            overflow: visible;
            display: flex;
            justify-content: center;

            &::before{
                content:            "";
                background-color:   var(--wp--preset--color--white);
                border:             solid 4px var(--wp--preset--color--brand);
                width:              20px;
                height:             20px;
                position:           absolute;
                border-radius:      var(--radius-round);
                z-index:            1;

                @media (max-width: 767px) {
                    bottom:             calc(-1 * (20px / 2));
                }
                @media (min-width: 768px) {
                    bottom:             calc(50% - 20px / 2);
                }
            }
            &::after{
                content:            "";
                position:           absolute;
                z-index:            -1;
                @media (max-width: 767px) {
                    right:              calc(50% - (4px / 2));
                    bottom:             -100px;
                    height:             200px;
                    border-left:        solid 4px var(--wp--preset--color--brand);
                }
                @media (min-width: 768px) {
                    border-bottom:      solid 4px var(--wp--preset--color--brand);
                    width:              -webkit-fill-available;
                    right:              calc(-1 * (var(--card-padding) * 2) - var(--space-xl) + 20px);
                    bottom:             calc(50% - 4px / 2);
                }
            } 
        }
    }

    .flex-dir-row{
        .timeline-stop:first-child{ 
            .tm-card-item{
                &::before{
                    @media (max-width: 767px) {
                        right:      calc(50% - (20px / 2));
                    }
                    @media (min-width: 768px) {
                        right:      calc(-1 * (20px / 2));
                    }
                }
            } 
        }
        .timeline-stop:last-child{ 
            .tm-card-item{
                &::before{
                    @media (max-width: 767px) {
                        right:      calc(50% - (20px / 2));
                    }
                    @media (min-width: 768px) {
                        left:       calc(-1 * (20px / 2));
                    }
                }
                &::after{
                    @media (min-width: 768px) {
                        display:    none;
                    }
                }
            } 
        }
    }

    .timeline-end{
        .tm-card-item{
            --card-bg: var(--wp--preset--color--brand-light-80);
        }
    }
}