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

/* ── 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--brand);
    --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-content:                 150px;
    --logo-width-max:               200px;
    --block-bridge-min-height:      360px;
    --block-bridge-max-height:      500px;
    --banner-xs-min-height:         60vh;
    --banner-xs-max-height:         60vh;
    --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;
    --btn-default-height:           52px;
    --btn-picto-size:               1em;
    --btn-picto-gap:                var(--space-xs);

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

        /* 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%;

    /* Si inutilisé, supprimer
    --img-deco:                     url(../../../../uploads/2026/06/motif2-fixed.svg);
    --img-deco-height:              432px;
    --img-deco-width:               222px;

    --bridge-bg:                    url(../../../../uploads/2026/06/pattern-fixed.svg);
    --block-bg:                     url(../../../../uploads/2026/06/deco-min.webp);*/

    /* Overide les couleurs du badge en version sombre */
    --eco-badge-dark-background:    var(--wp--preset--color--brand-dark-60);
    --shadow-color-rgb:             76 105 235;

    /* 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));
}

/* ─────────────────────────────────────────────────────
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(--body-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);
    }
    /*
    img:is([sizes=auto i],[sizes^="auto," i]){
        contain-intrinsic-size:revert;
    }*/
}

.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);
        }
    }
}

/* ─────────────────────────────────────────────────────
Paramétrages du border radius du bandeau menu isboxed si topbar existant
──────────────────────────────────────────────────────── */
body:has(.site-topbar),
body.has-topbar{
    .bandeau.is-sticky-header.is-boxed{
        border-radius: 0;
    }
    #banner.is-boxed{
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        .image-switcher,
        .image-switcher__item{
            border-top-left-radius: 0;
            border-top-right-radius: 0;
        }
    }
}

body:has(.signature.is-boxed){
    .site-footer.is-boxed{
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }
    .signature.is-boxed{
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }
}

body.has-signature{
    .site-footer.is-boxed{
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }
    .signature.is-boxed{
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }
}


/* ─────────────────────────────────────────────────────
Paramétrages de la signature
──────────────────────────────────────────────────────── */
.eco-badge-dark{
    background-color: var(--eco-badge-dark-background);
    border:1px solid var(--eco-badge-dark-background);
    box-shadow: 0 0 15px rgba(128 182 233, 0.1);
}

/* Topbanner en mode boxed */
.signature.is-boxed {
    border-top-left-radius:0;
    border-top-right-radius:0;
}

/* ─────────────────────────────────────────────────────
Paramétrages de la top banner
──────────────────────────────────────────────────────── */
.site-topbar-inner {
    justify-content:flex-end;
    gap: var(--space-xs);
}

/* Topbanner en mode boxed */
.site-topbar.is-boxed {
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
}

/* ─────────────────────────────────────────────────────
Paramétrages du footer
──────────────────────────────────────────────────────── */
body footer.site-footer.is-boxed,
.site-footer{
    @media (max-width: 782px) { padding-top: var(--space-xl); }
    padding-inline: var(--container-padding-x);
    padding:        var(--container-padding-x);
}

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

/* Modifier l'ordre des colonnes de footer section */
.footer-contact-info{ order:1; }
.footer-cta{ order:2; }
.footer-social-wrap{ order:4; }
.footer-hours{ order:3; }

/* Alignement des textes */
.site-footer h3,
.site-footer p{
    @media (max-width: 919px) {
        text-align:     center;
    }
    @media (min-width: 920px) {
        text-align: left;
    }
}

.footer-cta .btn{
    min-width:230px;
}

/* Styles du logo footer */
.site-footer img {
    @media (max-width: 919px) {
        height: auto;
        margin: 0 auto;
        width:  var(--logo-width-max);
    }
    @media (min-width: 920px) {
        height: auto;
        width:  var(--logo-width-fluid);
    }
}

/* Styles du fallback logo footer */
.site-footer .mag-logo-text {
    font-family:    var(--font-titles);
    font-size:      var(--space-md);
    font-weight:    600;
    justify-content:center;
}

/* Taille des titres */
.footer-title{
    font-size: calc(0.9 * var(--wp--preset--font-size--sm));
}

/* Taille des textes */
.site-footer p,
.footer-address .adress,
.footer-tel a,
.footer-email a{
    font-size: calc(0.9 * var(--wp--preset--font-size--xs));
    @media (max-width: 919px) {
        justify-content: center;
    }
}

