/* Header navigation: desktop layout stays unchanged; mobile uses native details. */
.site-header > div { position: relative; }
.mobile-nav { display: none; }
@media (max-width: 1023px) {
  .site-header .desktop-nav { display: none; }
  .site-header > div { gap: 1rem; }
  .site-header > div > a { min-width: 0; }
  .site-header > div > a span { white-space: nowrap; }
  .mobile-nav { display: block; margin-left: auto; flex-shrink: 0; }
  .mobile-nav-toggle { display: flex; align-items: center; gap: .4rem; cursor: pointer; padding: .55rem .7rem; color: #cbd5e1; border: 1px solid #334155; border-radius: .6rem; list-style: none; }
  .mobile-nav-toggle::-webkit-details-marker { display: none; }
  .mobile-nav-toggle:focus-visible, .mobile-nav-panel a:focus-visible { outline: 2px solid #2dd4bf; outline-offset: 3px; }
  .mobile-nav[open] .mobile-nav-toggle { color: #2dd4bf; border-color: #2dd4bf; }
  .mobile-nav-panel { position: absolute; z-index: 50; right: 1.5rem; top: calc(100% - .35rem); min-width: 15rem; max-width: calc(100vw - 3rem); padding: .5rem; background: #020617; border: 1px solid #334155; border-radius: .75rem; box-shadow: 0 14px 30px rgba(0,0,0,.35); }
  .mobile-nav-panel a { display: block; padding: .8rem 1rem; border-radius: .45rem; color: #cbd5e1; text-decoration: none; }
  .mobile-nav-panel a:hover, .mobile-nav-panel a:focus-visible { background: #1e293b; color: #5eead4; }
  .mobile-nav-panel a.mobile-nav-active { color: #2dd4bf; font-weight: 600; }
}
@media (max-width: 360px) { .mobile-nav-label { display: none; } .site-header > div { padding-left: 1rem; padding-right: 1rem; } .mobile-nav-panel { right: 1rem; } }