/* ===== BASE ===== */
header.zb-header {
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
}

/* Overlay reste sous la barre/menu */
header.zb-header .zb-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* On neutralise tout centrage vertical imposé par d'autres templates */
header.zb-header .zb-hero__content {
  position: relative;
  z-index: 3;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 20px !important;
  min-height: 100vh;
  display: block !important;
}

header.zb-header .zb-hero {
  display: block !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ===== BARRE LÉGÈRE EN HAUT (SANS BLUR) ===== */
@media (min-width: 992px) {
  .zb-nav-wrapper {
    position: relative;
    z-index: 1000;
  }

  /* ===== LOGO TOUT EN HAUT ===== */
  header.zb-header .zb-hero__top {
    display: flex !important;
    align-items: left !important;
    justify-content: left !important;
    gap: 16px !important;
    margin: 0 !important;
    padding-top: 5px !important;         /* logo à ~10px du haut */
  }
.zb-meta {
    display:none  !important;
}
  /* On réserve l'espace pour la barre + menu (pour éviter que ça recouvre) */
header.zb-header .zb-hero {
    padding-top: 100px !important;
}

  /* ===== MENU JUSTE EN DESSOUS DU LOGO ===== */
  .zb-nav-wrapper > nav.zb-nav {
    position: fixed !important;
    top: 170px !important;                 /* sous le logo */
    left: 50% !important;
    transform: translateX(-50%) !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 14px !important;

    padding: .35rem .8rem !important;
    margin: 0 !important;

    background: transparent !important;   /* PAS de barre sombre */
    border: 0 !important;
    box-shadow: none !important;

    z-index: 1001 !important;
    pointer-events: auto !important;
      min-width: 100% !important;
  }

  /* Si ton JS ajoute zb-nav--bg, on l’écrase aussi (sans blur) */
  .zb-nav-wrapper > nav.zb-nav.zb-nav--bg {
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: .35rem  !important
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  /* Liens menu = texte (pas “boutons”), sauf hover */
  .zb-nav-wrapper > nav.zb-nav a,
  .zb-nav-wrapper > nav.zb-nav .btn,
  .zb-nav-wrapper > nav.zb-nav .zb-nav__item {
    display: inline-flex !important;
    align-items: center !important;
    white-space: nowrap !important;

    background: rgba(var(--rgb-btn), 1) !important;
    border: 0 !important;
    box-shadow: none !important;

    color: var(--rgb-btn-text) !important;
    text-decoration: none !important;

    padding: 10px !important;
    border-radius: 5px !important;
  }

  .zb-nav-wrapper > nav.zb-nav a:hover,
  .zb-nav-wrapper > nav.zb-nav .btn:hover {
    color: rgba(var(--rgb-btn), 1) !important;
    background: rgba(var(--rgb-btn-text), 1) !important;
    text-decoration: none !important;
  }
}
.zb-avatar
{
    position:absolute  !important;
    left:50% !important;
    top:2px !important;
    transform: translateX(-50%) !important;
    max-height:130px !important;
    position:fixed !important;
}

.zb-nav {
    position: sticky;
    top: 0;
    z-index: 1000;
}

.zb-nav-wrapper::before {
    content: "";
    position: fixed;
    top: 0; left: 0; right: 0;
    height: 230px;
    background: rgba(0,0,0,.18); 
    border-bottom: 1px solid rgba(255,255,255,.08);
    z-index: 2147482000;
    pointer-events: none;
}
.zb-scrolled  .zb-nav-wrapper::before {
    background: rgba(var(--rgb-link), .9); 
}

.is-stuck {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  box-shadow: 0 4px 12px rgba(0,0,0,.12);
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  background: rgba(var(--rgb-bg), 1) !important;
}
/**********************************************/
.zb-nav-wrapper,
.zb-avatar,
.zb-nav-wrapper > nav,
.zb-header::before {
  transition: all .28s ease;
}

.zb-scrolled .zb-nav-wrapper::before {
  height: 50px !important;
}

.zb-scrolled .zb-avatar {
/*  height: 60px !important;*/
    display: none !important;
}
.zb-scrolled .zb-nav-wrapper > nav.zb-nav {
  top: 5px !important;        /* remonte sous logo réduit */
  padding: .15rem .5rem !important;
  gap: 10px !important;
}
.zb-scrolled .zb-nav-wrapper > nav.zb-nav a {
  font-size: .95em;
  padding: 5px 7px !important;
}
/*.zb-scrolled .zb-avatar {
  transform: translateX(120px);
}
.zb-avatar {
  transform: translateX(0);
}*/
.zb-identity {
  transform: translate(0, 150px); 
}
.zb-header::before{
    content:"";
    position:absolute;
    top:280px;
    left:50px;
    right:50px;
    bottom:50px;
    border:2px solid rgba(var(--rgb-link), 0.9);
    pointer-events:none;
    z-index:2;
}
.zb-scrolled .zb-header::before{
    content:"";
    position:absolute;
    top:50px;
    left:50px;
    right:50px;
    bottom:50px;
    border:2px solid  rgba(var(--rgb-bg), 0.9);
    border-bottom: 0 !important;
    pointer-events:none;
    z-index:2;
    position: fixed;
}
/**********************************************/

/* Mobile : on ne force rien ici (comme tu fais souvent) */
@media (max-width: 991.98px) {
    .zb-nav-wrapper,
    .zb-avatar,
    .zb-nav-wrapper > nav,
    .zb-header::before {
      transition: all .28s ease;
    }
      header.zb-header { min-height: 60vh; }
      header.zb-header .zb-hero__content { padding: 0 12px !important; min-height: 60vh; }
    .zb-nav-wrapper::before {
        height: 100px !important;
    }
    .zb-scrolled .zb-nav-wrapper::before {
      height: 75px !important;
    }

    .zb-avatar
    {
        max-height:80px !important;
        left:50px !important;
        top: -10px !important;
    }
    .zb-header::before{
        content:"";
        position:absolute;
        top:120px;
        left:25px;
        right:25px;
        bottom:25px;
        border:2px solid rgba(var(--rgb-link), 0.9);
        pointer-events:none;
        z-index:2;
    }
    .zb-scrolled .zb-header::before{
        content:"";
        position:absolute;
        top:74px;
        left:25px;
        right:25px;
        bottom:25px;
        border:2px solid rgba(var(--rgb-bg), 0.5);
        pointer-events:none;
        z-index:2;
        position: fixed;
    }
    .zb-scrolled .zb-avatar {
        height: 60px !important;
        display: block !important;
    }
}

.zb-section__head {
    text-align: center !important;
    margin-top: 2rem !important;
}

h2 {
    position: relative !important;
    letter-spacing: 0.2rem !important;
}

h2::after {
    content: "";
    position: absolute;
    left: 50% !important;
    bottom: 0.8em;
    width: 48px;
    height: 2px;
    background: rgba(var(--rgb-btn), .65);
    transform: translateX(-50%);
}

.site-header {
    position: relative;
}

/* icône positionnée en bas du header */
.arrow-bottom {
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    color: rgba(var(--rgb-link), 1);
    cursor: pointer;
    display: none; /* caché par défaut */
}

/* affichage uniquement sur desktop */
@media (min-width: 992px) {
    .arrow-bottom {
        display: block;
        z-index: 999999999;
    }
    .zb-scrolled .arrow-bottom {
        display: none;
    }
}

body.zb-minisite .content-wrapper.zb-shell {
  max-width: 1320px !important;
}
/* ===== FIX MENU MOBILE ===== */

/* Menu offcanvas au-dessus de tout */
.offcanvas {
    z-index: 2147483647 !important;
}

.offcanvas-backdrop {
    z-index: 2147483646 !important;
}

/* Le ::before ne doit JAMAIS bloquer les clics */
.zb-nav-wrapper::before,
.zb-header::before,
.zb-scrolled .zb-nav-wrapper::before,
.zb-scrolled .zb-header::before {
    pointer-events: none !important;
}

/* Réduire les z-index normaux (pas besoin de valeurs extrêmes) */
.zb-nav-wrapper {
    z-index: 1000 !important;
}

.zb-nav-wrapper > nav.zb-nav {
    z-index: 1001 !important;
}

.zb-nav-wrapper::before {
    z-index: 999 !important;
}

.zb-header::before {
    z-index: 2 !important;
}
/* En mobile, logo visible mais sous le menu offcanvas */
@media (max-width: 991.98px) {
    .zb-avatar {
        z-index: 1000 !important; /* Sous le menu (2147483647) */
        position: fixed !important;
    }
    
    /* Menu offcanvas au-dessus */
    .offcanvas {
        z-index: 2147483647 !important;
    }
    
    .offcanvas-backdrop {
        z-index: 2147483646 !important;
    }
}

@media (max-width: 991.98px) {
    .zb-avatar {
        z-index: 2147483645 !important; /* Sous le menu (2147483647) et backdrop (2147483646) */
        position: fixed !important;
        left: 50px !important;
        top: -10px !important;
        max-height: 80px !important;
    }
    
    .zb-scrolled .zb-avatar {
        height: 60px !important;
        display: block !important;
        z-index: 2147483645 !important;
    }
    
    /* Menu offcanvas AU-DESSUS de tout */
    .offcanvas {
        z-index: 2147483647 !important;
    }
    
    .offcanvas-backdrop {
        z-index: 2147483646 !important;
    }
}