.site-footer .footer-tel, .site-footer .footer-email {
    display: flex;
    align-items: center;
    @media (max-width: 919px) {
        justify-content: center;
    }
}

.footer-tel .btn-wrap{
    @media (max-width: 919px) {
        text-align: center;
    }
    .btn{
        min-width:250px;
    }
}

/* Taille des icones */
.footer-contact-info {
    .footer-icon {
        width:  16px;
        height: 16px;
        svg { width: 16px; height: 16px; }
    }
}

.footer-brand{
    @media (max-width: 919px) {
        gap: var(--space-md);
        flex-direction: column;
        margin-top:     var(--space-xl);
    }
    @media (min-width: 920px) {
        gap: var(--space-md);
        justify-content: space-between;
    }
}

.footer-config-wrap {
    flex-grow: 0.8;
    @media (max-width: 919px) {
        flex-direction: column;
    }
    @media (min-width: 920px) {
        display: grid;
        grid-auto-flow: row;
        gap: var(--space-md);

        /* Par défaut : marque + 1 colonne optionnelle (2 colonnes) */
        grid-template-columns: repeat(2, auto);

        /* 2 colonnes optionnelles présentes → 3 colonnes */
        &:has(.footer-contact-info):has(.footer-cta):has(.footer-hours):not(:has(.footer-social-wrap)),
        &:has(.footer-contact-info):has(.footer-cta):has(.footer-social-wrap):not(:has(.footer-hours)),
        &:has(.footer-contact-info):has(.footer-hours):has(.footer-social-wrap):not(:has(.footer-cta)) {
        grid-template-columns: repeat(3, auto);
        }

        /* 3 colonnes optionnelles présentes → 4 colonnes (dès 920px, pas besoin d'un 2e breakpoint) */
        &:has(.footer-contact-info):has(.footer-cta):has(.footer-hours):has(.footer-social-wrap) {
        grid-template-columns: repeat(4, auto);
        }
    }

    /* Si 4 colonnes deviennent trop serrées sur écran moyen, on peut les repasser à 2 lignes de 2 */
    @media (min-width: 920px) and (max-width: 1224px) {
        &:has(.footer-contact-info):has(.footer-cta):has(.footer-hours):has(.footer-social-wrap) {
        grid-template-columns: repeat(2, auto);
        }
    }
}

/* les 4 colonnes s'empilent aussi
.footer-brand .footer-config-wrap {
  grid-template-columns: 1fr;
}*/

/* Colonnes dans le footer */
.footer-section{
    display:         flex;
    flex-direction:  column;
    margin:          0 auto;
    gap:             var(--space-xs);

    @media (max-width: 919px) {
        align-items:center;
    }
    @media (min-width: 920px) {
        align-items:flex-start;
    }
}


/* Styles des colonnes d'adresse */
.footer-address,
.footer-tel,
.footer-email,
.social-links-wrap {
    gap: var(--global-gap);
    @media (max-width: 919px) {
        justify-content:center;
    }
    @media (min-width: 920px) {
        justify-content:flex-start;
    }
}

/* Styles de la colonne d'adresse */
.footer-address{
    .footer-icon {
        margin-top: 6px;
        @media (max-width: 782px) { left: calc(-1 * var(--space-sm)); }
    }

    .adress {
        min-width: 0;
        width:auto;
    }
}

/* 100% de largeur sur les colonnes d'adresse et d'horaire */
.footer-section{
    @media (max-width: 919px) {
       padding-block: var(--space-md);
    }
    width:100%;
}

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

    #footer-navigation {
        text-align:   center;
        padding:      var(--space-xs) 0;
    }

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


header #barre-menu { min-height: var(--header-height); }

/* Réduire la taille des boutons
header #barre-menu .header-elements-wrapper,
footer .footer-config-wrap .footer-cta {
    .btn,
    .is-primary,
    .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.8 * var(--btn-default-fz));
        }
    }
} */

/* Hauteurs */
header .site-banner {
    margin-top:         calc(var(--header-height) - 2px);
    @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: 1546px){
        max-height:     calc(var(--banner-max-height) - (var(--banner-max-height)) / 4);
        min-height:     calc(var(--banner-max-height) - (var(--banner-max-height)) / 4);
    }
}

