/* nav */
nav{position:fixed;top:0;left:0;width:100%;z-index:500;display:flex;justify-content:space-between;align-items:center;padding:22px 5vw;transition:padding .4s}
/* soft frosted strip under the header: content scrolling beneath it blurs slightly,
   fading out at the bottom so there is no hard edge */
nav::before{content:'';position:absolute;inset:0 0 -16px 0;z-index:-1;pointer-events:none;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);-webkit-mask-image:linear-gradient(#000 60%,transparent);mask-image:linear-gradient(#000 60%,transparent)}
nav.scrolled{padding:14px 5vw}
nav .brand{display:flex;align-items:center;gap:12px}
nav .brand img{width:30px;height:30px;border-radius:50%}
nav .brand b{font-family:'Inter Tight',sans-serif;font-weight:700;font-size:15px;letter-spacing:2px}
.nav-right{display:flex;align-items:center;gap:26px}
.nav-menu{display:flex;gap:30px}
.nav-menu a{font-family:'Inter Tight',sans-serif;font-size:11px;letter-spacing:1px;text-transform:uppercase;opacity:.75;transition:opacity .3s}
.nav-menu a:hover{opacity:1;color:var(--gold)}
@media(max-width:820px){.nav-menu{display:none}}