/* Shared navigation finish for React and public HTML. Keep the existing header
   height: map controls and side panels derive their geometry from --shapka-h.
   Blur belongs only to the rounded surface, never the full-width sticky box. */
@media (min-width: 1024px) {
  .site-nav.homehead, .site-nav.shapka {
    isolation: isolate;
    gap: clamp(8px, 1vw, 16px);
    border-bottom: 0;
    box-shadow: none;
    background: transparent;
  }
  .site-nav::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 8px max(18px, calc((100% - 1680px) / 2 + 22px));
    border-radius: 999px;
    background: var(--plinth);
    background: color-mix(in srgb, var(--plinth) 78%, transparent);
    -webkit-backdrop-filter: blur(12px) saturate(1.12);
    backdrop-filter: blur(12px) saturate(1.12);
    border: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
    box-shadow: 0 4px 18px #00000008, inset 0 1px 0 #ffffff45;
    pointer-events: none;
  }
  .site-nav.homehead::after { display: none; }
  .site-nav :is(.homehead__mark, .shapka__mark) { margin-right: 8px; flex: none; }
  .site-nav :is(.homehead__nav, .shapka__nav) { align-items: center; gap: 2px; flex: none; }
  .site-nav :is(.homehead__navlink, .shapka__tab) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 12px;
    border-radius: 999px;
    font-size: clamp(13px, .97vw, 15px);
    font-weight: 550;
    color: var(--ink-dim);
    box-shadow: none;
    transition: color .16s ease, background-color .16s ease;
  }
  .site-nav :is(.homehead__navlink, .shapka__tab)::after,
  .site-nav :is(.homehead__city, .shapka__city)::after { display: none; }
  .site-nav :is(.homehead__navlink, .shapka__tab):hover {
    background: var(--vitrine);
    color: var(--ink);
    text-decoration: none;
  }
  .site-nav .homehead__navlink[aria-current="page"] {
    background: var(--ink);
    color: var(--bg);
    box-shadow: none;
  }
  .site-nav :is(.homehead__search, .shapka__search) {
    width: clamp(150px, 17vw, 270px);
    height: 38px;
    background: var(--vitrine);
    border: 1px solid transparent;
    box-shadow: none;
    padding-inline: 12px;
    transition: border-color .16s ease;
  }
  .site-nav :is(.homehead__search, .shapka__search):focus-within {
    background: var(--plinth);
    border-color: var(--ink);
    box-shadow: none;
  }
  .site-nav :is(.homehead__city, .shapka__city) {
    min-height: 38px;
    max-width: 164px;
    padding-inline: 8px;
    font-size: 14px;
    border-radius: 999px;
  }
  .site-nav__tools {
    display: flex;
    align-items: center;
    flex: none;
    gap: 4px;
    padding: 3px;
    border-radius: 999px;
    background: var(--vitrine);
  }
  .site-nav__tools :is(button, a) {
    width: 32px;
    height: 32px;
    flex: none;
    border-radius: 50%;
    transition: background-color .16s ease, color .16s ease;
  }
  .site-nav__tools :is(.homehead__tema, .homehead__nastr, .shapka__tema, .shapka__nastr) { background: transparent; }
  .site-nav__tools :is(button, a):hover { background: var(--plinth); color: var(--ink); box-shadow: none; }
  .site-nav__tools .homehead__nastr--tek { background: var(--ink); color: var(--bg); }
  .site-nav :is(.homepoisk__spisok, .homegorod__spisok, .gorod__spisok) {
    border-radius: 18px;
    padding: 8px;
    box-shadow: 0 12px 36px #00000014, inset 0 0 0 1px var(--line-soft, var(--hair));
  }
  .site-nav :is(.homepoisk__stroka, .homegorod__punkt, .gorod__punkt) { border-radius: 10px; }
  .site-nav :is(button, a):focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
  .homeview .homeask__pole {
    border-radius: 24px;
    height: calc(72 * var(--e));
    box-shadow: 0 6px 24px #00000008, inset 0 0 0 1px var(--hair-2);
  }
  .homeview .homeask__pole:focus-within { box-shadow: 0 6px 24px #00000008, inset 0 0 0 2px var(--ink); }
  .homeview .homeask__go { border-radius: 50%; transform: none; }
  .homeview .homeask__go:disabled { background: var(--vitrine); color: var(--ink-faint); }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .site-nav :is(.homehead__mark, .shapka__mark) { margin-right: 0; }
  .site-nav :is(.homehead__navlink, .shapka__tab) { padding-inline: 8px; font-size: 13px; }
  .site-nav :is(.homehead__search, .shapka__search) { width: 184px; }
  .site-nav :is(.homehead__search-key, .shapka__key) { display: none; }
  .site-nav :is(.homehead__city, .shapka__city) { font-size: 13px; padding-inline: 4px; }
  .site-nav__tools { gap: 2px; }
}
@media (max-width: 1023px) {
  .mobile-header {
    padding: calc(var(--safe-t, 0px) + 8px) 12px 8px;
    border-bottom: 0;
    background: transparent;
  }
  .mobile-header .mobile-header__row {
    min-height: 54px;
    padding: 4px 6px;
    gap: 8px;
    border: 1px solid var(--line-soft);
    border-radius: 999px;
    background: var(--plinth);
    background: color-mix(in srgb, var(--plinth) 82%, transparent);
    -webkit-backdrop-filter: blur(10px) saturate(1.1);
    backdrop-filter: blur(10px) saturate(1.1);
    box-shadow: 0 3px 12px #00000008, inset 0 1px 0 #ffffff45;
  }
  .mobile-header .mobile-header__brand { font-size: 23px; }
  .mobile-header :is(.mobile-menu-button, .mobile-header__actions button) {
    border-radius: 50%;
    width: 44px;
    height: 44px;
    background: var(--vitrine);
  }
  .mobile-header .mobile-header__actions { gap: 4px; }
  .mobile-map-header .mobile-header { padding: 0; background: transparent; }
  /* Map chrome stays on a lightweight tint: no continuously sampled blur while dragging. */
  .mobile-map-header { background: color-mix(in srgb, var(--plinth) 94%, transparent); }
  .mobile-map-header .mobile-header__row { border: 0; background: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .kat-phone .kat-phone__bar {
    margin: calc(env(safe-area-inset-top, 0px) + 8px) 12px 8px;
    padding: 4px 6px;
    min-height: 54px;
    border: 1px solid var(--hair);
    border-radius: 999px;
    background: color-mix(in srgb, var(--plinth) 82%, transparent);
    -webkit-backdrop-filter: blur(10px) saturate(1.1);
    backdrop-filter: blur(10px) saturate(1.1);
  }
  .kat-phone .kat-phone__bar .kat-phone__icon { border-radius: 50%; }
}
@media (prefers-reduced-motion: reduce) {
  .site-nav *, .mobile-header * { transition: none; }
}

/* Map extends behind the fixed header. Keep the capsule readable with a tint,
   without allocating a blur surface over the moving canvas. */
@media (min-width: 1024px) {
  .app--shapka .site-nav.homehead--karta { background: transparent; }
  .app--shapka .site-nav.homehead--karta::before {
    background: color-mix(in srgb, var(--plinth) 94%, transparent);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}
@media (prefers-reduced-transparency: reduce) {
  .site-nav::before, .mobile-header .mobile-header__row, .kat-phone .kat-phone__bar {
    background: var(--plinth);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}