/* Shared on every page: the title lock-up, the menu and the footer. */
.lock{font-family:Bungee,sans-serif;color:var(--taxi,#f7c600);text-align:center;line-height:1;
  font-size:clamp(40px,min(14vw,14svh),128px);-webkit-text-stroke:2px #0c0804;text-shadow:0 0 22px #ff9a0080,4px 5px 0 #000}
.lock.small{font-size:44px}
.band{display:inline-block;background:#d61c28;color:#fff;font:400 clamp(11px,1.6vw,16px)/1.3 Bungee,sans-serif;padding:4px 14px;
  transform:skewX(-12deg);-webkit-text-stroke:0;text-shadow:2px 3px 0 #000;margin-top:10px;white-space:nowrap}
.lock .band{vertical-align:top}
/* what B.H.A.I. stands for, under the name wherever the lock-up shows */
.full{display:inline-block;font:400 clamp(11px,1.5vw,15px)/1.2 Bungee,sans-serif;letter-spacing:.16em;color:#fff;
  -webkit-text-stroke:0;text-shadow:0 2px 6px #000;white-space:nowrap}
.lock .full{display:block;margin:8px 0 2px}
.band i{display:inline-block;transform:skewX(12deg);font-style:normal}

#menuBtn{position:fixed;left:calc(12px + env(safe-area-inset-left));top:calc(12px + env(safe-area-inset-top));z-index:110;width:44px;
  height:44px;border-radius:50%;border:2px solid #fff3;background:#000a;cursor:pointer;display:none;padding:0;
  flex-direction:column;align-items:center;justify-content:center;gap:4px}
#menuBtn.on{display:flex}
/* Join the waitlist, top right on every page while you read (home: not on the first screen, not over the form) */
#joinBtn{position:fixed;right:calc(12px + env(safe-area-inset-right));top:calc(12px + env(safe-area-inset-top));z-index:110;
  display:none;align-items:center;height:44px;padding:0 16px;border-radius:22px;background:var(--taxi,#f7c600);color:#1a1405;
  text-decoration:none;font:400 13px/1 Bungee,sans-serif;box-shadow:0 4px 14px #000a;white-space:nowrap}
#joinBtn.on{display:flex}
body:has(#mute.on) #joinBtn{right:calc(64px + env(safe-area-inset-right))}   /* home: never on top of the sound button */
#menuBtn i{display:block;width:18px;height:2px;background:#fff;border-radius:1px}
#menu{position:fixed;inset:0;z-index:120;background:#07060ff5;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:calc(40px + env(safe-area-inset-top)) 24px calc(40px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
#menu[hidden]{display:none}
#menu .close{position:absolute;left:calc(12px + env(safe-area-inset-left));top:calc(12px + env(safe-area-inset-top));width:44px;height:44px;
  border-radius:50%;border:2px solid #fff3;background:transparent;color:#fff;font-size:18px;cursor:pointer}
#menu ul{list-style:none;margin:28px 0 0;padding:0;text-align:center}
#menu li{margin:6px 0}
#menu a{display:inline-block;padding:10px 14px;font:400 clamp(20px,6vw,30px)/1.1 Bungee,sans-serif;color:#fff;text-decoration:none}
#menu a:hover,#menu a:focus-visible{color:var(--taxi,#f7c600)}
#menu a.cta{margin-top:14px;background:var(--taxi,#f7c600);color:#1a1405;border-radius:10px;font-size:clamp(16px,4.6vw,22px);padding:14px 20px}
html.menu-open{overflow:hidden}

footer{padding:56px 20px calc(40px + env(safe-area-inset-bottom));text-align:center;background:#05040b;border-top:1px solid #1d1a2c}
footer p{color:#a7a3b5;margin:14px auto 0;max-width:46ch;font-size:15px}
footer .fine{font-size:13px;opacity:.7}
footer a{color:var(--taxi,#f7c600)}
