/* izolex — слой A, своя часть «шапка/мегаменю/подвал/FAB» (GOAL_IZOLEX_DESIGN_A.md, Э1).
   Вся разметка стилизуется общим design/a/a.css (копия proto/iz.css) — здесь только то, чего
   в общем файле нет, т.к. завязано на реальные данные/AJAX этой части. */

/* Бейдж корзины — реальная разметка mk_cart_badge_html() (inc/iz-header.php): класс
   "iz-cart-badge" переживает замену WooCommerce-фрагмента (woocommerce_add_to_cart_fragments,
   селектор "#iz-cart-badge"), в отличие от класса .n из a.css, который AJAX стирает при
   каждом обновлении корзины — поэтому стиль/анимация bump продублированы под реальный класс. */
.iza .ico-btn .iz-cart-badge {
  position: absolute; top: 5px; right: 4px; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 9px; background: var(--a-amber); color: #1d1405; font: 700 11px/18px var(--a-f);
  text-align: center; transform: scale(1); transition: transform .5s var(--a-ease-spring);
}
.iza .ico-btn .iz-cart-badge:empty { transform: scale(0); }
.iza .ico-btn .iz-cart-badge.bump { animation: bump .6s var(--a-ease-spring); }

/* Старый sitewide FAB темы (.st-fab/.st-fab-cta, вставляется отдельным виджетом вне .iza)
   виден одновременно со своим .fab — две плавающие кнопки «заявка» на экране. При слое A
   (body.iza-on) прячем старый, свой .fab уже делает ту же задачу. */
body.iza-on .st-fab, body.iza-on .st-fab-cta { display: none !important; }

/* Поле поиска: подсказка не показывалась, потому что скрытый <input type="hidden" name="post_type">
   стоял между видимым input и .hint — CSS-правило a.css ".search input:not(:placeholder-shown) + .hint"
   (adjacent-sibling) матчилось на СКРЫТОМ input (у него :placeholder-shown никогда не true → "not"
   всегда true) и гасило подсказку постоянно. Починено перестановкой разметки в header.php (hidden
   input теперь первым, перед видимым полем) — здесь фикса не требуется.

   Вид поля (рамка 1px/радиус 12 из a.css): sitewide next.css держит ".st-search{border-radius:999px;
   box-shadow:…;background:#fff;padding:5px}" и "input{border:0!important}" с большей специфичностью
   (0,2,1) против нашего ".iza .search" (0,2,0) — рамка эталона не применялась, был белый «пилюльный»
   фон с тенью. Перебиваем явным выбором повыше специфичностью (+ !important против чужого border:0). */
.iza .hdr .search { background: transparent; border-radius: 0; box-shadow: none; padding: 0; }
.iza .hdr .search input[type="search"] {
  border-radius: 12px !important; border: 1.5px solid var(--a-line) !important;
  background: #fff !important; padding: 0 48px 0 44px !important;
}
.iza .hdr .search input[type="search"]:focus {
  border-color: var(--a-steel) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--a-steel) 15%, transparent) !important;
}

