/* MR9 v10.10.0 RC2 — compact, accessible primary navigation */

.desktop-nav{
  align-items:center;
  justify-content:flex-end;
  min-width:0;
  gap:clamp(10px,1vw,18px);
  white-space:nowrap;
}

.desktop-nav>a,
.mr9-nav-dropdown>summary,
.mr9-portal-nav>summary,
.project-link{
  font:800 10px/1 var(--cond);
  letter-spacing:.105em;
  text-transform:uppercase;
}

.desktop-nav>a,
.mr9-nav-dropdown>summary,
.mr9-portal-nav>summary{
  color:#c9cdc5;
  text-decoration:none;
}

.desktop-nav>a,
.mr9-nav-dropdown>summary{
  display:flex;
  align-items:center;
  min-height:44px;
}

.desktop-nav>a:hover,
.desktop-nav>a:focus-visible,
.mr9-nav-dropdown>summary:hover,
.mr9-nav-dropdown>summary:focus-visible,
.mr9-portal-nav>summary:hover,
.mr9-portal-nav>summary:focus-visible,
.mr9-nav-dropdown[open]>summary,
.mr9-portal-nav[open]>summary,
.mr9-nav-dropdown>summary[aria-current="page"]{
  color:var(--acid);
}

.mr9-nav-dropdown,
.mr9-portal-nav{
  position:relative;
}

.mr9-nav-dropdown>summary,
.mr9-portal-nav>summary{
  cursor:pointer;
  list-style:none;
  user-select:none;
}

.mr9-nav-dropdown>summary::-webkit-details-marker,
.mr9-portal-nav>summary::-webkit-details-marker{
  display:none;
}

.mr9-nav-dropdown>summary b,
.mr9-portal-nav>summary b{
  display:inline-block;
  margin-left:8px;
  color:var(--acid);
  font-size:14px;
  transition:transform .18s ease;
}

.mr9-nav-dropdown[open]>summary b,
.mr9-portal-nav[open]>summary b{
  transform:rotate(45deg);
}

.mr9-nav-dropdown-panel,
.mr9-portal-menu{
  position:absolute;
  top:calc(100% + 18px);
  min-width:220px;
  padding:8px;
  background:rgba(9,10,8,.98);
  border:1px solid rgba(236,238,232,.25);
  box-shadow:0 18px 42px rgba(0,0,0,.45);
}

.mr9-nav-dropdown-panel{
  left:-16px;
}

.mr9-portal-menu{
  right:0;
  min-width:238px;
}

.mr9-nav-dropdown-panel a,
.mr9-portal-menu a{
  display:flex;
  align-items:center;
  min-height:44px;
  padding:0 12px;
  color:#c9cdc5 !important;
  border:0;
  background:transparent;
  text-decoration:none;
  font:800 10px/1.25 var(--cond);
  letter-spacing:.105em;
  text-transform:uppercase;
}

.mr9-nav-dropdown-panel a+a,
.mr9-portal-menu a+a{
  border-top:1px solid rgba(236,238,232,.14);
}

.mr9-nav-dropdown-panel a:hover,
.mr9-nav-dropdown-panel a:focus-visible,
.mr9-portal-menu a:hover,
.mr9-portal-menu a:focus-visible,
.mr9-nav-dropdown-panel a[aria-current="page"]{
  color:var(--acid) !important;
  background:rgba(152,255,84,.07);
}

.desktop-nav a:focus-visible,
.mr9-nav-dropdown>summary:focus-visible,
.mr9-portal-nav>summary:focus-visible,
.mr9-nav-dropdown-panel a:focus-visible,
.mr9-portal-menu a:focus-visible,
.project-link:focus-visible{
  outline:2px solid var(--acid);
  outline-offset:3px;
}

.project-link{
  justify-self:end;
  min-height:44px;
  padding:0 0 0 18px;
  gap:10px;
  white-space:nowrap;
}

.project-link b{
  font-size:14px;
}

.topbar>.logo{
  width:210px;
}

.topbar>.logo img{
  width:100%;
  height:64px;
  max-height:64px;
  object-fit:contain;
  object-position:left center;
}

.mr9-portal-nav{
  padding:0;
  border:0;
  white-space:nowrap;
}

.mr9-portal-nav>summary{
  display:flex;
  align-items:center;
  min-height:44px;
  padding:0 13px;
  border:1px solid var(--acid);
  color:var(--acid);
}

@media (min-width:1600px){
  .topbar{
    grid-template-columns:210px minmax(0,1fr) auto auto;
    gap:clamp(14px,1.2vw,24px);
  }
  .topbar>.logo{grid-column:1}
  .topbar>.desktop-nav{display:flex;grid-column:2;justify-self:end}
  .topbar>.project-link{display:flex;grid-column:3}
  .topbar>.mr9-portal-nav{display:block !important;grid-column:4}
  .topbar>.menu{display:none}
}

@media (min-width:721px) and (max-width:1599px){
  .topbar{
    grid-template-columns:190px minmax(0,1fr) auto 44px;
    gap:18px;
  }
  .topbar>.logo{grid-column:1}
  .topbar>.logo{width:190px}
  .topbar>.logo img{height:58px;max-height:58px}
  .topbar>.desktop-nav,
  .topbar>.mr9-portal-nav{display:none !important}
  .topbar>.project-link{display:flex;grid-column:3;margin-left:0}
  .topbar>.menu{display:block;grid-column:4}
}

@media (max-width:720px){
  .topbar>.logo{width:148px}
  .topbar>.logo img{height:48px;max-height:48px}
  .topbar>.desktop-nav,
  .topbar>.project-link,
  .topbar>.mr9-portal-nav{display:none !important}
}

@media (prefers-reduced-motion:reduce){
  .mr9-nav-dropdown>summary b,
  .mr9-portal-nav>summary b{transition:none}
}