/* Taille des boutons toggle */
.nav-toggle-open,
.nav-toggle-close {
    color:              var(--b-bg);
    background-color:   var(--b-nav);
    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-nav);
        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);
        justify-content: space-between;
        @media (max-width: 919px) {

            gap:             var(--global-gap);
        }
        @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(1 * var(--wp--preset--font-size--xs)); gap: 0; }
        @media (min-width: 1226px) and (max-width: 2559px){ font-size: calc(1 * 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); }
    }
    #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;
        }
    }
}

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%);
        }
    }
}

header .site-banner .banner-content {
    h1{
        font-weight:    400;
        font-size:      var(--wp--preset--font-size--xxl);
        line-height:    auto;
        font-family:    var(--font-titles);
        span {
            font-family:   var(--font-body);
            font-size:     var(--wp--preset--font-size--xxl);
        }
    }
    .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);
    }
}

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;

        .mag-logo--scroll{
            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);
            .mag-logo--scroll{
                width:  auto;
                height: var(--logo-height);
                padding:     calc(var(--space-md) - var(--space-xs)) 0;
            }
        }
    }
}


.header-social-wrap{

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

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);
    }
}

@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;
    }
}

/* Image switcher */
.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%;
}

/* Picto réseaux sociaux */
.header-social-wrap{
    .social-links-wrap {
        justify-content: space-around;
        gap: var(--global-gap);
    }
}

.elementor-button span, .elementor-button a, .elementor-button .elementor-button-text,
.card-link.is-style-filled, .card-link.is-style-secondary{
    font-weight: 400;
}

/* ─────────────────────────────────────────────────────
Classe d'animation
──────────────────────────────────────────────────────── */
.reveal-on-scroll {
    opacity: 0;
    transform: translateY(100px);
    transition: opacity 0.6s ease-out 0.30s, transform 0.6s ease-out 0.30s;
}
.reveal-on-scroll.is-revealed {
    opacity: 1;
    transform: none;
}
@media (prefers-reduced-motion: reduce) {
    .reveal-on-scroll {
        transition: none;
        opacity: 1;
        transform: none;
    }
}

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

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

/* Gestion des largeurs
.text-left,
.text-right{

}*/


/* Gestion de la position des éléments décoratifs */
.text-right{
    .deco{
        &:not(.img-broken){
            img {
                @media (max-width: 1225px){ mask-position:  240% 160%, center; }
                @media (min-width: 1226px) and (max-width: 2559.98px){ mask-position:  180% 160%, center; }
                @media (min-width: 2560px){ mask-position:  120% 160%, center; }
            }
        }
        &::after{
            transform:  rotate(-25deg);
            @media (max-width: 1380px) { left:   calc(-1 * var(--space-sm)); }
            @media (min-width: 1440px) { left:   calc(-1 * var(--space-lg)); }
        }
    }
}

.text-left{
    .deco{
        &:not(.img-broken){
            img {
                @media (max-width: 1225px){ mask-position:  -100% 220%, center; }
                @media (min-width: 1226px){ mask-position:  -120% 220%, center; }
            }
        }
        &::after{
            transform:  rotate(-185deg);
            @media (max-width: 1380px) { right:   calc(-1 * var(--space-sm)); }
            @media (min-width: 1440px) { right:   calc(-1 * var(--space-lg)); }
        }
    }
}

/* Gestion des éléments décoratifs */
.deco{
    &:not(.img-broken){
        position:relative; overflow:visible;
        /* Mask de l'image */
        img {
            -webkit-mask-image:    var(--img-deco), linear-gradient(black, black);
            mask-image:            var(--img-deco), linear-gradient(black, black);
            mask-repeat:           no-repeat,       repeat;
            mask-size:             var(--img-deco-width) var(--img-deco-height), cover;
            mask-composite:        exclude;
        }

        /* Element décoratif */
        &::after{
            position:absolute;
            content:"";
            top:              0;
            z-index:          -1;
            background-image: var(--img-deco);
            height:           var(--img-deco-height);
            width:            var(--img-deco-width);
            fill:             var(--wp--preset--color--accent-1);
        }
    }
}

/* Exceptions décorations */
.img-broken{
    &::after{
        display:none;
    }
    img::after{ display:none; }
}

