@import url("/wp-content/themes/smarttheme/assets/css/menu-panel-right.css");
@import url("/wp-content/themes/smarttheme/assets/css/menu-underline.css");
@import url("/wp-content/themes/smarttheme/assets/css/hide-bloc.css");
@import url("/wp-content/themes/smarttheme/assets/css/style-bloc-articles.css");

@import url("/wp-content/themes/smarttheme/assets/css/style-vadancourt.css");

@import url("/wp-content/themes/smarttheme/assets/css/style-defisparc.css");
@import url("/wp-content/themes/smarttheme/assets/css/style-defisparc-break-1400.css");

/* ####################################################################################################################### */
/* --- Variables de position & hauteurs utilitaires ---------------------------------------------------------------------- */
/* ####################################################################################################################### */

:root{
  --icon-top: 37px;
  --icon-right: 20px;
  --icon-left: 20px;
  --header-mobile-stack-height: 90px;
  --beige-pad-b: 20px;
}


/* ####################################################################################################################### */
/* --- Déclenchement du menu mobile entre 600 et 1400 px, pour une nav marquée .break-1400 ------------------------------- */
/* ####################################################################################################################### */

@media (min-width:600px) and (max-width:1400px){

  /* 1) Forcer l’UI mobile WordPress */
  .break-1400 .wp-block-navigation__container{
    display:none !important;
  }

  .break-1400 .wp-block-navigation__responsive-container-open,
  .break-1400 .wp-block-navigation__responsive-container-toggle{
    display:inline-flex !important;
  }

  .break-1400 .wp-block-navigation__responsive-container{
    display:block !important;
  }

  /* 2) IMPORTANT :
     masquer tout le contenu du panneau par défaut,
     y compris le bloc bouton ajouté après la liste */
  .break-1400 .wp-block-navigation__responsive-container-content,
  .break-1400 .wp-block-navigation__responsive-container .wp-block-buttons,
  .break-1400 .wp-block-navigation__responsive-container .wp-block-button{
    display:none !important;
  }

  /* 3) Quand le panneau est OUVERT, réafficher proprement */
  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
  }

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container{
    display:flex !important;
    flex-direction:column !important;
  }

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-buttons{
    display:flex !important;
  }

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-button{
    display:block !important;
  }

  /* 4) Le bouton CLOSE n’existe pas hors état ouvert */
  .break-1400 .wp-block-navigation__responsive-container-close{
    display:none !important;
    pointer-events:none !important;
  }

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-close{
    display:inline-flex !important;
    pointer-events:auto !important;
  }
}


/* ####################################################################################################################### */
/* --- Transformation d’un item du menu en bouton : .bouton-menu --------------------------------------------------------- */
/* ####################################################################################################################### */

.wp-block-navigation .wp-block-navigation-item.bouton-menu > .wp-block-navigation-item__content{
  display:inline-block;
  padding:.5rem 1.25rem;
  border-radius:5px;
  border:2px solid currentColor;
  text-decoration:none;
}

/* Variante “plein” au survol — uniquement lorsque le hover existe (desktop) */
@media (hover:hover){
  .wp-block-navigation .wp-block-navigation-item.bouton-menu > .wp-block-navigation-item__content:hover{
    background:#000; color:#fff; border-color:#000;
  }
}

/* En mobile (panneau), bouton non pleine largeur, look “lien” (sans bord/hover) */
@media (max-width:1400px){
  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item.bouton-menu > .wp-block-navigation-item__content{
    display:inline-flex !important;
    width:auto !important; max-width:100% !important;
    text-align:left !important; white-space:nowrap;
    margin-top:0 !important;
    border:none !important; box-shadow:none !important;
    background:transparent !important; color:inherit !important; transition:none !important;
  }
  /* Variante Button block éventuelle */
  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  li.bouton-menu .wp-block-button__link{
    display:inline-flex !important;
    width:auto !important; max-width:100% !important;
    white-space:nowrap;
    border:none !important; box-shadow:none !important;
    background:transparent !important; color:inherit !important; transition:none !important;
  }
  /* Cadratin visuel avant “Contact” */
  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item.bouton-menu > .wp-block-navigation-item__content::before,
  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  li.bouton-menu .wp-block-button__link::before{
    content:"\2014\00A0"; /* — + espace insécable */
  }
}


/* ####################################################################################################################### */
/* --- Épaississement + agrandissement léger des icônes burger & close jusqu’à 1400 px ---------------------------------- */
/* ####################################################################################################################### */

