/* ══════════════════════════════════════════════════════════════════════
   VAJRA-CREST · Shared navigation stylesheet
   Dropdown-enabled desktop nav + hamburger-drawer mobile nav.
   Piggybacks on each page's CSS variables (--gold, --bg, --border…).
════════════════════════════════════════════════════════════════════════ */

/* Dropdown wrapper — sits inline among the pill list */
.vc-nav-drop{position:relative}
.vc-nav-drop-toggle{
  display:inline-flex;align-items:center;gap:6px;
  padding:10px 18px;color:var(--muted);
  font-family:'Roboto Mono',monospace;font-size:11px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;border-radius:6px;
  background:transparent;border:0;cursor:pointer;
  transition:color .2s, background .2s;
}
.vc-nav-drop-toggle:hover{color:var(--text);background:var(--bg3)}
.vc-nav-drop-toggle svg{
  width:9px;height:9px;stroke:currentColor;fill:none;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;
  transition:transform .2s;
  opacity:.7;
}
.vc-nav-drop.open  .vc-nav-drop-toggle{color:var(--gold);background:rgba(234,179,8,.07)}
.vc-nav-drop.open  .vc-nav-drop-toggle svg{transform:rotate(180deg);opacity:1}
.vc-nav-drop-toggle[aria-current="true"]{color:var(--gold)}

/* Dropdown panel */
.vc-nav-drop-menu{
  position:absolute;top:calc(100% + 8px);right:0;min-width:240px;
  background:var(--bg2);border:1px solid rgba(234,179,8,.2);
  border-radius:10px;padding:6px;margin:0;list-style:none;
  box-shadow:
    0 20px 60px rgba(0,0,0,.7),
    0 0 0 1px rgba(234,179,8,.04) inset;
  opacity:0;transform:translateY(-6px) scale(.98);
  pointer-events:none;transform-origin:top right;
  transition:opacity .18s ease, transform .2s ease;
  z-index:120;
}
.vc-nav-drop.open .vc-nav-drop-menu{
  opacity:1;transform:translateY(0) scale(1);pointer-events:auto;
}
.vc-nav-drop-menu a{
  display:flex;align-items:center;gap:10px;
  padding:12px 14px;color:var(--muted);text-decoration:none;
  font-family:'Roboto Mono',monospace;font-size:10px;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;border-radius:6px;
  transition:color .15s, background .15s, padding-left .2s;
  line-height:1.3;
}
.vc-nav-drop-menu a::before{
  content:'›';color:var(--gold);opacity:.55;
  font-family:'Roboto Mono',monospace;font-size:13px;line-height:1;
  width:10px;flex-shrink:0;transition:opacity .15s, transform .2s;
}
.vc-nav-drop-menu a:hover{
  color:var(--gold);background:rgba(234,179,8,.06);padding-left:18px;
}
.vc-nav-drop-menu a:hover::before{opacity:1;transform:translateX(2px)}
.vc-nav-drop-menu a[aria-current="page"]{
  color:var(--gold);background:rgba(234,179,8,.08);
}
.vc-nav-drop-menu a[aria-current="page"]::before{opacity:1}
.vc-nav-drop-menu a .ni{
  flex:1;display:flex;flex-direction:column;gap:2px;
}
.vc-nav-drop-menu a .ni-title{color:inherit;font-weight:600;letter-spacing:.2em}
.vc-nav-drop-menu a .ni-sub{
  font-size:9px;font-weight:400;letter-spacing:.1em;
  color:var(--faint);text-transform:none;
}
.vc-nav-drop-menu a:hover .ni-sub{color:var(--muted)}
/* Inquiry link — small visual accent */
.vc-nav-inquiry{color:var(--gold) !important}
.vc-nav-inquiry[aria-current="page"]{background:rgba(234,179,8,.1)}

