/* Standalone base for the global navbar on pages that do not load styles.css. */
.pill-nav {
  position: fixed;
  left: 50%;
  z-index: 1000;
  display: flex;
  align-items: center;
  transform: translateX(-50%);
}
.pill-nav-links { display: flex; align-items: center; }
.pill-nav .logo { text-decoration: none; }
.pill-nav .text-red { color: #ff204e; }
.pill-nav .brand-logo { object-fit: contain; }
.pill-link { text-decoration: none; white-space: nowrap; }
body.nb-premium-page > main { padding-top: 48px; }

/* Short staged entrance used by the main commercial experience. */
@keyframes nb-timed-nav-show {
  from { opacity: 0; visibility: hidden; transform: translate(-50%, -12px) scale(.985); }
  to { opacity: 1; visibility: visible; transform: translate(-50%, 0) scale(1); }
}
@keyframes nb-timed-title-show {
  from { opacity: 0; visibility: hidden; transform: translateY(18px); filter: blur(5px); }
  to { opacity: 1; visibility: visible; transform: translateY(0); filter: blur(0); }
}
@keyframes nb-timed-showcase-show {
  from { opacity: 0; visibility: hidden; transform: translateY(28px) scale(.985); filter: blur(5px); }
  to { opacity: 1; visibility: visible; transform: translateY(0) scale(1); filter: blur(0); }
}

body.nb-premium-page .pill-nav {
  animation: nb-timed-nav-show .6s cubic-bezier(.16,1,.3,1) .45s both;
}
body.nb-premium-page .nb-hero-copy h1 {
  animation: nb-timed-title-show .55s cubic-bezier(.16,1,.3,1) .25s both;
}
body.nb-premium-page .nb-hero-showcase {
  animation: nb-timed-showcase-show .75s cubic-bezier(.16,1,.3,1) .8s both;
  transition: none;
}
body.nb-premium-page .nb-hero-showcase.is-revealed {
  transform: none;
  filter: none;
}
.menu-toggle {
  display: none;
  padding: 10px;
  border: 0;
  color: #fff;
  background: transparent;
  cursor: pointer;
}

.mobile-menu-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  padding: 28px;
  flex-direction: column;
  visibility: hidden;
  background: rgba(7, 7, 8, .97);
  backdrop-filter: blur(22px);
  transform: translateX(100%);
  transition: transform .38s cubic-bezier(.85, 0, .15, 1), visibility .38s;
}

.mobile-menu-overlay.active { visibility: visible; transform: translateX(0); }
.menu-overlay-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 44px; }
.menu-overlay-header .logo { display: inline-flex; align-items: center; gap: 10px; color: #fff; font: 900 1rem Inter, sans-serif; text-decoration: none; }
.menu-overlay-header .brand-logo { width: 34px; height: 34px; object-fit: contain; }
.menu-close { padding: 8px; border: 0; color: #ff6686; background: transparent; cursor: pointer; }
.menu-overlay-links { display: flex; flex-direction: column; gap: 8px; }
.menu-overlay-link {
  display: flex;
  min-height: 54px;
  padding: 0 14px;
  align-items: center;
  gap: 12px;
  border-radius: 12px;
  color: #f7f7f8;
  font: 750 1rem Manrope, Inter, sans-serif;
  text-decoration: none;
}
.menu-overlay-link:hover { color: #fff; background: rgba(255,255,255,.055); }
.menu-overlay-link span { color: #ff6686; font: 800 .65rem Inter, sans-serif; }
.btn-pro-mobile { margin-top: 8px; color: #fff !important; background: linear-gradient(135deg,#ff315b,#dd0936); }

@media (max-width: 1024px) {
  .menu-toggle { display: inline-grid; place-items: center; }
  .pill-nav-links { display: none !important; }
}