/* top navigation bar, phone menu, and the sticky phone "Join" button */
nav{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:16px 24px;transition:.4s}
nav.solid{background:rgba(15,8,24,.9);backdrop-filter:blur(10px);padding:10px 24px;border-bottom:1px solid rgba(217,164,65,.15)}
/* logo: the peacock, then the word traced from the brand PNG (assets/brand). The opening loader flies its peacock onto .logo-mark */
.logo{display:flex;align-items:center;gap:10px;position:relative;z-index:62}
.logo-mark{height:46px;width:auto}
.logo-word{height:34px;width:auto;margin-top:6px}
@media(max-width:899px){.logo-mark{height:40px}.logo-word{height:29px}}
nav ul{display:flex;gap:28px;list-style:none;font-size:13px;letter-spacing:.18em;text-transform:uppercase}
nav ul a{color:var(--mute);transition:.3s}
nav ul a:hover{color:var(--gold2)}
.burger{display:none;position:relative;z-index:62;width:44px;height:44px;background:none;border:0;cursor:pointer}
.burger span{position:absolute;left:11px;right:11px;height:1px;background:var(--gold2);transition:.35s}
.burger span:nth-child(1){top:16px}.burger span:nth-child(2){top:22px}.burger span:nth-child(3){top:28px}
nav.open .burger span:nth-child(1){top:22px;rotate:45deg}
nav.open .burger span:nth-child(2){opacity:0}
nav.open .burger span:nth-child(3){top:22px;rotate:-45deg}

.cta-bar{display:none}

@media(max-width:899px){
  .burger{display:block}
  nav ul{position:fixed;inset:0;z-index:61;flex-direction:column;justify-content:center;align-items:center;gap:26px;
    background:rgba(15,8,24,.97);font-family:var(--serif);font-size:34px;letter-spacing:.06em;text-transform:none;
    opacity:0;pointer-events:none;transition:.4s}
  nav ul a{color:var(--ink)}
  nav.open ul{opacity:1;pointer-events:auto}
  .cta-bar{display:block;position:fixed;left:16px;right:16px;bottom:max(14px,env(safe-area-inset-bottom));z-index:40;
    text-align:center;padding:15px;background:var(--gold);color:#150a22;letter-spacing:.2em;font-size:12px;text-transform:uppercase;
    box-shadow:0 10px 30px rgba(0,0,0,.5);transform:translateY(140%);transition:.45s}
  body.past-hero .cta-bar{transform:none}
  body.menu-open .cta-bar{transform:translateY(140%)}
  footer{padding-bottom:90px}
}