/* Hamburger toggle — mobile only */
.vc-nav-toggle{
  display:none;align-items:center;justify-content:center;
  width:38px;height:38px;padding:0;
  background:transparent;border:1px solid var(--border-2);
  border-radius:6px;cursor:pointer;
  flex-direction:column;gap:3px;
  transition:border-color .2s, background .2s;
}
.vc-nav-toggle:hover{border-color:var(--gold);background:rgba(234,179,8,.04)}
.vc-nav-toggle span{
  display:block;width:18px;height:1.5px;background:var(--muted);
  transition:transform .22s ease, opacity .15s, background .2s;
}
.vc-nav-toggle[aria-expanded="true"]{border-color:var(--gold);background:rgba(234,179,8,.06)}
.vc-nav-toggle[aria-expanded="true"] span{background:var(--gold)}
.vc-nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(4.5px) rotate(45deg)}
.vc-nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.vc-nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-4.5px) rotate(-45deg)}

/* ═══ MOBILE · slide-down drawer (≤ 860 px) ═══════════════════════════ */
@media (max-width:860px){
  .vc-nav-inner{
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    padding:14px 18px !important;
    gap:12px !important;
    position:relative;
  }
  .vc-nav-brand{align-self:auto !important}
  .vc-nav-toggle{display:flex}

  /* Links list becomes a full-width drawer anchored under the nav */
  .vc-nav-links{
    position:absolute !important;top:100% !important;left:0 !important;right:0 !important;
    flex-direction:column !important;gap:0 !important;align-items:stretch !important;
    background:rgba(5,5,5,.98);border-bottom:1px solid var(--border);
    padding:0 18px !important;margin:0 !important;
    max-height:0;overflow:hidden;opacity:0;
    transition:max-height .28s ease, opacity .18s ease, padding .2s ease;
    -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
    z-index:115;flex-wrap:nowrap !important;
  }
  .vc-nav-links.open{
    max-height:640px;opacity:1;
    padding:12px 18px 18px !important;
    box-shadow:0 24px 60px rgba(0,0,0,.55);
  }
  .vc-nav-links > li{width:100%}
  .vc-nav-links a, .vc-nav-drop-toggle{
    width:100%;padding:13px 12px !important;
    font-size:11px !important;letter-spacing:.2em !important;
    justify-content:flex-start;border-radius:6px;
    white-space:nowrap !important;
  }
  .vc-nav-links > li + li{border-top:1px dashed rgba(255,255,255,.05)}
  .vc-nav-links a[aria-current="page"]{
    box-shadow:none !important;background:rgba(234,179,8,.08) !important;
    color:var(--gold) !important;
  }

  /* Inline dropdown — expands in place under Partners */
  .vc-nav-drop{position:static}
  .vc-nav-drop-menu{
    position:static;background:transparent;border:0;box-shadow:none;
    padding:4px 0 8px 10px;margin:0;
    opacity:1 !important;transform:none !important;pointer-events:auto;
    max-height:0;overflow:hidden;
    transition:max-height .28s ease, padding .2s ease;
  }
  .vc-nav-drop.open .vc-nav-drop-menu{max-height:240px}
  .vc-nav-drop-menu a{
    padding:10px 12px !important;font-size:10px;letter-spacing:.16em;
    border-left:1px dashed rgba(234,179,8,.18);
    margin-left:6px;padding-left:16px !important;
  }
  .vc-nav-drop-menu a:hover{padding-left:18px !important}
  .vc-nav-inquiry{border-top:1px solid rgba(234,179,8,.2) !important;margin-top:6px}
}

/* ═══ Extra-narrow phones (≤ 380 px) — tighten a touch more ═════════ */
@media (max-width:380px){
  .vc-nav-brand{font-size:12px;letter-spacing:.14em}
  .vc-nav-brand svg{width:26px;height:26px}
  .vc-nav-links a, .vc-nav-drop-toggle{padding:12px 10px !important;font-size:10px !important}
}
