.site-nav{
  position:absolute;
  z-index:28;
  top:64px;
  right:0;
  left:0;
  display:flex;
  gap:7px;
  padding:7px 9px;
  overflow-x:auto;
  scrollbar-width:none;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.site-nav::-webkit-scrollbar{display:none}
.site-nav a{
  flex:0 0 auto;
  white-space:nowrap;
  padding:7px 10px;
  border:1px solid rgba(180,216,242,.27);
  background:rgba(3,8,14,.18)!important;
  color:#e8f1f7;
  font-size:10px;
  line-height:1.2;
  text-shadow:0 1px 5px #000,0 1px 12px #000;
  backdrop-filter:blur(2px);
}
.site-nav a.active{
  border-color:#248cff;
  color:#fff;
  background:rgba(36,140,255,.18)!important;
  box-shadow:inset 0 0 0 1px rgba(36,140,255,.16);
}

/* Keep the brand mark identical on the main page and every internal page. */
.brand-mark{
  width:46px!important;
  height:38px!important;
  border:0!important;
  border-radius:12px!important;
  background:radial-gradient(circle at 58% 45%,rgba(36,140,255,.24),transparent 68%)!important;
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
}
.brand-mark:after{display:none!important}
.brand-mark i{
  position:absolute;
  z-index:2;
  width:10px;
  height:55px;
  opacity:.72;
  transform:rotate(35deg);
  background:linear-gradient(transparent,#248cff,transparent);
  animation:sweep 4s linear infinite;
}
.brand-bike-real{
  position:relative!important;
  z-index:1!important;
  width:45px!important;
  height:34px!important;
  object-fit:contain;
  transform:rotate(-2deg) scale(1.08);
  filter:drop-shadow(0 0 5px rgba(36,140,255,.55));
}
@media(min-width:520px){
  body>.site-nav{
    width:430px;
    right:auto;
    left:50%;
    transform:translateX(-50%);
  }
}
