/* OrbitalX: "Explore" dropdown in the primary nav. Uses the tokens from ox.css. */
.nav-dd{position:relative;display:flex;align-items:center}
.nav-dd-btn{display:inline-flex;align-items:center;gap:6px;margin:0;padding:0;border:0;background:none;
  font:inherit;font-size:.9375rem;letter-spacing:inherit;color:#c9cdd3;cursor:pointer;position:relative;line-height:inherit}
.nav-dd-btn svg{width:10px;height:10px;transition:transform .2s ease}
.nav-dd-btn:hover,.nav-dd.open .nav-dd-btn,.nav-dd-btn.is-current{color:var(--ink,#eceef1)}
.nav-dd-btn.is-current::after{content:"";position:absolute;left:0;right:16px;bottom:-6px;height:1px;background:var(--plasma,#8fb3ff)}
.nav-dd-btn:focus-visible{outline:1px solid var(--plasma,#8fb3ff);outline-offset:6px}

/* Panel. padding-top bridges the gap so hover doesn't drop between button and panel. */
.nav-dd-menu{position:absolute;top:100%;left:-20px;z-index:60;margin:0;padding:18px 0 0;list-style:none;
  min-width:360px;visibility:hidden;opacity:0;transform:translateY(-4px);
  transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s}
.nav-dd-menu::before{content:"";position:absolute;inset:18px 0 0;z-index:-1;background:var(--panel,#07090c);
  border:1px solid var(--rule,rgba(236,238,241,.14));box-shadow:0 24px 60px rgba(0,0,0,.55)}
.nav-dd-menu li{margin:0}
.nav-dd-menu li:first-child{padding-top:8px}
.nav-dd-menu li:last-child{padding-bottom:8px}
.nav .nav-dd-menu a{display:block;padding:12px 20px;color:var(--ink,#eceef1);font-size:.9375rem;line-height:1.3}
.nav .nav-dd-menu a span{display:block;margin-top:3px;font-size:13px;letter-spacing:.01em;color:var(--dim,#8b919a)}
.nav .nav-dd-menu a:hover,.nav .nav-dd-menu a:focus-visible{background:rgba(236,238,241,.05);outline:none}
.nav .nav-dd-menu a:hover span{color:#c9cdd3}
.nav .nav-dd-menu a[aria-current="page"]::after{content:"";position:absolute;left:0;right:auto;top:12px;bottom:12px;width:2px;height:auto;background:var(--plasma,#8fb3ff)}

/* Open: click/keyboard (JS adds .open), mouse hover, or keyboard focus when JS is off */
.nav-dd.open .nav-dd-menu,
html:not(.ox-nav-js) .nav-dd:focus-within .nav-dd-menu{visibility:visible;opacity:1;transform:none;transition:opacity .18s ease,transform .18s ease}
@media (hover:hover) and (pointer:fine){
  .nav-dd:hover .nav-dd-menu{visibility:visible;opacity:1;transform:none;transition:opacity .18s ease,transform .18s ease}
  .nav-dd:hover .nav-dd-btn{color:var(--ink,#eceef1)}
  .nav-dd:hover .nav-dd-btn svg{transform:rotate(180deg)}
}
.nav-dd.open .nav-dd-btn svg{transform:rotate(180deg)}
@media (prefers-reduced-motion:reduce){.nav-dd-menu,.nav-dd-btn svg{transition:none}}