/* Floating site header - shared by every page.
   To add a link: add an <a> inside .site-nav on each page. */
.site-header{
  position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:1000;
  width:min(1100px,calc(100% - 24px));
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:7px 7px 7px 20px;
  background:rgba(17,17,17,.74);
  -webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);
  border:1px solid rgba(255,255,255,.08);border-radius:999px;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
  font-family:'Plus Jakarta Sans',sans-serif;
}
.site-brand{color:#f2eeea;text-decoration:none;font-weight:800;font-size:15px;letter-spacing:-.02em;white-space:nowrap}
.site-brand span{color:#e8622a}
.site-nav{display:flex;gap:2px}
.site-nav a{color:#b9b4ae;text-decoration:none;font-size:14px;font-weight:600;padding:9px 16px;border-radius:999px;transition:color .2s,background .2s;white-space:nowrap}
.site-nav a:hover{color:#f2eeea;background:rgba(255,255,255,.07)}
.site-nav a[aria-current="page"]{color:#fff;background:#e8622a}
.site-nav a[aria-current="page"]:hover{background:#d0561f}
.site-header-spacer{height:72px}
@media (max-width:480px){
  .site-header{padding:6px 6px 6px 14px}
  .site-brand{font-size:14px}
  .site-brand span{display:none}
  .site-nav a{font-size:13px;padding:8px 11px}
}