/* [OURS] CHECKOUT-REBUILD Б19.1 (2026-08-29): каркас всплывающих окон ВИТРИНЫ.
   Стиль = модал нового чекаута (checkout_v2.css .q-movl/.q-modal, приёмка Б4/Б12);
   токены --q-* приезжают из checkout_v2_cart.css (:root, грузится в server mode).
   Классы qp-* — свои: чекаутные .q-modal живут только на /basket/ и не пересекаются.
   body.q-noscroll (блокировка фона) — общий, из checkout_v2_cart.css (Б12). */

/* z-index выше шторки корзины (cart_popup_v2: 10040/10050) — модальное окно всегда верхний слой */
.qp-ovl { position:fixed; inset:0; background:rgba(8,26,38,.5); z-index:10060;
	opacity:0; visibility:hidden; pointer-events:none; transition:opacity .22s ease, visibility 0s linear .22s; }
.qp-ovl.show { opacity:1; visibility:visible; pointer-events:auto; transition:opacity .22s ease; }
.qp-ovl.qp-dark { background:rgba(8,26,38,.94); } /* [Б19 блок4] плотнее (.85 просвечивал карточку под фото — решение Димы В2=Б): сплошной тёмный лайтбокс */

.qp-win { position:fixed; z-index:10070; left:50%; top:50%;
	transform:translate(-50%,-46%) scale(.96);
	/* [Б19 блок3] ЕДИНЫЙ закон ширины: контентные окна диктуют ширину контентом (max-content),
	   окна-точки задают токен --qp-w (трекер/рассрочка/iframe ниже) — и те и другие сжимаются
	   ОДНОЙ формулой min(…, 100vw - --qp-gutter). Нет резкого скачка в 100vw на 699 (был прыжок
	   400/440 -> 699 «наизнанку»); full-bleed на телефоне — только ≤430, где gutter=0 (плавный доснап). */
	--qp-gutter:28px;
	width:max-content; max-width:min(860px, calc(100vw - var(--qp-gutter))); max-height:min(88dvh, 720px);
	overflow:auto; overscroll-behavior:contain;
	background:var(--q-card, #fff); border-radius:18px; box-shadow:0 24px 64px -12px rgba(8,30,46,.35);
	opacity:0; visibility:hidden; pointer-events:none;
	transition:opacity .22s ease, transform .22s cubic-bezier(.3,.9,.4,1), visibility 0s linear .22s; }
.qp-win.show { opacity:1; visibility:visible; pointer-events:auto;
	transform:translate(-50%,-50%) scale(1);
	transition:opacity .22s ease, transform .22s cubic-bezier(.3,.9,.4,1); }

/* крестик — как .q-x шторки корзины, живёт в липкой шапке-строке */
.qp-x { border:none; background:var(--q-soft, #E9F7FD); width:44px; height:44px; border-radius:50%;
	cursor:pointer; color:var(--q-ink, #202c38); display:grid; place-items:center; flex:none; }
.qp-x:hover { background:var(--q-line, #e3ebf1); }

.qp-body { position:relative; min-width:260px; min-height:64px; }
/* легаси-контент приносит свои отступы; страховочный воздух — только когда их нет */
.qp-body > .qp-load, .qp-body > .qp-err { padding:28px 24px; }

.qp-load { display:flex; align-items:center; gap:10px; color:var(--q-ink2, #5c6b78); font-size:14px; }
.qp-load .sp { width:18px; height:18px; border-radius:50%; flex:none;
	border:2.5px solid var(--q-line, #e3ebf1); border-top-color:var(--q-brand, #0FAEE3);
	animation:qpspin .8s linear infinite; }
@keyframes qpspin { to { transform:rotate(360deg); } }

.qp-err { color:var(--q-ink, #202c38); font-size:14px; line-height:1.5; max-width:340px; }
.qp-err button { border:none; background:none; color:var(--q-brand, #0FAEE3); font:inherit; font-weight:700;
	cursor:pointer; text-decoration:underline; padding:0; }

/* ── фото-режим (img_zoom, rel-группы): тёмная сцена, картинка сама задаёт размер ── */
.qp-win.qp-photo { background:transparent; box-shadow:none; border-radius:0; overflow:visible; max-height:none; }
.qp-win.qp-photo .qp-body { min-width:0; }
.qp-win.qp-photo img { display:block; max-width:min(92vw, 1100px); max-height:86dvh;
	border-radius:12px; background:#fff; box-shadow:0 24px 64px -12px rgba(0,0,0,.5); }
/* ── [VIDEO-16-9, решение Димы «б» 04.09] окно видео с плитки каталога = фото-лайтбокс: тёмная сцена
   (dark:true → .qp-dark), без белой рамки, ✕ снаружи справа-сверху (правила .qp-photo .qp-head ниже
   продублированы на .qp-video), плеер 16:9 шириной min(92vw, 1100px) — 1:1 с картинкой фото-режима.
   Сам 16:9 держит .iframe_wrap (eshop/cont.css); здесь — ширина и снятие legacy-полей .youtube_wrap. ── */
.qp-win.qp-video { background:transparent; box-shadow:none; border-radius:0; overflow:visible; max-height:none; }
.qp-win.qp-video .qp-body { min-width:0; width:min(92vw, 1100px); }
.qp-win.qp-video .eshop .youtube_wrap { padding:56.25% 0 0; max-width:none; border-radius:12px; overflow:hidden;
	box-shadow:0 24px 64px -12px rgba(0,0,0,.5); } /* padding-top 56.25% = 16:9 (legacy padding:15px снят) */
.qp-win.qp-video .qp-head { position:absolute; top:-14px; right:-14px; left:auto; padding:0;
	width:auto; min-width:0; background:none; z-index:6; }
.qp-win.qp-video .qp-title { display:none; }
.qp-win.qp-video .qp-x { background:#fff; box-shadow:0 6px 18px -8px rgba(8,30,46,.45); }
/* [Б19 блок4] счётчик — тёмная пилюля-подложка: раньше белый текст без фона тонул на светлом
   просвете кнопки «Купити» под затемнением; теперь читается на любом фоне */
.qp-cap { color:#fff; font-size:13px; text-align:center; margin:12px auto 0; width:fit-content;
	background:rgba(0,0,0,.55); padding:5px 14px; border-radius:999px; }
.qp-nav { position:absolute; top:50%; transform:translateY(-50%); z-index:5;
	border:none; background:#fff; width:44px; height:44px; border-radius:50%; cursor:pointer;
	color:var(--q-ink, #202c38); display:grid; place-items:center; box-shadow:0 6px 18px -8px rgba(8,30,46,.45); }
.qp-nav.prev { left:-14px; }
.qp-nav.next { right:-14px; }
@media (max-width:600px){
	.qp-nav.prev { left:6px; }
	.qp-nav.next { right:6px; }
}

/* ── iframe-режим (внешние страницы; ширину может задать точка через options.width) ── */
.qp-win.qp-frame { width:min(830px, calc(100vw - var(--qp-gutter))); }
.qp-win.qp-frame iframe { display:block; width:100%; height:min(80vh, 640px); border:0; }

/* ── шапка-строка «заголовок + крестик» — как у шторки корзины («Кошик + крестик»), липкая.
      width:0+min-width:100% — шапка НЕ участвует в max-content окна: ширину диктует
      только контент, длинный заголовок переносится (фикс Димы 30.08: трекер растягивало) ── */
.qp-head { display:flex; align-items:center; justify-content:space-between; gap:10px;
	padding:12px 12px 8px 20px; position:sticky; top:0; background:var(--q-card, #fff); z-index:4;
	width:0; min-width:100%; box-sizing:border-box; }
.qp-head .qp-title { font-size:18px; font-weight:700; margin:0; line-height:1.25; flex:1; }
.qp-hidden { display:none !important; } /* родной заголовок контента спрятан — он уехал в шапку */
/* фото-сцена: шапки-полосы нет — только плавающий крестик в углу */
/* [Б матрица 01.09 №2] width:auto/min-width:0 — общая шапка растянута на всё окно (width:0+min-width:100%
   для длинных заголовков, 0d9e9e5); в фото-режиме это уводило крестик к ЛЕВОМУ краю (computed left 14px) */
.qp-win.qp-photo .qp-head { position:absolute; top:-14px; right:-14px; left:auto; padding:0;
	width:auto; min-width:0; background:none; z-index:6; }
.qp-win.qp-photo .qp-title { display:none; }
.qp-win.qp-photo .qp-x { background:#fff; box-shadow:0 6px 18px -8px rgba(8,30,46,.45); }

/* ── окно рассрочки карточки: рендер чекаута (.q-cprog из checkout_v2_cart.css) ── */
.qp-win.qp-credit { width:min(460px, calc(100vw - var(--qp-gutter))); }
.qp-credit .qp-body { padding:0 16px 16px; }
.qp-credit-sum { font-size:14px; color:var(--q-ink2, #5E6B76); margin:2px 0 4px; }
.qp-credit-sum b { color:var(--q-ink, #202c38); }

/* ── КОНСИСТЕНТНОСТЬ С ЧЕКАУТОМ (слово Димы 30.08: «всё, чего касался, — как новая корзина/
      оформление, без отсебятины»). Значения — 1:1 из checkout_v2*.css: поля .q-fld
      (border 1.5 --q-fline, radius 11, font 16, min-height 48, фокус-кольцо --q-sky),
      кнопка .q-cta (градиент --q-cta1/2, radius 14, 52px, 17/700). Слой действует ТОЛЬКО
      внутри окна (.qp-body) — off-мир и страницы не тронуты. ── */
/* ── [В 01.09] ЗАКОН ШИРИНЫ ОКОН-УЗЛОВ + ОБЩИЙ СЛОЙ СБРОСА ЛЕГАСИ-ГАБАРИТОВ (DESIGN-CONTRACT §4).
      Урок 01.09: вход починили точечно, а OTP и активация с той же легаси-шириной остались прибиты —
      класс, не экземпляр. Две половины правила:
      1) ширину окна задаёт КАРКАС токеном: className точки (tracker_*, feedback) либо класс по id
         переехавшего узла qp-n-<id> (ставит popup_v2.js showInline). Один токен на семейство:
         формы входа/OTP/удаления 410 (легаси 350 + поля 30 → на ПК визуально тот же размер),
         трекеры/активация/бонус 400, звонок 640 (легаси .form 580 + поля).
      2) корни переехавших узлов теряют СВОИ width/height/overflow (user/style.css:19,41,48 —
         350×435/350×475/300×200 + overflow:hidden; tracker_price и tracker_exist style.css:7 — 300;
         feedback/style.css:6 — 580) и заполняют окно; поля 20px вровень с заголовком шапки (.qp-head
         padding-left 20). ⚠ В комментариях CSS нельзя писать «звёздочка, затем слэш» (glob-путь
         «tracker_* + слэш + style.css»): это закрывает комментарий и съедает следующее правило —
         поймано пробой 01.09 (окно входа осталось max-content 358 вместо токена 410).
      Действует ТОЛЬКО внутри .qp-body — off-мир и страницы не тронуты. ── */
.qp-win.qp-n-lay_loginbox, .qp-win.qp-n-lay_check_otp, .qp-win.qp-n-lay_deletebox { width:min(410px, calc(100vw - var(--qp-gutter))); }
.qp-win.tracker_price, .qp-win.tracker_exist,
.qp-win.qp-n-lay_activation, .qp-win.qp-n-bonus_block { width:min(400px, calc(100vw - var(--qp-gutter))); }
.qp-win.feedback { width:min(640px, calc(100vw - var(--qp-gutter))); }
.qp-body .user .loginbox, .qp-body .user .check_otp, .qp-body .user .activation, .qp-body .user .deletebox,
.qp-body .tracker_price .form, .qp-body .tracker_exist .form, .qp-body .feedback .form, .qp-body .form {
	width:auto !important; max-width:100%; height:auto !important; overflow:visible;
	box-sizing:border-box; padding:6px 20px 20px; } /* верх 6: шапка .qp-head уже даёт воздух */
/* звонок: легаси двухколонник на float (fline 250 / fline_4 530 под окно 580) → одна колонка,
   поля во всю ширину — как страница оформления (контракт §3); проба 01.09 на 1440 показала
   «лесенку» полей при сброшенных ширинах; подсказка .info несла поля 60px — вровень с полями */
.qp-body .feedback form .fline, .qp-body .feedback form .fline_4 { float:none; clear:both; width:100%; }
.qp-body .feedback .info { padding-left:0; padding-right:0; }
.qp-body input.fld, .qp-body textarea.fld {
	border:1.5px solid var(--q-fline, #9AACB9) !important; border-radius:11px;
	background:var(--q-card, #fff) !important; /* !important: легаси .tracker_exist .form form .fld — голубой фон */
	color:var(--q-ink, #202c38);
	font:inherit; font-size:16px; padding:12px 13px; width:100%; min-height:48px;
	box-sizing:border-box; -webkit-appearance:none; }
.qp-body input.fld:focus, .qp-body textarea.fld:focus { outline:none; border-color:var(--q-sky, #0FAEE3) !important;
	box-shadow:0 0 0 3px color-mix(in srgb, var(--q-sky, #0FAEE3) 20%, transparent); }
.qp-body .fline .iline .name, .qp-body .fline > .name { font-size:13px; font-weight:600; color:var(--q-ink2, #5E6B76); }
.qp-body input.submit, .qp-body .btn.submit, .qp-body a.submit {
	width:100%; min-height:52px; border:none; border-radius:14px;
	background:linear-gradient(180deg, var(--q-cta1, #12B1E8), var(--q-cta2, #0B85C8));
	color:#fff; font:inherit; font-size:17px; font-weight:700; cursor:pointer;
	box-shadow:0 8px 18px -8px rgba(11,133,200,.55); }
/* вторичные кнопки входа (Google / Email та пароль / назад) — рамочные, радиус чекаута.
   [Б матрица 01.09 №4] селектор с .user .loginbox — специфичность (0,5,0): легаси
   `.user .loginbox .login_other .btn` (user/style.css:27, (0,4,0)) бил прежние (0,3,0) —
   кнопки оставались 1px #bdbdbd, правило было мёртвым во всех окнах входа */
.qp-body .user .loginbox .login_other .btn { border:1.5px solid var(--q-fline, #9AACB9); border-radius:11px;
	min-height:48px; box-sizing:border-box; display:flex; align-items:center; font-size:15px; }
.qp-body .user .loginbox .login_other .btn:hover { border-color:var(--q-sky, #0FAEE3); }

/* ── контент легаси-окон: SVG-иконки входа (единый стиль §6; габариты/поля узлов — общий слой выше;
      PNG icon_gl/em/fb/ai_big перекрываются ТОЛЬКО внутри нашего окна — off-мир нетронут).
      [Б матрица 01.09 №4] селекторы с .user .loginbox — тот же класс, что у кнопок выше: (0,3,1) проигрывало
      легаси (0,4,1), на скрине матрицы у Email стоял PNG «@», SVG-конверт не применялся ── */
.qp-body .user .loginbox .login_other .socauth .btn:before,
.qp-body .user .loginbox .login_other .btn_email:before { background-repeat:no-repeat; background-size:contain; }
.qp-body .user .loginbox .login_other .btn_socauth_gl:before { background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><path fill="%23FFC107" d="M43.6 20.1H42V20H24v8h11.3C33.7 32.7 29.2 36 24 36c-6.6 0-12-5.4-12-12s5.4-12 12-12c3.1 0 5.9 1.2 8 3l5.7-5.7C34.3 6.1 29.4 4 24 4 13 4 4 13 4 24s9 20 20 20 20-9 20-20c0-1.3-.1-2.6-.4-3.9z"/><path fill="%23FF3D00" d="M6.3 14.7l6.6 4.8C14.7 15.1 19 12 24 12c3.1 0 5.9 1.2 8 3l5.7-5.7C34.3 6.1 29.4 4 24 4 16.3 4 9.7 8.3 6.3 14.7z"/><path fill="%234CAF50" d="M24 44c5.2 0 9.9-2 13.4-5.2l-6.2-5.2C29.2 35.1 26.7 36 24 36c-5.2 0-9.6-3.3-11.3-8l-6.5 5C9.5 39.6 16.2 44 24 44z"/><path fill="%231976D2" d="M43.6 20.1H42V20H24v8h11.3c-.8 2.2-2.2 4.2-4.1 5.6l6.2 5.2C36.9 39.2 44 34 44 24c0-1.3-.1-2.6-.4-3.9z"/></svg>'); }
.qp-body .user .loginbox .login_other .btn_email:before { background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23202c38" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><rect x="2.5" y="4.5" width="19" height="15" rx="2.5"/><path d="m3 6 9 7 9-7"/></svg>'); }
.qp-body .user .loginbox .login_other .btn_socauth_fb:before { background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%231877F2" d="M24 12a12 12 0 1 0-13.9 11.9v-8.4h-3v-3.5h3V9.4c0-3 1.8-4.7 4.6-4.7 1.3 0 2.7.2 2.7.2v3h-1.5c-1.5 0-2 .9-2 1.9v2.3h3.4l-.5 3.5h-2.9v8.4A12 12 0 0 0 24 12z"/></svg>'); }
.qp-body .user .loginbox .login_other .btn_socauth_ai:before { background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23202c38"><path d="M16.7 12.8c0-2.4 2-3.6 2.1-3.7-1.1-1.7-2.9-1.9-3.5-1.9-1.5-.2-2.9.9-3.7.9-.8 0-1.9-.9-3.2-.9-1.6 0-3.1 1-4 2.4-1.7 3-.4 7.3 1.2 9.7.8 1.2 1.8 2.5 3.1 2.4 1.2 0 1.7-.8 3.2-.8s1.9.8 3.2.8c1.3 0 2.2-1.2 3-2.4.9-1.4 1.3-2.7 1.3-2.8 0 0-2.6-1-2.7-3.7zM14.4 5.6c.7-.8 1.1-1.9 1-3.1-1 0-2.2.7-2.9 1.5-.6.7-1.2 1.9-1 3 1.1.1 2.2-.6 2.9-1.4z"/></svg>'); }

/* ── [Б19 02.09, решение Димы] окно входа — вид Розетки: способы СТОЛБИКОМ во всю ширину,
      иконка в потоке слева от текста, группа по центру (легаси: кнопки в ряд flex:1, иконка
      absolute у левого края — user/style.css:30-32). Подписи кнопок переписывает
      polishLoginbox (popup_v2.js) — Lang-ключи общие с off-миром не трогаем ── */
.qp-body .user .loginbox .login_other .socauth .list { flex-direction:column; gap:10px; margin:0 0 10px; }
.qp-body .user .loginbox .login_other .socauth .btn { flex:0 0 auto; position:static; padding:11px 16px; justify-content:center; gap:10px; }
.qp-body .user .loginbox .login_other .socauth .btn:before,
.qp-body .user .loginbox .login_other .btn_email:before { content:''; position:static; top:auto; left:auto; flex:0 0 20px; width:20px; height:20px; }
/* кнопка Apple — НАША (button.qp-ai, НЕ <a>: легаси $('a', .socauth).click не должен её видеть);
   живая с 04.09 (APPLE-SIGNIN: SDK Apple в окне + fallback-редирект, popup_v2.js aiClick) */
.qp-body .user .loginbox .login_other .socauth .qp-ai { background:none; font:inherit; font-size:15px; color:var(--q-ink, #202c38); cursor:pointer; width:100%; }
/* [поправка Димы 02.09] яблоко оптически мельче гугл-круга (path заполняет ~57% viewBox против ~83%)
   — кнопки выглядели разнобойно; выравниваем ВИЗУАЛЬНЫЙ вес размером элемента: 23px даёт высоту
   силуэта ~17.7px против ~16.7px круга (узкой форме чуть больше высоты для равного веса) */
.qp-body .user .loginbox .login_other .socauth .qp-ai:before { flex-basis:23px; width:23px; height:23px; background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23202c38"><path d="M16.7 12.8c0-2.4 2-3.6 2.1-3.7-1.1-1.7-2.9-1.9-3.5-1.9-1.5-.2-2.9.9-3.7.9-.8 0-1.9-.9-3.2-.9-1.6 0-3.1 1-4 2.4-1.7 3-.4 7.3 1.2 9.7.8 1.2 1.8 2.5 3.1 2.4 1.2 0 1.7-.8 3.2-.8s1.9.8 3.2.8c1.3 0 2.2-1.2 3-2.4.9-1.4 1.3-2.7 1.3-2.8 0 0-2.6-1-2.7-3.7zM14.4 5.6c.7-.8 1.1-1.9 1-3.1-1 0-2.2.7-2.9 1.5-.6.7-1.2 1.9-1 3 1.1.1 2.2-.6 2.9-1.4z"/></svg>') no-repeat center / contain; }

/* ── мобильный: окна на всю ширину экрана и ПО ЦЕНТРУ — ровно как шторка корзины
      (cart_popup_v2.css .q-sheet: inset:0+margin:auto+width:100vw; поправка Димы 30.08 —
      прижатие к низу снято) ── */
/* [Б19 блок3] планшет/большой экран телефона (431–699): окна ЦЕНТРИРУЮТСЯ и сжимаются
   единой формулой (ширина по токену/контенту, без скачка). Full-bleed 100vw — ниже, ≤430. */
@media (max-width:699px){
	/* [Б19 фикс 01.09] ЦЕНТР через translate (как десктоп) — надёжно на iOS Safari;
	   прежний inset:0+margin:auto+height:fit-content на iPhone прижимал окно к ВЕРХУ
	   (margin:auto не центрирует по вертикали при auto-высоте — глюк WebKit; поймал Дима). */
	.qp-win { left:50%; top:50%; right:auto; bottom:auto; margin:0; height:fit-content;
		border-radius:14px; max-height:calc(100dvh - 12px);
		transform:translate(-50%,-50%) scale(.96); }
	.qp-win.show { transform:translate(-50%,-50%) scale(1); }
	/* фото — во весь экран, без полей; [Б19 блок4] тёмный фон на само окно (растянуто top:0/bottom:0):
	   гарантирует сплошной лайтбокс без белых полей по краям картинки товара (на телефоне фото
	   на всю ширину, а его встроенный белый фон раньше «разбавлял» сцену) */
	/* [Б матрица 01.09 №1] фото — full-bleed через inset:0, БЕЗ центра-translate: общее правило .qp-win выше
	   (height:fit-content + translate(-50%,-50%)) в паре с top:0 уносило окно за верх экрана
	   (ui_matrix: box top −422 на 390, оба движка). Порядок в файле = приоритет: это правило после .qp-win.show */
	.qp-win.qp-photo, .qp-win.qp-photo.show { left:0; right:0; top:0; bottom:0; height:auto; transform:none;
		width:100vw; max-width:100vw; border-radius:0; background:rgba(8,26,38,.94);
		display:grid; place-items:center; max-height:none; overflow:visible; }
	/* [Б19 блок4] телефон: фото крупнее, меньше воздуха (contain, БЕЗ обрезки — решение Димы В2=Б) */
	.qp-win.qp-photo img { max-width:100vw; max-height:calc(100dvh - 72px); border-radius:0; }
	/* [Б19 блок4] в фото-режиме шапка = только плавающий крестик: снять белый фон и min-width:100%
	   (общий .qp-head несёт их) — иначе белая полоса во всю ширину поверх тёмной фото-сцены */
	.qp-win.qp-photo .qp-head { position:fixed; top:max(10px, env(safe-area-inset-top)); right:max(10px, env(safe-area-inset-right)); left:auto;
		background:none; width:auto; min-width:0; padding:0; }
	/* [VIDEO-16-9] окно видео на телефоне — 1:1 с фото: сцена на весь экран, плеер во всю ширину (16:9 держит
	   .iframe_wrap), крестик плавает в углу экрана (на 92vw-окне он резался краем viewport — проба 04.09) */
	.qp-win.qp-video, .qp-win.qp-video.show { left:0; right:0; top:0; bottom:0; height:auto; transform:none;
		width:100vw; max-width:100vw; border-radius:0; background:rgba(8,26,38,.94);
		display:grid; place-items:center; max-height:none; overflow:visible; }
	.qp-win.qp-video .qp-body { width:100vw; }
	.qp-win.qp-video .eshop .youtube_wrap { border-radius:0; box-shadow:none; }
	.qp-win.qp-video .qp-head { position:fixed; top:max(10px, env(safe-area-inset-top)); right:max(10px, env(safe-area-inset-right)); left:auto;
		background:none; width:auto; min-width:0; padding:0; }
}
/* [Б19 блок3] телефон (≤430): full-bleed — поля убираем (gutter=0), окно на всю ширину,
   плавный «доснап» из min(токен, 100vw-28) — сохраняет решение Димы 24.08 (без полей на телефоне) */
@media (max-width:430px){
	/* [В 01.09] .qp-win.qp-win — специфичность (0,2,0), чтобы full-bleed перебивал токены ширины
	   .qp-win.tracker_price / .qp-n-* (тоже (0,2,0), но выше по файлу); проба 01.09: на 430 трекер
	   оставался 400 с полями по 15px — закон «≤430 = 100vw» не работал ни для одного окна с токеном */
	.qp-win.qp-win { --qp-gutter:0px; width:100vw; max-width:100vw; }
	/* [Б19 фикс 01.09 №2 → В 01.09] точечный фикс «.loginbox width:100%» заменён ОБЩИМ слоем сброса
	   легаси-габаритов (блок «слой сброса» выше): вход, OTP, активация, трекеры, звонок — одним правилом */
}

/* ══ [Б19 доп. 2026-09-01] МОБИЛЬНОЕ ОКНО ФИЛЬТРОВ КАТАЛОГА (#lay_eshop_filter) ══
   Легаси открывал фильтр инлайн-панелью в потоке (position:static, без затемнения, старый вид).
   Приводим к шторке снизу — как корзина (.q-sheet): затемнение фона, скруглённый верх, липкая
   шапка «Фільтри + крестик», кнопки/чекбоксы/слайдер в стиле чекаута. Только в server mode
   (файл грузится за гейтом) — off-мир и десктоп-сайдбар нетронуты.
   Открытие/перенос узла — существующий script.js; здесь ВИД + оверлей + блокировка фона (JS ниже).
   [CATALOG-FROM-MOCKUP доп., слово Димы 02.09.2026 «займись»] Граница расширена 699 -> 992:
   кнопка «Фільтри» живёт с ≤992 (style_mob), и на планшете 700–992 окно открывалось ЛЕГАСИ-видом —
   дыра Б19. Теперь весь диапазон кнопки получает одно и то же полноэкранное окно (как Розетка);
   992 — существующий легаси-брейкпоинт, не новый (§5 контракта). */
@media (max-width:992px){
	/* оверлей поверх страницы */
	#lay_eshop_filter.opened { position:fixed; inset:0; z-index:10060; display:block; padding:0;
		background:rgba(8,26,38,.5); }
	/* [Б19 Вариант Б Димы 01.09] ПОЛНОЭКРАННОЕ окно (как Rozetka), не шторка снизу */
	#lay_eshop_filter.opened > .wrap { position:fixed; inset:0; left:0; right:0; top:0; bottom:0;
		width:100%; max-height:none; overflow:auto; overscroll-behavior:contain; box-sizing:border-box;
		background:var(--q-card, #fff); border-radius:0;
		padding:0 16px calc(20px + env(safe-area-inset-bottom)); }
	/* аккордеон: с CATALOG-FROM-MOCKUP п.6 (слово Димы 02.09) группы приходят раскрытыми (.opened с сервера),
	   тап по заголовку сворачивает/раскрывает на месте; правило прячет только свёрнутые руками */
	#lay_eshop_filter.opened .filter .std:not(.price):not(.opened) .wrap_items { display:none; }
	#lay_eshop_filter.opened .filter .std:not(.price) > .title { cursor:pointer; position:relative; padding-right:26px; }
	/* шеврон-индикатор раскрытия (как Rozetka): вниз = свёрнуто, вверх = раскрыто */
	#lay_eshop_filter.opened .filter .std:not(.price) > .title:after {
		content:''; position:absolute; right:6px; top:50%; width:8px; height:8px;
		border:2px solid var(--q-ink2, #5E6B76); border-left:0; border-top:0;
		transform:translateY(-70%) rotate(45deg); transition:transform .2s ease; }
	#lay_eshop_filter.opened .filter .std:not(.price).opened > .title:after {
		transform:translateY(-30%) rotate(-135deg); }
	/* [CATALOG-FROM-MOCKUP 02.09] у title теперь всегда есть легаси-стрелка .arrow (группы кликабельны
	   и на десктопе) — в мобильном окне шеврон рисует :after выше, легаси-стрелку прячем (был двойной значок) */
	#lay_eshop_filter.opened .filter .std > .title .arrow { display:none; }
	/* липкая шапка «Фільтри + крестик» (паттерн шторки корзины) */
	#lay_eshop_filter.opened .buttons { position:sticky; top:0; z-index:3;
		background:var(--q-card, #fff); margin:0 -16px; padding:14px 16px 10px; }
	#lay_eshop_filter.opened .top { display:flex; align-items:center; justify-content:space-between; margin:0; }
	#lay_eshop_filter.opened .top:before { content:'Фільтри'; font-size:18px; font-weight:700;
		color:var(--q-ink, #202c38); order:1; }
	/* [поправка Димы 02.09 п.2: «не заметна»] специфичность над легаси .wrap .top a (матрица 01.09 №4)
	   + акцентный текст-линк в гамме действий */
	#lay_eshop_filter.opened .wrap .top a.filter_clear { order:2; color:var(--q-brand, #0894D4);
		font-size:14px; font-weight:600; text-decoration:none; }
	/* «Закрити» -> круглый крестик как .qp-x */
	#lay_eshop_filter.opened .filter_close { order:3; width:44px; height:44px; border-radius:50%;
		background:var(--q-soft, #E9F7FD); display:grid; place-items:center; margin-left:10px; flex:none; }
	#lay_eshop_filter.opened .filter_close span { display:none; }
	#lay_eshop_filter.opened .filter_close div { width:16px; height:16px; position:relative; }
	#lay_eshop_filter.opened .filter_close div:before,
	#lay_eshop_filter.opened .filter_close div:after { content:''; position:absolute; left:7px; top:1px;
		width:2px; height:14px; background:var(--q-ink, #202c38); border-radius:2px; }
	#lay_eshop_filter.opened .filter_close div:before { transform:rotate(45deg); }
	#lay_eshop_filter.opened .filter_close div:after { transform:rotate(-45deg); }
}

/* ── [Б19 доп. 2026-09-01, решение Димы «десктоп-колонку и слайдер тоже, всё консистентно»]
   СОДЕРЖИМОЕ ФИЛЬТРА в едином стиле с чекаутом/корзиной — И десктоп-сайдбар, И мобильная
   шторка (server mode, токены --q-* из checkout_v2_cart.css). off-мир не тронут (файл за гейтом). ── */
/* секции: серые рамки легаси -> чистый разделитель */
.eshop .filter .std { border:none !important; border-bottom:1px solid var(--q-line, #e3ebf1) !important; padding:14px 2px; }
.eshop .filter .std:last-child { border-bottom:none !important; }
/* заголовки секций -> тёмный q-ink, вес 700 (было синее #056cb0) */
.eshop .filter .title, .eshop .filter .std > .title {
	color:var(--q-ink, #202c38); font-size:15px; font-weight:700; padding-left:0; margin-bottom:8px; }
/* стрелка сворачивания -> CSS-шеврон вместо png */
.eshop .filter .std .title .arrow { background:none; width:9px; height:9px; border:2px solid var(--q-ink2, #5E6B76);
	border-left:0; border-top:0; transform:rotate(45deg); top:5px; }
.eshop .filter .std.opened .title .arrow { transform:rotate(-135deg); }
/* строки брендов/типов/цветов */
.eshop .filter .li .name, .eshop .filter .li a.name { color:var(--q-ink, #202c38); font-size:14px; }
.eshop .filter .li .name.active, .eshop .filter .li a.name.active { color:var(--q-brand, #0FAEE3); font-weight:600; }
/* чекбоксы брендов/типов/цветов = .std .li:before (png-спрайт checkbox.png) -> CSS-квадрат q-;
   выбранный (.active) -> заливка q-brand + белая SVG-галочка (было смещение спрайта -32px) */
.eshop .filter .std .li:before { background:var(--q-card, #fff) !important; width:20px !important; height:20px !important;
	border:1.5px solid var(--q-fline, #9AACB9); border-radius:6px; box-sizing:border-box; left:0; top:6px; }
.eshop .filter .std .li:hover:before { border-color:var(--q-sky, #0FAEE3); }
/* [поправка Димы 02.09 п.3] галочка НЕ картинкой (data-URI декодируется при первом использовании —
   на первом клике страница уже уходит в переход и виден «синий квадрат без галочки»), а CSS-рисунком
   в ::after — рендерится в один кадр с заливкой */
.eshop .filter .std .li.active:before {
	background:var(--q-brand, #0894D4) !important;
	border-color:var(--q-brand, #0894D4); }
.eshop .filter .std .li.active:after { content:''; position:absolute; left:5px; top:12px;
	width:9px; height:4px; border-left:2.5px solid #fff; border-bottom:2.5px solid #fff;
	transform:rotate(-45deg); box-sizing:content-box; }
/* «Ще N» — это действие, не пункт выбора: чекбокс-квадрат у него не рисуем (замечено скрином 02.09) */
.eshop .filter .std .li.more:before { display:none !important; }
/* стрелка «показати більше» (.li.more) — png -> CSS-шеврон */
.eshop .filter .std .li.more a:before { background:none !important; width:9px; height:9px;
	border:2px solid var(--q-brand, #0FAEE3); border-left:0; border-top:0; transform:rotate(45deg); top:3px; }
/* поля диапазона цены -> .q-fld */
.eshop .filter .price input.from, .eshop .filter .price input.till, .eshop .filter .price input[type=text] {
	border:1.5px solid var(--q-fline, #9AACB9); border-radius:10px; min-height:40px;
	font-size:16px; padding:6px 10px; box-sizing:border-box; -webkit-appearance:none; }
/* кнопка «Ok» цены -> CTA чекаута */
.eshop .filter .price .btn, .eshop .filter .price input[type=button] {
	background:linear-gradient(180deg, var(--q-cta1, #12B1E8), var(--q-cta2, #0B85C8));
	color:#fff; border:none; border-radius:11px; min-height:40px; padding:0 18px; font-weight:700; cursor:pointer; }
/* jQuery UI слайдер цены -> дорожка/заливка/ручки q-стиля */
.eshop .filter .slider.ui-slider { background:var(--q-line, #e3ebf1); border:none; height:6px; border-radius:3px; margin:16px 8px; }
.eshop .filter .slider .ui-slider-range { background:var(--q-brand, #0FAEE3); border:none; }
.eshop .filter .slider .ui-slider-handle { width:20px; height:20px; border-radius:50%; top:-7px; margin-left:-10px;
	background:#fff; border:2px solid var(--q-brand, #0FAEE3); box-shadow:0 2px 6px -1px rgba(8,30,46,.35); cursor:grab; }
/* «Ще N / показати більше» */
.eshop .filter .wraped_more .more, .eshop .filter .std .more, .eshop .filter .show_more {
	color:var(--q-brand, #0FAEE3); font-weight:600; }

/* ══ [CATALOG-FROM-MOCKUP п.1, слово Димы 02.09.2026] ТУЛБАР ЛИСТИНГА КАТАЛОГА ══
   Селект сортировки = .q-csel (рамка/радиус/SVG-стрелка приезжают из checkout_v2_cart.css, §3 контракта).
   ПК: подпись + селект слева, кнопки «Фільтри» нет (фильтры в левой колонке).
   Мобильный (≤992 — легаси-диапазон видимости кнопки, style_mob.css): как у Розетки —
   кнопка «Фільтри» слева растянутая, сортировка справа (50/50). Высота строки 44 = min-height
   .q-csel (§3); контрактные 48 — у второстепенных кнопок ОКОН, тут пара к селекту в одной строке. */
.listtop { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.listtop .sorts { flex:none; }
.listtop .sorts .eshop, .listtop .sorts .sort, .listtop .sorts .order { display:flex; align-items:center; gap:10px; }
.listtop .sorts .sort { margin:0; }
.listtop .sorts .order { float:none; margin:0; }
.listtop .sorts .order label.title { float:none; margin:0; font-size:13px; font-weight:600;
	color:var(--q-ink2, #5E6B76); cursor:pointer; }
.listtop .sorts .order select.q-csel { padding-top:8px; padding-bottom:8px; cursor:pointer; }
.listtop .sorts .sort > .clear, .listtop .sorts .order > .clear { display:none; }

@media screen and (max-width: 992px){
	.listtop { gap:10px; }
	/* кнопка «Фільтри»: легаси absolute+PNG (style_mob.css) -> статичная кнопка контракта с SVG-воронкой */
	/* [решение Димы 02.09 «а»: рамочная АКЦЕНТНАЯ, цвета макета Б14 — рамка/текст --q-brand,
	   hover мягкая подложка --q-soft; толщина/радиус контрактные (1.5/11, §3)] */
	/* [Б33, приёмка Димы 06.09 ⑨ по скрину Розетки] кнопка и сортировка — ДВЕ РАВНЫЕ колонки на всю
	   ширину (было по аудит-блицу №6 «в» 03.09: кнопка по контенту, селект — остаток; замер 390 06.09:
	   .sort внутри .sorts не рос — селект 188 из 251, справа пусто ~63px). Короткие подписи сортировки
	   (langs) остаются — в половину 390 влезают. Нет кнопки (раздел без наличия) — селект на всю ширину. */
	.listtop .filter_btn { position:static; top:auto; right:auto; z-index:auto;
		flex:1 1 calc(50% - 5px); min-width:0; display:flex; align-items:center; justify-content:center; gap:8px;
		/* базис — ровно половина за вычетом половины gap: при flex-basis:0 у кнопки (border-box, padding 12+рамка)
		   гипотетический размер выходил на 27px больше селекта — замер 06.09: 195 против 169 */
		min-height:44px; padding:0 12px; box-sizing:border-box;
		border:1.5px solid var(--q-brand, #0894D4); border-radius:11px;
		background:var(--q-card, #fff); color:var(--q-brand, #0894D4);
		font-size:15px; font-weight:600; line-height:1.2; text-decoration:none;
		transition:background .2s ease-in-out; }
	.listtop .filter_btn:before { content:''; position:static; margin:0; width:18px; height:18px;
		background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230894D4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polygon points='22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3'/></svg>") center/18px no-repeat; }
	.listtop .filter_btn:hover, .listtop .filter_btn:active { color:var(--q-brand, #0894D4);
		border-color:var(--q-brand, #0894D4); background:var(--q-soft, #E9F7FD); }
	.listtop .filter_btn:hover:before { background-position:center; }
	/* сортировка справа, подпись скрыта (как у Розетки) — имя списку даёт aria-label серверной подписи */
	.listtop .sorts { flex:1 1 calc(50% - 5px); min-width:0; }
	.listtop .sorts .eshop, .listtop .sorts .sort { width:100%; min-width:0; } /* ⑨: селект занимает свою половину целиком */
	.listtop .sorts .order { width:100%; }
	.listtop .sorts .order label.title { position:absolute; width:1px; height:1px; overflow:hidden;
		clip:rect(0 0 0 0); white-space:nowrap; }
	.listtop .sorts .order select.q-csel { width:100%; min-width:0; }
}

/* ══ [CATALOG-FROM-MOCKUP п.3, слово Димы 02.09.2026] «ПОКАЗАТИ ЩЕ N ТОВАРІВ» ══
   Второстепенная кнопка контракта (§3: border 1.5 --q-fline, radius 11, min-height 48,
   hover -> --q-sky); стоит над пагинацией (как Розетка). */
.list_more { text-align:center; margin:18px 0 6px; }
/* [решение Димы 02.09 «а»] рамочная акцентная — рамка/текст --q-brand, hover --q-soft (цвета макета Б14) */
.list_more a.more_btn { display:inline-flex; align-items:center; justify-content:center; gap:5px;
	min-height:48px; padding:0 28px; box-sizing:border-box;
	border:1.5px solid var(--q-brand, #0894D4); border-radius:11px;
	background:var(--q-card, #fff); color:var(--q-brand, #0894D4);
	font-size:15px; font-weight:600; text-decoration:none; transition:background .2s ease-in-out; }
.list_more a.more_btn:hover { border-color:var(--q-brand, #0894D4); color:var(--q-brand, #0894D4);
	background:var(--q-soft, #E9F7FD); }
.list_more a.more_btn.loading { opacity:.55; pointer-events:none; }
@media screen and (max-width: 699px){
	.list_more a.more_btn { display:flex; width:100%; }
}

/* ══ [CATALOG-FROM-MOCKUP п.4, слово Димы 02.09.2026] ПЛИТКА БЕЗ НАЛИЧИЯ ══
   Статус + «Повідомимо, коли з'явиться» с кнопкой-колокольчиком (SVG, тач-мишень 44 — §3).
   Открывает существующий трекер наличия (форма на листинге, goods_id подставляет клик). */
.eshop .list .li .wrap .notify_exist { margin-top:4px; }
.eshop .list .li .wrap .notify_exist .stock_off { font-size:13px; font-weight:600;
	color:var(--q-ink2, #5E6B76); margin-bottom:6px; }
.eshop .list .li .wrap .notify_exist .row { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.eshop .list .li .wrap .notify_exist .note { font-size:12.5px; color:var(--q-ink2, #5E6B76); line-height:1.3; }
/* [решение Димы 02.09 «а»] колокольчик = форма кнопки-корзинки макета (квадрат 44, радиус контрактный 11),
   сознательно приглушён: рамка --q-line, звоночек --q-ink2; на hover оживает голубым — плитка без товара
   не должна манить как живая (логика макета Б14) */
.eshop .list .li .wrap .notify_exist a.bell { flex:none; display:grid; place-items:center;
	width:44px; height:44px; border-radius:11px; box-sizing:border-box;
	border:1.5px solid var(--q-line, #E4E9EE); color:var(--q-ink2, #5E6B76);
	background:var(--q-card, #fff); text-decoration:none;
	transition:border-color .2s ease-in-out, color .2s ease-in-out; }
.eshop .list .li .wrap .notify_exist a.bell:hover { border-color:var(--q-brand, #0894D4);
	color:var(--q-brand, #0894D4); }
/* [FAV-MECHANICS C 2026-09-04] вошедший уже стежит: колокольчик и кнопка карточки — зелёный «ok»
   контракта (--q-ok, тот же, что у строки срока отправки) */
.eshop .list .li .wrap .notify_exist a.bell.tracked { border-color:var(--q-ok, #168A4E); color:var(--q-ok, #168A4E); }
/* [FAV-MECHANICS B] кабинет: «Видалити» у подписок — рамочная кнопка контракта (вторичная), во всю ширину плитки */
.user .eshop .list .li .wrap .cab_del { margin-top:8px; }
.user .eshop .list .li .wrap .cab_del a { display:flex; align-items:center; justify-content:center; height:40px; box-sizing:border-box;
	border:1.5px solid var(--q-line, #E4E9EE); border-radius:11px; color:var(--q-ink2, #5E6B76); font-size:13.5px; font-weight:600;
	text-decoration:none; background:var(--q-card, #fff); transition:border-color .2s ease-in-out, color .2s ease-in-out; }
.user .eshop .list .li .wrap .cab_del a:hover { border-color:var(--q-danger, #C23434); color:var(--q-danger, #C23434); }
.tracker_exist .button a.tracked span, .tracker_price .button a.tracked span { color:var(--q-ok, #168A4E); border-bottom-color:transparent; font-weight:600; }
.tracker_exist .button a.tracked:before, .tracker_price .button a.tracked:before { background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23168A4E' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5.5 5.5L20 6.5'/%3E%3C/svg%3E") no-repeat center / 16px 16px; }

/* ══ [CATALOG-FROM-MOCKUP п.5, слово Димы 02.09.2026] SEO-ТЕКСТ + FAQ КАТЕГОРИИ ══
   Существующие блоки (.context2, .faq) — современный вид по образцу макета Б14 v2,
   значения из контракта; поведение прежнее (faq/script.js toggle .open, main/script.js «Читати далі»). */

/* SEO-текст: свёрнут до порога с растворением снизу; «Читати далі» — текстовая кнопка --q-brand
   (тот же приём, что «показати більше» фильтра, Б19) */
.context2.wrapped { max-height:200px; overflow:hidden; position:relative; }
.context2.wrapped:after { content:''; position:absolute; left:0; right:0; bottom:0; height:56px;
	background:linear-gradient(180deg, rgba(255,255,255,0), var(--q-bg, #fff)); }
a.ctx_more { display:inline-block; margin:2px 0 8px; color:var(--q-brand, #0894D4);
	font-size:14px; font-weight:600; text-decoration:none; }
a.ctx_more:hover { color:var(--q-deep, #056CB0); }
.context2 h2, .context2 h3 { color:var(--q-ink, #202c38); }

/* FAQ: карточка-строка вопроса (паттерн .q-way: рамка 1.5 --q-line, radius 13, строка ≥52),
   CSS-шеврон вместо PNG-стрелки, цвета q- вместо легаси-синих */
.faq { margin:26px 0; }
.faq .title, .faq h3.title { font-size:18px; font-weight:700; color:var(--q-ink, #202c38); margin-bottom:12px; }
.faq .li { border:1.5px solid var(--q-line, #E4E9EE) !important; border-radius:13px; margin-bottom:10px;
	padding:0 16px; background:var(--q-card, #fff); }
.faq .li:last-child { border-bottom:1.5px solid var(--q-line, #E4E9EE) !important; }
.faq .li .name { min-height:52px; box-sizing:border-box; display:flex; align-items:center;
	padding:14px 30px 14px 0; font-size:15px; font-weight:600; color:var(--q-ink, #202c38); line-height:1.35; }
.faq .li:hover .name { color:var(--q-brand, #0894D4); }
.faq .li .name .arrow { background:none; width:9px; height:9px; margin-top:-6px;
	border:2px solid var(--q-ink2, #5E6B76); border-left:0; border-top:0;
	transform:rotate(45deg); transition:transform .2s ease; }
.faq .li.open .name .arrow { transform:rotate(-135deg); margin-top:-2px; }
.faq .li .text { font-size:14px; line-height:1.5; color:var(--q-ink2, #5E6B76); padding:0 0 14px; }
.faq .li .text a { color:var(--q-brand, #0894D4); }


/* ══ [поправка Димы 02.09 п.2] КАРТОЧКА ВЫБРАННЫХ ФИЛЬТРОВ (.filter.selected .clear) ══
   Легаси: мелкий 13px, рыхлые отступы 16/17, PNG-крестики, пустая оранжевая полоса .title.
   Приводим к контракту: карточка 1.5 --q-line r13, текст 14, CSS-крестики --q-danger. */
.eshop .filter.selected .clear .title { display:none; } /* пустой легаси-заголовок с оранжевым фоном */
.eshop .filter.selected .clear .wrap { padding:12px 14px 10px; border:1.5px solid var(--q-line, #E4E9EE);
	border-radius:13px; }
.eshop .filter.selected .clear .text { font-size:14px; font-weight:700; color:var(--q-ink, #202c38);
	margin:0 0 8px; padding:0 0 8px; line-height:1.3; border-bottom:1px solid var(--q-line, #E4E9EE); }
.eshop .filter.selected .clear .li { margin:0 0 6px; }
.eshop .filter.selected .clear .li .name { font-size:14px; font-weight:600; color:var(--q-ink2, #5E6B76); }
.eshop .filter.selected .clear .li a { font-size:14px; line-height:1.3; color:var(--q-ink, #202c38); }
/* крестик снятия значения: PNG -> CSS, красный как ошибка/удаление */
.eshop .filter.selected .clear .li a span { background:none !important; width:11px; height:11px; margin-top:-5px; }
.eshop .filter.selected .clear .li a span:before,
.eshop .filter.selected .clear .li a span:after { content:''; position:absolute; left:5px; top:0;
	width:2px; height:11px; background:var(--q-danger, #C23434); border-radius:2px; }
.eshop .filter.selected .clear .li a span:before { transform:rotate(45deg); }
.eshop .filter.selected .clear .li a span:after { transform:rotate(-45deg); }
/* «Скинути фільтр» внутри карточки: текст-линк в гамме действий (десктоп-колонка) */
.eshop .filter.selected .clear .reset { line-height:1; text-align:left; margin-top:4px; }
.eshop .filter.selected .clear .reset a { color:var(--q-brand, #0894D4); font-weight:600; font-size:14px;
	text-decoration:none; }
.eshop .filter.selected .clear .reset a:hover { color:var(--q-deep, #056CB0); }
/* в мобильном окне «Скинути фільтр» уже есть в шапке — дубль в карточке прячем */
@media (max-width:992px){
	#lay_eshop_filter.opened .filter.selected .reset { display:none; }
}

/* ══ [АУДИТ-БЛИЦ №4, слово Димы 03.09.2026] КОД ТОВАРА НА ПЛИТКЕ ══
   Различитель близнецов, виден и на телефоне (в ховере оставался мимо 71%). Тихая строка --q-ink2. */
.eshop .list .li .wrap .articul { font-size:12.5px; color:var(--q-ink2, #5E6B76); margin:2px 0 4px;
	white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }


/* ══ [АУДИТ-БЛИЦ №7 «б», слово Димы 03.09.2026] МИШЕНЬ ПУНКТА ФИЛЬТРА = ВСЯ СТРОКА ══
   Кликалось только слово-ссылка (~17px высотой), а ховер-подсветка обещала всю строку.
   Stretched-link: зона клика ссылки растянута на строку (текст на месте), счётчик тоже кликабелен.
   Действует везде (десктоп-колонка и моб-окно) — класс «мишень меньше подсветки» целиком. */
.eshop .filter .std .li { position:relative; }
/* легаси даёт a.name position:relative — тогда ::after растягивался по ссылке (57×17), а не по строке */
.eshop .filter .std .li > a.name { position:static; }
.eshop .filter .std .li > a.name:after { content:''; position:absolute; inset:0; }
/* тач-высота ≥44 — в мобильном окне (контракт §3); десктоп-строки прежней плотности */
@media (max-width:992px){
	#lay_eshop_filter.opened .filter .std .li { padding-top:13px; padding-bottom:13px; }
}

/* ══ [АУДИТ-БЛИЦ №1 «а», слово Димы 03.09.2026] МОБИЛЬНЫЙ ГРИД ПЛИТОК: ВЫСОТА ПО СОДЕРЖИМОМУ ══
   Легаси: li фикс-высоты (466 / 325 на ≤479) + .wrap position:absolute — контент, не влезший в
   высоту, НАКРЫВАЛСЯ следующим рядом: у 5-значных цен пропадала кнопка «Купити», у плиток без
   наличия срезался колокольчик (аудит 02-03.09, замер btn_bottom 353 > li 325). На тач-экранах
   ховер-вылета нет — absolute не нужен: грид, плитки в потоке, ряд тянется по самой высокой.
   Колонки как в легаси: 3 (≤992), 2 (≤479). Только главный грид листинга — карусели не тронуты. */
@media (max-width:992px){
	.contentbody > .eshop > .list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
	.contentbody > .eshop > .list > .li { min-width:0; } /* длинный артикул (nowrap) не распирает колонку — ellipsis работает */
	.contentbody > .eshop > .list > .li { float:none; width:auto; height:auto;
		border:0; border-bottom:1px solid var(--q-line, #F1F1F1); border-right:1px solid var(--q-line, #F1F1F1); }
	.contentbody > .eshop > .list > .li:nth-child(3n) { border-right:0; }
	.contentbody > .eshop > .list > .li > .wrap { position:static; min-height:0; height:auto;
		border:0 !important; box-shadow:none !important; }
	.contentbody > .eshop > .list > br.clear { display:none; }
}
@media (max-width:479px){
	.contentbody > .eshop > .list { grid-template-columns:repeat(2,minmax(0,1fr)); }
	.contentbody > .eshop > .list > .li:nth-child(3n) { border-right:1px solid var(--q-line, #F1F1F1); }
	.contentbody > .eshop > .list > .li:nth-child(2n) { border-right:0; }
}

/* ══ [Б33 CATALOG-FACETS-STOCK, решение Димы 06.09 ⑩ «б»] РАЗДЕЛ БЕЗ ЛЕВОЙ КОЛОНКИ — СПИСОК НА ВСЮ ШИРИНУ ══
   view_list.php не печатает #lay_left, когда ему нечего показать (подменю нет, панель фильтров пуста —
   в наличии ни одного товара), и даёт #lay_right легаси-класс `full` (style.css: width 100%). На ПК плитки
   легаси 25% от колонки — на полной ширине их бы растянуло; 5 в ряд (20%) держат размер плитки прежним
   (1440: 4×~285 в колонке ≈ 5×~283 на полной). Мобильный/планшет — грид выше (3 / 2 колонки), не задет. */
/* [TILES 06.09] правило `… .full … .li { width:20% }` снято: ПК-ряд теперь грид (секция TILES ниже — 5 колонок для .full); при равной
   специфичности (1,6,0) оно перекрывалось только порядком строк — дизайн-критик 06.09 нашёл плитку 69 px, ревью — хрупкость. */

/* [FAV-MECHANICS B 2026-09-04] списки кабинета (обрані / повідомити / слідкувати за ціною) — та же сетка
   «высота по содержимому» на ВСЕХ ширинах: ховер-вылета в кабинете нет, а плитка распроданного с меткой и
   колокольчиком выше фикс-высоты легаси (466) и вылезала на подвал (скрин 04.09). 3 колонки, 2 на ≤479. */
.cab_goods > .eshop > .list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.cab_goods > .eshop > .list > .li { min-width:0; float:none; width:auto; height:auto;
	border:0; border-bottom:1px solid var(--q-line, #F1F1F1); border-right:1px solid var(--q-line, #F1F1F1); }
.cab_goods > .eshop > .list > .li:nth-child(3n) { border-right:0; }
.cab_goods > .eshop > .list > .li > .wrap { position:static; min-height:0; height:auto; width:auto;
	border:0 !important; box-shadow:none !important; }
.cab_goods > .eshop > .list > br.clear { display:none; }
@media (max-width:479px){
	.cab_goods > .eshop > .list { grid-template-columns:repeat(2,minmax(0,1fr)); }
	.cab_goods > .eshop > .list > .li:nth-child(3n) { border-right:1px solid var(--q-line, #F1F1F1); }
	.cab_goods > .eshop > .list > .li:nth-child(2n) { border-right:0; }
}

/* ══ [Б33 CATALOG-FACETS-STOCK, решение Димы 05.09.2026 ⑤] ПОРЯДОК УЗЛОВ ШТОРКИ ФИЛЬТРОВ ══
   Липкая CTA «Показати N товарів» аудит-блица №8 «а» (03.09) снята вместе с переоткрытием окна —
   Дима посмотрел живьём и вернул «выбрал бренд → сразу товары». Flex-порядок .wrap (кнопки → фильтры),
   заведённый под ту плашку, оставлен: шторка принята в этом виде, менять раскладку без причины не надо. */
@media (max-width:992px){
	#lay_eshop_filter.opened > .wrap { display:flex; flex-direction:column; }
	#lay_eshop_filter.opened > .wrap > .buttons { order:0; }
	#lay_eshop_filter.opened > .wrap > .eshop { order:1; }
}

/* ══ [Б22.2 CALL-FAB, решение Димы «а» 05.09.2026] ПЛАВАЮЩАЯ КНОПКА КОНТАКТОВ + ОКНО КАНАЛОВ СВЯЗИ ══
   Разведка 05.09 (Rozetka/Epicentr/Allo/Comfy/конкурент santehnika.com.ua, iPhone 390): номера в мобильной
   шапке не держит никто; связь = круглая кнопка внизу справа → окно/панель каналов. У нас на телефоне
   .middle .phone скрыт (style_mob.css ≤650), телефон был только в подвале (5,7 экрана).
   Кнопка: круг 52 (высота .q-cta), градиент cta1→cta2, тень окон; только ≤900 (было ≤650 — HEADER-MOBILE 06.09: одна граница мобильной оболочки), только server mode
   (узел и кнопка печатаются в view_index.php под тем же гейтом, что этот файл). Кнопка «наверх»
   (#btn_scroll_up, btnscrolltotop/style.css: bottom 10%, right 2vw) встаёт над ней столбиком.
   z-index ниже оверлеев (qp-ovl 10060, q-ovl 10040) — при открытом окне/шторке уходит под затемнение. */
/* [HOME-FOOTER 11.09, ревью №8] запретная зона правого нижнего угла: круг 52 + поля. Подвал держит по ней отступ — меняешь кнопку, меняй токен */
:root { --q-fab-keepout: 68px; }
.qp-callfab { display:none; position:fixed; right:16px; bottom:calc(16px + env(safe-area-inset-bottom, 0px));
	width:52px; height:52px; border-radius:50%; z-index:10030; color:#fff; align-items:center; justify-content:center;
	background:linear-gradient(180deg, var(--q-cta1, #00C0F7), var(--q-cta2, #0FAEE3));
	box-shadow:0 10px 24px -8px rgba(11,133,200,.6); text-decoration:none; -webkit-tap-highlight-color:transparent; }
.qp-callfab svg { display:block; }
@media (max-width:900px){ /* [HEADER-MOBILE 06.09] граница 650→900: одна граница мобильной оболочки (шапка ≤900 прячет телефон) */
	.qp-callfab { display:flex; }
	#btn_scroll_up { bottom:calc(16px + 52px + 12px + env(safe-area-inset-bottom, 0px)); right:16px; }
}
/* окно: закон ширины узлов-точек (400, как трекеры/активация); тело — поля 20 вровень с шапкой окна */
.qp-win.qp-n-lay_call { width:min(400px, calc(100vw - var(--qp-gutter))); }
.qp-body .qp-call { padding:6px 20px 20px; }
/* три номера из админ-текста footer_tel.html (<p><a>…</a><br/>…) — кнопками второго уровня контракта
   (рамка 1.5 --q-fline, r11, min-height 48, hover --q-sky), <br> гасим, трубка SVG слева */
.qp-body .qp-call .tels p { margin:0; }
.qp-body .qp-call .tels br { display:none; }
.qp-body .qp-call .tels a { display:flex; align-items:center; justify-content:center; gap:10px; min-height:48px; margin:0 0 10px;
	border:1.5px solid var(--q-fline, #9AACB9); border-radius:11px; box-sizing:border-box; padding:0 14px;
	font-size:16px; font-weight:600; color:var(--q-ink, #202c38); text-decoration:none; font-variant-numeric:tabular-nums; }
.qp-body .qp-call .tels a:hover { border-color:var(--q-sky, #0FAEE3); }
.qp-body .qp-call .tels a:before { content:''; width:18px; height:18px; flex:none; background-repeat:no-repeat; background-size:contain;
	background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230894D4" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z"/></svg>'); }
/* часы из footer_time.html (<p>…</p><p>…</p>) — одной строкой подписи 13px --q-ink2 */
.qp-body .qp-call .hours { margin:4px 0 14px; font-size:13px; line-height:1.4; color:var(--q-ink2, #5E6B76); text-align:center; }
.qp-body .qp-call .hours p { display:inline; margin:0; }
.qp-body .qp-call .hours p + p:before { content:' · '; }
.qp-body .qp-call .hours_t { font-weight:600; }
/* мессенджеры: ряд рамочных кнопок с SVG-иконками (PNG-спрайт .smo шапки в новом слое не живёт — контракт §3) */
.qp-body .qp-call .smo { display:flex; gap:10px; }
.qp-body .qp-call .smo a.btn { flex:1; display:flex; align-items:center; justify-content:center; gap:8px; min-height:48px;
	border:1.5px solid var(--q-fline, #9AACB9); border-radius:11px; box-sizing:border-box; padding:0 10px;
	font-size:15px; font-weight:600; color:var(--q-ink, #202c38); text-decoration:none; background:var(--q-card, #fff); }
.qp-body .qp-call .smo a.btn:hover { border-color:var(--q-sky, #0FAEE3); }
.qp-body .qp-call .smo a.btn:before { content:''; width:20px; height:20px; flex:none; background-repeat:no-repeat; background-size:contain; }
.qp-body .qp-call .smo a.btn.tg:before { background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12" cy="12" r="12" fill="%2329A9EB"/><path fill="%23fff" d="M5.4 11.6l11.4-4.4c.5-.2 1 .1.8.9l-1.9 9.1c-.1.7-.6.8-1.1.5l-3-2.2-1.5 1.4c-.2.2-.3.3-.6.3l.2-3.1 5.6-5c.2-.2 0-.3-.3-.1l-6.9 4.3-3-.9c-.6-.2-.6-.6.3-.8z"/></svg>'); }
.qp-body .qp-call .smo a.btn.vb:before { background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%237360F2" d="M12 2C6.8 2 3 5.2 3 10.5c0 2.8 1.1 4.9 2.9 6.2V21l3.3-1.8c.9.2 1.8.3 2.8.3 5.2 0 9-3.2 9-8.5S17.2 2 12 2z"/><path fill="none" stroke="%23fff" stroke-width="1.4" stroke-linecap="round" d="M9.3 7.6c.3-.1.6 0 .8.3l.9 1.6c.2.3.1.6-.1.8l-.5.5c.5 1.1 1.4 2 2.5 2.5l.5-.5c.2-.2.5-.3.8-.1l1.6.9c.3.2.4.5.3.8-.3.9-1.1 1.4-2 1.2-2.6-.6-4.7-2.7-5.3-5.3-.2-.9.3-1.7 1.2-2z"/></svg>'); }
.qp-body .qp-call .smo a.btn.wa:before { background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%2325D366" d="M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2z"/><path fill="%23fff" d="M9.2 7.4c-.2-.5-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.5s1.1 2.9 1.2 3.1c.1.2 2.1 3.3 5.2 4.5 2.6 1 3.1.8 3.6.8.6-.1 1.8-.7 2-1.4.2-.7.2-1.3.2-1.4-.1-.1-.3-.2-.6-.3l-2-1c-.3-.1-.5-.2-.7.1-.2.3-.8 1-.9 1.2-.2.2-.3.2-.6.1-.3-.2-1.3-.5-2.4-1.5-.9-.8-1.5-1.8-1.7-2.1-.2-.3 0-.5.1-.6l.5-.5.3-.5c.1-.2 0-.4 0-.5l-.9-2.2z"/></svg>'); }
/* [Б22.3] ручки ползунка цены в шторке фильтра: рисунок 20px, хит-зона 44 паддингом (контракт §3; A1 M5) */
.eshop .filter .slider .ui-slider-handle:before { content:''; position:absolute; inset:-12px; border-radius:50%; }
/* (псевдоэлемент, не паддинг: рамка ручки рисуется по padding-box — паддинг раздувал сам кружок до 44, матрица 05.09) */

/* ══ [BUY-BUTTONS 2026-09-06, слово Димы «приступай» после обсуждения] КНОПКИ ПОКУПКИ ВИТРИНЫ 1:1 С ОФОРМЛЕНИЕМ + ПЛИТКА БЕЗ ДЕФЕКТОВ ══
   Дом: docs/checkout-rebuild/buy-mockup-2026-09-06.md (решения, критика ролями, замеры), DESIGN-CONTRACT §1/§3.
   Плитка: строка «цена + значок» — <div class="buyrow"> (view_price_list.php) одним флексом, цена никогда не уезжает на строку чипа
   (дефекты 3/4 критики Б32); СЛОТЫ НАД ЦЕНОЙ ФИКСИРОВАНЫ (⑧, замечание Димы 06.09 «большие отступы, особенно без отзывов»): имя ровно
   3 строки с «…» (9), строка отзывов зарезервирована всегда (пустая без отзывов), код, строка цены min-height 52 сразу под кодом →
   цена и значок в ряду на одной высоте БЕЗ прижатия к низу; переменное («Безкоштовна доставка») — ПОД ценой, как у Розетки: пустота
   у соседа без чипа остаётся внизу плитки, а не дырой между кодом и ценой. Цена --q-price 600, старая --q-ink2 12 (5); значок
   SVG-маской (7); карусель ≤500 в широком костюме (6); ховер-вылет ПК вне потока — ничего не двигает.
   Значок-кнопка (решение Димы 06.09 «как у Розетки»): без рамки, тележка 28 brand, невидимая мишень 44×44, hover — подложка --q-soft;
   «в кошику» — залитая тележка с галочкой-вырезом --q-brand (вариант «А» Димы), тап открывает шторку (⑦); колокольчик OOS — тот же
   язык. Карточка: «Купити» = .q-cta во всю ширину, степпер скрыт (количество — в шторке .q-qty, как Rozetka/Allo/Comfy), рассрочка —
   рамочная акцентная той же ширины со строкой «ПриватБанк, monobank — 0% · від N грн/міс» из живых программ (popup_v2.js creditLine,
   1:1 оформление) и мишенью на всю коробку; после добавления одна «В кошику» во всю ширину («Видалити» скрыта — решение Димы 06.09,
   убрать товар в шторке). Липкая панель: CTA 44 r12, фото 40 на телефоне; плавающая кнопка контактов и «наверх» выше панели, пока
   та видна (body.barbuy-open — Kernel.BarBuy, cont.js). Раскладка карточки не зависит от display контейнеров .out/.in — их
   переключает jQuery hide()/show() поверх класса d_none (урок живого прогона 06.09). Только server mode. */

/* ── плитка: колонка, стек над ценой = имя + код, всё переменное — ПОД ценой (класс — каталог, поиск, карусели карточки, кабинет, главная).
   ⑧ [замечание Димы 06.09 по скрину главной: «большие отступы в плитке, особенно без отзывов»] Было: строка цены margin-top:auto
   (прижата к низу ряда), а над ней переменные строки — отзывы (только при отзывах, решение 03.09), старая цена, чип доставки (у 33 %
   товаров) → у плитки без них дыра между кодом и ценой 44 px (390). Первая версия резервировала пустой слот отзывов и держала строку
   цены 52 — Дима 06.09 15:17: «огромные отступы между наименованием и артикулом и между ценой и артикулом». Итог: слот НЕ резервируем,
   отзывы и чип — под строкой цены (переменное вниз, как доставка у Розетки); над ценой только имя 54 + код; строка цены = мишень 44,
   столбик цены по низу с padding 10 → цифры на 14 от верха строки и со старой ценой, и без (старая 14 + новая 20 + 10 = 44). ── */
.eshop > .list > .li { display:flex; flex-direction:column; }
.eshop > .list > .li > .wrap { flex:1 1 auto; display:flex; flex-direction:column; box-sizing:border-box; }
.eshop > .list > .li > .wrap > br.clear { display:none; }
.eshop > .list > .li > .wrap > .buyrow { display:flex; align-items:flex-end; justify-content:space-between; gap:8px; margin-top:0; min-height:44px; padding-top:0; box-sizing:border-box; }
.eshop > .list > .li > .wrap > .buyrow:after { content:none; }
/* блок «немає в наявності» — та же геометрия, что строка цены (min-height 44, низ = низ корзинок ряда): статус и подпись слева
   столбиком, колокольчик 44 справа по низу; .row раскрыт в грид (display:contents), off-мир не грузит этот файл */
.eshop > .list > .li > .wrap > div.notify_exist { margin-top:0; padding-top:0; box-sizing:border-box; min-height:44px; display:grid;
	grid-template-columns:minmax(0,1fr) 44px; grid-template-rows:auto auto; column-gap:8px; align-items:end; }
.eshop > .list > .li > .wrap > div.notify_exist .stock_off { grid-column:1; grid-row:1; line-height:16px; margin:0 0 2px; }
.eshop > .list > .li > .wrap > div.notify_exist .row { display:contents; }
.eshop > .list > .li > .wrap > div.notify_exist .note { grid-column:1; grid-row:2; }
.eshop > .list > .li > .wrap > div.notify_exist a.bell { grid-column:2; grid-row:1 / span 2; align-self:end; }
/* код — сразу под именем (имя margin-bottom 6 + 2 = 8 px) */
.eshop > .list > .li > .wrap > .articul { margin:2px 0 4px; }
/* отзывы — ПОД строкой цены: звёзды слева, счётчик справа (legacy .review — table + margin-bottom 11, cont.css:83) */
.eshop > .list > .li > .wrap > .review { order:1; display:flex; align-items:center; justify-content:space-between; gap:6px; height:20px; margin:6px 0 0; }
.eshop > .list > .li > .wrap > .review .rate, .eshop > .list > .li > .wrap > .review .comm { display:block; width:auto; }
/* чип «Безкоштовна доставка» — под строкой цены, после отзывов; flex order, off-мир (флоаты) не задет */
.eshop > .list > .li > .wrap > .badge_free { order:2; margin:8px 0 0; align-self:flex-start; }
@media (max-width:992px){
	.contentbody > .eshop > .list > .li > .wrap { min-height:100%; }
}
/* имя — ровно 3 строки с честным многоточием (min = max: код и строка покупки на общей линии ряда — как .q-xcard .nm) */
.eshop > .list > .li > .wrap > .name { height:auto; min-height:54px; max-height:54px; margin-bottom:6px; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
/* ховер-вылет с характеристиками — СНЯТ (TILES 2026-09-06, решение Димы «Вариант А»): правила панели вне потока (06.09 утро) удалены,
   `.text` в шаблоне остаётся для off-мира; класс-широкое скрытие — секция TILES ниже */
.eshop > .list > .li > .wrap > .text { display:none; }
/* цена — деньги контракта (--q-price, 600 как весь новый слой), столбик по низу: действующая цена на одной линии во всём ряду.
   Высоты строк жёсткие (строка цены 44 = старая 14 + новая 20 + padding 10): кегль контейнера .new = кеглю цифр, «грн» с line-height 1 —
   смесь кеглей в одной строке раздувала строку до 21–22 px, и строка цены со старой ценой выходила 46–47 вместо 44 (обмер 06.09) */
.eshop .list .li .wrap .price.goods { float:none; flex:1 1 auto; min-width:0; height:auto; min-height:44px; box-sizing:border-box; padding:0 0 10px;
	display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; line-height:1.15; }
.eshop .list .li .wrap .price .new { float:none; color:var(--q-price, #0894D4); font-size:17px; line-height:20px; white-space:nowrap; }
.eshop .list .li .wrap .price .new .valuta, .eshop .list .li .wrap .price .new .pre, .eshop .list .li .wrap .price .new .izm { font-size:13px; line-height:1; }
.eshop .list .li .wrap .price .format { font-size:17px; font-weight:600; font-variant-numeric:tabular-nums; }
.eshop .list .li .wrap .price .old { color:var(--q-ink2, #5E6B76); text-decoration:line-through; text-decoration-color:var(--q-ink2, #5E6B76);
	font-size:12px; line-height:14px; margin:0; white-space:nowrap; font-variant-numeric:tabular-nums; }
.eshop .list .li .wrap .price .old .format, .eshop .list .li .wrap .price .old .valuta { font-size:12px; font-weight:400; }
/* значок-кнопка покупки: мишень 44×44 невидимая, тележка 28 --q-brand, hover — подложка --q-soft r11;
   подпись «Купити»/«В кошику» (<bdi class="q-vh">, view_price_list.php) скрыта клип-паттерном (как подпись сортировки выше) —
   читалка читает, смок «текст <12px» не видит (font-size:0 он считал текстом) */
.eshop .list .li .wrap .ctrl { float:none; flex:none; width:44px; height:44px; }
.eshop .list .li .wrap .ctrl div { height:100%; }
.eshop .list .li .wrap .ctrl a { display:grid; place-items:center; width:44px; height:44px; box-sizing:border-box; border:0; border-radius:11px;
	background:transparent; color:var(--q-brand, #0894D4); line-height:0; text-decoration:none; position:relative;
	transition:background .2s ease-in-out, color .2s ease-in-out; -webkit-tap-highlight-color:transparent; }
.eshop .list .li .wrap .ctrl a .q-vh { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; font-size:14px; }
.eshop .list .li .wrap .ctrl a:focus-visible { outline:2px solid var(--q-brand, #0894D4); outline-offset:2px; }
/* легаси-ховеры (cont.css:91 голубая заливка + белая иконка, :100 тёмно-синяя у «в кошику») гасим БЕЗ media: iOS вешает :hover на тап,
   и после «Купити» значок оставался в тёмно-синем квадрате (проба 06.09); подложка для мыши — ниже, в @media (hover:hover) */
.eshop .list .li .wrap .ctrl a:hover, .eshop .list .li .wrap .ctrl .in a:hover { background:transparent; color:var(--q-brand, #0894D4); }
.eshop .list .li .wrap .ctrl a span { display:block; width:28px; height:28px; margin:0; background:currentColor; background-image:none;
	-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M3 4h2.2l2.5 11.2a1.6 1.6 0 0 0 1.57 1.3h7.9a1.6 1.6 0 0 0 1.56-1.22L21 8H6.1"/><circle cx="10" cy="20.2" r="1.3" fill="%23000" stroke="none"/><circle cx="16.6" cy="20.2" r="1.3" fill="%23000" stroke="none"/></svg>') center / contain no-repeat;
	mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M3 4h2.2l2.5 11.2a1.6 1.6 0 0 0 1.57 1.3h7.9a1.6 1.6 0 0 0 1.56-1.22L21 8H6.1"/><circle cx="10" cy="20.2" r="1.3" fill="%23000" stroke="none"/><circle cx="16.6" cy="20.2" r="1.3" fill="%23000" stroke="none"/></svg>') center / contain no-repeat; }
@media (hover:hover) and (pointer:fine){
	.eshop .list .li .wrap .ctrl a:hover { background:var(--q-soft, #E9F7FD); color:var(--q-brand, #0894D4); }
}
/* «в кошику» — вариант «А» Димы 06.09 (как у Розетки): ЗАЛИТАЯ тележка фирменным голубым с галочкой-вырезом — один цельный знак,
   состояние читается по заливке, без второго цвета (зелёная тележка с отдельной галочкой отклонена: «корявая, зелёный не бьётся»);
   ссылка ведёт в корзину. background — явно: легаси .ctrl .in a красит серым #EFF3F6 (cont.css:98) */
.eshop .list .li .wrap .ctrl .in a { color:var(--q-brand, #0894D4); background:transparent; }
.eshop .list .li .wrap .ctrl .in a span { display:block;
	-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" fill-rule="evenodd" d="M2.2 3.2h3.3a1 1 0 0 1 1 .78L7 6h14.1a1 1 0 0 1 .97 1.24l-1.9 7.6A2.4 2.4 0 0 1 17.85 16.6H9.2a2.4 2.4 0 0 1-2.34-1.86L4.75 5.2H2.2a1 1 0 1 1 0-2Zm8.05 8.6 1.95 1.95 3.55-3.55a.95.95 0 1 1 1.35 1.35l-4.2 4.2a.95.95 0 0 1-1.35 0l-2.65-2.65a.95.95 0 1 1 1.35-1.3Z"/><circle cx="10" cy="20.2" r="1.6" fill="%23000"/><circle cx="16.6" cy="20.2" r="1.6" fill="%23000"/></svg>') center / contain no-repeat;
	mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" fill-rule="evenodd" d="M2.2 3.2h3.3a1 1 0 0 1 1 .78L7 6h14.1a1 1 0 0 1 .97 1.24l-1.9 7.6A2.4 2.4 0 0 1 17.85 16.6H9.2a2.4 2.4 0 0 1-2.34-1.86L4.75 5.2H2.2a1 1 0 1 1 0-2Zm8.05 8.6 1.95 1.95 3.55-3.55a.95.95 0 1 1 1.35 1.35l-4.2 4.2a.95.95 0 0 1-1.35 0l-2.65-2.65a.95.95 0 1 1 1.35-1.3Z"/><circle cx="10" cy="20.2" r="1.6" fill="%23000"/><circle cx="16.6" cy="20.2" r="1.6" fill="%23000"/></svg>') center / contain no-repeat; }
@media (hover:hover) and (pointer:fine){
	.eshop .list .li .wrap .ctrl .in a:hover { background:var(--q-soft, #E9F7FD); color:var(--q-brand, #0894D4); }
}
/* колокольчик плитки без наличия — тот же язык: без рамки, звоночек 26 --q-ink2, hover подложка + brand; «стежимо» — --q-ok */
.eshop .list .li .wrap .notify_exist a.bell { border:0; background:transparent; color:var(--q-ink2, #5E6B76); transition:background .2s ease-in-out, color .2s ease-in-out; }
.eshop .list .li .wrap .notify_exist a.bell svg { width:26px; height:26px; }
.eshop .list .li .wrap .notify_exist a.bell:hover { background:var(--q-soft, #E9F7FD); color:var(--q-brand, #0894D4); border-color:transparent; }
.eshop .list .li .wrap .notify_exist a.bell.tracked, .eshop .list .li .wrap .notify_exist a.bell.tracked:hover { color:var(--q-ok, #168A4E); }
/* телефон: сетка 187px — цена 16; карусельная плитка 275px (карточка) — широкий костюм, не сетки */
@media (max-width:500px){
	.eshop .list .li .wrap .price.goods { height:auto; min-height:44px; align-items:flex-start; }
	.eshop .list .li .wrap .price .new { font-size:16px; }
	.eshop .list .li .wrap .price .new .valuta { font-size:12px; }
	.eshop .list .li .wrap .price .format { font-size:16px; }
	.eshop .list .li .wrap .ctrl { width:44px; }
	.eshop .list .li .wrap .ctrl a span { width:28px; height:28px; }
	.short.h_scroll .eshop > .list > .li > .wrap { padding:16px; }
	.short.h_scroll .eshop > .list > .li > .wrap .img { height:200px; }
	.short.h_scroll .eshop > .list > .li > .wrap .price .new .format { font-size:17px; }   /* только действующая: правило на .price .format било и старую цену (17 вместо 12 — обмер 06.09) */
	.short.h_scroll .eshop > .list > .li > .wrap .price .new { font-size:17px; }
	.short.h_scroll .eshop > .list > .li > .wrap .price .new .valuta { font-size:13px; }
}
@media (max-width:360px){ /* плитка 140px: «грн» может уйти на вторую строку, цифры не переносятся (99 товаров ≥100 000) */
	.eshop .list .li .wrap .price .format { font-size:15px; white-space:nowrap; }
	.eshop .list .li .wrap .price .new { font-size:15px; white-space:normal; }
}
/* плавающая кнопка контактов и «наверх» — выше липкой панели покупки карточки, пока та видна */
@media (max-width:900px){
	body.barbuy-open .qp-callfab { bottom:calc(16px + 54px + env(safe-area-inset-bottom, 0px)); }
	body.barbuy-open #btn_scroll_up { bottom:calc(16px + 52px + 12px + 54px + env(safe-area-inset-bottom, 0px)); }
}
/* ── карточка: блок покупки (ТОЛЬКО .wrap_buy; липкая панель — ниже отдельно) ── */
.eshop .show .wrap_price .price { color:var(--q-price, #0894D4); }   /* деньги карточки — тот же синий, что в плитках и шторке */
.eshop .show .wrap_buy .ctrl.buy { min-height:52px; height:auto; }
.eshop .show .wrap_buy .ctrl.buy div.quant { display:none; }         /* количество — в шторке корзины (.q-qty) сразу после «Купити» */
.eshop .show .wrap_buy .ctrl.buy a.akabtn { float:none; display:flex; align-items:center; justify-content:center; gap:10px; width:auto; height:auto; min-height:52px;
	padding:0 18px; box-sizing:border-box; border:none; border-radius:14px; color:#fff; font-size:17px; font-weight:700; line-height:1.2; text-decoration:none;
	background:linear-gradient(180deg, var(--q-cta1, #00C0F7), var(--q-cta2, #0FAEE3)); box-shadow:0 8px 18px -8px rgba(11,133,200,.55); }
@media (hover:hover) and (pointer:fine){
	.eshop .show .wrap_buy .ctrl.buy a.akabtn:hover { background:linear-gradient(180deg, #1ACCFF, #25BDF0); box-shadow:0 10px 22px -8px rgba(11,133,200,.6); }
}
.eshop .show .wrap_buy .ctrl.buy a.akabtn:active { transform:translateY(1px); }
.eshop .show .wrap_buy .ctrl.buy .out > .clear { display:block; clear:both; height:0; }
/* «в кошику»: «Видалити» слева (второстепенная §3, первым в DOM), «В кошику» справа — flex = BFC рядом с float, ширина — остаток */
.eshop .show .wrap_buy .ctrl.buy .in a.del_byid { float:left; margin-right:10px; width:auto; min-height:52px; padding:0 16px; box-sizing:border-box;
	display:inline-flex; align-items:center; gap:8px; background:var(--q-card, #fff); border:1.5px solid var(--q-fline, #9AACB9); border-radius:11px;
	color:var(--q-ink2, #5E6B76); font-size:15px; font-weight:600; line-height:1; text-decoration:none; }
@media (hover:hover) and (pointer:fine){
	.eshop .show .wrap_buy .ctrl.buy .in a.del_byid:hover { border-color:var(--q-danger, #C23434); color:var(--q-danger, #C23434); }
}
.eshop .show .wrap_buy .ctrl.buy .in a.go.akabtn { float:none; width:auto; }
.eshop .show .wrap_buy .ctrl.buy .in:after { content:''; display:block; clear:both; }
/* [решение Димы 06.09, по примеру Розетки] «Видалити» на карточке и в липкой панели НЕ показываем: после добавления
   одна кнопка «В кошику» во всю ширину, убрать товар — в шторке корзины (там же количество). Легаси-элемент остаётся в DOM (off-мир). */
.eshop .show .wrap_buy .ctrl.buy .in a.del_byid, .eshop .show .barbuy .buy a.del_byid { display:none !important; }
/* иконки — SVG-маски (контракт §3): тележка в CTA; корзина у «Видалити» — правило осталось, сама кнопка скрыта (решение Димы 06.09) */
.eshop .show a .img_buy_add { display:block; width:22px; height:22px; margin:0; background:currentColor; background-image:none;
	-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M3 4h2.2l2.5 11.2a1.6 1.6 0 0 0 1.57 1.3h7.9a1.6 1.6 0 0 0 1.56-1.22L21 8H6.1"/><circle cx="10" cy="20.2" r="1.3" fill="%23000" stroke="none"/><circle cx="16.6" cy="20.2" r="1.3" fill="%23000" stroke="none"/></svg>') center / contain no-repeat;
	mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M3 4h2.2l2.5 11.2a1.6 1.6 0 0 0 1.57 1.3h7.9a1.6 1.6 0 0 0 1.56-1.22L21 8H6.1"/><circle cx="10" cy="20.2" r="1.3" fill="%23000" stroke="none"/><circle cx="16.6" cy="20.2" r="1.3" fill="%23000" stroke="none"/></svg>') center / contain no-repeat; }
.eshop .show .buy a.del_byid span { display:block; width:18px; height:18px; margin:0; background:currentColor; background-image:none;
	-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 7h16M10 11v6M14 11v6M6 7l1 13h10l1-13M9 7V4h6v3"/></svg>') center / contain no-repeat;
	mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 7h16M10 11v6M14 11v6M6 7l1 13h10l1-13M9 7V4h6v3"/></svg>') center / contain no-repeat; }
/* рассрочка: рамочная акцентная во всю ширину (= ширина CTA); строка «0% · від N грн/міс» 14/600 чернилами (popup_v2.js creditLine);
   кликается вся коробка — растянутая ссылка (приём popup_v2.css фильтров) */
/* сама ссылка растянута на всю коробку (не псевдоэлемент: смок Б22 меряет bbox ссылки — 176×19 было мишенью «<44»),
   подпись в верхней части, строка суммы — абсолютно снизу под ссылкой (pointer-events:none) */
.credit .average { margin:10px 0 0; }
.credit .average .wrap { position:relative; display:block; height:52px; min-height:52px; line-height:1.2; padding:0;
	background:var(--q-card, #fff); border:1.5px solid var(--q-brand, #0894D4); border-radius:11px; box-sizing:border-box; cursor:pointer; }
.credit .average .wrap .btn, .credit .average .wrap a.btn.akabtn, .eshop .show .average .wrap a.btn { float:none; position:absolute; inset:0; z-index:1; width:auto; min-height:0; height:auto;
	display:flex; align-items:center; justify-content:center; padding:0 16px 17px; box-sizing:border-box;
	background:none; line-height:1.2; color:var(--q-brand, #0894D4); font-size:16px; font-weight:700; text-decoration:none; }
.credit .average .wrap .summa { float:none; position:absolute; left:16px; right:16px; bottom:6px; width:auto; text-align:center; pointer-events:none;
	font-size:14px; line-height:1.2; font-weight:600; color:var(--q-ink, #202c38); font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.credit .average .wrap .summa span { font-size:14px; line-height:1.2; font-weight:600; color:var(--q-ink, #202c38); }
.credit .average .wrap .summa:empty { display:none; }
@media (hover:hover) and (pointer:fine){ .credit .average .wrap:hover { background:var(--q-soft, #E9F7FD); } }
@media (max-width:360px){ .credit .average .wrap .summa .qb { display:none; } }   /* «ПриватБанк, monobank — » не влезает в 273px; «0% · від N грн/міс» остаётся */
@media (max-width:500px){ .eshop .show .wrap_buy .ctrl.buy a.akabtn { font-size:16px; padding:0 14px; } }
/* ── липкая панель карточки — компактная CTA 44 r12 (как плашка попапа 48/15); «Видалити» скрыта правилом ниже (решение Димы 06.09), стили её значка 44 остались мёртвыми; легаси-флоаты (cont.css:185,191) сняты ── */
.eshop .show .barbuy .wrap_price .price { color:var(--q-price, #0894D4); }
.eshop .show .barbuy .wrap_ctrl .ctrl.buy { flex:none; }
.eshop .show .barbuy .buy { width:auto; height:44px; min-height:44px; }
.eshop .show .barbuy .buy > div { width:auto; }
.eshop .show .barbuy .buy .in, .eshop .show .barbuy .buy .out { white-space:nowrap; }
.eshop .show .barbuy .buy a.add, .eshop .show .barbuy .buy a.go { display:inline-flex !important; align-items:center; justify-content:center; gap:8px; height:44px !important; width:auto !important;
	float:none; vertical-align:top; padding:0 16px !important; border-radius:12px; background:linear-gradient(180deg, var(--q-cta1, #00C0F7), var(--q-cta2, #0FAEE3)); color:#fff;
	font-size:15px !important; font-weight:700; white-space:nowrap; text-decoration:none; box-shadow:none; }
.eshop .show .barbuy .buy a .img_buy_add { width:20px; height:20px; }
.eshop .show .barbuy .buy a.del_byid { display:inline-flex !important; align-items:center; justify-content:center; width:44px !important; height:44px !important; padding:0 !important;
	float:none; vertical-align:top; margin-right:8px; box-sizing:border-box; border:1.5px solid var(--q-fline, #9AACB9); border-radius:11px; background:var(--q-card, #fff);
	color:var(--q-ink2, #5E6B76); font-size:0 !important; }
.eshop .show .barbuy .buy a.del_byid span { width:18px; height:18px; }
/* телефон (≤768): легаси прятал фото и название в панели (cont.css:578-579) — фото 40 возвращаем (замечание Димы 06.09: «пропало
   изображение»), название не помещается рядом с кнопкой — остаётся только на ПК; цена по содержимому (легаси 135 фикс), на ≤360 фото снова прячем */
@media (max-width:768px){
	.eshop .show .barbuy .img { display:block; flex:none; width:40px; height:40px; margin-right:10px; }
	.eshop .show .barbuy .img img { width:40px; height:40px; }
	.eshop .show .barbuy .wrap_price { width:auto; min-width:0; margin-right:10px; }
	.eshop .show .barbuy .favorite { margin-right:10px; }
}
@media (max-width:360px){
	.eshop .show .barbuy .img { display:none; }
}
/* [решение Димы 06.09] «Видалити» в панели не показываем (как и на карточке) — специфичностью выше правила панели с !important выше */
.eshop .show .barbuy .wrap_ctrl .ctrl.buy a.del_byid { display:none !important; }
/* ── ГЛАВНАЯ: блоки «хиты» / «новинки» (.home .short — легаси float-сетка li 480/325 фикс + .wrap absolute) — тот же класс, что закрыл
   CATALOG-FROM-MOCKUP в каталоге: строка покупки по низу сделала плитку выше фикс-высоты, следующий ряд накрывал цену и значок
   (скрин Димы 06.09 с телефона; на ПК вылезало 15 px). Грид на всех ширинах, колонки как в легаси: 5 (>1420) / 4 / 3 (≤992) / 2 (≤768).
   Карусели карточки (.h_scroll) не задеты. ── */
.home .short:not(.h_scroll) .eshop > .list { display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); }
.home .short:not(.h_scroll) .eshop > .list > .li { min-width:0; float:none; width:auto; height:auto; margin:0; }
.home .short:not(.h_scroll) .eshop > .list > .li > .wrap { position:static; min-height:100%; height:auto; width:auto; }
.home .short:not(.h_scroll) .eshop > .list > br.clear { display:none; }
@media (max-width:1420px){ .home .short:not(.h_scroll) .eshop > .list { grid-template-columns:repeat(4, minmax(0,1fr)); } }
@media (max-width:992px){ .home .short:not(.h_scroll) .eshop > .list { grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width:768px){ .home .short:not(.h_scroll) .eshop > .list { grid-template-columns:repeat(2, minmax(0,1fr)); } }

/* ── окна каркаса: легаси a.akabtn (например «Ok» активации) = главная кнопка окна ── */
.qp-body a.akabtn { display:flex; align-items:center; justify-content:center; width:100%; min-height:52px; box-sizing:border-box; border:none; border-radius:14px;
	background:linear-gradient(180deg, var(--q-cta1, #00C0F7), var(--q-cta2, #0FAEE3)); color:#fff; font:inherit; font-size:17px; font-weight:700; text-decoration:none;
	box-shadow:0 8px 18px -8px rgba(11,133,200,.55); padding:0 18px; }

/* [HEADER-MOBILE 06.09, ревью №2] пустая корзина в шапке живая на всех ширинах (CQHead: .empty a.go → шторка) — легаси cursor:default снят */
#lay_header .eshop .info .empty .go { cursor:pointer; }

/* ══ [HEADER-MOBILE, решение Димы «B» 06.09.2026] ШАПКА НА ТЕЛЕФОНЕ: ДВЕ СТРОКИ ══
   Вход: «в мобильной версии шапка — большой лоб с кучей пустых мест, поле поиска теряется» (Дима 06.09).
   Было 229 px: тёмная 44 (вход/языки) + белая 130 (логотип, сердце, корзина, под ними поиск абсолютом)
   + синяя 55 с ОДНИМ гамбургером — ПК-раскладка из трёх полос на телефоне не пересобрана, а сжата.
   Рынок живьём (iPhone 390, 06.09: Rozetka/Allo/Comfy/Epicentr/santehnika.com.ua/Prom): 1–2 строки,
   поиск скруглён с лупой внутри и самый широкий элемент, вход и языки — в шторке меню.
   Стало 107 px: строка ☰ · логотип · сердце · корзина / поиск во всю ширину; .top и синяя полоса не
   показываются, их содержимое (.user .block, .wrap_lang) и сам .menu_btn переезжают узлами (popup_v2.js).
   1:1 с контрактом §3: поле = .q-fld input (1.5px --q-fline, r11, 16px, лупа --q-brand внутри слева;
   высота 44 — Б22.3), значки = значок-кнопка плитки (мишень 44, r11, знак 28, --q-brand, подложка --q-soft
   для мыши), счётчик = кружок 18 --q-brand, при нуле не рисуется (серый ноль = контраст 1,78:1 и «выключено»).
   Критика ролями 06.09 (critique-design/-buyer-header-mobile): без отрицательных полей (кружок вылезал за
   край поля), submit-призрак в поле снят (тап давал погашенную ошибку), отступ = сетка страницы .lay_site
   (2 %), подсказки вплотную к полю, шторка по закону окна §4 (затемнение .q-ovl, ☰→✕, мишени 44, выше FAB),
   одна граница мобильной оболочки 900 (FAB и телефон были на 650 — в полосе 651–900 телефона не было бы нигде).
   Только server mode (файл грузится под тем же гейтом) — off-мир держит старую шапку. Дом — DECISIONS HEADER-MOBILE. */
/* ── [HEADER-V2 07.09] общее для обеих ширин: значки сердца/корзины и счётчики — один код для телефона (≤900) и ПК (≥901);
   до 07.09 жили внутри @media ≤900, ПК-шапка 07.09 берёт их без копии (класс, не экземпляр). Цвет значков — --q-brand на белом
   (3,39:1; решение Димы 07.09 «М1»: белый фон вместо подложки --q-tint, значки как на листе — brand), счётчик --q-deep
   (белые 11/700 на brand 3,39 — не проходят 4,5, на deep 5,56 — проходят). ── */
/* сердце и корзина — переодевание легаси-узлов (CQHead пишет в .basket_wrap .eshop .info, cart_popup_v2.js) */
html.q-hdr2 #lay_header .basket_wrap { display:contents; }
html.q-hdr2 #lay_header .middle .favorite { position:static; order:3; flex:none; }
html.q-hdr2 #lay_header .middle .basket_wrap .eshop { order:4; flex:none; } /* флекс-элемент — обёртка .eshop, не .info */
html.q-hdr2 #lay_header .middle .eshop .info { position:static; z-index:auto; }
html.q-hdr2 #lay_header .middle .eshop .info .empty, html.q-hdr2 #lay_header .middle .eshop .info .full { position:static; width:44px; height:44px; }
html.q-hdr2 #lay_header .middle .favorite .info a, html.q-hdr2 #lay_header .middle .eshop .info a.go { position:relative; top:auto; right:auto; display:grid; place-items:center;
	width:44px; height:44px; padding:0; margin:0; box-sizing:border-box; border-radius:11px; background:none; color:var(--q-brand, #0894D4); /* brand на белом 3,39:1 (07.09: подложка --q-tint снята) */
	font-size:0; line-height:0; text-decoration:none; cursor:pointer; -webkit-tap-highlight-color:transparent; transition:background .2s ease-in-out; }
html.q-hdr2 #lay_header .middle .favorite .info a:before, html.q-hdr2 #lay_header .middle .eshop .info .pic:before { content:""; display:block; width:28px; height:28px; background:currentColor; }
/* сердце 26 при тележке 28 — оптическое выравнивание (решение Димы «а» 06.09 по скринам: замкнутая форма шире на 1,5 px и на 5 % тяжелее чернилами) */
html.q-hdr2 #lay_header .middle .favorite .info a:before { width:26px; height:26px; }
html.q-hdr2 #lay_header .middle .favorite .info a:before {
	-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20.5s-7.5-4.6-9.3-9.4C1.5 7.7 3.6 4.5 7 4.5c2 0 3.4 1.1 5 3 1.6-1.9 3-3 5-3 3.4 0 5.5 3.2 4.3 6.6-1.8 4.8-9.3 9.4-9.3 9.4z"/></svg>') center/contain no-repeat;
	mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M12 20.5s-7.5-4.6-9.3-9.4C1.5 7.7 3.6 4.5 7 4.5c2 0 3.4 1.1 5 3 1.6-1.9 3-3 5-3 3.4 0 5.5 3.2 4.3 6.6-1.8 4.8-9.3 9.4-9.3 9.4z"/></svg>') center/contain no-repeat; }
/* тележка — тот же знак, что у значка-кнопки плитки (BUY-BUTTONS) */
html.q-hdr2 #lay_header .middle .eshop .info .pic { position:relative; top:auto; left:auto; width:28px; height:28px; background:none; }
html.q-hdr2 #lay_header .middle .eshop .info .pic:before {
	-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M3 4h2.2l2.5 11.2a1.6 1.6 0 0 0 1.57 1.3h7.9a1.6 1.6 0 0 0 1.56-1.22L21 8H6.1"/><circle cx="10" cy="20.2" r="1.3" fill="%23000" stroke="none"/><circle cx="16.6" cy="20.2" r="1.3" fill="%23000" stroke="none"/></svg>') center/contain no-repeat;
	mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="1.9" stroke-linecap="round" stroke-linejoin="round"><path d="M3 4h2.2l2.5 11.2a1.6 1.6 0 0 0 1.57 1.3h7.9a1.6 1.6 0 0 0 1.56-1.22L21 8H6.1"/><circle cx="10" cy="20.2" r="1.3" fill="%23000" stroke="none"/><circle cx="16.6" cy="20.2" r="1.3" fill="%23000" stroke="none"/></svg>') center/contain no-repeat; }
/* счётчики: кружок 18 --q-brand внутри мишени 44; при нуле не рисуются (Rozetka), «disable» легаси = ноль */
html.q-hdr2 #lay_header .middle .favorite .info a span, html.q-hdr2 #lay_header .middle .eshop .info .pic .quant_w { position:absolute; top:auto; bottom:auto; left:auto; right:auto;
	min-width:18px; min-height:0; height:18px; padding:0 5px; box-sizing:border-box; border-radius:9px; background:var(--q-deep, #056CB0);
	color:#fff; font:700 11px/18px var(--q-serif, "Open Sans", sans-serif); text-align:center; }
html.q-hdr2 #lay_header .middle .favorite .info a span { top:2px; right:2px; }
html.q-hdr2 #lay_header .middle .eshop .info .pic .quant_w { top:-6px; right:-6px; } /* = сердце: верх 2, правый край 42 от мишени */
html.q-hdr2 #lay_header .middle .eshop .info .pic .quant_w .quant { position:static; color:#fff; }
html.q-hdr2 #lay_header .middle .favorite .info a.disable span, html.q-hdr2 #lay_header .middle .eshop .info .pic .quant_w.disable { display:none; }
/* ☰ — легаси-узел .menu_btn в белой строке на ОБЕИХ ширинах (телефон — HEADER-MOBILE 06.09; ПК — BL-11 «б» 08.09: как у eMAG, узел переезжает
   один раз при загрузке, popup_v2.js); три «линии» легаси дают ✕ через .active. Легаси-правила .line:before/:after привязаны к '.bottom .menu_btn'
   и после переезда не действуют — описаны здесь целиком. Порядок во флексе телефона (order:1) — в мобильной секции, схлопывание слота на ПК — в STICKY-HEADER. */
html.q-hdr2 #lay_header .middle .menu_btn { position:relative; top:auto; left:auto; display:grid; place-items:center; flex:none;
	width:44px; height:44px; padding:0; margin:0; box-sizing:border-box; border-radius:11px; background:transparent; box-shadow:none; text-decoration:none;
	-webkit-tap-highlight-color:transparent; }
html.q-hdr2 #lay_header .middle .menu_btn:hover, html.q-hdr2 #lay_header .middle .menu_btn.active { background:transparent; box-shadow:none; }
html.q-hdr2 #lay_header .middle .menu_btn .line { display:block; position:relative; top:auto; left:auto; width:26px; height:2.5px; border-radius:2px; background:var(--q-ink, #202c38); transition:background 0s .2s; }
html.q-hdr2 #lay_header .middle .menu_btn .line:before, html.q-hdr2 #lay_header .middle .menu_btn .line:after { content:""; display:block; position:absolute; left:0; width:26px; height:2.5px; border-radius:2px;
	background:var(--q-ink, #202c38); transition:top .2s .2s, transform .2s 0s; }
html.q-hdr2 #lay_header .middle .menu_btn .line:before { top:-8px; }
html.q-hdr2 #lay_header .middle .menu_btn .line:after { top:8px; }
html.q-hdr2 #lay_header .middle .menu_btn:hover .line, html.q-hdr2 #lay_header .middle .menu_btn:hover .line:before, html.q-hdr2 #lay_header .middle .menu_btn:hover .line:after { background:var(--q-ink, #202c38); }
html.q-hdr2 #lay_header .middle .menu_btn.active .line { background:transparent; }
html.q-hdr2 #lay_header .middle .menu_btn.active .line:before, html.q-hdr2 #lay_header .middle .menu_btn.active .line:after { top:0; background:var(--q-ink, #202c38); transition:top .2s 0s, transform .2s .2s; }
html.q-hdr2 #lay_header .middle .menu_btn.active .line:before { transform:rotate(45deg); }
html.q-hdr2 #lay_header .middle .menu_btn.active .line:after { transform:rotate(-45deg); }
@media (prefers-reduced-motion:reduce){ html.q-hdr2 #lay_header .middle .menu_btn .line, html.q-hdr2 #lay_header .middle .menu_btn .line:before, html.q-hdr2 #lay_header .middle .menu_btn .line:after { transition:none; } }

@media (max-width:900px){
	html.q-hdr2 #lay_header .top { display:none; }
	html.q-hdr2 #lay_header .bottom { height:auto; background:transparent; }
	html.q-hdr2 #lay_header .bottom .lay_site { height:auto; }
	html.q-hdr2 body:not(.basket) #lay_header .middle, html.q-hdr2 #lay_header .middle { height:auto; background:#fff; box-shadow:none; position:relative; z-index:3; } /* [HEADER-V2 07.09 «М1»: белый фон + тень --q-shadow-hdr вместо подложки --q-tint] → [BL-11 08.09, решение Димы по eMAG + дизайнер]: тень СНЯТА, граница шапки — цветная полоска 3 px по нижней кромке (::after, секция STICKY-HEADER); одна граница вместо двух (тень под полоской измеримо не видна: самый тёмный ряд 1,14:1). Линия --q-line 07.09 давала вторую линейку над крошками — полоска brand-цветов читается как край шапки, не как линейка */ /* body:not(.basket) — перебить style_mob ≤900 (height:130) той же специфичностью */
	html.q-hdr2 #lay_header .middle .lay_site { height:auto; display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; padding:4px 0 10px; }
	html.q-hdr2 #lay_header .middle .phone { display:none; }
	/* ☰ — вид и ✕ описаны в общем блоке выше (обе ширины); здесь только место во флексе строки */
	html.q-hdr2 #lay_header .middle .menu_btn { order:1; }
	html.q-hdr2 #lay_header .logo { position:static; order:2; flex:none; height:38px; margin-right:auto; } /* 34 → 38 (решение Димы «М1» 07.09): порог 320 — при 40 корзина падает на вторую строку (обмер 07.09, Chromium = WebKit), 38 держит 106 на всех ширинах */
	html.q-hdr2 #lay_header .logo img { height:38px; width:auto; }
	/* поиск — поле контракта §3, во всю ширину второй строкой; отправка — клавишей «Пошук»/Enter (submit-призрак снят) */
	html.q-hdr2 #lay_header .search { order:5; flex:1 0 100%; position:static; }
	html.q-hdr2 .search .form { position:static; height:44px; width:100%; max-width:none; }
	html.q-hdr2 .search .form form { position:relative; }
	html.q-hdr2 .search .form .fld { position:static; width:100%; height:44px; line-height:normal; box-sizing:border-box; border:2px solid var(--q-brand, #0894D4); border-radius:11px; /* [HEADER-V2 07.09] контур 2 px --q-brand на белом (3,39:1) — лист «рамка поля (Comfy)», выбор Димы; ⚠ фокус ниже той же силы — не добавлять !important сюда, иначе фокус deep перебьётся (ловушка критики 07.09; фокус ink → deep 13.09, SEARCH-FOCUS) */
		padding:0 48px 0 12px; font-size:16px; color:var(--q-ink, #202c38); -webkit-appearance:none; appearance:none; /* [BL-11 07.09, решение Димы «E»] лупа СПРАВА (одна, = кнопка): левую лупу-кнопку не заметил и сам Дима, тот же класс, что находка покупателя-критика «на ПК нет видимой кнопки поиска» */
		background:#fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230894D4" stroke-width="2" stroke-linecap="round"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.8-3.8"/></svg>') calc(100% - 12px) center/22px 22px no-repeat; }
	html.q-hdr2 .search .form .fld::placeholder { color:var(--q-ink2, #5E6B76); opacity:1; }
	html.q-hdr2 .search .form .fld:focus { outline:none; border-color:var(--q-deep, #056CB0); box-shadow:0 0 0 3px rgba(5,108,176,.20); } /* [SEARCH-FOCUS 13.09] фокус --q-deep + кольцо 3px/20% (геометрия 1:1 с полем чекаута, цвет глубокий синий): ПЕРЕСМОТР решения «а» 06.09 (фокус ink) — на телефоне рамка читалась как жирная чёрная (скрин Димы 13.09), выбор Димы «А»; deep 5,56:1 против brand 3,39:1 — нажатое поле отличимо от покоя без ухода из синего */
	/* [HEADER-V2 07.09, критика покупателя П1 + дизайн №3] лупа = кнопка: невидимый submit лежит НАД лупой (44×44) — тап по лупе отправляет,
	   тап мимо неё — нет; клавиша «Пошук»/Enter как прежде. [BL-11 «E»] лупа и кнопка — у ПРАВОГО края поля */
	html.q-hdr2 .search .form .btn { display:block; position:absolute; left:auto; top:0; right:0; width:44px; height:44px; padding:0; margin:0; opacity:0; background:none; border:0; cursor:pointer; }
	html.q-hdr2 .search .form .error_msg { position:absolute; top:100%; left:0; z-index:1; margin-top:2px; padding:2px 8px; background:#fff; border:1px solid var(--q-line, #E4E9EE); border-radius:8px; font-size:12.5px; line-height:14px; } /* плашка на 1 px ниже шапки — осознанно (ревью №5) */
	html.q-hdr2 .search .ui-widget-content { top:calc(100% - 6px) !important; left:0 !important; right:0 !important; width:auto !important; } /* контейнер — .lay_site (уже 96 %): 0, не 2 % (ревью №5) */
	/* шторка меню — закон окна §4: под затемнением .q-ovl (cart_popup_v2.css, z 10040) вся шапка поднимается выше, ☰ → ✕ */
	html.q-hdr2 body.q-menu-open #lay_header { z-index:10045; }
	html.q-hdr2 body.q-menu-open #lay_header .middle .lay_site > :not(.menu_btn) { pointer-events:none; } /* поверх затемнения — только ✕ (ревью №8) */
	html.q-hdr2 body.q-menu-open .qp-callfab, html.q-hdr2 body.q-menu-open #btn_scroll_up { visibility:hidden; } /* под открытой шторкой кнопке контактов делать нечего (критика: рисовалась поверх панели) */
	html.q-hdr2 #lay_header .menu_mob.opened { top:0; left:0; margin-left:-2vw; width:100%; max-width:min(88vw, 360px); padding:0 0 12px; box-sizing:border-box;
		max-height:calc(100vh - 120px); max-height:calc(100dvh - 120px); overflow:auto; -webkit-overflow-scrolling:touch; border-radius:0 0 16px 0; box-shadow:0 24px 64px -12px rgba(8,30,46,.35); }
	html.q-hdr2 #lay_header .menu_mob ul { padding-top:6px; }
	html.q-hdr2 #lay_header .menu_mob ul li { margin:0; padding-left:0; }
	html.q-hdr2 #lay_header .menu_mob ul li a, html.q-hdr2 #lay_header .menu_mob .menu_main ul li a, html.q-hdr2 #lay_header .menu_mob ul.level_1 li ul.level_2 li a { display:flex; align-items:center; min-height:44px;
		padding:6px 16px; font-size:16px; line-height:20px; color:var(--q-ink, #202c38); }
	html.q-hdr2 #lay_header .menu_mob .menu_main ul { padding-top:6px; border-top:1px solid var(--q-line, #E4E9EE); margin-top:6px; }
	/* вход — первой строкой шторки (узел .user из .top) */
	html.q-hdr2 #lay_header .menu_mob .user .block { position:static; max-width:none; z-index:auto; display:flex; align-items:center; gap:8px; min-height:52px; padding:4px 16px;
		border-bottom:1px solid var(--q-line, #E4E9EE); }
	html.q-hdr2 #lay_header .menu_mob .user .block:before { content:""; display:block; flex:none; width:24px; height:24px; background:var(--q-brand, #0894D4);
		-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2" stroke-linecap="round"><circle cx="12" cy="8" r="4"/><path d="M4 20.5c0-4 3.6-6.5 8-6.5s8 2.5 8 6.5"/></svg>') center/contain no-repeat;
		mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2" stroke-linecap="round"><circle cx="12" cy="8" r="4"/><path d="M4 20.5c0-4 3.6-6.5 8-6.5s8 2.5 8 6.5"/></svg>') center/contain no-repeat; }
	html.q-hdr2 #lay_header .menu_mob .user .block .logged_off a, html.q-hdr2 #lay_header .menu_mob .user .block .logged_on a { float:none; display:inline-flex; align-items:center; min-height:44px; height:auto;
		padding:0; margin:0; background:none; color:var(--q-ink, #202c38); font-size:16px; font-weight:600; line-height:20px; text-decoration:none; }
	html.q-hdr2 #lay_header .menu_mob .user .block .logged_on { display:flex; align-items:center; gap:14px; }
	html.q-hdr2 #lay_header .menu_mob .user .block .logged_on .logout { color:var(--q-ink2, #5E6B76); font-weight:400; }
}
/* ── шторка меню, содержимое — ОБЩЕЕ для телефона и ПК (с BL-11 09.09 шторка открывается и на ПК по ☰ в прилипшем состоянии; узлы .user/.wrap_lang
   попадают внутрь .menu_mob: на телефоне навсегда, на ПК на время открытия — popup_v2.js). Правила ниже действуют только внутри .menu_mob. ── */
/* [BL-13 LOGIN-VISIBILITY 07.09, решение Димы по скрину шторки Rozetka «тут согласен»] гость: первая строка шторки — карточка входа
   .login_card (user/view_block.php, только server mode) = карточка «скидка за вход» товара (.eshop .show .regdisc, секция REG-DISCOUNT:
   12/14, 13.5/1.45; кнопка brand, r11; значок кнопки 18 снят 08.09 по слову Димы «лишнее», тексты
   08.09 его: «Увійдіть, щоб отримати знижки.» / «Увійдіть в особистий кабінет» — отступление от текста кнопки товара) — селекторы свои, потому что строка шторки
   выше по специфичности (правило .logged_off a над этим блоком (1,4,2)) и перебила бы общие. Отступления от товара: без значка
   слева (колонка в шторке на 63 px уже — со значком кнопка переносилась уже на 390) и без подсказки (решение Димы 07.09
   «портянка лишняя»). На 320 кнопка в две строки (56) — допущено (порог 320 = «работает», не «та же раскладка»). Текстовая
   ссылка «Вхід» в шторке скрыта; .guest ставит PHP (без :has()). Вошедший: легаси DOM «Вийти, имя» под float:right во flex
   читался наоборот (промах пальцем по первой строке = выход) — имя первым через order (дизайн-критик 07.09). */
/* [BL-11/BL-20 09.09 — пересмотр Димы «слишком доминирует», оба консультанта «б», решение «согласен»] карточка КОМПАКТНАЯ: заливка кнопки
   остаётся (смысл BL-13 — скидка после входа), рамка и подложка карточки сняты, кнопка 44 → 40, текст 15 → 14: блок 125 → 91, первая категория
   237 → 203. Отступление от 1:1 с .q-restored (DESIGN-CONTRACT §3) разрешено Димой 09.09. На ПК та же карточка (шторка ПК = шторка телефона;
   в превью P3 там оставалась сырая строка «Вхід» + текст без кнопки — артефакт прототипа, не решение). */
html.q-hdr2 #lay_header .menu_mob .user .block.guest { display:block; padding:12px 16px 10px; min-height:0; }
html.q-hdr2 #lay_header .menu_mob .user .block.guest:before { display:none; }
html.q-hdr2 #lay_header .menu_mob .user .block.guest .logged_off > a.login { display:none; }
html.q-hdr2 #lay_header .menu_mob .user .block .login_card { display:flex; gap:10px; align-items:flex-start; margin:0; padding:0; box-sizing:border-box;
	border:0; background:none; border-radius:0;
	font-size:13.5px; line-height:1.45; color:var(--q-ink, #202c38); font-family:var(--q-serif, "Open Sans", -apple-system, sans-serif); }
html.q-hdr2 #lay_header .menu_mob .user .block .login_card .regdisc_body { flex:1 1 auto; min-width:0; }
html.q-hdr2 #lay_header .menu_mob .user .block .login_card .regdisc_text { display:block; }
html.q-hdr2 #lay_header .menu_mob .user .block .login_card a.login_btn { display:flex; align-items:center; justify-content:center; width:100%; box-sizing:border-box;
	min-height:40px; height:auto; margin:8px 0 0; padding:0 14px; border:1.5px solid var(--q-brand, #0894D4); border-radius:11px;
	background:var(--q-brand, #0894D4); color:#fff; font-size:14px; font-weight:700; line-height:1.2; text-decoration:none; text-align:center; }
	/* заливка brand + белый (14/700 — жирный текст, 3,39:1 ≥ порога 3:1) — решение Димы 08.09 «а» по находке покупателя/дизайнера «три синие
	   рамки стопкой»: осознанное исключение от рамочной кнопки товара (там рядом «Купити», здесь кнопка одна) — DESIGN-CONTRACT §3 */
html.q-hdr2 #lay_header .menu_mob .user .block .login_card a.login_btn:focus-visible { outline:none; box-shadow:0 0 0 3px rgba(15,174,227,.2); }
html.q-hdr2 #lay_header .menu_mob .user .block .logged_on .name { order:1; }
html.q-hdr2 #lay_header .menu_mob .user .block .logged_on .logout { order:2; }
html.q-hdr2 #lay_header .menu_mob .user .block .logged_on .q-umenu { display:none; } /* меню имени — только в тёмной полосе ПК (BL-13 08.09), в шторке имя ведёт в кабинет */
/* языки — внизу шторки кнопками-рамками контракта (узел .wrap_lang из .top) */
html.q-hdr2 #lay_header .menu_mob .wrap_lang { position:static; z-index:auto; margin-top:8px; padding:12px 16px 0; border-top:1px solid var(--q-line, #E4E9EE); }
html.q-hdr2 #lay_header .menu_mob .wrap_lang .menu_lang { padding-left:0; display:flex; gap:8px; }
html.q-hdr2 #lay_header .menu_mob .wrap_lang .menu_lang:before { display:none; }
html.q-hdr2 #lay_header .menu_mob .wrap_lang .menu_lang ul { display:flex; gap:8px; }
html.q-hdr2 #lay_header .menu_mob .wrap_lang .menu_lang ul li { float:none; padding:0; }
html.q-hdr2 #lay_header .menu_mob .wrap_lang .menu_lang ul li:after { display:none; }
html.q-hdr2 #lay_header .menu_mob .wrap_lang .menu_lang ul li a { display:inline-flex; align-items:center; justify-content:center; min-width:56px; min-height:44px; padding:0 14px; box-sizing:border-box;
	border:1.5px solid var(--q-fline, #9AACB9); border-radius:11px; color:var(--q-ink, #202c38); font-size:14px; font-weight:600; line-height:normal; }
html.q-hdr2 #lay_header .menu_mob .wrap_lang .menu_lang ul li a.active { border-color:var(--q-brand, #0894D4); color:var(--q-brand, #0894D4); background:var(--q-soft, #E9F7FD); }
@media (hover:hover) and (pointer:fine){ /* [HEADER-V2 07.09] ховер значков — обе ширины */
	html.q-hdr2 #lay_header .middle .favorite .info a:hover, html.q-hdr2 #lay_header .middle .eshop .info a.go:hover, html.q-hdr2 #lay_header .middle .menu_btn:hover { background:var(--q-soft, #E9F7FD); }
}

/* ══ [HEADER-V2 2026-09-07, решение Димы «П1» + блиц «один телефон»/«а» + «приступай»] ШАПКА ПК: 30 + 72 + 48 = 150 (было 175) ══
   Вход: «в настольной версии слишком много воздуха, поле поиска куцее, скруглить, причесать под новый дизайн» (Дима 07.09).
   Было (обмер 1440): логотип 42 в белой строке 90 (24/24 воздуха), поле 480×40 с рамкой #AFC7DF 1,74:1 и r0, дыры 81/52/167/46,
   три оси значков (72,5/75/77), PNG-значки 2,46:1; три дефекта брейкпоинтов легаси: 1400 поле 471→309, 1280 категории и меню
   пропадают (синяя полоса 55 с одним гамбургером на всей полосе 901–1280), 1200 шапка 175→235.
   Стало: белая строка 72 = 12+48+12 флексом с зазором 24: логотип 48 (183) · поле flex (713 на 1440, пол 320) · телефоны 300 ·
   сердце · корзина (правый край = сетка); синяя полоса 48; порог скрытия категорий/меню 1280 → 992 (6 категорий и 10 ссылок
   влезают до 993 — обмер 07.09); 901–1099 телефоны одной строкой — первый номер (иначе строка 667 + поле 320 > 0,96·W: 993 → hscroll 14,
   901 → 104; решение Димы 07.09 «один телефон»); 901–992 гамбургер 48 по центру полосы. Поле = то же, что на телефоне (2 px brand,
   r11, лупа = кнопка справа (BL-11 «E»), фокус deep + кольцо 3 px/20 % — SEARCH-FOCUS 13.09), значки/счётчики — общий блок выше. Часы работы — слот .time тёмной полосы (админ-текст
   header_time.html, решение Димы «а»), виден только ≥1380 (рядом с меню страниц 749 px иначе не влезает: 749 + 553 > 0,96·W).
   Рынок ПК 1440 (07.09): Rozetka 66, Epicentr 102, Comfy 103 (поле 570×44, рамка 2 px), Allo ~112. Только server mode (гейт html.q-hdr2).
   Дом — docs/checkout-rebuild/header-v2-2026-09-07.md, DECISIONS HEADER-V2. */
@media (min-width:901px){
	html.q-hdr2 #lay_header .middle { height:72px; }
	html.q-hdr2 #lay_header .middle .lay_site { height:72px; display:flex; align-items:center; gap:24px; }
	html.q-hdr2 #lay_header .logo { position:static; top:auto; left:auto; flex:none; height:48px; }
	html.q-hdr2 #lay_header .logo img { height:48px; width:auto; }
	/* поле поиска: тянется на всё свободное место, пол 320 (ниже — телефоны схлопываются, см. 901–1099) */
	html.q-hdr2 #lay_header .search { flex:1 1 auto; min-width:320px; position:relative; }
	html.q-hdr2 .search .form { position:static; top:auto; left:auto; width:100%; max-width:none; height:48px; }
	html.q-hdr2 .search .form form { position:relative; display:block; height:48px; }
	html.q-hdr2 .search .form .fld { position:static; display:block; width:100%; height:48px; line-height:normal; box-sizing:border-box; border:2px solid var(--q-brand, #0894D4); border-radius:11px;
		padding:0 52px 0 16px; font-size:16px; color:var(--q-ink, #202c38); -webkit-appearance:none; appearance:none; /* [BL-11 «E»] лупа справа = кнопка, как на телефоне */
		background:#fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%230894D4" stroke-width="2" stroke-linecap="round"><circle cx="11" cy="11" r="7"/><path d="m20 20-3.8-3.8"/></svg>') calc(100% - 14px) center/22px 22px no-repeat; }
	html.q-hdr2 .search .form .fld::placeholder { color:var(--q-ink2, #5E6B76); opacity:1; }
	html.q-hdr2 .search .form .fld:focus { outline:none; border-color:var(--q-deep, #056CB0); box-shadow:0 0 0 3px rgba(5,108,176,.20); } /* [SEARCH-FOCUS 13.09] то же, что на телефоне (выбор Димы «А») — один вид фокуса на обеих ширинах; легаси search/style.css: outline:none без замены — с клавиатуры поле было невидимо */
	html.q-hdr2 .search .form .btn { display:block; position:absolute; left:auto; top:0; right:0; width:44px; height:48px; padding:0; margin:0; opacity:0; background:none; border:0; cursor:pointer; } /* лупа = кнопка, справа (BL-11 «E») */
	html.q-hdr2 .search .form .error_msg { position:absolute; top:100%; left:0; z-index:1; margin-top:2px; padding:2px 8px; background:#fff; border:1px solid var(--q-line, #E4E9EE); border-radius:8px; font-size:12.5px; line-height:14px; color:var(--q-danger, #98423E); }
	html.q-hdr2 .search .ui-widget-content { top:calc(100% + 4px) !important; left:0 !important; width:100% !important; } /* легаси search/style.css: top:44px !important */
	/* телефоны: админ-текст header_tel.html как есть (таблица 2×2 + мессенджеры), блок 300 в потоке; трубка — SVG brand вместо PNG */
	html.q-hdr2 #lay_header .middle .phone { position:relative; top:auto; left:auto; flex:none; width:300px; min-width:0; padding-left:30px; box-sizing:border-box; }
	html.q-hdr2 #lay_header .middle .phone:before { width:22px; height:22px; margin-top:-11px; background:var(--q-brand, #0894D4);
		-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z"/></svg>') center/contain no-repeat;
		mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z"/></svg>') center/contain no-repeat; }
	html.q-hdr2 #lay_header .middle .phone a { color:var(--q-ink, #202c38); font-size:14px; font-variant-numeric:tabular-nums; }
	/* сердце и корзина — узлы из общего блока; на ПК прижаты к правому краю сетки */
	html.q-hdr2 #lay_header .middle .favorite { position:static; top:auto; right:auto; margin-left:auto; }
	html.q-hdr2 #lay_header .middle .basket_wrap .eshop { flex:none; }
	/* синяя полоса категорий 55 → 48 (значок 26 + текст 15/600: 11/11); body:not(.basket) — легаси-страница корзины держит свои 5 px */
	html.q-hdr2 body:not(.basket) #lay_header .bottom { height:48px; }
	html.q-hdr2 #lay_header .menu_catalog ul.level_1 li a { height:48px; }
	html.q-hdr2 #lay_header .menu_catalog ul.level_1 li ul.level_2 { top:48px; }
	/* часы работы в тёмной полосе — значок SVG вместо растрового клипарта icons_time.png; легаси style_mob ≤1420 прячет .time — показываем с 1380 (расчёт ниже) */
	html.q-hdr2 #lay_header .time { display:block; }
	html.q-hdr2 #lay_header .time:before { background:currentColor; margin-top:-7px;
		-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg>') center/contain no-repeat;
		mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg>') center/contain no-repeat; }
}
@media (min-width:901px) and (max-width:1379px){
	html.q-hdr2 #lay_header .time { display:none; } /* меню страниц 749 + часы 250 + вход/языки 303 > сетки 0,96·W при W < 1380 */
}
/* ── [HEADER-V2 07.09, пакет мелочей по критике — «приступай» Димы] ПК ≥901: тёмная полоса и полоса категорий ──
   (1) признак подразделов у категорий: у всех 6 пунктов есть выпадающее меню (ul.level_2), но пункт выглядел как обычная ссылка
       (критика покупателя П8) — стрелка 12 px после названия у пунктов с ul.level_2 (:has — Chrome 105+/Safari 15.4+/Firefox 121+;
       старее — без стрелки, меню работает как прежде);
   (2) значки тёмной полосы (человечек icon_user.png, выход icon_exit.png, глобус icon_lang.png) — растр 2,27:1 (дизайн-критик)
       → SVG-маски currentColor, как весь новый слой; (3) активный язык был ТИШЕ неактивного (UA #AFC7DF 8,15:1 против RU белого 14,2:1 —
       наоборот шторке телефона) → активный белый 700, неактивный #AFC7DF, hover белый. */
@media (min-width:901px){
	html.q-hdr2 #lay_header .menu_catalog ul.level_1 > li:has(> ul.level_2) > a:after { content:""; display:inline-block; flex:none; width:12px; height:12px; margin-left:6px;
		background:currentColor; opacity:.85;
		-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>') center/contain no-repeat;
		mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>') center/contain no-repeat; }
	html.q-hdr2 #lay_header .menu_catalog ul.level_1 > li:hover > a:after { transform:rotate(180deg); }
	/* вход / имя / выход — значки-маски вместо PNG (узлы .user живут в .top только на ПК; на телефоне они в шторке со своим значком) */
	html.q-hdr2 #lay_header .top .user .block .logged_off a, html.q-hdr2 #lay_header .top .user .block .logged_on .name, html.q-hdr2 #lay_header .top .user .block .logged_on .logout { background-image:none; position:relative; }
	html.q-hdr2 #lay_header .top .user .block .logged_off a:before, html.q-hdr2 #lay_header .top .user .block .logged_on .name:before, html.q-hdr2 #lay_header .top .user .block .logged_on .logout:before { content:""; position:absolute; left:2px; top:50%; width:14px; height:14px; margin-top:-7px; background:currentColor; }
	html.q-hdr2 #lay_header .top .user .block .logged_off a:before, html.q-hdr2 #lay_header .top .user .block .logged_on .name:before {
		-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2.2" stroke-linecap="round"><circle cx="12" cy="8" r="4"/><path d="M4 20.5c0-4 3.6-6.5 8-6.5s8 2.5 8 6.5"/></svg>') center/contain no-repeat;
		mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2.2" stroke-linecap="round"><circle cx="12" cy="8" r="4"/><path d="M4 20.5c0-4 3.6-6.5 8-6.5s8 2.5 8 6.5"/></svg>') center/contain no-repeat; }
	html.q-hdr2 #lay_header .top .user .block .logged_on .logout:before {
		-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 4H5a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h5M15 8l4 4-4 4M9 12h10"/></svg>') center/contain no-repeat;
		mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 4H5a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h5M15 8l4 4-4 4M9 12h10"/></svg>') center/contain no-repeat; }
	/* [BL-13 LOGIN-VISIBILITY 07.09 → пересмотр 08.09 по живой сборке (DESIGN-FLOW, слово Димы «всё равно теряется, может залить фоном» → выбор «a»)]
	   вход гостя в тёмной полосе — пилюля-кнопка: заливка белая, текст чернила --q-ink (14,2:1), 700 (как активный язык), высота 24 в полосе 30
	   (3…27, ось 15 = ось полосы), r12 = h/2, значок-маска 14 внутри (currentColor — перекрашивается сам); на месте прежней ссылки (right:115 —
	   как имя вошедшего); hover — подложка --q-soft. Было 07.09: контурная 22/r11 с hover #58CEF6; до того «Вхід | Реєстрація» 13/400 (кегль
	   «Блога», критика покупателя П6). Карточка входа .login_card — только шторка телефона (ниже, ≤900). */
	html.q-hdr2 #lay_header .top .user .block .logged_off a.login { display:inline-flex; align-items:center; float:right; height:24px; line-height:22px; margin-top:3px;
		padding:0 11px 0 29px; box-sizing:border-box; border:1px solid #fff; border-radius:12px; font-weight:700; background:#fff; color:var(--q-ink, #202c38); }
	html.q-hdr2 #lay_header .top .user .block .logged_off a.login:before { left:9px; }
	/* ховер только при мыши (как значки шапки :980 и кнопка товара :1195 — дизайн-критик 08.09 Д3); фокус с клавиатуры — кольцо как у кнопок нового слоя
	   (легаси style.css:12 «* {outline:none}» гасит стандартное — Д2) */
	@media (hover:hover) and (pointer:fine){ html.q-hdr2 #lay_header .top .user .block .logged_off a.login:hover { background:var(--q-soft, #E9F7FD); border-color:var(--q-soft, #E9F7FD); color:var(--q-ink, #202c38); } }
	html.q-hdr2 #lay_header .top .user .block .logged_off a.login:focus-visible { outline:none; box-shadow:0 0 0 3px rgba(15,174,227,.55); }
	/* [BL-13 08.09, слово Димы «вместо кнопки вход — имя, по клику выпадающее меню: личный кабинет, выйти»] вошедший ПК: имя — та же белая
	   пилюля (значок-маска + имя + шеврон, обрезка многоточием в max-width 180 легаси .block), строка «Вийти» полосы скрыта, меню под пилюлей
	   «как окна» (r11, рамка --q-line, тень выпадашки подсказок :1082; строки 40, 14/500, hover --q-soft). Узлы .q-umenu строит popup_v2.js.
	   Телефон: в шторке строка «имя · Вийти» как была (меню скрыто в HEADER-MOBILE). */
	html.q-hdr2 #lay_header .top .user .block .logged_on .name { display:inline-block; float:right; height:24px; line-height:22px; margin-top:3px; padding:0 12px 0 29px; box-sizing:border-box; max-width:180px;
		border:1px solid #fff; border-radius:12px; font-weight:700; background:#fff; color:var(--q-ink, #202c38); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
		/* inline-block, не inline-flex: многоточие у длинного имени рисует только блочный контейнер (ревью 08.09 №2 — на inline-flex текст уезжал под шеврон);
		   вертикаль держит line-height 22 в коробке 22 + рамка = 24. Шеврон и скрытие «Вийти» — только при построенном меню (.q-umenu-on, ревью №1) */
	html.q-hdr2 #lay_header .top .user .block .logged_on .name:before { left:9px; }
	html.q-hdr2 #lay_header .top .user .block .logged_on.q-umenu-on .name { padding-right:26px; cursor:pointer; }
	html.q-hdr2 #lay_header .top .user .block .logged_on.q-umenu-on .name:after { content:""; position:absolute; right:9px; top:50%; width:12px; height:12px; margin-top:-6px; background:currentColor; transition:transform .15s;
		-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>') center/contain no-repeat;
		mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>') center/contain no-repeat; }
	html.q-hdr2 #lay_header .top .user .block .logged_on.q-umenu-open .name:after { transform:rotate(180deg); }
	@media (hover:hover) and (pointer:fine){ html.q-hdr2 #lay_header .top .user .block .logged_on .name:hover { background:var(--q-soft, #E9F7FD); border-color:var(--q-soft, #E9F7FD); color:var(--q-ink, #202c38); } }
	html.q-hdr2 #lay_header .top .user .block .logged_on .name:focus-visible { outline:none; box-shadow:0 0 0 3px rgba(15,174,227,.55); }
	html.q-hdr2 #lay_header .top .user .block .logged_on.q-umenu-on > .logout { display:none; }
	html.q-hdr2 #lay_header .top .user .block .logged_on .q-umenu { display:none; position:absolute; top:30px; right:0; min-width:200px; padding:6px; box-sizing:border-box; background:#fff;
		border:1px solid var(--q-line, #E4E9EE); border-radius:11px; box-shadow:0 24px 60px -24px rgba(0,0,0,.55); z-index:20; }
	html.q-hdr2 #lay_header .top .user .block .logged_on.q-umenu-open .q-umenu { display:block; }
	html.q-hdr2 #lay_header .top .user .block .logged_on .q-umenu a { display:flex; align-items:center; min-height:40px; padding:0 12px; border-radius:8px; font-size:14px; font-weight:500; line-height:1.2; color:var(--q-ink, #202c38); text-decoration:none; white-space:nowrap; }
	@media (hover:hover) and (pointer:fine){ html.q-hdr2 #lay_header .top .user .block .logged_on .q-umenu a:hover { background:var(--q-soft, #E9F7FD); color:var(--q-ink, #202c38); } }
	html.q-hdr2 #lay_header .top .user .block .logged_on .q-umenu a:focus-visible { outline:none; box-shadow:0 0 0 3px rgba(15,174,227,.2); }
	html.q-hdr2 #lay_header .top .user .login_card { display:none; }
	/* языки: глобус-маска, активный ярче неактивного */
	html.q-hdr2 #lay_header .top .wrap_lang .menu_lang:before { background:currentColor; color:#fff;
		-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2" stroke-linecap="round"><circle cx="12" cy="12" r="9"/><path d="M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18"/></svg>') center/contain no-repeat;
		mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2" stroke-linecap="round"><circle cx="12" cy="12" r="9"/><path d="M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18"/></svg>') center/contain no-repeat; }
	html.q-hdr2 #lay_header .top .wrap_lang .menu_lang ul li a { color:#AFC7DF; font-weight:400; }
	html.q-hdr2 #lay_header .top .wrap_lang .menu_lang ul li a:hover { color:#fff; }
	html.q-hdr2 #lay_header .top .wrap_lang .menu_lang ul li a.active { color:#fff; font-weight:700; }
}
/* (4) выпадашка подсказок поиска — как окна нового слоя (дизайн-критик 07.09: без заметной тени, r4, рамка 1,27:1 — над баннером
   сливалась): рамка --q-line, r11, тень окон .qp-win; выбранная строка — подложка --q-soft без полосы слева (полоса = знак
   легаси-предупреждения, критика 06.09). Обе ширины; легаси-тема media/uitheme держит z-index/padding !important — их не трогаем. */
html.q-hdr2 .search .ui-menu { border:1px solid var(--q-line, #E4E9EE); border-radius:11px; box-shadow:0 24px 60px -24px rgba(0,0,0,.55); }
html.q-hdr2 .search .ui-menu .ui-menu-item a.ui-state-hover, html.q-hdr2 .search .ui-menu .ui-menu-item a.ui-state-focus, html.q-hdr2 .search .ui-menu .ui-menu-item a.ui-state-active { background:var(--q-soft, #E9F7FD); box-shadow:none; }
/* [BL-12 SEARCH-HINTS-ALL 07.09] строка-подвал «Показати всі товари (N)» = рамочная акцентная кнопка контракта §3
   (.list_more a.more_btn: 1.5 brand, r11, 15/600, фон card, hover soft), мишень 44, поля 8/10 внутри панели; легаси
   .text.all (search/style.css: голубой жирный по центру) и разделитель между строками (border-top #F1F6FA) — перекрыты */
html.q-hdr2 .search .ui-menu li.q-ac-all { padding:10px 14px 4px; } /* бока 14 = колонка содержимого строк, верх/низ 10 (низ = 4 + padding панели 6) — дизайн-критик 07.09 №7 */
html.q-hdr2 .search .ui-menu li.q-ac-all a, html.q-hdr2 .search .ui-menu .ui-menu-item + li.q-ac-all a { display:flex; align-items:center; justify-content:center; min-height:44px; height:auto !important; width:auto !important; margin:0; padding:10px 16px !important; box-sizing:border-box;
	border:1.5px solid var(--q-brand, #0894D4); border-radius:11px; background:var(--q-card, #fff); transition:background .2s ease-in-out; } /* height/width свои, не через легаси search/style.css:35 (критик №9) */
html.q-hdr2 .search .ui-menu li.q-ac-all a .text.all { flex:0 1 auto; width:auto; padding:0; line-height:20px; font-size:15px; font-weight:600; color:var(--q-brand, #0894D4); text-align:center; white-space:normal; overflow:visible; } /* сжимается и переносится: на 320 RU с 5-значным числом метка была шире кнопки (критик №1) */
html.q-hdr2 .search .ui-menu li.q-ac-all a.ui-state-hover, html.q-hdr2 .search .ui-menu li.q-ac-all a.ui-state-focus, html.q-hdr2 .search .ui-menu li.q-ac-all a.ui-state-active { background:var(--q-soft, #E9F7FD); border-color:var(--q-brand, #0894D4); }
html.q-hdr2 .search .ui-menu li.q-ac-all a.ui-state-hover .text.all, html.q-hdr2 .search .ui-menu li.q-ac-all a.ui-state-focus .text.all, html.q-hdr2 .search .ui-menu li.q-ac-all a.ui-state-active .text.all { color:var(--q-brand, #0894D4); }
/* порог скрытия категорий и меню страниц 1280 → 992 (style_mob ≤1280 прячет .menu_main/.menu_catalog и показывает .menu_btn) */
@media (min-width:993px) and (max-width:1280px){
	html.q-hdr2 #lay_header .menu_main { display:block; }
	html.q-hdr2 #lay_header .menu_catalog { display:block; }
	/* легаси-гамбургер полосы (.bottom .menu_btn) прятать больше не нужно: узел живёт в белой строке на всех ширинах (BL-11) */
}
/* 901–1099: телефоны одной строкой — первый номер админ-таблицы (решение Димы 07.09 «один телефон»); остальные — подвал, контакты */
@media (min-width:901px) and (max-width:1099px){
	html.q-hdr2 #lay_header .middle .phone { width:auto; }
	html.q-hdr2 #lay_header .middle .phone table td { display:none; }
	html.q-hdr2 #lay_header .middle .phone table tr:first-child td:first-child { display:table-cell; white-space:nowrap; width:auto; }
	html.q-hdr2 #lay_header .middle .phone .smo { display:none; }
}
/* [HEADER-V2 07.09, попутно] кнопка баннера главной «Переглянути» — мишень 44 на телефоне (легаси 40; всплыло, когда баннер вернулся
   на песочницу: смок Б22.3 «тач-мишени <44» увидел её впервые — снимок media/ песочницы был без файла баннера) */
@media (max-width:900px){
	.slider .pics .li .link { height:44px; line-height:44px; }
}
/* 901–992: категории не влезают (порог 993), а гамбургер с BL-11 живёт в белой строке — синяя полоса пуста и не печатается (шапка 30 + 72 = 102);
   ☰ здесь виден всегда (наверху страницы каталог иначе не открыть — схлопывание слота STICKY-HEADER только с 993) */
@media (min-width:901px) and (max-width:992px){
	html.q-hdr2 body:not(.basket) #lay_header .bottom { display:none; }
}

/* ══ [TILES 2026-09-06, слово Димы «приступай» после разбора → варианты → «Вариант А» + «второе фото при наведении» + пилюли «П2» → макет → критика двух ролей] ПЛИТКА КАТАЛОГА/ГЛАВНОЙ ══
   Дом: docs/checkout-rebuild/tiles-mockup-2026-09-06.md (решения, критика, замеры), tiles-research-2026-09-06.md (разбор, эталоны), DESIGN-CONTRACT §3, DECISIONS TILES.
   Болезнь (скрин Димы 06.09): коробка плитки ПК фикс 480 (cont.css:66) при содержимом 416 → 64 px пустоты под ценой в каждой плитке; ховер-вылет приклеен к коробке
   (top:100% от .wrap 480) → дыра 64 px между ценой и «Виробник»; в вылете 3 из 5 строк — дубли, short пуст у 0/22 271. Эталоны (Rozetka/Алло/Епіцентр) вылета не имеют. */
/* 1. ПК (≥993): ряд плиток каталога/поиска = грид авто-высоты — продолжение мобильного грида ≤992 (АУДИТ-БЛИЦ №1) тем же приёмом:
      рамки на .li (низ + право), .wrap без рамки; колонки как в легаси: 3 (993–1420, style_mob 33.3%), 4 (>1420, cont.css 25%),
      5 на разделе без левой колонки (#lay_right.full, Б33 ⑩). Карусели карточки (.short.h_scroll) не задеты — селекторы только прямой ребёнок. */
@media (min-width:993px){
	.contentbody > .eshop > .list, .search .items > .eshop > .list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
	#lay_right.list_eshop.full .contentbody > .eshop > .list { grid-template-columns:repeat(5,minmax(0,1fr)); }
	.contentbody > .eshop > .list > .li, .search .items > .eshop > .list > .li,
	#lay_right.list_eshop.full .contentbody > .eshop > .list > .li { min-width:0; float:none; width:auto; height:auto; margin:0;
		border:0; border-bottom:1px solid var(--q-line, #F1F1F1); border-right:1px solid var(--q-line, #F1F1F1); }
	.contentbody > .eshop > .list > .li:nth-child(3n), .search .items > .eshop > .list > .li:nth-child(3n) { border-right:0; }
	#lay_right.list_eshop.full .contentbody > .eshop > .list > .li:nth-child(3n) { border-right:1px solid var(--q-line, #F1F1F1); }
	#lay_right.list_eshop.full .contentbody > .eshop > .list > .li:nth-child(5n) { border-right:0; }
	.contentbody > .eshop > .list > .li > .wrap, .search .items > .eshop > .list > .li > .wrap { position:static; min-height:100%; height:auto; width:auto; border:0 !important; }
	.contentbody > .eshop > .list > br.clear, .search .items > .eshop > .list > br.clear { display:none; }
}
@media (min-width:1421px){
	.contentbody > .eshop > .list, .search .items > .eshop > .list { grid-template-columns:repeat(4,minmax(0,1fr)); }
	.contentbody > .eshop > .list > .li:nth-child(3n), .search .items > .eshop > .list > .li:nth-child(3n) { border-right:1px solid var(--q-line, #F1F1F1); }
	.contentbody > .eshop > .list > .li:nth-child(4n), .search .items > .eshop > .list > .li:nth-child(4n) { border-right:0; }
}
/* 1а. Телефон/планшет (≤992): поиск получает тот же мобильный грид, что каталог (АУДИТ-БЛИЦ №1 писал только .contentbody —
      на /search/ следующий ряд накрывает низ плитки на 64 px на 390, живой дефект, найден дизайн-критиком 06.09) */
@media (max-width:992px){
	.search .items > .eshop > .list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
	.search .items > .eshop > .list > .li { min-width:0; float:none; width:auto; height:auto;
		border:0; border-bottom:1px solid var(--q-line, #F1F1F1); border-right:1px solid var(--q-line, #F1F1F1); }
	.search .items > .eshop > .list > .li:nth-child(3n) { border-right:0; }
	.search .items > .eshop > .list > .li > .wrap { position:static; min-height:0; height:auto; border:0 !important; box-shadow:none !important; }
	.search .items > .eshop > .list > br.clear { display:none; }
}
@media (max-width:479px){
	.search .items > .eshop > .list { grid-template-columns:repeat(2,minmax(0,1fr)); }
	.search .items > .eshop > .list > .li:nth-child(3n) { border-right:1px solid var(--q-line, #F1F1F1); }
	.search .items > .eshop > .list > .li:nth-child(2n) { border-right:0; }
}
/* 2. Ховер-вылет с характеристиками снят (решение Димы 06.09 «Вариант А»). Наведение = мягкая тень + кольцо, только для мыши;
      легаси-свечение #0FAEE3 (cont.css:69) и синие верх/лево на главной (cont.css:390-403) гасим БЕЗ media — iOS вешает :hover на тап (урок Б34). */
.eshop .list .li .wrap .text, .eshop .list .li .wrap:hover .text { display:none !important; }
.eshop .list .li .wrap:hover { box-shadow:none; border-color:var(--q-line, #F1F1F1); }
.short .list .li:nth-child(n):hover .wrap { border-top-color:var(--q-line, #F1F1F1); border-left-color:var(--q-line, #F1F1F1); }
@media (hover:hover) and (pointer:fine){
	.eshop .list .li .wrap:hover, .short .list .li:nth-child(n):hover .wrap { border-color:#C9DDE8; box-shadow:0 6px 18px -6px rgba(32,44,56,.18); }
	.contentbody > .eshop > .list > .li > .wrap:hover, .search .items > .eshop > .list > .li > .wrap:hover { box-shadow:0 0 0 1px #C9DDE8, 0 6px 18px -6px rgba(32,44,56,.18); }
}
/* 3. Второе фото при наведении (только мышь): второй <img class="img2"> в .img, data-src подгружается при первом mouseenter (cont.js), crossfade с задержкой
      150 мс (мышь пересекает чужие плитки по пути — покупатель-критик); белый фон и object-fit — второе фото ДРУГОЙ пропорции полностью закрывает первое (дизайн-критик). */
.eshop .list .li .wrap .img img.img2 { width:100%; height:100%; object-fit:contain; background:#fff; opacity:0; transition:opacity .2s ease 0s; z-index:3; pointer-events:none; }
@media (hover:hover) and (pointer:fine){ .eshop .list .li .wrap:hover .img img.img2.loaded { opacity:1; transition-delay:.15s; } }
/* 4. Пилюли П2 (решение Димы 06.09): «−N%» как есть (белым на --q-sale); остальные — цветной текст на светлой подложке в языке чипа доставки;
      «Краща ціна» не печатается (1 товар на каталог) */
.eshop .label.hit { background:#FFF1E6; color:#C2410C; }
.eshop .label.new { background:var(--q-soft, #E9F7FD); color:var(--q-deep, #056CB0); }
/* «Краща ціна» снята в PHP (view_labels_dyn.php, обоих миров) — CSS-дубля не держим (/done 1.5) */
/* 5. Чип доставки на узкой плитке (≤992: 3 колонки, на 600 плитка 192 px) — одна строка, кегль 12 остаётся (контракт §3 / смок Б22.3
      «текст <12px = 0»: первая версия с 11px покраснела в 3 секциях); влезает за счёт снятой галочки и узких полей: текст ≈145 при 166 внутри */
@media (max-width:992px){ .eshop .list .li .wrap .badge_free { white-space:nowrap; padding:2px 7px; gap:0; }
	.eshop .list .li .wrap .badge_free svg { display:none; } }

/* ══ [REG-DISCOUNT 2026-09-07, решения Димы 06.09 → макет → критика 5 ролей → фактчек 07.09 → «приступай»] «СКИДКА ЗА ВХОД» ══
   Дом: docs/checkout-rebuild/regdiscount-2026-09-06.md (§6 решения, §7 тексты, §8 фактчек), DECISIONS REG-DISCOUNT, DESIGN-CONTRACT §3.
   1. Карточка выгоды на карточке товара (view_regdisc_card) = 1:1 .q-restored оформления (checkout_v2.css:110): flex gap 10,
      рамка 1.5 --q-brand, подложка --q-soft, r12, 12/14, 13.5/1.45, SVG brand. Суммы чернилами 700 (brand на soft 3,1:1 — та же
      ловушка, что на письмах 05.09). Подсказка 12.5 --q-ink2. Кнопка — рамочная акцентная (.filter_btn: 1.5 brand, текст brand 15/700,
      r11, 44) ВО ВСЮ ШИРИНУ; ховер на подложке — рамка/текст --q-deep (фон card остаётся: soft на soft невидим). Легаси плашка
      .discount_text (cont.css:153) в новом слое не печатается (PHP), её правила не трогаем — off-мир. */
.eshop .show .regdisc { display:flex; gap:10px; align-items:flex-start; margin:10px 0 12px; padding:12px 14px; box-sizing:border-box;
	border:1.5px solid var(--q-brand, #0894D4); background:var(--q-soft, #E9F7FD); border-radius:14px; /* [13.09 решение Димы «а»] было 12 — единственное такое значение на карточке: в вертикали панели покупки кнопки-рамки 11 (контракт), «Купити» 14 (контракт), крупные карточки 16; 12 ни из одного ряда. Стало 14 — в панели два радиуса вместо трёх */
	font-size:13.5px; line-height:1.45; color:var(--q-ink, #202c38); font-family:var(--q-serif, "Open Sans", -apple-system, sans-serif); }
.eshop .show .regdisc > svg { flex:none; margin-top:2px; color:var(--q-brand, #0894D4); }
.eshop .show .regdisc .regdisc_body { flex:1 1 auto; min-width:0; }
.eshop .show .regdisc .regdisc_text { display:block; }
.eshop .show .regdisc .regdisc_text b { color:var(--q-ink, #202c38); font-weight:700; white-space:nowrap; }
.eshop .show .regdisc .regdisc_hint { display:block; margin-top:5px; color:var(--q-ink2, #5E6B76); font-size:12.5px; }
.eshop .show .regdisc a.regdisc_btn { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; box-sizing:border-box;
	min-height:44px; margin-top:10px; padding:0 14px; border:1.5px solid var(--q-brand, #0894D4); border-radius:11px;
	background:var(--q-card, #fff); color:var(--q-brand, #0894D4); font-size:15px; font-weight:700; line-height:1.2; text-decoration:none;
	text-align:center; /* перенесённая подпись на 320 — по центру, а не рваным левым краем (класс, дизайн-критик BL-13 08.09 Д1: та же кнопка в шторке) */ }
.eshop .show .regdisc a.regdisc_btn svg { flex:none; }
@media (hover:hover) and (pointer:fine) { .eshop .show .regdisc a.regdisc_btn:hover { border-color:var(--q-deep, #056CB0); color:var(--q-deep, #056CB0); } }
.eshop .show .regdisc a.regdisc_btn:focus-visible { outline:none; box-shadow:0 0 0 3px rgba(15,174,227,.2); }
/* 2. Подпись вошедшему у перечёркнутой цены (view_show_price) — 1:1 «Відправимо…» (.buy_notes .note: 13.5/700 --q-ok + SVG);
      хвост «вигода N грн» тем же цветом, чтобы строка читалась одним статусом */
.eshop .show .wrap_price .regdisc_mine { display:flex; align-items:center; gap:8px; margin:-4px 0 0; padding-bottom:12px; font-size:13.5px; line-height:1.4;
	color:var(--q-ok, #168A4E); font-weight:700; }
/* легаси-коробка цены фиксирована (cont.css:163 height:72 / line-height:70), отзывы прибиты к её низу (cont.css:209 absolute bottom:12) —
   подпись вылезала под кнопку «Купити», а с ростом коробки отзывы съезжали на подпись (прогоны 07.09). Растим коробку только когда
   подпись есть, отзывы держим на строке цены. Класс has_regdisc ставит сервер (view_show.php по is_regdisc) — без :has(),
   ревью 07.09 №4: у коробки нет overflow:hidden, в браузере без :has подпись легла бы поверх кнопки */
.eshop .show .wrap_price.has_regdisc { height:auto; min-height:72px; }
.eshop .show .wrap_price.has_regdisc .review { bottom:auto; top:45px; }
.eshop .show .wrap_price .regdisc_mine svg { flex:0 0 auto; color:var(--q-ok, #168A4E); }
/* 3. Чип «після входу» на плитке (view_regdisc_chip, внутри hole-punch) — форма чипа доставки (.badge_free: 12/600, r99, 2/9),
      цвета --q-deep на --q-soft (язык пилюли «Новинка» П2); в колонке плитки — после отзывов (order:1) и доставки (order:2) */
.eshop .regdisc_chip { display:inline-flex; align-items:center; gap:4px; font-size:12px; font-weight:600; line-height:1.4;
	color:var(--q-deep, #056CB0); background:var(--q-soft, #E9F7FD); border-radius:99px; padding:2px 9px; white-space:nowrap; }
.eshop > .list > .li > .wrap > .regdisc_chip { order:3; margin:8px 0 0; align-self:flex-start; }
@media (max-width:992px){ .eshop .list .li .wrap .regdisc_chip { padding:2px 7px; gap:0; }
	.eshop .list .li .wrap .regdisc_chip svg { display:none; } }


/* ══ [BL-11 STICKY-HEADER — стройка 09.09; решения Димы 07–09.09 живьём на песочнице (DESIGN-FLOW), дом docs/checkout-rebuild/sticky-header-2026-09-07.md] ЛИПКАЯ ШАПКА + ПОЛОСКА ══
   Липнет сам #lay_header (position:sticky): родители #lay_footer_wrap/body/html без overflow — HTML и page-кэш не трогаются; страница оформления /basket/ —
   свой лейаут (.cq-header), не задета. Телефон ≤900 — «M1» (решение 07.09): вся шапка 106 липкая всегда. ПК ≥901 — «б» как у eMAG (решение 08.09):
   top:-30 (тёмная полоса уходит за верх), белая строка 72 липкая; при прокрутке (body.q-stuck ставит popup_v2.js при scrollY > 30) полоса категорий
   уезжает под белую строку (коробка шапки прежняя → контент не прыгает; освободившиеся 48 px под строкой кликаются — pointer-events; visibility —
   чтобы спрятанные ссылки полосы не ловила клавиатура), в белой строке появляется ☰ (наверху слот схлопнут, логотип у края — как у eMAG:
   x 110 → 160, у нас 30 → 98), по ☰ — шторка телефона (ниже). Граница шапки — полоска 3 px по нижней кромке белой строки ВМЕСТО тени
   (решение 08.09 «делаем два гребня» по рекомендации дизайнера): deep → sky 25 % → deep 50 % → sky 75 % → deep, в процентах — одна картинка на любой
   ширине (период в px давал на 390 обрыв); телефон всегда, ПК только в прилипшем состоянии (наверху под белой строкой сразу синяя полоса).
   scroll-padding-top — якоря/scrollIntoView не под шапку; потребители высоты шапки (BarBuy, Tabs, offset ошибки формы) — window.luxHdrH (popup_v2.js).
   z-порядок: шапка 30 < .barbuy 1000 (низ) < .q-ovl 10040 < шапка при открытой шторке 10045. Только server mode (html.q-hdr2) — off-мир не липнет. */
html.q-hdr2 #lay_header .middle::after { content:""; position:absolute; left:0; right:0; bottom:0; height:3px; pointer-events:none;
	background:linear-gradient(90deg, var(--q-deep, #056CB0) 0%, var(--q-sky, #0FAEE3) 25%, var(--q-deep, #056CB0) 50%, var(--q-sky, #0FAEE3) 75%, var(--q-deep, #056CB0) 100%); }
@media (max-width:900px){
	html.q-hdr2 #lay_header { position:sticky; top:0; }
	html.q-hdr2 { scroll-padding-top:106px; }
}
@media (min-width:901px){
	html.q-hdr2 #lay_header { position:sticky; top:-30px; }
	html.q-hdr2 { scroll-padding-top:72px; }
	html.q-hdr2 #lay_header .middle { position:relative; }
	html.q-hdr2 #lay_header .middle::after { opacity:0; transition:opacity .2s ease; }
	html.q-hdr2 body.q-stuck #lay_header .middle::after { opacity:1; }
	/* полоса категорий при прокрутке — под белую строку (z 2 > z 1, белый фон); visibility с задержкой на длину анимации */
	html.q-hdr2 body:not(.basket) #lay_header .bottom { transition:transform .2s ease, visibility 0s linear 0s; }
	html.q-hdr2 body.q-stuck:not(.basket) #lay_header .bottom { transform:translateY(-48px); visibility:hidden; transition:transform .2s ease, visibility 0s linear .2s; }
	html.q-hdr2 body.q-stuck #lay_header { pointer-events:none; }
	html.q-hdr2 body.q-stuck #lay_header .top, html.q-hdr2 body.q-stuck #lay_header .middle { pointer-events:auto; }
	/* ☰: наверху слот схлопнут (width 0, зазор флекса 24 съеден отрицательным полем), в прилипшем состоянии — мишень 44.
	   ⚠ Специфичность равна общему правилу ☰ (блок «☰ — легаси-узел .menu_btn в белой строке» выше, width:44) — побеждает порядком: секцию STICKY-HEADER
	   не переносить выше него (ревью 09.09 №8); перестановку ловит смок «BL-11 ПК наверху: ☰ схлопнут» */
	html.q-hdr2 #lay_header .middle .menu_btn { width:0; margin-right:-24px; opacity:0; overflow:hidden; pointer-events:none; visibility:hidden; transition:width .2s ease, margin .2s ease, opacity .15s ease, visibility 0s linear .2s; } /* visibility — схлопнутый слот не ловит Tab */
	html.q-hdr2 body.q-stuck #lay_header .middle .menu_btn { width:44px; margin-right:0; opacity:1; pointer-events:auto; visibility:visible; transition:width .2s ease, margin .2s ease, opacity .15s ease, visibility 0s linear 0s; }
	/* выпадашки полосы категорий — ТОЛЬКО по клику (решение Димы 07.09: наведение «так никто не делает, раздражает»; вариант «задержка + клик»
	   отброшен); легаси li:hover ul.level_2 {display:block !important} (style.css:123) гасится той же силой, класс li.q-open ставит popup_v2.js */
	html.q-hdr2 #lay_header .menu_catalog ul.level_1 li:hover ul.level_2 { display:none !important; }
	html.q-hdr2 #lay_header .menu_catalog ul.level_1 li.q-open ul.level_2 { display:block !important; }
	html.q-hdr2 #lay_header .menu_catalog ul.level_1 > li:hover > a:after { transform:none; }
	html.q-hdr2 #lay_header .menu_catalog ul.level_1 > li.q-open > a:after { transform:rotate(180deg); }
	/* ── шторка на ПК = шторка телефона (идея Димы 07.09 «шторка как на телефоне», решение «б» 08.09): узел .menu_mob под .middle (внутри .bottom его
	   клипует/сдвигает transform полосы) — popup_v2.js; панель под белой строкой у левого края сетки, 360, тень окон; вход и языки едут в шторку
	   на время открытия и возвращаются в тёмную полосу (наверху страницы она живая). Затемнение .q-ovl.q-menu-ovl, Esc, клик по фону — как на телефоне ── */
	html.q-hdr2 #lay_header .middle .menu_mob { display:none; }
	html.q-hdr2 #lay_header .middle .menu_mob.opened { display:block; position:absolute; top:100%; left:2%; width:360px; max-width:none; margin-left:0; /* max-width/margin — перебить легаси style_mob ≤1280 (320, −3vw) */
		max-height:calc(100vh - 120px); max-height:calc(100dvh - 120px); overflow:auto; box-sizing:border-box; padding:0 0 12px; background:#fff;
		border-radius:0 0 16px 16px; box-shadow:0 24px 64px -12px rgba(8,30,46,.35); z-index:5; text-align:left; }
	html.q-hdr2 #lay_header .middle .menu_mob ul { margin:0; padding:6px 0 0; list-style:none; height:auto; display:block; }
	html.q-hdr2 #lay_header .middle .menu_mob ul li { float:none; flex:none; position:static; height:auto; margin:0; padding:0; text-align:left; }
	html.q-hdr2 #lay_header .middle .menu_mob ul li:before { display:none; }
	html.q-hdr2 #lay_header .middle .menu_mob ul li a, html.q-hdr2 #lay_header .middle .menu_mob .menu_main ul li a { display:flex; align-items:center; justify-content:flex-start; min-height:44px; height:auto; padding:4px 16px;
		font-size:15px; font-weight:600; line-height:1.3; color:var(--q-ink, #202c38); text-decoration:none; background:none; box-shadow:none; text-transform:none; }
	html.q-hdr2 #lay_header .middle .menu_mob ul li a:hover { background:var(--q-soft, #E9F7FD); color:var(--q-ink, #202c38); }
	html.q-hdr2 #lay_header .middle .menu_mob ul.level_1 li a .img { display:inline-block; position:relative; flex:none; width:26px; height:25px; overflow:hidden; margin-right:8px; }
	html.q-hdr2 #lay_header .middle .menu_mob ul.level_1 li a .img img { position:absolute; top:-24px; left:0; right:0; bottom:0; margin:auto; } /* спрайт: тёмный вариант значка (как в шторке телефона) */
	html.q-hdr2 #lay_header .middle .menu_mob .menu_main { display:block; position:static; }
	html.q-hdr2 #lay_header .middle .menu_mob .menu_main ul { padding-top:6px; border-top:1px solid var(--q-line, #E4E9EE); margin-top:6px; }
	/* вход (вошедший: имя · выйти) — строка с человечком; карточка гостя и языки — общий блок шторки выше (HEADER-MOBILE) */
	html.q-hdr2 #lay_header .middle .menu_mob .user .block { position:static; max-width:none; z-index:auto; display:flex; align-items:center; gap:8px; min-height:52px; padding:4px 16px; border-bottom:1px solid var(--q-line, #E4E9EE); }
	html.q-hdr2 #lay_header .middle .menu_mob .user .block:before { content:""; display:block; flex:none; width:24px; height:24px; background:var(--q-brand, #0894D4);
		-webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2.2" stroke-linecap="round"><circle cx="12" cy="8" r="4"/><path d="M4 20.5c0-4 3.6-6.5 8-6.5s8 2.5 8 6.5"/></svg>') center/contain no-repeat;
		mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23000" stroke-width="2.2" stroke-linecap="round"><circle cx="12" cy="8" r="4"/><path d="M4 20.5c0-4 3.6-6.5 8-6.5s8 2.5 8 6.5"/></svg>') center/contain no-repeat; }
	html.q-hdr2 #lay_header .middle .menu_mob .user .block .logged_on .name, html.q-hdr2 #lay_header .middle .menu_mob .user .block .logged_on .logout { float:none; display:inline-flex; align-items:center; min-height:44px; height:auto; max-width:none; padding:0; margin:0; border:0; border-radius:0;
		background:none; font-size:15px; font-weight:600; line-height:1.3; color:var(--q-ink, #202c38); white-space:normal; overflow:visible; }
	html.q-hdr2 #lay_header .middle .menu_mob .user .block .logged_on .name:before, html.q-hdr2 #lay_header .middle .menu_mob .user .block .logged_on .name:after { display:none; } /* значок и шеврон пилюли тёмной полосы — не в шторке */
	html.q-hdr2 #lay_header .middle .menu_mob .user .block .logged_on { display:flex; align-items:center; gap:14px; }
	html.q-hdr2 #lay_header .middle .menu_mob .user .block .logged_on.q-umenu-on > .logout { display:inline-flex; } /* в тёмной полосе «Вийти» прячет меню имени; в шторке меню скрыто — «Вийти» строкой */
	html.q-hdr2 #lay_header .middle .menu_mob .user .block .logged_on .logout { color:var(--q-ink2, #5E6B76); font-weight:400; }
	/* гость: та же компактная карточка, что на телефоне (общий блок HEADER-MOBILE) — строка-флекс с человечком выше её перебивала (специфичность .middle) */
	html.q-hdr2 #lay_header .middle .menu_mob .user .block.guest { display:block; min-height:0; padding:12px 16px 10px; }
	html.q-hdr2 #lay_header .middle .menu_mob .user .block.guest:before { display:none; }
	html.q-hdr2 #lay_header .middle .menu_mob .wrap_lang .menu_lang ul { padding:0; border:0; margin:0; }
	/* открытая шторка: шапка выше затемнения, кликабелен только ✕ (закон окна §4, как на телефоне) */
	html.q-hdr2 body.q-menu-open #lay_header { z-index:10045; }
	html.q-hdr2 body.q-menu-open #lay_header .middle .lay_site > :not(.menu_btn) { pointer-events:none; }
}
/* [решение Димы 09.09, вопрос 5 блица: заголовок каталога на ноуте СЛЕВА — класс: заголовки страниц каталога — хаб (#lay_right .context_top h1)
   и раздел (#lay_right > h1, list_eshop); имя товара на карточке (.eshop .show h1) — не заголовок каталога, не трогаем (ревью 09.09 №4).
   Легаси style_cont.css:17 «h1 {text-align:center}», телефон ≤768 у style_mob уже слева, полоса 769–900 была по центру — одно правило на все ширины] */
html.q-hdr2 #lay_right > h1, html.q-hdr2 #lay_right .context_top h1 { text-align:left; }
@media (min-width:901px) and (max-width:992px){
	/* ☰ виден всегда (категории не влезают, синяя полоса не печатается — HEADER-V2 выше; наверху страницы каталог иначе не открыть) */
	html.q-hdr2 #lay_header .middle .menu_btn, html.q-hdr2 body.q-stuck #lay_header .middle .menu_btn { width:44px; margin-right:0; opacity:1; pointer-events:auto; visibility:visible; }
	html.q-hdr2 #lay_header .middle::after { opacity:1; } /* полоска и наверху: синей полосы под белой строкой здесь нет — без неё у шапки не было бы края (ревью 09.09 №2) */
	/* строка 44+183+300+151+44+44 + 5×24 = 886 > сетки 865 на 901 → зазор 16 и пол поля 300 (обмер 07.09: 846 ≤ 865) */
	html.q-hdr2 #lay_header .middle .lay_site { gap:16px; }
	html.q-hdr2 #lay_header .search { min-width:300px; }
}
@media (prefers-reduced-motion:reduce){
	html.q-hdr2 body:not(.basket) #lay_header .bottom, html.q-hdr2 #lay_header .middle .menu_btn, html.q-hdr2 #lay_header .middle::after { transition:none; }
}
/* ── [BL-20 ХАБ + BL-11, стройка 09.09] строки категорий в шторке (main/view_menu_drawer.php): категория = ссылка на хаб, «›» справа (решение 3 блица 09.09:
   8×8, 2px --q-ink2 — шеврон аккордеона фильтра, повёрнутый вправо; right 18, padding-right 44), «вы здесь» — brand + aria-current (класс active с сервера),
   нажатая строка — подложка --q-soft + чернила 600 (решение 6: 12,98:1; на телефоне 400 → 600, на ПК от ховера отличается только временем жизни —
   держится до перехода, li.q-going ставит popup_v2.js). Нажатое сильнее «вы здесь» по порядку при равной специфичности. overscroll — как у окон ── */
html.q-hdr2 #lay_header .menu_mob.opened { overscroll-behavior:contain; }
html.q-hdr2 #lay_header .menu_mob ul.level_1 > li > a.q-hub-link { position:relative; padding-right:44px; }
html.q-hdr2 #lay_header .menu_mob ul.level_1 > li > a.q-hub-link::after { content:""; position:absolute; right:18px; top:50%; width:8px; height:8px; border:2px solid var(--q-ink2, #5E6B76); border-left:0; border-top:0; transform:translateY(-50%) rotate(-45deg); }
html.q-hdr2 #lay_header .menu_mob ul.level_1 > li > a.q-hub-link.active { color:var(--q-brand, #0894D4); }
html.q-hdr2 #lay_header .menu_mob ul.level_1 > li > a.q-hub-link:active, html.q-hdr2 #lay_header .menu_mob ul.level_1 > li.q-going > a.q-hub-link { background:var(--q-soft, #E9F7FD); color:var(--q-ink, #202c38); font-weight:600; }


/* ══ [HOME-FOOTER 2026-09-11 — принято Димой живьём («принимаю»); петля DESIGN-FLOW, эскизы 11.09] ГЛАВНАЯ + ПОДВАЛ ══
   Дом решений: docs/checkout-rebuild/home-footer-2026-09-11.md (что решено, что отклонено, разбор рынка, ревизия дизайнера и покупателя).
   Секция живёт в popup_v2.css → грузится только в server mode: в off-мире витрина остаётся легаси целиком (подвал #lay_footer, плитки категорий,
   прежние отступы) — гейт тот же, что у всей новой оболочки. Временный переключатель ?lux= / cookie lux_hf снят после приёмки. */
/* 1. Плитки категорий под баннером — снять (решение Димы 11.09; дубль синей полосы шапки, 1446 px на телефоне); ?lux=…,cats возвращает для сравнения */
.home .categories { display:none; }
/* 1а. Воздух между блоками главной (замечание Димы 11.09 «слишком большие отступы» + обмер дизайнера): было баннер→хиты 60, между лентами 55,
      а заголовок→плитки 50 — зазор ВНУТРИ группы почти равен зазору МЕЖДУ группами (1:1,1), заголовок «плавает» и не читается как шапка ленты.
      Ставим шаг крупных блоков нового слоя (48 ПК / 32 телефон — тот же, что у подвала) и отступ заголовка 30/20 = 1:1 со страницей бренда
      (контракт §3: «над сеткой блок лого + h2, 30 px до плиток»). Соотношение становится 1:1,6, как у eMAG (обмер: 40 и 20). */
.home .slider { margin-bottom:48px; }
.home .eshop_hit, .home .eshop_new, .home .eshop_stock { margin-bottom:48px; }
.home .short { padding-bottom:0; margin-bottom:0; }
.home .short .title { margin-bottom:30px; }
@media (max-width:900px){
	.home .slider { margin-bottom:32px; }
	.home .eshop_hit, .home .eshop_new, .home .eshop_stock { margin-bottom:32px; }
	.home .short .title { margin-bottom:20px; }
	.home .short .list { margin-bottom:0; }
}
/* 2. Подвал v2 вместо легаси: легаси-подвал висит на трюке «reserved 444 + margin-top:-444» (style.css:164-166, 270 на ≤768) — сбрасываем оба */
#lay_footer { display:none; }
#lay_footer_wrap .reserved { height:0; }
#lay_footer2 { display:block; }
/* 2а. ПОДВАЛ (вариант A после ревизии дизайнера и покупателя 11.09; замечания Димы «аппендицит», «растянутый», «тяп-ляп»):
      белый, одна линия сверху (приём «линия вместо тени», §1 контракта); ПК — ТРИ равные колонки + полоса доверия во всю ширину
      (четвёртая колонка расформирована: 148 px чернил в коробке 308); иерархия по рынку (Rozetka: подпись тише ссылок) —
      заголовок 13/600 ink2, ссылка 15/400 ink; общий ритм строк 30 у ссылок, телефонов, мессенджеров и почты. */
.q-foot { margin-top:48px; background:var(--q-card, #fff); border-top:1px solid var(--q-line, #E4E9EE); color:var(--q-ink, #202c38);
	font-family:var(--q-serif, "Open Sans", -apple-system, sans-serif); font-size:15px; line-height:20px; }
.q-foot .q-foot-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:20px 32px; padding:32px 0 24px; box-sizing:border-box; }
.q-foot .q-fcol { min-width:0; }
.q-foot .q-ftitle { display:block; margin:0 0 10px; padding:0; font-size:13px; font-weight:600; line-height:18px; color:var(--q-ink2, #5E6B76); }
.q-foot ul { list-style:none; margin:0; padding:0; }
.q-foot li { margin:0; padding:0; background:none; }
.q-foot li::before { content:none; display:none; }
.q-foot .q-fcol li a { display:inline-block; padding:5px 0; font-size:15px; line-height:20px; color:var(--q-ink, #202c38); text-decoration:none; }
.q-foot .q-ftel p { margin:0; }
.q-foot .q-ftel br { display:none; } /* админ-текст footer_tel.html держит <br> между номерами — при блочных ссылках это лишняя пустая строка */
/* мишень по чернилам, а не во всю колонку (было 44×369 — невидимый «позвонить» поверх пустоты); ритм 30, как у ссылок */
.q-foot .q-ftel a { display:block; width:max-content; max-width:100%; padding:5px 0; font-size:16px; font-weight:600; line-height:20px; color:var(--q-ink, #202c38); text-decoration:none; }
.q-foot .q-fhours { display:flex; align-items:center; gap:8px; margin:6px 0 8px; font-size:13.5px; line-height:19px; color:var(--q-ink2, #5E6B76); }
.q-foot .q-fhours svg { flex:none; }
.q-foot .q-fhours p { display:inline; margin:0; }
.q-foot .q-fhours p + p::before { content:" · "; }   /* админ-текст «Подвал - время работы» приходит двумя <p> (Пн-Пт… / Сб-Нд…) — одна строка */
.q-foot .q-fmsg { padding:0; font-size:15px; line-height:20px; color:var(--q-ink2, #5E6B76); }
.q-foot .q-fmsg a { display:inline-block; padding:5px 0; color:var(--q-deep, #056CB0); font-weight:600; text-decoration:none; } /* deep 5,56:1 (brand давал 3,39 — ниже нормы для 15px) */
.q-foot .q-fmail { display:block; width:max-content; max-width:100%; padding:5px 0; font-size:15px; line-height:20px; color:var(--q-ink, #202c38); text-decoration:none; }
/* полоса доверия: карты слева, соцсети справа — как нижняя линия Rozetka/Comfy/eMAG, вместо полупустой четвёртой колонки */
/* правый край нижней полосы — запретная зона: там живут плавающие кнопки «наверх» и звонок (обмер 1440: круг x1364–1412; 390: x322–374).
   Без запаса значки соцсетей оказывались ПОД кругами на всех трёх ширинах (скрин v2_pc1440 / v2_w860_open 11.09) */
.q-foot .q-fcol-trust { grid-column:1 / -1; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 24px;
	margin-top:4px; padding:16px var(--q-fab-keepout, 68px) 0 0; border-top:1px solid var(--q-line, #E4E9EE); }
.q-foot .q-ftrust-pays, .q-foot .q-ftrust-soc { display:flex; align-items:center; gap:12px; }
.q-foot .q-ftitle-s { margin:0; }
.q-foot .q-fpays { display:flex; align-items:center; gap:12px; }
.q-foot .q-fpays img { display:block; height:22px; width:auto; }
.q-foot .q-fsoc { display:flex; flex-wrap:wrap; gap:2px; margin:0 -10px 0 0; }
.q-foot .q-fsoc a { display:flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:11px; color:var(--q-ink2, #5E6B76); }
.q-foot .q-fsoc svg { width:24px; height:24px; fill:currentColor; }
.q-foot .q-fbottom { border-top:1px solid var(--q-line, #E4E9EE); }
.q-foot .q-fbottom .lay_site { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:4px 14px; padding:12px 10px 10px; box-sizing:border-box;
	font-size:12.5px; line-height:1.4; color:var(--q-ink2, #5E6B76); text-align:center; }
.q-foot details.q-fcol > summary { list-style:none; cursor:default; }   /* ПК: summary = обычный заголовок колонки, без шеврона и без клика */
.q-foot details.q-fcol > summary::-moz-list-bullet { list-style-type:none; }
.q-foot details.q-fcol > summary::-webkit-details-marker { display:none; }
.q-foot details.q-fcol > summary::marker { content:""; }
@media (hover:hover) and (pointer:fine){
	.q-foot .q-fcol li a:hover, .q-foot .q-ftel a:hover, .q-foot .q-fmail:hover, .q-foot .q-fmsg a:hover { color:var(--q-deep, #056CB0); }
	.q-foot .q-fsoc a:hover { background:var(--q-soft, #E9F7FD); color:var(--q-brand, #0894D4); }
}
.q-foot a:focus-visible { outline:none; box-shadow:0 0 0 3px rgba(15,174,227,.45); border-radius:6px; }
/* телефон и планшет ≤900 — один список строк 44 (закон строк шторки меню): «Контакти ›» ссылкой, две группы аккордеоном, почта строкой,
   полоса доверия одной строкой. Номера, часы и мессенджеры НЕ печатаются: те же три номера, часы и Viber/Telegram лежат в окне плавающей
   кнопки звонка (Б22 CALL-FAB) — подвал их дублировал и давал 279 из 552 px («растянутый»). Почта остаётся: в окне звонка её нет. */
@media (max-width:900px){
	.q-foot { margin-top:32px; }
	.q-foot .q-foot-grid { grid-template-columns:1fr; gap:0; padding:0 0 8px; }
	/* решение Димы 11.09: контакты — такой же свёрнутый раздел, внутри номера, часы, мессенджеры, почта (мишени 44) */
	.q-foot .q-fcol-contact .q-ftel a { min-height:44px; display:flex; align-items:center; padding:0; }
	.q-foot .q-fcol-contact .q-fhours { margin:2px 0 2px; min-height:32px; }
	.q-foot .q-fmsg a { min-width:44px; min-height:44px; padding:12px 0; box-sizing:border-box; }
	.q-foot .q-fmail { display:flex; align-items:center; width:auto; min-height:44px; padding:0; box-sizing:border-box; }
	.q-foot .q-fcol-contact > *:not(summary):last-child { margin-bottom:8px; }
	.q-foot details.q-fcol { border-bottom:1px solid var(--q-line, #E4E9EE); }
	.q-foot details.q-fcol > summary { position:relative; display:flex; align-items:center; min-height:44px; margin:0; padding:0 40px 0 0; cursor:pointer;
		font-size:15px; font-weight:600; color:var(--q-ink, #202c38); }
	.q-foot details.q-fcol > summary::after { content:""; position:absolute; right:16px; top:50%; width:8px; height:8px; border:2px solid var(--q-ink2, #5E6B76); border-left:0; border-top:0;
		transform:translateY(-70%) rotate(45deg); transition:transform .2s ease; }
	.q-foot details.q-fcol[open] > summary::after { transform:translateY(-20%) rotate(-135deg); }
	.q-foot details.q-fcol ul { padding:0 0 8px; }
	.q-foot .q-fcol li a { display:block; min-height:44px; padding:12px 0; box-sizing:border-box; }
	.q-foot .q-fcol-trust { margin-top:0; padding:6px var(--q-fab-keepout, 68px) 0 0; border-top:0; }
	.q-foot .q-ftitle-s { display:none; } /* подписи ≤900 рвут строку: «Ми в мережі» уезжала к правому краю, её значки — на следующую */
	/* отрицательного поля справа тут быть не может: сетка .lay_site = 96 % ширины, значок вылезал за экран (проба: scrollWidth 392 при 390).
	   Оптический край держим паддингом самого значка — рисунок 24 в мишени 44 и так отстоит от края на 10 */
	.q-foot .q-fsoc { margin:0; }
	/* низ страницы живёт под плавающими кнопками (звонок 52 + «наверх») — зазор, иначе копирайт слипается с кругом (обмер: 3,5 px) */
	.q-foot .q-fbottom .lay_site { padding:12px 10px calc(20px + env(safe-area-inset-bottom, 0px)); }
	.q-foot .q-fbottom .slogan { display:block; }
	.q-foot .q-fbottom .cop { padding-right:var(--q-fab-keepout, 68px); }
	.q-foot .q-fbottom .slogan .dash { display:none; }   /* [редактор] на 390 слоган уходит на вторую строку и она начиналась с тире */
}
/* 2б/2в. Варианты B «компакт» и C «как eMAG» показаны 11.09 и сняты Димой («к чему этот вариант… просто так, чтобы было») — правила удалены,
       в ревизию идёт только A; метки foot-b/foot-c больше ничего не включают */
/* 3. Полоса фактов над подвалом главной — показана в превью 11.09 и снята решением Димы («этот блок тут лишний»); правила и HTML удалены */
/* 3а. СИНИЙ БЛОК SEO-ТЕКСТА внизу главной — сжат; цвет оставлен синим (решение Димы 11.09 живьём из двух вариантов: «оставляем синий как сейчас»).
   Было (обмер дизайнера): 516 px и на 1440, и на 390 — полэкрана текста перед подвалом; маска-градиент 120 px рвала текст посреди слова;
   «Читати більше →» — мишень 111×22 на ПК и та самая стрелка-символ (main/style.css:34), которую мы убрали из подвала.
   Стало: текст режется на 260, маска 64, ссылка 15/600 с подчёркиванием и мишенью 44 без стрелки → блок 316. */
.home .text_pic .text_seo { max-height:260px; margin:28px 0; }
.home .text_pic .text_seo.opened { max-height:none; }
.home .text_pic .text_seo .mask { height:64px; background-image:linear-gradient(0deg, #056CB0 35%, rgba(5,108,176,0) 100%); }
.home .text_pic .text_seo .mask a { display:inline-flex; align-items:center; min-height:44px; padding:0 2px 0 0;
	font-size:15px; font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.home .text_pic .text_seo .mask a:after { content:none; }
/* 4. Подсветка названия товара при наведении (только мышь): цвет deep — 5,56:1 на белом и не совпадает с ценой (--q-price = brand);
      brand 3,39:1 для 14 px мал. nm-tile — при наведении на всю плитку (фото и имя — разные ссылки, cont.css:71); nm-name — только на имя.
      Специфичность (0,6,2)/(0,6,3) перебивает легаси-гаситель .eshop .list .li .wrap .name:hover (cont.css:75) */
/* Решение Димы 11.09 живьём: подсветка — при наведении на само название, как у Rozetka, не на всю карточку (метка nm-tile снята; действует при любой метке превью) */
.eshop .list .li .wrap .name { transition:color .15s ease; }
@media (hover:hover) and (pointer:fine){
	.eshop .list .li .wrap .name:hover { color:var(--q-deep, #056CB0); }
}