/* Gestion du bridge */
.e-con.bridge{
    @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);
    }

    overflow:           hidden;
    position:           relative;
    border-radius:      0;
    align-items:        center;
    justify-content:    center;

    &::before {
        content:          "";
        position:         absolute;
        inset:            0;
        z-index:          0;
        pointer-events:   none;
        background-color: var(--b-bg-alt);
        mask-image:       var(--bridge-bg);
        mask-repeat:      repeat;
        mask-size:        calc(2 * var(--space-xl));
        opacity:          .3;
    }

    > * { position: relative; z-index: 1; text-align: center;}

    .text{
        @media (max-width: 919px){
            width: 100%;
        }
        @media (min-width: 920px) and (max-width: 1023px){
            width: 80%;
        }
        @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;
        }
        @media (min-width: 2560px){
            padding-right:  var(--space-xl);
        }
    }

    h2, h2.elementor-heading-title { text-align: center; }

    .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; margin:0 auto; }
    .e-con{ justify-content: center; }
    .parallax img{
        opacity:.8;
        filter:brightness(.8)
    }
}

/* Exceptions parallax */
.e-con.bridge.has-parallax .e-con.e-child{
    flex:none;
}

/* Formulaires */
.wpcf7-form {
    background-color: var(--wp--preset--color--accent-1);
    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:   600;
        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 formulaire */
.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:        var(--container-padding-x);
    padding-bottom:     var(--container-padding-x);*/
    padding-inline: 0;
}

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



.elementor-widget-image.deco{
    img {
        outline:        2px solid var(--wp--preset--color--gradient-2);
        outline-offset: calc(-1 * var(--space-sm));
    }
}

.card{
    overflow: visible;
}
.tm-card-item[class*=card-theme]{
    outline:        2px solid var(--b-border);
    outline-offset: calc(-1 * var(--space-sm));
    position:       relative;
    z-index:        1;
    overflow:       visible;

    &::before{
        position:           absolute;
        content:            "";
        overflow:       visible;

        @media (min-width: 920px){
            background-color:   var(--card-bg);
            -webkit-mask-image: var(--img-deco);
            mask-image:         var(--img-deco);
            mask-repeat:        no-repeat;
            mask-size:          contain;

            top:                calc(50% - (var(--img-deco-height) / 2));
            z-index:            -1;
            height:             var(--img-deco-height);
            width:              var(--img-deco-width);
            scale:1.2;
        }
    }
}

header .bandeau.is-sticky-header.scrolled{ box-shadow: var(--btn-default-sh); }

.site-header[class*=is-style] {
    &::before {
        background: var(--wp--preset--color--gradiant-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));
            }
        }
    }
}

.bg:not([class*=is-style]){
        @media (min-width: 783px) {
            &::before{
                content:                var(--background-overlay);
                background-image:       var(--block-bg);
                background-repeat:      no-repeat;
                background-position:    top;
                opacity:                .6;
            }
        }

    &.text-left{
        &::before{
            background-position:    60%;
        }
    }
    &.text-right{
        &::before{
            background-position:    40%;
        }
    }
}

.elementor-widget-tm-flexible-card{
    .tm-card-item.card-structure-editor{
        .card-body {
            img[src$=".svg"] {
                width: 33.33%;
            }
        }
    }
}

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

/* Mettre les classes override ici */

h1 span{
  font-family: var(--font-titles) !important;
  font-weight: 600 !important;
  /*color: rgb(247, 214, 197) !important;*/
  color: #b68163 !important;
}
.bg-full, .site-banner{
  position: relative;
}
.bg-full::before{
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #b68163;
  background: linear-gradient(166deg, rgba(182, 129, 99, 1) 61%, rgba(197, 133, 205, 1) 100%);
  opacity: 0.6;
}
.site-banner::after{
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #f6f7f7;
  opacity: 0.6;
}
.full-alt{
  background-color: #f6f7f7 !important;
}
p, a, input, textarea{
  font-size: calc(0.8* var(--wp--preset--font-size--xs)) !important;
}
h2.elementor-heading-title, h2 {
    font-family: var(--wp--preset--font-family--titles, var(--wp--preset--font-family--titles)) !important;
    font-size: var(--wp--preset--font-size--md) !important;
}
h3.elementor-heading-title, h3 {
    font-family: var(--wp--preset--font-family--titles, var(--wp--preset--font-family--titles)) !important;
    font-size: calc(0.8* var(--wp--preset--font-size--md)) !important;
}
.no-color img{
    background-color: #ffffff00 !important;
}
.elementor-button{
  border-width: 1px !important;
}
.elementor-button span{
  font-weight: 400 !important;
}
.elementor-button:hover{
  background-color: #ffffff !important;
  filter: none !important;
}
.elementor-button:hover span{
  color: var(--b-btn-bg) !important;
}

