/* ===== BAR ===== */
.custom-navbar{
  --nav-h: 70px; --line-h: 6px;
  background: var(--bg);
  height: var(--nav-h); width: 100%; padding: 0 26px;
  position: sticky; top: 0; z-index: 2000; overflow: visible;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.custom-navbar::after{
  content:""; position:absolute; left:0; right:0; bottom:0;
  height: var(--line-h); background: var(--accent); z-index: 1;
}
.custom-navbar-container{
  height: var(--nav-h);
  display:flex; align-items:center; justify-content:space-between;
  position:relative; z-index:2;
}

/* brand/logo */
.custom-navbar-logo{ height:65.2px; width:auto; background:transparent; object-fit:contain; }

/* ===== DESKTOP PILLS ===== */
.nav-pills{
  list-style:none; margin:0; padding:0;
  display:flex; gap:22px;
}
.nav-pills > li > a{
  display:inline-block; padding:8px 14px;
  border:1.5px solid var(--accent); border-radius:9999px;
  color:var(--accent); background:transparent; text-decoration:none;
  font-weight:600; letter-spacing:.2px; line-height:1;
  transition: background .25s, color .25s, border-color .25s;
}
.nav-pills > li > a:hover,
.nav-pills > li > a:focus{
  background:var(--accent); color:var(--accent-contrast,#fff);
  border-color:var(--accent); outline:none;
}

/* toggle button */
.pill-btn.nav-toggle{
  border:1.5px solid var(--accent); color:var(--accent);
  background:transparent; padding:8px 12px; font-weight:700;
  border-radius:9999px; line-height:1; display:none; /* shown on mobile */
}
.pill-btn.nav-toggle .fa-bars{ color:var(--accent); }
.pill-btn.nav-toggle[aria-expanded="true"]{
  background:var(--accent); color:var(--accent-contrast,#fff);
}

/* ===== DROPDOWN (MOBILE) ===== */
.nav-dropdown{
  position:absolute;
  top: calc(var(--nav-h) + var(--line-h));
  right: 26px; left:auto;
  width: min(86vw, 360px);
  background: var(--bg);
  border-top: 4px solid var(--accent);
  border-left: 1px solid rgba(var(--accent-rgb,218,165,32),.25);
  border-bottom-left-radius: 18px;
  box-shadow: 0 24px 60px rgba(0,0,0,.14);
  padding: 12px;
  z-index: 2100;
  max-height: 60vh; overflow:auto;
}
/* dropdown items look like big options */
.nav-option{
  display:block; width:100%; text-align:center;
  padding:14px 16px; border-radius:14px;
  border:1.5px solid transparent; background:transparent;
  color:var(--accent); font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  cursor:pointer; transition: background .15s, border-color .15s, color .15s;
}
.nav-option:hover{ background:rgba(var(--accent-rgb,218,165,32),.08); border-color:rgba(var(--accent-rgb,218,165,32),.35); }
.nav-option[aria-selected="true"]{ background:var(--accent); color:var(--accent-contrast,#fff); border-color:var(--accent); }

/* ===== RESPONSIVE ===== */
@media (max-width: 991px){
  /* hide desktop pills; show toggle */
  .nav-pills{ display:none; }
  .pill-btn.nav-toggle{ display:inline-flex; align-items:center; gap:8px; margin-left:auto; }
}