/* Customer navigation only. The artwork/animation breakpoints are unchanged. */
@media (min-width: 1201px) {
  body .site-header.has-auth { gap: clamp(14px, 1.25vw, 32px); padding-inline: 4%; }
  body .site-header.has-auth .brand { width: clamp(160px, 13vw, 330px); }
  body .site-header.has-auth .desktop-nav { position: static; gap: clamp(10px, 1vw, 26px); margin: 0; min-width: 0; flex: 1; }
  body .site-header.has-auth .desktop-nav a { font-size: clamp(12px, .84vw, 21px); white-space: nowrap; }
  body .site-header.has-auth .header-actions { gap: 8px; padding-left: 0; flex-shrink: 0; }
}
@media (max-width: 1200px) {
  body .site-header .desktop-nav, body .site-header .header-actions { display: none; }
  body .mobile-navigation { display: flex; align-items: center; gap: 10px; position: absolute; z-index: 30; right: 16px; top: max(12px, env(safe-area-inset-top)); }
  body .mobile-navigation > .mobile-language-toggle { display: inline-grid; position: static; inset: auto; z-index: auto; flex: 0 0 auto; margin: 0; min-width: 44px; height: 44px; }
  body .mobile-navigation > .menu-toggle { display: grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; padding: 11px; border: 1px solid #ffffff70; border-radius: 50%; color: white; background: #07131ce8; }
  body .menu-toggle svg { width: 20px; height: 20px; }
  body .mobile-menu { position: absolute; top: 54px; right: 0; width: min(292px, calc(100vw - 32px)); max-height: calc(100dvh - 84px); overflow-y: auto; padding: 12px; border: 1px solid #ffffff5c; border-radius: 14px; color: #fff; background: #0b1927fa; box-shadow: 0 10px 32px #0006; }
  body .mobile-menu[hidden] { display: none; }
  body .mobile-menu a, body .mobile-menu .mobile-menu-link { display: block; padding: 12px; border-radius: 8px; font-size: 15px; line-height: 1.5; }
  body .mobile-menu a[aria-current] { color: #f7ebd7; background: #ffffff16; }
  body .mobile-menu .auth-controls { padding: 10px 8px 4px; }
}
@media (min-width: 768px) and (max-width: 1200px) {
  body .site-header.has-auth { display: flex; padding-inline: 4%; }
  body .site-header.has-auth .brand { width: 160px; }
  body .mobile-navigation { top: calc((var(--header-height) - 44px) / 2); right: 4%; }
}
