/* Top-nav dropdown (Resources) — shared by every page.
   Desktop: the trigger opens a small panel on hover or keyboard focus.
   Mobile: the group renders as a label with indented sub-links. */

.nav-dropdown { position: relative; display: inline-flex; align-items: center; }

.nav-dropdown__trigger {
  display: inline-flex; align-items: center; gap: 6px;
  background: transparent; border: 0; padding: 0; margin: 0;
  cursor: pointer;
}
.nav-dropdown__caret { width: 12px; height: 12px; transition: transform 160ms ease; }
.nav-dropdown:hover .nav-dropdown__caret,
.nav-dropdown:focus-within .nav-dropdown__caret { transform: rotate(180deg); }
.nav-dropdown:hover .nav-dropdown__trigger,
.nav-dropdown:focus-within .nav-dropdown__trigger { color: var(--smb-rust); }

/* padding-top keeps the pointer inside the dropdown on the way down (no
   hover gap) and sets the space between "Resources" and the first item;
   with the list's zero top padding it matches the space between items. */
.nav-dropdown__panel {
  position: absolute; top: 100%; left: -22px;
  padding-top: 12px;
  visibility: hidden; opacity: 0;
  transform: translateY(-4px);
  transition: opacity 160ms ease, transform 160ms ease, visibility 0s linear 160ms;
}
.nav-dropdown:hover .nav-dropdown__panel,
.nav-dropdown:focus-within .nav-dropdown__panel {
  visibility: visible; opacity: 1; transform: translateY(0);
  transition: opacity 160ms ease, transform 160ms ease, visibility 0s;
}
/* While the panel is open, drop the nav's scrolled-state Brûlée line and shadow so the two surfaces join seamlessly */
.nav-fixed:has(.nav-dropdown:hover),
.nav-fixed:has(.nav-dropdown:focus-within) { border-bottom-color: transparent; box-shadow: none; }

.nav-dropdown__list {
  display: flex; flex-direction: column; gap: 4px;
  min-width: 260px; padding: 0 12px 12px;
  /* Semi-transparent Brûlée 50 so the page shows through; no top border so it blends into the nav bar */
  background-color: rgba(248,244,235,0.82);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border: 1px solid rgba(217,196,147,0.45); border-top: 0;
  border-radius: 0 0 5px 5px;
  box-shadow: 0 14px 36px -10px rgba(217,196,147,0.33), 0 4px 10px -4px rgba(217,196,147,0.24);
}
.nav-dropdown__link {
  display: block; padding: 8px 10px; border-radius: 4px;
  font-family: "Inter Tight", system-ui, -apple-system, sans-serif;
  font-size: 18px; font-weight: 500;
  color: var(--smb-dark-delft);
  text-decoration: none; white-space: nowrap;
  transition: color 160ms ease;
}
.nav-dropdown__link:hover { color: var(--smb-rust); }
.nav-dropdown__link.is-current { color: var(--smb-rust); }

/* Mobile menu group */
.mobile-nav-label {
  font-family: "Inter Tight", system-ui, -apple-system, sans-serif;
  font-size: 22px; font-weight: 500;
  color: var(--smb-dark-delft);
}
.mobile-nav-link.mobile-nav-sublink { font-size: 18px; padding-left: 16px; margin-top: -6px; }