@media (max-width:1400px){
  .break-1400 .wp-block-navigation__responsive-container-open svg,
  .break-1400 .wp-block-navigation__responsive-container-close svg{
    transform:scale(1.35); transform-origin:center;
  }
  .break-1400 .wp-block-navigation__responsive-container-open svg *,
  .break-1400 .wp-block-navigation__responsive-container-close svg *{
    stroke:currentColor; stroke-width:1.2; vector-effect:non-scaling-stroke; paint-order:stroke fill;
  }

  /* Neutraliser des gaps parasites sur certaines versions */
  .break-1400.wp-block-navigation,
  .break-1400 .wp-block-navigation__container,
  .break-1400 .wp-block-group:has(.wp-block-navigation){
    gap:0 !important;
  }
}


/* 
    ######################################################################
    Effet “point noir” sous les liens du menu desktop (> 1400px),
    activé uniquement avec .menu-dot et non actif si classe .bouton-menu
    ######################################################################
*/

    @media (min-width:1401px){

      .menu-dot nav.wp-block-navigation .wp-block-navigation__container > li:not(.bouton-menu) a,
      .menu-dot nav.wp-block-navigation .wp-block-navigation__container > li:not(.bouton-menu) .wp-block-navigation-item__content{
        position:relative;
        overflow:visible;
      }

      .menu-dot nav.wp-block-navigation .wp-block-navigation__container > li:not(.bouton-menu) a::after,
      .menu-dot nav.wp-block-navigation .wp-block-navigation__container > li:not(.bouton-menu) .wp-block-navigation-item__content::after{
        content:"";
        position:absolute;
        left:50%;
        bottom:-10px;
        transform:translateX(-50%) scale(.6);
        width:8px;
        height:8px;
        border-radius:50%;
        background:#000;
        opacity:0;
        transition:opacity .2s ease, transform .2s ease;
        pointer-events:none;
      }

      .menu-dot nav.wp-block-navigation .wp-block-navigation__container > li:not(.bouton-menu) a:hover::after,
      .menu-dot nav.wp-block-navigation .wp-block-navigation__container > li:not(.bouton-menu) a:focus-visible::after,
      .menu-dot nav.wp-block-navigation .wp-block-navigation__container > li:not(.bouton-menu) .wp-block-navigation-item__content:hover::after,
      .menu-dot nav.wp-block-navigation .wp-block-navigation__container > li:not(.bouton-menu) .wp-block-navigation-item__content:focus-visible::after{
        opacity:1;
        transform:translateX(-50%) scale(1);
      }

      .menu-dot nav.wp-block-navigation .wp-block-navigation__container > li:not(.bouton-menu).current-menu-item > a::after,
      .menu-dot nav.wp-block-navigation .wp-block-navigation__container > li:not(.bouton-menu).current-menu-ancestor > a::after{
        opacity:1;
        transform:translateX(-50%) scale(1);
      }

    }




/* 
    ##################################################################################
    Passage des items texte du menu en noir en mode mobile,
    activé pour tous les menus
    ##################################################################################
*/

      .wp-block-navigation__responsive-container.is-menu-open{
        color:#000;
      }



/* ####################################################################################################################### */
/* --- Mobile (<=1400px) : burger ↔ close au même endroit + alignements internes ---------------------------------------- */
/* ####################################################################################################################### */

