/* Сквозной поиск swsteel.ru.
   Место под лупу зарезервировано до JavaScript: без этого правила шапка
   дёргается на каждой странице в момент вставки кнопки.
   Цвета — из темы (assets/css/main.css), у каждого своё запасное значение:
   файл должен выглядеть прилично, даже если переменная не дошла. */

/* ── Лупа ────────────────────────────────────────────────────────────────
   Кнопка — одна иконка, без капсулы: рамка и подложка ставили рядом с CTA
   второй «блок» и визуально наезжали на него на айфоне.
   Хит-зона остаётся 44×44, поэтому палец попадает так же, как в кнопку:
   размер рамки менялся, размер нажатия — нет.
   Ширина задана на обёртке, у кнопки — 100%: кнопка не может вылезти
   за своё место и съесть промежуток до CTA. */
.sw-search{
  display:flex;align-items:center;justify-content:center;
  flex:0 0 auto;
  width:44px;height:44px;
}
.sw-search__btn{
  width:100%;height:100%;display:grid;place-items:center;padding:0;
  border:0;border-radius:8px;background:none;
  color:var(--text,#F6F8FB);cursor:pointer;
  transition:color .15s,transform .1s;
  -webkit-tap-highlight-color:transparent;
}
.sw-search__btn:hover,
.sw-search__btn[aria-expanded="true"]{color:var(--amber,#F2C94C)}
.sw-search__btn:active{transform:scale(.92)}
.sw-search__btn svg{
  width:22px;height:22px;fill:none;stroke:currentColor;
  stroke-width:1.6;stroke-linecap:round;
}

/* ── Место под лупу: шапка не разъезжается ───────────────────────────────
   Лупа занимает 44 px, которых в шапке не было. CTA не сжимаем (текст в
   одну строку), свободное место отдаём промежуткам и логотипу.
   На узких экранах шапка раньше вылезала за край: body{overflow-x:hidden}
   резал бургер пополам на iPhone Pro Max. Поэтому ниже 980 px (там меню
   уже спрятано в бургер) логотип — единственный гибкий элемент: он
   ужимается первым, а лупа, CTA и бургер держат свой размер и отступ. */
.header-inner .cta{flex:0 0 auto;white-space:nowrap}
@media (max-width:1500px){.header-inner{gap:20px}nav.primary{gap:20px}}
@media (max-width:1300px){nav.primary{gap:16px}}
/* 981–1199 px — самая тесная полоса: меню ещё видно, а места уже нет.
   Здесь шапка обрезала CTA ещё до появления лупы (проверено снимком 29.10.2026).
   Уменьшаем шаг меню и кегль на один пункт, логотип — до 150 px. */
@media (max-width:1199px){
  .header-inner{gap:14px}
  nav.primary{gap:12px}
  nav.primary a{font-size:13px}
  .brand-logo{max-width:min(150px,30vw)}
}
@media (max-width:980px){
  .header-inner{min-width:0}
  .header-spacer{display:none}
  .brand{flex:1 1 auto;min-width:0}
  .brand-logo{max-width:100%}
}
@media (max-width:560px){.header-inner{gap:10px}}
@media (max-width:420px){
  .header-inner{gap:8px}
  .header-inner .cta{font-size:12px;padding:10px}
}
@media (max-width:380px){.brand-logo{max-width:min(112px,34vw)}}
/* На 360 px и уже в шапку не помещаются логотип, лупа, CTA и бургер сразу.
   CTA там дублируется полосой снизу (.mob-sticky) и в меню — убираем верхний. */
@media (max-width:360px){.header-inner .cta{display:none}}

/* Панель живёт в body, а не в шапке: внутри .mobile-nav она была бы скрыта. */
.sw-search__panel{
  position:fixed;left:50%;transform:translateX(-50%);
  top:var(--sw-header-h,76px);
  width:min(640px,calc(100vw - 24px));
  max-height:calc(100vh - var(--sw-header-h,76px) - 16px);
  overflow-y:auto;z-index:130;margin-top:8px;padding:12px;
  background:var(--card,#18212B);border:1px solid var(--line,#2B3642);
  border-radius:12px;box-shadow:0 24px 60px -20px rgba(0,0,0,.65);
  color:var(--text,#F6F8FB);
}
.sw-search__panel[hidden]{display:none}

.sw-search__bar{display:flex;gap:8px;align-items:center}
.sw-search__input{
  flex:1;min-width:0;height:44px;padding:0 12px;
  border:1px solid var(--line,#2B3642);border-radius:10px;
  background:var(--bg,#0B0F14);color:var(--text,#F6F8FB);
  font:inherit;font-size:16px;
}
.sw-search__input::placeholder{color:var(--tech,#8A96A4)}
/* Системный крестик поля type=search не нужен: рядом своя кнопка закрытия. */
.sw-search__input::-webkit-search-cancel-button,
.sw-search__input::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none}

.sw-search__close{
  flex:0 0 auto;width:44px;height:44px;
  border:1px solid var(--line,#2B3642);border-radius:10px;
  background:var(--bg,#0B0F14);color:var(--muted,#A8B1BD);
  font-size:20px;line-height:1;cursor:pointer;
}

.sw-search__status{margin:10px 2px 6px;font-size:13px;color:var(--muted,#A8B1BD)}
.sw-search__list{display:flex;flex-direction:column}
.sw-search__row{display:block;padding:10px 8px;border-radius:8px;color:var(--text,#F6F8FB);text-decoration:none}
.sw-search__row[aria-selected="true"],.sw-search__row:hover{background:rgba(255,255,255,.06)}
.sw-search__title{font-size:15px;font-weight:600}
.sw-search__type{margin-left:8px;font-size:12px;color:var(--tech,#8A96A4)}
.sw-search__snippet{display:block;margin-top:2px;font-size:13px;color:var(--muted,#A8B1BD)}
.sw-search__title mark,.sw-search__snippet mark{background:var(--amber,#F2C94C);color:#0B0F14;padding:0 1px}

.sw-search__btn:focus,.sw-search__input:focus,.sw-search__close:focus,.sw-search__row:focus{
  outline:2px solid var(--amber,#F2C94C);outline-offset:2px;
}

/* Страница /poisk/ */
.sw-search-page{max-width:820px}
.sw-search-page__list{margin-top:6px}
.sw-search-page .sw-search__row{padding:12px 10px}

@media (max-width:380px){
  .sw-search__panel{width:calc(100vw - 16px)}
}

@media (prefers-reduced-motion:reduce){
  .sw-search__btn{transition:none}
  .sw-search__btn:active{transform:none}
}