/* DREAMSPIRE NAVIGATION • REFINED 2026 • Scoped to public navigation only
   Pure styling: keep existing route handlers, scripts, and page structure. */
:root {
  --ds-nav-ink: #1F3351;
  --ds-nav-gold: #9B814C;
  --ds-nav-border: rgba(31,51,81,.11);
  --ds-nav-surface: rgba(255,253,250,.88);
  --ds-nav-soft: rgba(31,51,81,.055);
}

/* Non-home desktop header: quiet editorial bar. */
@media (min-width:981px) {
  body.ds-v3:not(.ds-vnext-home-active) #site-header {
    background: rgba(255,253,250,.94) !important;
    border-bottom: 1px solid var(--ds-nav-border) !important;
    box-shadow: 0 5px 20px rgba(31,51,81,.025) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.15);
    backdrop-filter: blur(18px) saturate(1.15);
  }
  body.ds-v3 #main-navigation.top-nav {
    gap: clamp(9px, 1.22vw, 22px) !important;
    align-items: center !important;
  }
  body.ds-v3 #main-navigation.top-nav > button {
    position: relative !important;
    appearance: none;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #526177 !important;
    font: 600 clamp(10px,.86vw,12px)/1.15 'DM Sans',system-ui,sans-serif !important;
    letter-spacing: -.015em !important;
    padding: 18px 0 20px !important;
    min-height: 52px !important;
    white-space: nowrap !important;
    transition: color .2s ease !important;
    -webkit-tap-highlight-color: transparent;
  }
  body.ds-v3 #main-navigation.top-nav > button:hover,
  body.ds-v3 #main-navigation.top-nav > button:focus-visible,
  body.ds-v3 #main-navigation.top-nav > button.is-current {
    color: var(--ds-nav-ink) !important;
  }
  body.ds-v3 #main-navigation.top-nav > button::after {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    bottom: 10px !important;
    left: 0 !important;
    right: auto !important;
    width: 100% !important;
    height: 1.5px !important;
    border-radius: 99px !important;
    background: var(--ds-nav-gold) !important;
    transform: scaleX(0) !important;
    transform-origin: center !important;
    opacity: 1 !important;
    transition: transform .22s cubic-bezier(.22,1,.36,1) !important;
  }
  body.ds-v3 #main-navigation.top-nav > button.is-current::after,
  body.ds-v3 #main-navigation.top-nav > button:hover::after,
  body.ds-v3 #main-navigation.top-nav > button:focus-visible::after {
    transform: scaleX(1) !important;
  }
  /* An active item's underline steps aside while a different menu item is hovered. */
  body.ds-v3 #main-navigation.top-nav:hover > button.is-current:not(:hover):not(:focus-visible)::after {
    transform: scaleX(0) !important;
  }
  body.ds-v3 #main-navigation.top-nav > button:focus-visible {
    outline: 2px solid rgba(155,129,76,.5) !important;
    outline-offset: 5px !important;
  }
}
@media (min-width:981px) and (max-width:1180px) {
  body.ds-v3 #main-navigation.top-nav { gap: 10px !important; }
  body.ds-v3 #main-navigation.top-nav > button {
    font-size: 10px !important;
    letter-spacing: -.025em !important;
  }
}

/* The separate homepage topbar is intentionally retained, just visually unified. */
body.ds-vnext-home-active #ds-home-topbar {
  background: rgba(255,253,250,.82) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.2) !important;
  backdrop-filter: blur(20px) saturate(1.2) !important;
  border-bottom: 1px solid rgba(31,51,81,.09) !important;
  box-shadow: 0 6px 26px rgba(31,51,81,.035) !important;
}
#ds-home-menu-button,
html body .header > button#ds-vnext-menu-button,
#ds-clean-menu-button,
#ds-premium-menu-button {
  background: rgba(255,255,255,.70) !important;
  border: 1px solid rgba(31,51,81,.12) !important;
  border-radius: 999px !important;
  color: var(--ds-nav-ink) !important;
  box-shadow: 0 3px 12px rgba(31,51,81,.045) !important;
  font: 600 13px/1 'DM Sans',system-ui,sans-serif !important;
  letter-spacing: .005em !important;
  transition: background .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}