@media (max-width:1400px){

  /* 1) Burger : laisser la position par défaut du thème (évite les “sauts”) */
  .break-1400 .wp-block-navigation__responsive-container-open{
    position:static !important; top:auto !important; right:auto !important; transform:none !important; z-index:auto !important;
  }

  /* 2) Quand le menu est ouvert : cacher visuellement le burger (sans décaler) */
  body.has-modal-open .break-1400 .wp-block-navigation__responsive-container-open{
    visibility:hidden !important; /* pas display:none ⇒ pas de shift */
  }

  /* 3) Close : calé exactement au même spot via variables */
  nav.wp-block-navigation{ position:relative; }
  .break-1400 .wp-block-navigation__responsive-container-close{
    position:fixed !important;
    top:var(--icon-top) !important;
    right:var(--icon-right) !important;
    z-index:2147483600 !important; /* > logo */
    transform:none !important; line-height:1;
  }

  /* 5) Items : tout aligné à GAUCHE + taille 2rem */
  .break-1400 .wp-block-navigation__responsive-container.is-menu-open{
    display:flex !important; flex-direction:column !important;
    align-items:flex-start !important; justify-content:flex-start !important; text-align:left !important;
  }
  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content{
    display:flex !important; flex-direction:column !important;
    align-items:flex-start !important; width:100% !important; text-align:left !important;
  }
  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container{
    display:flex !important; flex-direction:column !important;
    align-items:flex-start !important; width:100% !important;
    text-align:left !important;
    margin:16px 0 0 16px !important; padding:0 !important;
  }
  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container > li,
  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container > li > a,
  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content{
    font-size:1.2em !important; line-height:1.2 !important; text-align:left !important;
  }


    /* 5) Items : tout aligné au centre + taille 2rem */

    .break-1400.menu-align-center .wp-block-navigation__responsive-container.is-menu-open{
      display:flex !important;
      flex-direction:column !important;
      align-items:center !important;
      justify-content:center !important;
      text-align:center !important;
    }

    .break-1400.menu-align-center .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__responsive-container-content{
      display:flex !important;
      flex-direction:column !important;
      align-items:center !important;
      width:100% !important;
      text-align:center !important;
    }

    .break-1400.menu-align-center .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__container{
      display:flex !important;
      flex-direction:column !important;
      align-items:center !important;
      justify-content:center !important;

      gap:28px !important;   /* espace entre les items */

      width:100% !important;
      margin:30px 0 0 0 !important;
      padding:0 !important;
    }

    .break-1400.menu-align-center .wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation-item__content{

      font-size:1.7rem !important;   /* taille du menu */
      line-height:1.25 !important;
      text-align:center !important;
    }

}



/* ############################################################
   MENU MOBILE : items centrés + points parfaitement centrés
   ############################################################ */

@media (max-width:1400px){

  .break-1400.menu-align-center .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:0 !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
  }

  .break-1400.menu-align-center .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container > li{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
  }

  .break-1400.menu-align-center .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container > li > a,
  .break-1400.menu-align-center .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container > li > .wp-block-navigation-item__content{
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
    font-size:1.3rem !important;
    line-height:1.2 !important;
  }

  .break-1400.menu-align-center .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container > li:not(:last-child)::after{
    content:"";
    display:block;
    width:9px;
    height:9px;
    border-radius:50%;
    background:#000;
    margin:26px auto 26px auto;
  }

}





/* ####################################################################################################################### */
/* --- MENU MOBILE (<=1400px) : Cadre beige avec gouttières (pas de full-bleed) ----------------------------------------- */
/* ####################################################################################################################### */

@media (max-width:1400px){

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open{
    padding: 0 !important;
    overflow-x: hidden !important;
  }

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content{
    background: #f3eee6;
    border-radius: 5px;

    margin-top: var(--header-mobile-stack-height) !important;
    margin-left: 20px !important;
    margin-right: 20px !important;

    width: auto !important;
    max-width: calc(100vw - 40px) !important;
    max-inline-size: calc(100vw - 40px) !important;

    padding: 15px 15px 20px !important;
    box-sizing: border-box;

    min-height: calc(100dvh - var(--header-mobile-stack-height) - 20px);
    max-height: calc(100dvh - var(--header-mobile-stack-height) - 20px);

    overflow: auto;
    overflow-x: hidden !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: left !important;
  }

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container{
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content .wp-block-navigation-item,
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content .wp-block-navigation__container,
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content .wp-block-page-list{
    gap: 15px !important;
  }
}

/* ####################################################################################################################### */
/* --- MENU MOBILE : supprimer le scroll horizontal parasite ------------------------------------------------------------- */
/* ####################################################################################################################### */

@media (max-width:1400px){
  body.has-modal-open{
    overflow-x: hidden !important;
  }

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open{
    overflow-x: hidden !important;
  }

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content{
    max-inline-size: calc(100vw - 40px) !important;
    overflow-x: hidden !important;
  }

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__container{
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
}



/* ####################################################################################################################### */
/* --- Ombres sur le bandeau d'entête - classe css : shadow-scroll ------------------------------------------------------- */
/* ####################################################################################################################### */


.shadow-scroll{
  position: relative;
  transition: box-shadow .22s ease;
}

.shadow-scroll.scrolled{
  box-shadow: 0 4px 14px rgba(0,0,0,0.035);
}







/* le contenu passe au-dessus du fond animé */
.wp-site-blocks{
  position: relative;
  z-index: 1;
}

/* fondu visible uniquement avant le scroll */
body:has(.shadow-scroll:not(.scrolled)) .wp-site-blocks::before{
  content:"";
  position: fixed;
  left: 0;
  right: 0;
  top: 100px; /* hauteur visuelle de ton header */
  height: 80px;
  pointer-events: none;
  z-index: 0;
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,1) 0%,
    rgba(255,255,255,0.88) 28%,
    rgba(255,255,255,0.52) 62%,
    rgba(255,255,255,0) 100%
  );
}