.site-logo-wrapper .mag-logo-wrap, .site-logo-wrapper .mag-logo-wrap__default, .site-logo-wrapper img{
  width: 290px !important;
}
.triple-o{
  border: 1px solid #b68163 !important;
  padding: 20px !important;
  border-radius: 20px !important;
}

.femme_b, .libellule_b, .pierre_b, .pierre-plate_b, .papillon_b, .femme_n, .libellule_n, .pierre_n, .pierre-plate_n, .papillon_n, .sb-sign{
  position: relative;
}
.femme_b::before{
  content: '';
  display: block;
  position: absolute;
  width: 300px;
  height: 300px;
  top: 20px;
  left: 20px;
  background-image: url('/wp-content/themes/hello-theme-child-master/assets/femme_b.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.libellule_b::before{
  content: '';
  display: block;
  position: absolute;
  width: 400px;
  height: 200px;
  top: 20px;
  left: calc(100% - 420px);
  background-image: url('/wp-content/themes/hello-theme-child-master/assets/libellule_b.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.papillon_b::before{
  content: '';
  display: block;
  position: absolute;
  width: 400px;
  height: 400px;
  top: 20px;
  left: 20px;
  background-image: url('/wp-content/themes/hello-theme-child-master/assets/papillon_b.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.pierre-plate_b::before{
  content: '';
  display: block;
  position: absolute;
  width: 300px;
  height: 300px;
  top: 20px;
  left: 20px;
  background-image: url('/wp-content/themes/hello-theme-child-master/assets/pierre-plate_b.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.pierre_b::before{
  content: '';
  display: block;
  position: absolute;
  width: 350px;
  height: 350px;
  top: 20px;
  left: calc(100% - 370px);
  background-image: url('/wp-content/themes/hello-theme-child-master/assets/pierre_b.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.femme_n::before{
  content: '';
  display: block;
  position: absolute;
  width: 300px;
  height: 300px;
  top: 20px;
  left: 20px;
  background-image: url('/wp-content/themes/hello-theme-child-master/assets/femme_n.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.libellule_n::before{
  content: '';
  display: block;
  position: absolute;
  width: 400px;
  height: 200px;
  top: 20px;
  left: calc(100% - 420px);
  background-image: url('/wp-content/themes/hello-theme-child-master/assets/libellule_n.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.papillon_n::before{
  content: '';
  display: block;
  position: absolute;
  width: 400px;
  height: 400px;
  top: 20px;
  left: 20px;
  background-image: url('/wp-content/themes/hello-theme-child-master/assets/papillon_n.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.pierre-plate_n::before{
  content: '';
  display: block;
  position: absolute;
  width: 300px;
  height: 300px;
  top: 20px;
  left: 20px;
  background-image: url('/wp-content/themes/hello-theme-child-master/assets/pierre-plate_n.svg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
.pierre_n::before{
  content: '';
  display: block;
  position: absolute;
  width: 350px;
  height: 350px;
  top: 20px;
  left: calc(100% - 370px);
  background-image: url('/wp-content/themes/hello-theme-child-master/assets/pierre_n.svg');
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center;
}
@media (max-width: 1700px){
  .libellule_b::before, .libellule_n::before, .papillon_n::before, .papillon_b::before{
    width: 300px;
    height: 300px;
  }
}
@media (max-width: 1400px){
  .libellule_b::before, .libellule_n::before, .papillon_n::before, .papillon_b::before{
    width: 300px;
    height: 300px;
    opacity: 0.4;

  }
}
/*@media (max-width: 1400px){
  .libellule_b::before, .libellule_n::before, .papillon_n::before, .papillon_b::before{
    width: 100px;
    height: 100px;
  }
}
*/


.sb-sign::after{
  content: '';
  display: block;
  position: absolute;
  width: 150px;
  height: 150px;
  top: 0;
  left: 50%;
  background-image: url('/wp-content/themes/hello-theme-child-master/assets/sb_only2.webp');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  transform: translate(-50%, -50%);
}

h2{
  position: relative;
}
h2::after{
  content: '';
  display: block;
  position: absolute;
  width: 35px;
  height: 1px;
  background-color: #b68163;
  bottom: -20px;
  left: 0;
}
@media (max-width: 767px){
  h2::after{
    left: 50%;
    transform: translateX(-50%);
  }
}
.bg-full h2::after{
  content: '';
  display: block;
  position: absolute;
  width: 35px;
  height: 1px;
  background-color: #b68163;
  bottom: -20px;
  left: 50%;
  transform: translateX(-50%);
}
.bg-full *{
  color: #ffffff !important;
}
#menu-default .sub-menu{
  background-color: #ffffff !important;
  padding: 10px !important;
}
#menu-default .sub-menu li{
  margin-bottom: 10px;
}
#menu-default a{
  padding: 0 !important;
  margin-left: 20px !important;
  border-radius: 0px !important;
  border-bottom: solid 0px #b68163 !important;
  transition: all ease 0.3s;
}
#menu-default li:hover a{
  background-color: #ffffff00 !important;
  color: #000000 !important;
}
#menu-default a:hover{
  background-color: #ffffff00 !important;
  padding-bottom: 10px !important;
  border-bottom: solid 1px #b68163 !important;
  color: #000000 !important;
}
.header-cta .btn{
  background-color: #b68163 !important;
  color: #ffffff !important;
  border-width: 1px !important;
}
.header-cta .btn:hover{
  background-color: #ffffff !important;
  filter: none !important;
  color: #b68163 !important;
}


.wpcf7-form{
  background-color: #ffffff !important;
  padding: 0 !important;
  margin: 0 !important;
}
.c1 input, .c2 input{
  width: 48%;
}
.c1 .nom, .c2 .email{
  margin-right: 2%;
}
.c1 .prenom, .c2 .tel{
  margin-left: 2%;
}
.sujet{
  margin-bottom: 15px;
}
.c1 input, .c2 input, .c3 textarea, .c3 input{
  border: 1px solid #b68163 !important;
  border-radius: 20px !important;
}
.c1 input::placeholder, .c2 input::placeholder, .c3 textarea::placeholder, .c3 input::placeholder{
  color: #000000 !important;
}
.c1 input:active, .c2 input:active, .c3 textarea:active, .c3 input:active{
  border: 1px solid #b68163 !important;
  border-radius: 20px !important;
}
.c1 input:focus-visible, .c2 input:focus-visible, .c3 textarea:focus-visible, .c3 input:focus-visible{
  border: 1px solid #b68163 !important;
  border-radius: 20px !important;
}
.c4 p{
  text-align: center;
}
.c4 input{
  background-color: #b68163 !important;
  position: relative;
  padding: 15px 25px;
  transition: all ease 0.3s;
  color: #ffffff !important;
  font-weight: 600 !important;
  border: 1px solid #b68163;
  transition: all ease 0.3s;
  border-radius: 20px;
  width: 200px !important;
}
.c4 input:hover{
  color: #b68163 !important;
  background-color: #ffffff !important;
}


.footer-brand{
  align-items: center !important;
}
.site-footer img {
@media (min-width: 920px) {
        height: 100px !important;
        width: 350px !important;
    }
}
@media (max-width: 1100px){
  .femme_b::before, .libellule_b::before, .pierre_b::before, .pierre-plate_b::before, .papillon_b::before, .femme_n::before, .libellule_n::before, .pierre_n::before, .pierre-plate_n::before, .papillon_n::before
    {
      width: 300px;
      height: 300px;
      opacity: 0.4;
    }
    .sb-sign::after{
      width: 50px;
      height: 50px;
    }
  }
}
@media (max-width: 1199px){
    .set-col-max .e-con-inner{
        flex-direction: column !important;
    }
    .set-col-max .e-con-inner [class*="w-"]{
        min-width: 100%!important;
    }
}
.mag-logo{
  position: relative;
}
.footer-brand .mag-logo{
  filter: invert(1) brightness(100) !important;
}

.eco-badge-container-dark{
  background-color: #161616 !important;
}


.set-m svg *{
  fill: #b68163 !important;
}
.set-m svg{
  filter: none !important;
}