/* ═══════════════════════════════════════════════════════════
   MENU DE NAVIGATION — desktop, dropdowns, megamenu, mobile
   Fichier éditable depuis : Paramètres → Styles des pages
═══════════════════════════════════════════════════════════ */

/* ── Barre de navigation (accueil : .hx-nav) ── */
.hx-nav{background:#fff;border-top:1px solid #ECE7DD;border-bottom:2px solid #E8871E;position:sticky;top:0;z-index:50}
.hx-nav .row{max-width:1280px;margin:0 auto;padding:0 24px;display:flex;gap:2px;align-items:stretch}
.hx-nav .item{position:relative}
.hx-nav .item>a{display:flex;align-items:center;gap:6px;color:#141414;padding:15px 16px;font-size:14px;font-weight:700;white-space:nowrap;border-bottom:3px solid transparent;transition:color .2s,border-color .2s; text-transform: uppercase;}
.hx-nav .item:hover>a,.hx-nav .item.active>a{color:var(--g,#008774);border-bottom-color:#E8871E;font-weight:700}
.hx-nav .drop{position:absolute;top:100%;left:0;min-width:298px;background:#fff;border:1px solid #EDE8DD;border-radius:0 0 12px 12px;box-shadow:0 24px 48px -18px rgba(11,61,46,.35);padding:8px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.24s;z-index:60}
.hx-nav .item:hover .drop{opacity:1;visibility:visible;transform:none}
.hx-nav .drop a{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:8px;color:#2B2F33;font-size:14px;transition:background .2s,color .2s,padding-left .2s}
.hx-nav .drop a::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--g,#008774);flex-shrink:0}
.hx-nav .drop a:hover{background:#F3F1EA;color:var(--g,#008774);padding-left:18px}

/* ── Ancien bouton burger (déprécié, masqué partout) ── */
.hx-burger{display:none}

/* ── Navigation pages internes (.nav — mêmes règles) ── */
.nav{background:#fff;border-top:1px solid #ECE7DD;border-bottom:2px solid #E8871E;position:sticky;top:0;z-index:50}
.nav .wrap{max-width:1280px;margin:0 auto;padding:0 24px;display:flex;gap:2px;align-items:stretch}
.nav .item{position:relative}
.nav .item>a{display:flex;align-items:center;gap:6px;color:#141414;padding:15px 16px;font-size:14px;font-weight:500;white-space:nowrap;border-bottom:3px solid transparent;transition:color .2s,border-color .2s}
.nav .item:hover>a,.nav .item.active>a{color:var(--g,#008774);border-bottom-color:#E8871E;font-weight:700}
.nav .drop{position:absolute;top:100%;left:0;min-width:260px;background:#fff;border:1px solid #EDE8DD;border-radius:0 0 12px 12px;box-shadow:0 24px 48px -18px rgba(11,61,46,.35);padding:8px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.24s;z-index:60}
.nav .item:hover .drop{opacity:1;visibility:visible;transform:none}
.nav .drop a{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:8px;color:#2B2F33;font-size:14px;transition:background .2s,color .2s,padding-left .2s}
.nav .drop a::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--g,#008774);flex-shrink:0}
.nav .drop a:hover{background:#F3F1EA;color:var(--g,#008774);padding-left:18px}

/* ── Megamenu (3 niveaux — colonnes) ── */
.nav .item .drop--mega,
.hx-nav .item .drop--mega{min-width:602px;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:4px 18px;padding:18px 20px}
.nav .item .drop--mega .mega-col,
.hx-nav .item .drop--mega .mega-col{display:flex;flex-direction:column}
.nav .item .drop--mega .mega-col-titre,
.hx-nav .item .drop--mega .mega-col-titre{font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:#008774;padding:6px 10px 4px;border-bottom:1px solid #EAF5F1;margin-bottom:4px}
.nav .item .drop--mega .mega-col-titre a,
.hx-nav .item .drop--mega .mega-col-titre a{color:inherit;text-decoration:none}
.nav .item .drop--mega .mega-col-titre a::before,
.hx-nav .item .drop--mega .mega-col-titre a::before{display:none}
.nav .item .drop--mega a,
.hx-nav .item .drop--mega a{font-size:13.5px}
@media(max-width:1200px){
  .nav .item .drop--mega,
  .hx-nav .item .drop--mega{min-width:420px}
}

/* ── Bascule desktop / mobile (breakpoint 1080px) ──
   IMPORTANT : ces règles restent DANS leurs media queries. */
@media(max-width:1080px){
  .hx-nav, .nav { display:none !important }
  .mob-trigger  { display:flex !important }
}
@media(min-width:1081px){
  .mob-trigger { display:none !important }
  .mob-menu    { display:none !important }
  .mob-overlay { display:none !important }
}