/* ####################################################################################################################### */
/* --- Animation des cercles - déclenchée par .circle-anim --------------------------------------------------------------- */
/* ####################################################################################################################### */

html,
body{
  overflow-x: clip;
}

/* couche globale derrière tout le site */
.circle-anim-stage{
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: clip;
}

/* on remonte tout le contenu au-dessus */
.wp-site-blocks{
  position: relative;
  z-index: 1;
}

/* chaque instance créée par le JS */
.circle-anim-instance{
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  pointer-events: none;
}

.circle-anim-instance::before,
.circle-anim-instance::after{
  content: "";
  position: absolute;
  left: var(--circle-anchor-x, 50vw);
  top: var(--circle-anchor-y, 50vh);
  transform-origin: center center;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 1;
  will-change: transform;
}

/* 2 grands cercles */
.circle-anim-instance::before{
  width: 320vmax;
  height: 320vmax;
  margin-left: -160vmax;
  margin-top: -160vmax;
  background-size: 225vmax 225vmax;
  background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2000 2000'>\
<circle cx='800' cy='1000' r='800' fill='none' stroke='%23efefef' stroke-miterlimit='10' stroke-width='1'/>\
<circle cx='1000' cy='1000' r='1000' fill='none' stroke='%23efefef' stroke-miterlimit='10' stroke-width='1'/>\
</svg>");
  animation: circleRotateBig 140s linear infinite;
}

/* 3 cercles */
.circle-anim-instance::after{
  width: 220vmax;
  height: 220vmax;
  margin-left: -110vmax;
  margin-top: -110vmax;
  background-size: 142.5vmax 142.5vmax;
  background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2000 2000'>\
<circle cx='1000' cy='1000' r='200' fill='none' stroke='%23efefef' stroke-miterlimit='10' stroke-width='1'/>\
<circle cx='1000' cy='1000' r='600' fill='none' stroke='%23efefef' stroke-miterlimit='10' stroke-width='1'/>\
<circle cx='800' cy='1000' r='400' fill='none' stroke='%23efefef' stroke-miterlimit='10' stroke-width='1'/>\
</svg>");
  animation: circleRotateSmall 95s linear infinite reverse;
}

@keyframes circleRotateBig{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}

@keyframes circleRotateSmall{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}




/* ####################################################################################################################### */
/* --- Supprime les blocs Gutenberg avec les classes css ad'hoc en fonction du mode -------------------------------------- */
/* ####################################################################################################################### */


/* cacher sur mobile */
@media (max-width:768px){
.remove-mobile{
display:none !important;
}
}

/* cacher sur desktop */
@media (min-width:769px){
.remove-desktop{
display:none !important;
}
}

/* cacher sur tablette */
@media (min-width:768px) and (max-width:1024px){
.remove-tablet{
display:none !important;
}
}


/* ####################################################################################################################### */
/* --- Transforme un item MENU en Bouton >>>>>>>>>>>>>  Classe css : menu-button ----------------------------------------- */
/* ####################################################################################################################### */


.wp-block-navigation .menu-button{
  list-style: none;
}

.wp-block-navigation .menu-button > .wp-block-navigation-item__content{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;

  background: #000 !important;
  color: #fff !important;

  border-radius: 8px !important;

  padding: 10px 12px !important;

  font-style: normal !important;
  font-weight: 700 !important;
  font-size: 0.8em !important;
  line-height: 1 !important;
  text-decoration: none !important;

  box-sizing: border-box !important;
}

.wp-block-navigation .menu-button .wp-block-navigation-item__label{
  color: #fff !important;
  font-size: inherit !important;
  line-height: 1 !important;
}

/* taille typographique bouton FR */
.wp-block-navigation .menu-button > .wp-block-navigation-item__content,
.wp-block-navigation .menu-button .wp-block-navigation-item__label{
  font-size: 0.8rem !important;
}





