/* QW Menu (26.10.2026) — меню для < 1200px, варіант A1 «журнальний». Скло — як у хедера: rgba(255,255,255,.3) + blur(30px). */
.qwm{position:fixed;left:0;right:0;top:var(--qwm-top,56px);bottom:0;z-index:998;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
	background:rgba(255,255,255,.3);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);border-top:1px solid rgba(17,17,17,.08);
	color:#111;font-family:Montserrat,Arial,sans-serif;opacity:0;transition:opacity .22s ease}
.qwm[hidden]{display:none}
.qwm.is-open{opacity:1}
.qwm::-webkit-scrollbar{display:none}
.qwm-in{max-width:640px;margin:0 auto;padding:6px 22px calc(28px + env(safe-area-inset-bottom,0px))}

.qwm-it{display:flex;width:100%;align-items:baseline;justify-content:space-between;gap:12px;margin:0;padding:12px 0;border:0;border-bottom:1px solid rgba(17,17,17,.12);
	background:none;color:#111;text-align:left;text-decoration:none;cursor:pointer;font:inherit;-webkit-tap-highlight-color:transparent}
.qwm-it b{font-size:21px;font-weight:600;letter-spacing:-.01em;line-height:1.15;text-transform:uppercase}
.qwm-it em{flex:none;min-width:14px;font-size:12px;font-style:normal;font-weight:600;text-align:right;opacity:.55}
button.qwm-it em:before{content:"+"}
button.qwm-it[aria-expanded="true"] em:before{content:"—"}
button.qwm-it[aria-expanded="true"] b{font-weight:800}
.qwm-tag{display:inline-block;margin-left:8px;padding:3px 6px;background:#111;color:#fff;font-size:9px;font-weight:700;letter-spacing:.12em;vertical-align:middle;line-height:1.2}

.qwm-subs{display:grid;grid-template-columns:1fr 1fr;gap:11px 14px;padding:12px 0 16px;border-bottom:1px solid rgba(17,17,17,.12)}
.qwm-subs[hidden]{display:none}
.qwm-subs a{display:flex;align-items:center;gap:7px;color:#111;font-size:13px;font-weight:500;line-height:1.3;text-decoration:none}
.qwm-subs a:before{content:"";flex:none;width:10px;height:1px;background:#111;opacity:.5}
.qwm-grp{grid-column:1/-1}
.qwm-gk{display:grid;grid-template-columns:1fr 1fr;gap:9px 14px;margin-top:9px;padding-left:17px}
.qwm-subs a.qwm-g{font-size:12px;opacity:.8}
.qwm-subs a.qwm-g:before{width:6px}
.qwm-subs a.qwm-all{font-weight:700}

.qwm-pop{padding-top:20px}
.qwm-pop h4{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 10px;color:#111;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.qwm-pop h4 a{color:#111;font-weight:600;letter-spacing:.06em;text-transform:none;opacity:.7}
.qwm-row{display:flex;gap:10px;margin:0 -22px;padding:0 22px 4px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:22px;scrollbar-width:none}
.qwm-row::-webkit-scrollbar{display:none}
.qwm-pc{flex:0 0 118px;scroll-snap-align:start;color:#111;font-size:11px;font-weight:600;line-height:1.3;text-decoration:none}
.qwm-pc i{display:block;width:118px;height:148px;margin-bottom:7px;overflow:hidden;background:#f4f3ef}
.qwm-pc img{display:block;width:100%;height:100%;object-fit:cover}
.qwm-pc span{display:block;font-weight:500;opacity:.7}

.qwm-foot{display:flex;gap:18px;padding-top:22px;font-size:12px;font-weight:600}
.qwm-foot a{color:#111;text-decoration:none;border-bottom:1px solid rgba(17,17,17,.35)}

/* поява пунктів */
.qwm.is-open .qwm-nav > *{animation:qwmIn .32s ease both}
.qwm.is-open .qwm-nav > :nth-child(2){animation-delay:.03s}
.qwm.is-open .qwm-nav > :nth-child(3){animation-delay:.06s}
.qwm.is-open .qwm-nav > :nth-child(4){animation-delay:.09s}
.qwm.is-open .qwm-nav > :nth-child(5){animation-delay:.12s}
.qwm.is-open .qwm-nav > :nth-child(n+6){animation-delay:.15s}
@keyframes qwmIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.qwm,.qwm.is-open .qwm-nav > *{transition:none;animation:none}}

/* поки меню відкрите: сторінка не прокручується; липка панель товару, іконка KeyCRM і «нагору» — сховані (у них шар вищий за хедер) */
html.qwm-open,html.qwm-open body{overflow:hidden}
html.qwm-open .qwp-sbar,html.qwm-open #keycrm-social-buttons,html.qwm-open #totop,html.qwm-open #qw-sn{visibility:hidden!important} /* #qw-sn — чорна плашка доставки, темніла крізь скло */

/* своя кнопка ☰ на телефоні — у вільному місці ліворуч від логотипа (0–48px), на всю висоту хедера */
.qwm-btn{display:none}
@media (max-width:768px){
	.qwm-btn{display:flex;flex-direction:column;justify-content:center;gap:5px;position:fixed;left:0;top:0;z-index:1000;width:48px;height:50px;margin:0;padding:0 14px;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
	.qwm-btn i{display:block;width:20px;height:2px;background:#111;transition:opacity .15s}
}
html.qwm-open .qwm-btn i{opacity:0}
html.qwm-open .qwm-btn::before,html.qwm-open .qwm-btn::after{content:"";position:absolute;left:50%;top:50%;width:22px;height:2px;margin:-1px 0 0 -11px;background:#111;transform:rotate(45deg)}
html.qwm-open .qwm-btn::after{transform:rotate(-45deg)}

/* зона натискання ☰ на телефоні — на всю висоту хедера (було 30×30, промахи йшли в логотип); іконка лишається на місці */
body.qwm-on #responsive-menu-pro-button{top:0!important;left:0!important;width:48px!important;height:50px!important;padding:0!important;box-sizing:border-box!important}

/* ✕ на кнопці ☰, поки меню відкрите — своїм CSS: Responsive Menu Pro сам знімає свій is-active при кліку поза його меню */
html.qwm-open :is(#responsive-menu-pro-button,#zn-res-trigger){position:relative}
html.qwm-open #responsive-menu-pro-button{position:fixed}
html.qwm-open :is(#responsive-menu-pro-button,#zn-res-trigger) > *{opacity:0!important}
html.qwm-open :is(#responsive-menu-pro-button,#zn-res-trigger)::before,
html.qwm-open :is(#responsive-menu-pro-button,#zn-res-trigger)::after{content:"";position:absolute;left:50%;top:50%;width:22px;height:2px;margin:-1px 0 0 -11px;background:#111;transform:rotate(45deg)}
html.qwm-open :is(#responsive-menu-pro-button,#zn-res-trigger)::after{transform:rotate(-45deg)}

/* старі меню більше не відкриваються (кнопки перехоплює js/qw-menu.js) */
body.qwm-on #responsive-menu-pro-container{display:none!important}
@media (min-width:1200px){.qwm{display:none!important}}

/* Перемикач валют у хедері після WCML 5.6.3 (26.10.2026): кнопка стала <button> шириною 8px, а трикутник-стрілка вилазив ліворуч від «$».
   Тепер «$ ⌄» — та сама стрілка Glyphicons, що й у перемикачі мови. */
#header .wcml_currency_switcher,#header .wcml_currency_switcher ul,#header .wcml_currency_switcher li{width:auto!important;min-width:0}
#header .wcml_currency_switcher .wcml-cs-item-toggle{display:inline-flex;align-items:center;gap:4px;width:auto!important;padding:0 2px;border:0;background:none;color:#000;font:500 14px/1 Montserrat,Arial,sans-serif;cursor:pointer}
#header .wcml_currency_switcher .wcml-cs-item-toggle::after{content:"\e259";position:relative!important;inset:auto!important;top:1px!important;width:auto!important;height:auto!important;margin:0!important;border:0!important;color:#333;font:400 11px/1 "Glyphicons Halflings"}
#header .wcml_currency_switcher .wcml-cs-submenu button{display:block;width:100%;padding:8px 12px;border:0;background:#fff;color:#000;font:500 14px/1 Montserrat,Arial,sans-serif;text-align:left;cursor:pointer}