/* Separate floating panels leave the hero suspension visible between them. */
.nav-shell,
.nav-shell.scrolled {
  padding: 0;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  pointer-events: none;
}

.nav-brand-panel,
.nav-shell .nav-actions {
  height: 66px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  border-radius: 22px;
  background: rgba(245, 245, 243, .94);
  box-shadow: 0 13px 40px rgba(20, 20, 20, .045);
  pointer-events: auto;
  transition: height .3s ease, box-shadow .3s ease;
}

.nav-brand-panel { gap: 34px; padding: 0 23px; }
.nav-shell .nav-actions { position: relative; }

/* A compact dropdown stays anchored to its trigger at every scroll position. */
.menu-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 208px;
  max-height: calc(100dvh - 105px);
  overflow-y: auto;
  padding: 6px;
  border: 1px solid #e3e2e6;
  border-radius: 14px;
  background: #f8f8f6;
  color: var(--ink);
  box-shadow: 0 8px 24px rgba(23, 23, 25, .07);
}
.menu-panel > a {
  grid-template-columns: minmax(0, 1fr) 16px;
  align-items: center;
  min-height: 44px;
  padding: 10px 12px;
  border: 0;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 500;
  letter-spacing: -.015em;
}
.menu-panel > a b { font-size: 14px; color: #817c8b; }
.menu-panel > a:hover { background: #eeebf4; color: var(--violet); }
.menu-panel > a:focus-visible { outline-offset: -3px; }
.menu-button { position: relative; }
.menu-button span { margin-right: 22px; }
.menu-button i { position: absolute; top: calc(50% - 1px); right: 14px; margin: 0; }
.menu-button i:nth-of-type(1) { transform: translateY(-3px); }
.menu-button i:nth-of-type(2) { margin-left: 0; transform: translateY(3px); }
.menu-button[aria-expanded=true] i:nth-of-type(1) { transform: rotate(45deg); }
.menu-button[aria-expanded=true] i:nth-of-type(2) { transform: rotate(-45deg); }
.nav-links { display: flex; align-items: center; gap: 24px; }
.nav-links a { font-size: 12px; font-weight: 500; transition: color .2s ease; }
.nav-links a:hover { color: var(--violet); }
.nav-shell a:focus-visible,
.nav-shell button:focus-visible { outline: 2px solid var(--violet); outline-offset: 5px; }
.nav-shell.scrolled .nav-brand-panel,
.nav-shell.scrolled .nav-actions { height: 58px; box-shadow: 0 10px 35px rgba(20, 20, 20, .08); }

@media (min-width: 941px) {
  .nav-actions .menu-button,
  .nav-actions .menu-panel { display: none; }
}

@media (max-width: 940px) {
  .nav-links { display: none; }
}

@media (max-width: 720px) {
  .nav-brand-panel,
  .nav-shell .nav-actions { height: 52px; border-radius: 16px; }
  .nav-brand-panel { padding: 0 14px; }
  .nav-shell .nav-actions { padding: 0 8px; }
  .nav-shell.scrolled .nav-brand-panel,
  .nav-shell.scrolled .nav-actions { height: 50px; }
}

@media (prefers-reduced-motion: reduce) {
  .nav-brand-panel,
  .nav-shell .nav-actions { transition: none; }
}