/* ===== Correction spécifique menu mobile ouvert WordPress ===== */
@media (max-width:1400px){

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content .menu-button{
    display: block !important;
    width: auto !important;
    align-items: flex-start !important;
  }

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content .menu-button > .wp-block-navigation-item__content{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: row !important;
    align-self: flex-start !important;
    width: auto !important;
    min-height: auto !important;

    background: #000 !important;
    color: #fff !important;
    border-radius: 8px !important;

    padding: 10px 12px 8px !important;

    font-style: normal !important;
    font-weight: 700 !important;
    font-size: 0.8em !important;
    line-height: 1 !important;
    text-decoration: none !important;
  }

  .break-1400 .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content .menu-button .wp-block-navigation-item__label{
    color: #fff !important;
    font-size: inherit !important;
    line-height: 1 !important;
    display: inline !important;
  }



}





/* ####################################################################################################################### */
/* --- Gestion mobile d'un double menu - Un de chaque côté du logo centré - Classe css : .two-menus ---------------------- */
/* ####################################################################################################################### */


@media (max-width:1400px){

  /* On laisse les burgers à leur place naturelle */
  .two-menus .wp-block-navigation__responsive-container-open{
    width:auto !important;
    height:auto !important;
    padding:0 !important;
    margin:0 !important;
  }

  /* Icônes burger */
  .two-menus .wp-block-navigation__responsive-container-open svg{
    width:24px !important;
    height:24px !important;
    display:block !important;
    pointer-events:none !important;
  }


/* ####################### Gestion de la croix du menu mobile de droite quand il est actif ######################## */

  .two-menus .right-menu .wp-block-navigation__responsive-container-close{
    display:none !important;
    pointer-events:none !important;
  }

  .two-menus .right-menu
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-close{
    position:fixed !important;
    top:28px !important;
    right:10px !important;

    width:44px !important;
    height:44px !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    transform:none !important;
    z-index:2147483600 !important;
    pointer-events:auto !important;
  }


/* ####################### Gestion de la croix du menu mobile de gauche quand il est actif ######################## */

  .two-menus .left-menu .wp-block-navigation__responsive-container-close{
    display:none !important;
    pointer-events:none !important;
  }

  .two-menus .left-menu
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-close{
    position:fixed !important;
    top:28px !important;
    left:10px !important;

    width:44px !important;
    height:44px !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    transform:none !important;
    z-index:2147483600 !important;
    pointer-events:auto !important;
  }


  /* Icônes croix */
  .two-menus .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-close svg{
    width:24px !important;
    height:24px !important;
    display:block !important;
    pointer-events:none !important;
  }

}


/* ####################################################################################################################### */
/* --- Affichage du logo centrale lorsque les menus mobiles sont actifs - Classe css : .logo-overlay --------------------- */
/* ####################################################################################################################### */



@media (max-width:1400px){
  .logo-overlay{
    position: relative !important;
    z-index: 999999 !important;
    pointer-events: none !important;
  }

  .logo-overlay .wp-block-image,
  .logo-overlay .wp-block-image img{
    position: relative !important;
    z-index: 999999 !important;
    pointer-events: none !important;
  }
}


/* ####################################################################################################################### */
/* --- Remplacement de l'icone burger par l'icone SVG phone - Classe css : .menu-phone ----------------------------------- */
/* ####################################################################################################################### */


@media (max-width:1400px){

.menu-phone .wp-block-navigation__responsive-container-open svg{
  display:none !important;
}

.menu-phone .wp-block-navigation__responsive-container-open::before{

  content:"";
  width:35px;
  height:35px;
  display:block;

  background-color:currentColor;

  -webkit-mask:url("/wp-content/themes/smarttheme/assets/svg/icon-headset.svg") center/contain no-repeat;
  mask:url("/wp-content/themes/smarttheme/assets/svg/icon-headset.svg") center/contain no-repeat;

  transform: translateX(3px);
  flex: 0 0 35px;

}
}




/* ####################################################################################################################### */
/* --- Vadancourt : cadre beige avec marge basse fixe de 20px ------------------------------------------------------------ */
/* ####################################################################################################################### */

@media (max-width:1400px){

  nav.wp-block-navigation[aria-label="vadencourt-left-mobile"]
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content,

  nav.wp-block-navigation[aria-label="vadancourt-left-mobile"]
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content,

  nav.wp-block-navigation[aria-label="vadencourt-right-mobile"]
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content,

  nav.wp-block-navigation[aria-label="vadancourt-right-mobile"]
  .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation__responsive-container-content{
    height: calc(100dvh - var(--header-mobile-stack-height) - 20px) !important;
    min-height: auto !important;
    max-height: calc(100dvh - var(--header-mobile-stack-height) - 20px) !important;
    margin-bottom: 20px !important;
    box-sizing: border-box !important;
  }

}