/* Site switcher (owner 2026-10-22): two frosted-glass buttons, Vice After Dark → / and The Leonida Letter → /letter/,
   replace the logo + "The Letter" button in the top bar. Phones: one row with the hamburger. Desktop: a full-width row
   above the section links (owner approved the desktop preview). */
.nav__switch { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; min-width: 0; }
.nav .nav__brand, .nav .nav__letterbtn { display: none !important; }
.sw { display: flex; align-items: center; justify-content: center; min-width: 0; height: 52px; padding: 6px 10px; border-radius: 16px;
      background: rgba(20, 8, 34, .5); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .16); transition: box-shadow .25s, background .25s; }
.sw img { display: block; max-width: 100%; max-height: 40px; width: auto; height: auto; }
.sw--letter img { max-height: 36px; }
.sw:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
/* the site you're on: pink edge + soft glow (Letter pages carry body.lt-page) */
body:not(.lt-page) .sw--vad, .lt-page .sw--letter { background: rgba(40, 10, 50, .55);
  box-shadow: inset 0 0 0 1.5px var(--pink, #ff2d95), 0 0 18px rgba(255, 45, 149, .35); }
/* hero: the D2 logo carries its own glow */
.hero__title img { filter: none; }
/* home: the pink neon sweep is the header's bottom edge at every size (it used to hang off the vertically centred
   hero content, so it floated at different heights); it fades out once the bar turns solid on scroll */
.hero__sweep i:first-child { display: none; }
body:not(.sub) .nav::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; pointer-events: none;
  background: var(--pink, #ff2d95); color: var(--pink, #ff2d95); filter: drop-shadow(0 0 12px currentColor);
  transform: scaleX(0); transform-origin: left; animation: sweep 1.4s var(--ease, ease) .2s forwards; transition: opacity .35s; }
body:not(.sub) .nav.is-solid::after, body:not(.sub) .nav.is-open::after { opacity: 0 !important; }   /* beats the sweep animation's fill */
@media (prefers-reduced-motion: reduce) { body:not(.sub) .nav::after { transform: none; opacity: .55; } }

@media (max-width: 820px) {
  .nav__switch { flex: 1; }
  .nav__menu { flex: none; margin-left: 2px; }
}

@media (min-width: 821px) {
  .nav { flex-wrap: wrap; row-gap: 10px; }
  .nav__links a.nav__letter { display: none !important; }
  .nav__switch { gap: 12px; flex: 0 0 100%; order: -1; }
  .sw { height: 64px; padding: 8px 16px; }
  .sw img { max-height: 48px; }
  .sw--letter img { max-height: 44px; }
  .sw:hover { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .32); }
  body:not(.lt-page) .sw--vad:hover, .lt-page .sw--letter:hover { box-shadow: inset 0 0 0 1.5px var(--pink, #ff2d95), 0 0 24px rgba(255, 45, 149, .45); }
  /* the taller header pushes the hero down */
  .hero__inner { --pad-top: 184px; }
  .hero__title { width: min(620px, 80vw); }
}