@import url('https://fonts.googleapis.com/css2?family=DM+Mono:ital,wght@0,400;0,500;1,400&family=Cinzel:wght@600;700&family=Syne:wght@400;600;700&display=swap');

:root{
  --ares-header-bg:rgba(7,16,31,.95);
  --ares-header-s2:#111f35;
  --ares-header-gold:#c8952f;
  --ares-header-gold-bright:#f0b444;
  --ares-header-gold-dim:rgba(200,149,47,.13);
  --ares-header-gold-rule:rgba(200,149,47,.22);
  --ares-header-text:#e5dece;
  --ares-header-muted:#6e849f;
  --ares-header-border:rgba(255,255,255,.1);
}

.sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

.nav{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  padding:13px 28px !important;
  border-bottom:.5px solid var(--ares-header-gold-rule) !important;
  background:var(--ares-header-bg) !important;
  position:sticky !important;
  top:0 !important;
  z-index:120 !important;
}

.nav-logo{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
}

.nav-logo img{
  width:44px !important;
  height:44px !important;
  object-fit:contain !important;
}

.nav-logo > span,
.nav-logo > div{
  display:flex !important;
  flex-direction:column !important;
}

.nav-wm{
  font-family:'Cinzel',serif !important;
  font-size:15px !important;
  font-weight:700 !important;
  letter-spacing:.18em !important;
  color:var(--ares-header-gold-bright) !important;
}

.nav-sub{
  font-family:'DM Mono',monospace !important;
  font-size:9px !important;
  letter-spacing:.14em !important;
  color:var(--ares-header-muted) !important;
  text-transform:uppercase !important;
  margin-top:1px !important;
}

.nav-links{
  display:flex !important;
  gap:1px !important;
}

.nl,
.nl.active,
.nl[aria-current="page"]{
  font-family:'DM Mono',monospace !important;
  font-size:10px !important;
  letter-spacing:.07em !important;
  text-transform:uppercase !important;
  color:var(--ares-header-muted) !important;
  padding:6px 12px !important;
  border-radius:5px !important;
  border:none !important;
  background:none !important;
  cursor:pointer !important;
  transition:color .15s,background .15s !important;
}

.nl:hover,
.nl:focus-visible{
  color:var(--ares-header-gold-bright) !important;
  background:var(--ares-header-gold-dim) !important;
}

.nav-search{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  background:var(--ares-header-s2) !important;
  border:.5px solid var(--ares-header-gold-rule) !important;
  border-radius:7px !important;
  padding:7px 13px !important;
  font-family:'DM Mono',monospace !important;
  font-size:11px !important;
  color:var(--ares-header-muted) !important;
  min-width:170px !important;
  position:relative !important;
}

.nav-search input{
  width:100% !important;
  min-width:0 !important;
  background:transparent !important;
  border:0 !important;
  color:var(--ares-header-text) !important;
  font:inherit !important;
  outline:none !important;
}

.nav-search input::placeholder{
  color:var(--ares-header-muted) !important;
}

.search-results,
.ares-global-search-results{
  position:absolute !important;
  top:calc(100% + 6px) !important;
  left:0 !important;
  right:0 !important;
  background:var(--ares-header-s2) !important;
  border:1px solid var(--ares-header-gold-rule) !important;
  border-radius:7px !important;
  z-index:140 !important;
  max-height:360px !important;
  overflow:auto !important;
}

.nav-cta{
  display:none !important;
}

.menu-btn{
  display:none !important;
  background:none !important;
  border:.5px solid var(--ares-header-border) !important;
  color:var(--ares-header-gold-bright) !important;
  padding:7px 9px !important;
  border-radius:5px !important;
  font-family:'DM Mono',monospace !important;
  font-size:10px !important;
}

.nl:focus-visible,
.nav-search:focus-visible,
.menu-btn:focus-visible{
  outline:2px solid var(--ares-header-gold-bright) !important;
  outline-offset:2px !important;
}

@media (max-width:1120px){
  .nav-links{
    gap:0 !important;
  }
  .nl,
  .nl.active,
  .nl[aria-current="page"]{
    padding:6px 8px !important;
  }
  .nav-search{
    min-width:145px !important;
  }
}

@media (max-width:980px){
  .nav{
    padding:12px 18px !important;
  }
  .nav-links{
    display:none !important;
  }
  .menu-btn{
    display:block !important;
  }
  .nav-search{
    display:none !important;
  }
  .nav.open .nav-links,
  .nav-links.open{
    display:flex !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    top:67px !important;
    background:#0c1829 !important;
    padding:12px !important;
    flex-wrap:wrap !important;
    border-bottom:1px solid var(--ares-header-gold-rule) !important;
  }
}

@media (max-width:720px){
  .nav{
    padding:10px 14px !important;
  }
  .nav-wm{
    font-size:14px !important;
  }
  .nav-logo img{
    width:46px !important;
    height:46px !important;
  }
}