/* nav2 на мобильном — горизонтальная прокрутка с затуханием края (брифа 1.3), в a.css только overflow-x:auto. */
@media (max-width: 720px) {
  .iza .nav2 ul { mask-image: linear-gradient(90deg, transparent, #000 18px, #000 calc(100% - 28px), transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 18px, #000 calc(100% - 28px), transparent); }
  /* a.css задаёт .search{flex:1}, но у флекс-элемента по умолчанию min-width:auto — инпут не
     сжимался ниже своей intrinsic-ширины и ряд шапки вылезал за 390px (scrollWidth 524). */
  .iza .hdr .row > * { min-width: 0; }
  /* старый sitewide next.css держит правило "body.st-next .st-search{flex:0 0 auto;width:100%}"
     на @media(max-width:921px) — специфичность (0,2,1) выше нашего .iza .search (0,2,0), поэтому
     форма переставала сжиматься и держала интринсик-ширину (358px), вылезая за экран на 390px. */
  .iza .hdr .row .search { flex: 1 1 0% !important; width: auto !important; }
}
/* .mm всегда в DOM (открытие — clip-path, не display:none), поэтому её layout всегда считается
   в scrollWidth документа, даже закрытой. grid-колонка 1fr у .mm-root без minmax(0,…) получала
   автоматический минимум по контенту названия раздела — на 390px ряд вылезал за экран. */
.iza .mm-root { grid-template-columns: 40px minmax(0, 1fr) auto; }
.iza .mm-item { grid-template-columns: 56px minmax(0, 1fr); }

/* Подвал: .cols h6 (как и .step h4 на главной) не задаёт line-height в эталоне — наследует body
   1.55, а сетевой сброс заголовков даёт более тесный интервал (14px/1.25 вместо 21.7px) — все
   три ряда колонок подвала становились на ~4px короче каждый (.f/.wrap/.cols суммарно ниже эталона). */
.iza .cols h6, .iza .cols .h6 { line-height: 1.55; }


/* Э6 (perf/lh_a, круг 3): настоящая причина home CLS — не Onest/JetBrains (выше), а СЕТЕВОЙ
   next.css: @font-face Manrope (font-weight:200 800 variable, font-display:swap) — именно её
   грузит #hero/.spot через --font: Manrope,... (layout-shifts: cause "Web font loaded",
   fonts/manrope-net.woff2). next.css — общий файл сети, не трогаем (AGENT_RULES.md). header.css
   грузится ПОСЛЕ next.css (проверено curl: next.css #1-2, iza-header-css #3) — те же дескрипторы
   (family/weight-range/style) переопределяют font-display на optional тем же правилом каскада. */
@font-face{font-family:"Manrope";font-style:normal;font-weight:200 800;font-display:optional;src:url(../../fonts/manrope-net.woff2) format("woff2")}
/* Э6: сетевой next.css красит текст через var(--font) = Manrope (местами !important) — под слоем A текст шёл
   не шрифтом дизайн-кода, а лишний manrope-net.woff2 (29 КБ, VeryHigh) грузился до LCP. Подменяем переменную. */
body.iza-on { --font: var(--a-f); }
/* пульс точки «отгрузка»: в эталоне анимируется box-shadow — это перерисовка в основном потоке на каждом кадре, бесконечно
   (Lighthouse: non-composited animation, TBT листинга). Тот же вид — кольцом ::after через transform/opacity (композитор). */
.iza .top .dot { animation: none; position: relative; }
.iza .top .dot::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: rgba(62,207,122,.6); animation: iza-pulse 2.4s infinite; }
@keyframes iza-pulse { 0% { transform: scale(1); opacity: 1; } 70% { transform: scale(3.3); opacity: 0; } 100% { transform: scale(1); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .iza .top .dot::after { animation: none; opacity: 0; } }

/* 24.10.2026 geo_header_net: шапка как pokova — ПВЗ по гео (сетевой JS stalverk-geo.php) + почта под телефоном; подвал — адрес + карта */
.iza .hgeo { display: flex; align-items: center; gap: 8px; line-height: 1.2; white-space: nowrap; flex: none; color: var(--a-muted); }
.iza .hgeo svg { flex: none; }
.iza .hgeo-t { display: flex; flex-direction: column; min-width: 0; }
.iza .hgeo-t b { color: var(--a-ink); font-size: 14px; }
.iza .hgeo-t small { font-size: 12px; max-width: 210px; overflow: hidden; text-overflow: ellipsis; }
html:not(.st-geo-ready) .iza .hgeo-t { visibility: hidden; }
.iza .hdr .row .search { min-width: 140px; overflow: hidden; }
@media (max-width: 1180px) { .iza .hdr .search kbd { display: none; } .iza .hdr .search input[type="search"] { padding-right: 12px !important; } }
.iza .phone .st-geo-email { font-weight: 400; color: var(--a-muted); font-size: 12px; }
.iza .phone a:hover { color: var(--a-steel); }
.iza footer.f .fpk { margin-top: 16px; }
.iza footer.f .fpk span { display: block; color: #c9d4da; font-size: 13px; }
.iza footer.f .fpk-map { position: relative; margin-top: 10px; width: 100%; max-width: 260px; aspect-ratio: 4/3; min-height: 140px; max-height: 170px; border-radius: 10px; overflow: hidden; background: #1a2228; }
.iza footer.f .fpk-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
@media (max-width: 900px) { .iza .hgeo { display: none; } }