:root{
  --nav:#d7dcf0; --nav-hover:#ffffff; --border:rgba(255,255,255,.10);
  --brand-start:#6366f1; --brand-end:#7c3aed;
  --glass-bg: rgba(10, 14, 25, .55);
  --glass-grad: radial-gradient(120% 120% at 10% 0%, rgba(124,58,237,.18) 0%, rgba(99,102,241,.10) 28%, rgba(2,6,23,0) 55%),
                linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.00));
  --glass-tile: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
}

/* prevent sticky header jump when logged in */
body.admin-bar .main-header-container{ top:32px; }
@media (max-width:782px){ body.admin-bar .main-header-container{ top:46px; } }

/* header container (liquid glass) */
.main-header-container{
  position:sticky; top:0; z-index:50;
  padding-top:env(safe-area-inset-top);
  background:var(--glass-bg);
  background-image:var(--glass-grad);
  -webkit-backdrop-filter:saturate(140%) blur(18px);
  backdrop-filter:saturate(140%) blur(18px);
  border-bottom:1px solid var(--border);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.hdr-row{ height:2.75rem; } @media (min-width:768px){ .hdr-row{ height:3.75rem; } }

/* logo text gradient */
.header-logo-text{
  font-weight:800; letter-spacing:-.02em;
  background:linear-gradient(90deg,var(--brand-start),var(--brand-end));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* remove all underlines in header */
.main-header-container a,
.main-header-container a:hover,
.main-header-container a:focus{ text-decoration:none !important; }

/* DESKTOP NAV */
.primary-menu{ display:flex; gap:.25rem; list-style:none; margin:0; padding:0; }
.primary-menu > li{ margin:0; }
.primary-menu > li > a{
  display:inline-flex; align-items:center;
  color:var(--nav); font-weight:600; font-size:.95rem;
  padding:.4rem .6rem; border-radius:10px;
  transition:color .18s ease, background-color .18s ease;
}
.primary-menu > li > a:hover{ color:var(--nav-hover); background:rgba(255,255,255,.06); }

/* gradient link effect like logo */
.main-header-container[data-nav="gradient"] .primary-menu > li > a:hover,
.main-header-container[data-nav="gradient"] .primary-menu .current-menu-item > a,
.main-header-container[data-nav="gradient"] .primary-menu .current_page_item > a,
.main-header-container[data-nav="gradient"] .primary-menu > li > a[aria-current="page"]{
  background:linear-gradient(90deg,var(--brand-start),var(--brand-end));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.main-header-container[data-nav="gradient"] .primary-menu > li > a:hover{ background:transparent; }

/* MOBILE SHEET + tiles */
#mobile-menu{
  position:relative; max-height:0; overflow:hidden; visibility:hidden;
  transition:max-height .26s ease, visibility .26s ease;
  -webkit-backdrop-filter:saturate(140%) blur(18px);
  backdrop-filter:saturate(140%) blur(18px);
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(124,58,237,.16) 0%, rgba(124,58,237,0) 55%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,0));
  border-top:1px solid rgba(255,255,255,.10);
  padding-bottom:max(.5rem, env(safe-area-inset-bottom));
}
#mobile-menu[data-open="true"]{ max-height:72vh; visibility:visible; }

#mobile-menu::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,0,0,.18);
}
#mobile-menu .menu, #mobile-menu ul{ list-style:none; margin:0; padding:0; }

#mobile-menu a{
  position:relative; display:block; width:100%;
  padding:.8rem .9rem; margin:.35rem 0;
  border-radius:12px; color:var(--nav);
  background:rgba(255,255,255,.05); background-image:var(--glass-tile);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 2px 10px rgba(2,6,23,.15);
  transition:background-color .18s ease, color .18s ease, transform .06s ease, border-color .18s ease, box-shadow .18s ease;
}
#mobile-menu a:hover{ color:#fff; background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.16); }
#mobile-menu a:active{ transform:translateY(1px); }
#mobile-menu a:focus-visible{
  outline:none; box-shadow:0 0 0 2px rgba(99,102,241,.6), inset 0 1px 0 rgba(255,255,255,.08);
  border-color:rgba(99,102,241,.6); color:#fff;
}
#mobile-menu .sub-menu a{ margin-left:.5rem; }

#mobile-menu li.current-menu-item > a,
#mobile-menu li.current_page_item > a,
#mobile-menu li.current-menu-ancestor > a,
#mobile-menu a[aria-current="page"]{
  color:#fff; background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 4px 14px rgba(2,6,23,.25);
}
#mobile-menu li.current-menu-item > a::before,
#mobile-menu li.current_page_item > a::before,
#mobile-menu li.current-menu-ancestor > a::before,
#mobile-menu a[aria-current="page"]::before{
  content:""; position:absolute; left:6px; top:50%; transform:translateY(-50%);
  width:3px; height:60%; border-radius:2px;
  background:linear-gradient(180deg,var(--brand-start),var(--brand-end));
}

/* a11y fallbacks */
@media (prefers-reduced-transparency: reduce){
  #mobile-menu{ -webkit-backdrop-filter:none; backdrop-filter:none; background:#0f172a; }
  #mobile-menu::before{ box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }
}
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  #mobile-menu{ background:linear-gradient(180deg, rgba(18,24,40,.96), rgba(11,18,32,.92)); }
}