#ds-home-menu-button:hover,
html body .header > button#ds-vnext-menu-button:hover,
#ds-clean-menu-button:hover,
#ds-premium-menu-button:hover {
  background: #fff !important;
  border-color: rgba(155,129,76,.32) !important;
  box-shadow: 0 5px 18px rgba(31,51,81,.075) !important;
}
#ds-home-menu-button:focus-visible,
html body .header > button#ds-vnext-menu-button:focus-visible,
#ds-clean-menu-button:focus-visible,
#ds-premium-menu-button:focus-visible {
  outline: 2px solid var(--ds-nav-gold) !important;
  outline-offset: 3px !important;
}

/* Homepage + inner mobile sheets: one family of elegant, accessible menus. */
#ds-home-menu-sheet,
#ds-vnext-menu-sheet,
#ds-clean-menu-sheet,
#ds-premium-menu-sheet {
  border: 1px solid rgba(31,51,81,.13) !important;
  border-radius: 20px !important;
  background: rgba(255,253,250,.97) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.15) !important;
  backdrop-filter: blur(24px) saturate(1.15) !important;
  box-shadow: 0 22px 52px rgba(24,43,70,.14) !important;
  padding: 12px !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
}
#ds-home-menu-scrim,
#ds-vnext-menu-scrim,
#ds-clean-menu-scrim,
#ds-premium-menu-scrim {
  background: rgba(18,35,54,.19) !important;
  -webkit-backdrop-filter: blur(2px) !important;
  backdrop-filter: blur(2px) !important;
}
.ds-home-menu-kicker,
.ds-vnext-menu-kicker,
.ds-clean-menu-eyebrow,
.ds-premium-menu-eyebrow {
  color: var(--ds-nav-gold) !important;
  font: 700 10px/1.4 'DM Sans',system-ui,sans-serif !important;
  letter-spacing: .17em !important;
  text-transform: uppercase !important;
  padding: 10px 13px 9px !important;
}
.ds-home-menu-item,
.ds-vnext-menu-item,
.ds-clean-menu-item,
.ds-premium-menu-item {
  width: 100% !important;
  min-height: 49px !important;
  padding: 10px 14px !important;
  margin: 2px 0 !important;
  border: 0 !important;
  border-radius: 11px !important;
  background: transparent !important;
  color: var(--ds-nav-ink) !important;
  font: 600 14px/1.35 'DM Sans',system-ui,sans-serif !important;
  letter-spacing: -.015em !important;
  text-align: left !important;
  transition: background .2s ease, color .2s ease !important;
}
.ds-home-menu-item:hover,
.ds-vnext-menu-item:hover,
.ds-clean-menu-item:hover,
.ds-premium-menu-item:hover,
.ds-home-menu-item:focus-visible,
.ds-vnext-menu-item:focus-visible,
.ds-clean-menu-item:focus-visible,
.ds-premium-menu-item:focus-visible {
  background: rgba(155,129,76,.09) !important;
  color: #14243b !important;
}
.ds-home-menu-item::after,
.ds-vnext-menu-item::after,
.ds-clean-menu-item::after,
.ds-premium-menu-item::after {
  color: var(--ds-nav-gold) !important;
  opacity: .78 !important;
  font-weight: 500 !important;
}
.ds-home-menu-item:focus-visible,
.ds-vnext-menu-item:focus-visible,
.ds-clean-menu-item:focus-visible,
.ds-premium-menu-item:focus-visible {
  outline: 2px solid rgba(155,129,76,.5) !important;
  outline-offset: -2px !important;
}

@media (max-width:980px) {
  body.ds-v3:not(.ds-vnext-home-active) #site-header {
    background: rgba(255,253,250,.96) !important;
    border-bottom: 1px solid var(--ds-nav-border) !important;
    box-shadow: 0 4px 16px rgba(31,51,81,.03) !important;
  }
  html body .header > button#ds-vnext-menu-button {
    border-radius: 999px !important;
    width: 76px !important;
    min-width: 76px !important;
    max-width: 76px !important;
    height: 42px !important;
    padding: 0 12px !important;
  }
  #ds-vnext-menu-sheet,
  #ds-clean-menu-sheet,
  #ds-premium-menu-sheet {
    left: 12px !important;
    right: 12px !important;
    max-height: calc(100dvh - 112px) !important;
  }
  #ds-home-menu-sheet {
    max-height: calc(100dvh - 110px) !important;
    overflow-y: auto !important;
  }
}
@media (prefers-reduced-motion:reduce) {
  body.ds-v3 #main-navigation.top-nav > button,
  body.ds-v3 #main-navigation.top-nav > button::after,
  #ds-home-menu-button,
  .ds-home-menu-item,
  .ds-vnext-menu-item,
  .ds-clean-menu-item,
  .ds-premium-menu-item { transition: none !important; }
}