/*
 * Новая шапка (#ih, слои #ih-layers) и футер (#if) по макетам Header.dc.html / Footer.dc.html.
 * Разметка — template/ivanko/*.twig, поведение — js/ivanko-layout.js.
 * blue.css и responsive.css темы грузятся ПОСЛЕ addStyle, поэтому все правила висят на id
 * (#ih, #ih-layers, #if): только id-специфичность (1,x,x) надёжно перебивает тему.
 * blue.css:4268 прячет все svg правилом body svg { display: none } — у каждой иконки
 * .ih-i display задан явно.
 */
#ih, #ih-layers, #if {
	--ink: #15181C;
	--ink-2: #2E343B;
	--muted: #454B53;
	--muted-2: #656B74;
	--border: #E2E5E9;
	--border-input: #D5DAE0;
	--bg-subtle: #F3F5F7;
	--brand: #1B6FB3;
	--brand-hover: #124F82;
	--brand-tint: #EEF4FA;
	--brand-line: #C9DCEE;
	--cta: #FFB224;
	--cta-hover: #F5A00F;
	--ok: #1D9A55;
	--ok-text: #1D7A45;

	font-family: 'Golos Text', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
	font-size: 15px;
	line-height: 1.4;
	color: var(--ink);
	text-align: left;
	-webkit-font-smoothing: antialiased;
}
#ih *, #ih *::before, #ih *::after,
#ih-layers *, #ih-layers *::before, #ih-layers *::after,
#if *, #if *::before, #if *::after { box-sizing: border-box; }
#ih [hidden], #ih-layers [hidden], #if [hidden], #ih-layers[hidden] { display: none !important; }

#ih a, #ih-layers a, #if a { color: inherit; text-decoration: none; background: none; }
#ih a:hover, #ih-layers a:hover, #if a:hover { text-decoration: none; }
#ih button, #ih-layers button, #if button { font-family: inherit; cursor: pointer; margin: 0; text-transform: none; letter-spacing: normal; }
#ih button:focus-visible, #ih a:focus-visible, #ih-layers button:focus-visible, #ih-layers a:focus-visible,
#if button:focus-visible, #if a:focus-visible { outline: 3px solid rgba(27, 111, 179, .45); outline-offset: 2px; }
#ih p, #ih ul, #ih-layers p, #ih-layers ul { margin: 0; padding: 0; }
#ih img, #ih-layers img, #if img { max-width: none; }

/* Иконки: размер задаётся font-size, цвет — currentColor */
#ih .ih-i, #ih-layers .ih-i, #if .ih-i { display: block; flex: none; width: 1em; height: 1em; font-size: 20px; fill: currentColor; }
#ih .ih-i-22, #ih-layers .ih-i-22 { font-size: 22px; }
#ih .ih-i-24, #ih-layers .ih-i-24 { font-size: 24px; }
#ih .ih-i-26, #ih-layers .ih-i-26 { font-size: 26px; }
#ih .ih-i-brand, #ih-layers .ih-i-brand { color: var(--brand); }
#ih .ih-i-muted, #ih-layers .ih-i-muted { color: var(--muted); }

#ih .ih-wrap, #if .if-top { max-width: 1440px; margin: 0 auto; }
#ih .ih-wrap { padding-left: 64px; padding-right: 64px; }
#ih .ih-sp, #ih-layers .ih-sp { flex: 1; }

/* Статус часов: точка и текст */
#ih .ih-dot, #ih-layers .ih-dot, #if .ih-dot { display: block; flex: none; width: 7px; height: 7px; border-radius: 50%; background: #B4BBC3; }
#ih .is-open > .ih-dot, #ih-layers .is-open > .ih-dot, #if .is-open > .ih-dot { background: var(--ok); }
#ih .ih-st, #ih-layers .ih-st { display: flex; align-items: center; gap: 5px; min-width: 0; font-size: 12px; color: var(--muted-2); }
#ih .ih-st.is-open, #ih-layers .ih-st.is-open { color: var(--ok-text); }
#ih .ih-st > span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#ih .ih-pill, #ih-layers .ih-pill, #if .ih-pill { display: flex; align-self: flex-start; align-items: center; gap: 6px; height: 24px; padding: 0 8px; border-radius: 6px; background: #F1F3F5; font-size: 13px; font-weight: 500; color: var(--muted-2); }
#ih .ih-pill.is-open, #ih-layers .ih-pill.is-open, #if .ih-pill.is-open { background: #E8F5EE; color: var(--ok-text); }

/* ===== Контактная полоса ===== */
#ih { position: relative; z-index: 1000; background: #fff; }
#ih .ih-strip { background: var(--bg-subtle); border-bottom: 1px solid var(--border); }
#ih .ih-strip-in { display: flex; align-items: center; gap: 16px; height: 64px; }
#ih .ih-citywrap { position: relative; flex: none; }
#ih .ih-citybtn { display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 6px 0 8px; border: 1.5px solid var(--border-input); border-radius: 10px; background: #fff; color: var(--ink); }
#ih .ih-citybtn[aria-expanded="true"], #ih .ih-citybtn.is-attn { border-color: var(--brand); }
#ih .ih-citybtn-t { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.15; }
#ih .ih-citybtn-l { font-size: 11px; color: var(--muted-2); }
#ih .ih-citybtn-n { font-size: 16px; font-weight: 700; }

#ih .ih-depts { flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
#ih .ih-dept { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: 0 12px 0 14px; border-left: 1px solid var(--border-input); }
#ih .ih-dept-n { overflow: hidden; font-size: 12px; color: var(--muted); white-space: nowrap; text-overflow: ellipsis; }
#ih .ih-dept-r { display: flex; align-items: center; gap: 8px; min-width: 0; }
#ih .ih-dept-tel { flex: none; font-size: 17px; font-weight: 700; color: var(--ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
#ih .ih-dept-tel:hover, #ih .ih-mtel:hover, #ih .ih-stk-tel:hover { color: var(--brand-hover); }

#ih .ih-strip-acts { display: flex; flex: none; gap: 8px; }
#ih .ih-allbtn { display: flex; align-items: center; gap: 4px; height: 40px; padding: 0 12px 0 14px; border: 1.5px solid var(--brand-line); border-radius: 10px; background: #fff; font-size: 14px; font-weight: 600; color: var(--brand); }
#ih .ih-allbtn:hover, #ih .ih-allbtn[aria-expanded="true"] { background: var(--brand-tint); }
#ih .ih-allbtn[aria-expanded="true"] { border-color: var(--brand); }
#ih .ih-allbtn[aria-expanded="true"] .ih-i { transform: rotate(180deg); }
#ih .ih-iconbtn { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; }
#ih .ih-iconbtn-tg { background: var(--brand); color: #fff; }
#ih .ih-iconbtn-tg:hover { background: var(--brand-hover); color: #fff; }
#ih .ih-iconbtn-voice { border: 1.5px solid var(--brand-line); background: #fff; color: var(--brand); }
#ih .ih-iconbtn-voice:hover { background: var(--brand-tint); }
#ih .ih-iconbtn-voice .ih-i { font-size: 22px; }

/* Всплывающие окна у кнопки города и в футере */
#ih .ih-pop, #if .ih-pop { position: absolute; z-index: 30; display: flex; flex-direction: column; background: #fff; box-shadow: 0 12px 36px rgba(20, 30, 40, .18); }
#ih .ih-citywrap .ih-pop { top: 54px; left: 0; }
#ih .ih-confirm { width: 320px; gap: 12px; padding: 16px; border-radius: 12px; }
#ih .ih-pop-arrow { position: absolute; top: -6px; left: 24px; width: 12px; height: 12px; background: #fff; transform: rotate(45deg); }
#ih .ih-confirm-q { display: flex; flex-direction: column; gap: 4px; }
#ih .ih-confirm-q b { font-size: 17px; font-weight: 700; }
#ih .ih-confirm-q > span { font-size: 13px; color: var(--muted); }
#ih .ih-confirm-a { display: flex; gap: 8px; }
#ih .ih-b-cta, #ih .ih-b-out, #ih .ih-b-white { flex: 1; height: 40px; border-radius: 8px; font-size: 14px; }
#ih .ih-b-cta { border: 0; background: var(--cta); color: var(--ink); font-weight: 700; }
#ih .ih-b-cta:hover { background: var(--cta-hover); }
#ih .ih-b-out { border: 1.5px solid var(--border-input); background: #fff; color: var(--ink); font-weight: 600; }
#ih .ih-b-out:hover { background: var(--bg-subtle); }
#ih .ih-citypop, #if .if-citypop { gap: 12px; padding: 18px 18px 14px; border-radius: 14px; }
#ih .ih-citypop { width: 560px; }
#ih .ih-citypop-h { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
#ih .ih-citypop-h b { font-size: 18px; font-weight: 700; }
#ih .ih-citypop-h span { font-size: 13px; color: var(--muted-2); }
#ih .ih-citygrid, #if .ih-citygrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px 8px; }
#ih .ih-cityitem, #ih-layers .ih-cityitem, #if .ih-cityitem { display: flex; align-items: center; justify-content: space-between; height: 40px; padding: 0 10px; border: 0; border-radius: 8px; background: transparent; font-size: 15px; color: var(--ink); text-align: left; }
#ih .ih-cityitem:hover, #ih-layers .ih-cityitem:hover, #if .ih-cityitem:hover { background: var(--bg-subtle); }
#ih .ih-cityitem .ih-i, #ih-layers .ih-cityitem .ih-i, #if .ih-cityitem .ih-i { font-size: 18px; color: var(--brand); visibility: hidden; }
#ih .ih-cityitem.is-current, #ih-layers .ih-cityitem.is-current, #if .ih-cityitem.is-current { background: var(--brand-tint); font-weight: 700; }
#ih .ih-cityitem.is-current .ih-i, #ih-layers .ih-cityitem.is-current .ih-i, #if .ih-cityitem.is-current .ih-i { visibility: visible; }

/* ===== Основная строка ===== */
#ih .ih-main { background: #fff; border-bottom: 1px solid var(--border); }
#ih .ih-main-in { display: flex; align-items: center; gap: 24px; height: 72px; }
#ih .ih-logo { display: flex; flex: none; }
#ih .ih-logo img { display: block; width: auto; height: 56px; }
#ih .ih-logo b { font-size: 20px; }
#ih .ih-catbtn { display: flex; flex: none; align-items: center; gap: 8px; height: 44px; padding: 0 18px 0 14px; border: 0; border-radius: 10px; background: var(--brand); color: #fff; font-size: 15px; font-weight: 600; }
#ih .ih-catbtn:hover, #ih .ih-catbtn[aria-expanded="true"] { background: var(--brand-hover); }
#ih .ih-catbtn-x, #ih .ih-catbtn[aria-expanded="true"] .ih-catbtn-i { display: none; }
#ih .ih-catbtn[aria-expanded="true"] .ih-catbtn-x { display: block; }
#ih .ih-search { position: relative; flex: 1; min-width: 0; }
#ih .ih-burgerbtn, #ih .ih-stk-city, #ih .ih-stk-phone, #ih .ih-mcontacts { display: none; }

#ih .ih-acts { display: flex; flex: none; gap: 20px; }
#ih .ih-act { position: relative; display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: 12px; color: var(--muted); }
#ih .ih-act .ih-i { color: var(--ink); }
#ih .ih-act:hover { color: var(--brand-hover); }
#ih .ih-badge { position: absolute; top: -6px; display: flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; font-size: 11px; font-weight: 700; line-height: 1; }
#ih .ih-badge-ink { right: 4px; background: var(--ink); color: #fff; }
#ih .ih-badge-cta { right: 0; background: var(--cta); color: var(--ink); }

/* Поиск so_searchpro: разметка и скрипт модуля не меняются, только вид */
#ih .ih-search #sosearchpro { position: relative; float: none; width: 100%; margin: 0; padding: 0; background: none; border: 0; }
#ih .ih-search #sosearchpro h3, #ih .ih-search #sosearchpro .text-keyword, #ih .ih-search #sosearchpro .select_category { display: none !important; }
#ih .ih-search #sosearchpro form { margin: 0; }
#ih .ih-search #sosearchpro .search,
#ih .ih-search .ih-search-fb { position: relative; display: flex; align-items: center; float: none; width: 100%; height: 44px; margin: 0; padding: 0 6px 0 16px; border: 1.5px solid var(--border-input); border-radius: 10px; background: #fff; }
#ih .ih-search #sosearchpro .search:focus-within, #ih .ih-search .ih-search-fb:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(27, 111, 179, .18); }
#ih .ih-search #sosearchpro .search input.form-control,
#ih .ih-search .ih-search-fb input[type="search"] { display: block; flex: 1 1 auto; float: none; width: auto; min-width: 0; height: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; font-size: 15px; color: var(--ink); -webkit-appearance: none; appearance: none; }
#ih .ih-search input::placeholder { color: var(--muted-2); opacity: 1; }
#ih .ih-search #sosearchpro .search button.button-search,
#ih .ih-search .ih-search-fb button[type="submit"] { all: unset; box-sizing: border-box; display: block; flex: none; width: 34px; height: 34px; margin: 0; border-radius: 8px; background: var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E") center / 20px 20px no-repeat; font-size: 0; cursor: pointer; }
#ih .ih-search .ih-search-fb button[type="submit"] .ih-i { display: none; }
#ih .ih-search #sosearchpro .search button.button-search:hover,
#ih .ih-search .ih-search-fb button[type="submit"]:hover { background-color: var(--ink-2); }
#ih .ih-search #sosearchpro .search button.button-search i { display: none; }
#ih .ih-search #sosearchpro .search ul.dropdown-menu { position: absolute; top: calc(100% + 6px) !important; right: 0; left: 0 !important; z-index: 60; float: none; width: auto; min-width: 0; max-height: 70vh; margin: 0; padding: 6px; overflow-y: auto; border: 1px solid var(--border); border-radius: 12px; background: #fff; box-shadow: 0 8px 24px rgba(20, 30, 40, .14); }

/* ===== Меню ===== */
#ih .ih-menu { background: #fff; border-bottom: 1px solid var(--border); }
#ih .ih-menu-in { display: flex; align-items: center; gap: 28px; height: 44px; font-size: 15px; font-weight: 500; }
#ih .ih-menu-a { color: var(--ink); }
#ih .ih-menu-a:hover, #ih .ih-svc-btn[aria-expanded="true"] { color: var(--brand); }
#ih .ih-svc { position: relative; display: flex; align-items: center; height: 100%; }
#ih .ih-svc-btn { display: flex; align-items: center; gap: 2px; padding: 0; border: 0; background: none; font-size: 15px; font-weight: 500; }
#ih .ih-svc-pop { position: absolute; top: 44px; left: -12px; z-index: 30; width: 260px; padding: 6px; border: 1px solid var(--border); border-radius: 12px; background: #fff; box-shadow: 0 8px 24px rgba(20, 30, 40, .14); }
#ih .ih-svc-pop a { display: block; padding: 10px 12px; border-radius: 8px; font-size: 15px; font-weight: 400; color: var(--ink); }
#ih .ih-svc-pop a:hover { background: var(--bg-subtle); }

/* Мобильные элементы на десктопе скрыты */
#ih .ih-mstrip, #ih .ih-mconfirm { display: none; }
#ih .ih-sentinel { position: absolute; bottom: 0; left: 0; width: 1px; height: 1px; pointer-events: none; }

/* ===== Панель «Все контакты» ===== */
#ih .ih-panel { position: absolute; top: 65px; left: 0; right: 0; z-index: 25; background: #fff; border-bottom: 1px solid var(--border); box-shadow: 0 16px 32px rgba(20, 30, 40, .12); }
#ih .ih-panel-in { display: flex; flex-direction: column; gap: 18px; padding-top: 20px; padding-bottom: 24px; }
#ih .ih-panel-h { display: flex; align-items: center; gap: 16px; }
#ih .ih-panel-t { font-size: 22px; font-weight: 700; }
#ih .ih-panel-addr { display: flex; align-items: center; gap: 6px; font-size: 15px; color: var(--muted); }
#ih .ih-panel-addr .ih-i, #ih .ih-card-m .ih-i { font-size: 18px; color: var(--brand); }
#ih .ih-link { padding: 0; border: 0; background: none; font-size: 14px; font-weight: 500; color: var(--brand); }
#ih .ih-link:hover { color: var(--brand-hover); text-decoration: underline; }
#ih .ih-x, #ih-layers .ih-x { display: flex; align-items: center; justify-content: center; flex: none; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 10px; background: var(--bg-subtle); color: var(--muted); }
#ih .ih-x .ih-i, #ih-layers .ih-x .ih-i { font-size: 22px; }
#ih .ih-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
#ih .ih-card { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; border: 1px solid var(--border); border-radius: 14px; }
#ih .ih-card-h { display: flex; flex-direction: column; gap: 6px; }
#ih .ih-card-n { font-size: 16px; font-weight: 700; }
#ih .ih-card-p { display: flex; flex-direction: column; gap: 2px; }
#ih .ih-card-main { font-size: 22px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
#ih .ih-card-rest { font-size: 16px; font-weight: 500; line-height: 1.6; color: var(--ink); font-variant-numeric: tabular-nums; }
#ih .ih-card-main:hover, #ih .ih-card-rest:hover { color: var(--brand-hover); }
#ih .ih-card-m { display: flex; flex-direction: column; gap: 8px; padding-top: 12px; border-top: 1px solid var(--border); font-size: 14px; }
#ih .ih-card-m > div { display: flex; gap: 8px; }
#ih .ih-card-m .ih-i { color: var(--muted-2); }
#ih .ih-card-m a { color: var(--brand); }
#ih .ih-card-m span { color: var(--ink-2); }
#ih .ih-panel-f { display: flex; align-items: center; gap: 12px; font-size: 14px; color: var(--muted); }
#ih .ih-btn, #if .ih-btn { display: flex; align-items: center; gap: 6px; height: 40px; padding: 0 14px 0 12px; border-radius: 10px; font-size: 14px; font-weight: 600; white-space: nowrap; }
#ih .ih-btn-tg, #if .ih-btn-tg { background: var(--brand); color: #fff; }
#ih .ih-btn-tg:hover, #if .ih-btn-tg:hover { background: var(--brand-hover); color: #fff; }
#ih .ih-btn-voice, #if .ih-btn-voice { gap: 8px; border: 1.5px solid var(--brand-line); background: #fff; color: var(--brand); }
#ih .ih-btn-voice:hover, #if .ih-btn-voice:hover { background: var(--brand-tint); }
#ih .ih-btn-voice b, #if .ih-btn-voice b { font-weight: 500; color: var(--ink); font-variant-numeric: tabular-nums; }
#ih .ih-btn .ih-i, #if .ih-btn .ih-i { font-size: 18px; }
#ih .ih-btn-voice .ih-i, #if .ih-btn-voice .ih-i { font-size: 20px; }

/* ===== Мегаменю «Каталог» ===== */
#ih .ih-cat { position: absolute; top: 137px; left: 0; right: 0; z-index: 25; background: #fff; border-top: 1px solid var(--border); box-shadow: 0 16px 32px rgba(20, 30, 40, .12); }
#ih .ih-cat-in { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 32px; padding-top: 12px; padding-bottom: 24px; }
#ih .ih-cat-l { display: flex; flex-direction: column; padding-right: 12px; border-right: 1px solid var(--border); }
#ih .ih-cat-i { display: flex; align-items: center; justify-content: space-between; height: 42px; padding: 0 12px; border: 0; border-radius: 8px; background: transparent; font-size: 15px; color: var(--ink); text-align: left; }
#ih .ih-cat-i .ih-i { font-size: 18px; color: var(--muted-2); }
#ih .ih-cat-i.is-on { background: var(--brand-tint); font-weight: 600; }
#ih .ih-cat-r { max-height: calc(100vh - 230px); padding-top: 8px; overflow-y: auto; }
#ih .ih-cat-ph { display: flex; align-items: baseline; gap: 14px; }
#ih .ih-cat-ph b { font-size: 20px; font-weight: 700; }
#ih .ih-cat-ph a { font-size: 14px; font-weight: 500; color: var(--brand); }
#ih .ih-cat-ph a:hover { color: var(--brand-hover); text-decoration: underline; }
#ih .ih-cat-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px 16px; margin-top: 14px; }
#ih .ih-cat-grid a { font-size: 15px; line-height: 2; color: var(--ink); }
#ih .ih-cat-grid a:hover { color: var(--brand); }

/* ===== Затемнение ===== */
#ih-layers .ih-dim { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 900; background: rgba(21, 24, 28, .32); }
#ih-layers .ih-dim.is-m { z-index: 1090; background: rgba(21, 24, 28, .5); }

/* ===== Липкая шапка (десктоп): та же основная строка, зафиксированная вверху ===== */
#ih.is-stuck .ih-main { position: fixed; top: 0; right: 0; left: 0; z-index: 20; border-bottom: 0; box-shadow: 0 2px 12px rgba(20, 30, 40, .1); }
#ih.is-stuck .ih-main-in { gap: 16px; height: 60px; }
#ih.is-stuck .ih-logo img { height: 40px; }
#ih.is-stuck .ih-catbtn { height: 40px; padding: 0 14px 0 12px; gap: 6px; }
#ih.is-stuck .ih-search #sosearchpro .search, #ih.is-stuck .ih-search .ih-search-fb { height: 40px; }
#ih.is-stuck .ih-stk-city { display: flex; flex: none; align-items: center; gap: 4px; height: 40px; padding: 0 6px 0 10px; border: 1.5px solid var(--border-input); border-radius: 10px; background: #fff; font-size: 15px; font-weight: 700; color: var(--ink); }
#ih.is-stuck .ih-stk-phone { display: flex; flex: none; flex-direction: column; line-height: 1.2; }
#ih .ih-stk-tel { font-size: 17px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
#ih .ih-stk-all { padding: 0; border: 0; background: none; font-size: 12px; color: var(--brand); text-align: left; }
#ih .ih-stk-all:hover { color: var(--brand-hover); text-decoration: underline; }
#ih.is-stuck .ih-act-account, #ih.is-stuck .ih-act-wish, #ih.is-stuck .ih-act-l { display: none; }
#ih.is-stuck .ih-act-cart { align-items: center; justify-content: center; width: 44px; height: 44px; }
#ih.is-stuck .ih-act-cart .ih-i { font-size: 26px; }
#ih.is-stuck .ih-badge-cta { top: 2px; right: 0; }
#ih.is-stuck .ih-cat { position: fixed; top: 60px; }

/* ===== Футер ===== */
#if { background: var(--bg-subtle); border-top: 1px solid var(--border); }
#if .if-grid { display: grid; grid-template-columns: 460px minmax(0, 1fr) minmax(0, 1fr) minmax(0, .8fr); gap: 48px; align-items: start; padding: 40px 64px 32px; }
#if .if-card { position: relative; display: flex; flex-direction: column; gap: 16px; padding: 20px 22px; border: 1px solid var(--border); border-radius: 16px; background: #fff; }
#if .if-card-slot { display: flex; flex-direction: column; gap: 16px; }
#if .if-card-h { display: flex; flex-direction: column; gap: 6px; }
#if .if-card-lbl { font-size: 14px; color: var(--muted); }
#if .if-card-lbl b { font-weight: 700; color: var(--ink); }
#if .if-phones { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; }
#if .if-phones a { font-size: 20px; font-weight: 700; line-height: 1.5; color: var(--ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
#if .if-phones a:hover { color: var(--brand-hover); }
#if .if-phones .if-phone-i { display: none; }
#if .if-meta { display: flex; flex-direction: column; gap: 8px; padding-top: 14px; border-top: 1px solid var(--border); font-size: 15px; color: var(--ink-2); }
#if .if-meta > div { display: flex; align-items: flex-start; gap: 10px; }
#if .if-meta .ih-i { margin-top: 1px; font-size: 20px; color: var(--muted-2); }
#if .if-meta a { color: var(--brand); }
#if .if-meta a:hover { color: var(--brand-hover); text-decoration: underline; }
#if .if-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; }
#if .if-acts .ih-btn { height: 44px; padding: 0 16px 0 14px; font-size: 15px; }
#if .if-acts .ih-btn-voice { padding: 0 14px 0 12px; }
#if .if-citybtn { display: flex; align-items: center; gap: 2px; padding: 0; border: 0; background: none; font-size: 14px; font-weight: 500; color: var(--brand); }
#if .if-citybtn:hover { color: var(--brand-hover); }
#if .if-citybtn .ih-i { font-size: 18px; }
#if .if-citybtn[aria-expanded="true"] .ih-i { transform: rotate(180deg); }
#if .if-citypop { bottom: calc(100% + 8px); left: 0; width: 520px; padding: 16px; gap: 10px; }
#if .if-citypop-n { font-size: 13px; color: var(--muted-2); }
#if .if-citypop .ih-cityitem { height: 38px; }

#if .if-col { display: flex; flex-direction: column; gap: 2px; padding-top: 4px; }
#if .if-col-t { display: block; width: auto; padding: 0 0 10px; border: 0; background: none; font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); text-align: left; cursor: default; pointer-events: none; }
#if .if-col-t .ih-i { display: none; }
#if .if-col-l { display: flex; flex-direction: column; gap: 2px; }
#if .if-l { padding: 4px 0; font-size: 15px; line-height: 1.35; color: var(--ink); }
#if .if-l.is-sub { padding-left: 14px; font-size: 14px; color: var(--muted); }
#if .if-l:hover { color: var(--brand); }

#if .if-bot { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin: 0 64px; padding: 18px 0 96px; border-top: 1px solid var(--border-input); }
#if .if-bot-logo { display: block; flex: none; width: auto; height: 40px; }
#if .if-copy { flex: 1; min-width: 280px; font-size: 14px; color: var(--muted); }
#if .if-legal { display: flex; flex-wrap: wrap; gap: 4px 20px; font-size: 14px; }
#if .if-legal a { color: var(--ink-2); }
#if .if-legal a:hover { color: var(--brand); }

/* ===== Планшет и узкий десктоп ===== */
@media (max-width: 1199px) {
	#ih .ih-wrap { padding-left: 32px; padding-right: 32px; }
	#ih .ih-menu-in { gap: 22px; }
	#if .if-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 32px 32px 24px; gap: 32px; }
	#if .if-card { grid-column: 1 / -1; }
	#if .if-bot { margin: 0 32px; }
	#ih .ih-cat-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 768px) and (max-width: 1023px) {
	#ih .ih-wrap { padding-left: 24px; padding-right: 24px; }
	#ih .ih-strip-in { flex-wrap: wrap; gap: 10px 12px; height: auto; padding-top: 10px; padding-bottom: 10px; }
	#ih .ih-citywrap { order: 1; }
	#ih .ih-strip-acts { order: 2; margin-left: auto; }
	#ih .ih-depts { order: 3; flex: 1 1 100%; }
	#ih .ih-main-in { gap: 16px; }
	#ih .ih-acts { gap: 14px; }
	#ih .ih-menu-in { gap: 16px; font-size: 14px; }
	#ih .ih-panel { top: auto; }
	#ih .ih-panel-h { flex-wrap: wrap; gap: 8px 16px; }
	#ih .ih-cards { grid-template-columns: 1fr; }
	#ih .ih-cat-in { grid-template-columns: 220px minmax(0, 1fr); gap: 20px; }
	#ih .ih-cat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	#if .if-grid { padding: 28px 24px 20px; }
	#if .if-bot { margin: 0 24px; }
}

/* ===== Мобильный ===== */
@media (min-width: 768px) {
	#ih-layers .ih-sheet, #ih-layers .ih-burger { display: none !important; }
}

@media (max-width: 767px) {
	#ih .ih-strip, #ih .ih-menu, #ih .ih-panel, #ih .ih-cat, #ih .ih-confirm, #ih .ih-citypop { display: none !important; }
	#ih .ih-wrap { padding-left: 0; padding-right: 0; }

	#ih .ih-main { border-bottom: 0; }
	#ih .ih-main-in { display: grid; grid-template-columns: 44px auto minmax(0, 1fr) auto 44px; grid-template-areas: "burger logo . contacts cart" "search search search search search"; grid-template-rows: 56px auto; column-gap: 2px; align-items: center; height: auto; padding: 0 4px 8px; }
	#ih .ih-burgerbtn { grid-area: burger; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; background: none; color: var(--ink); }
	#ih .ih-logo { grid-area: logo; margin-left: 2px; }
	#ih .ih-logo img { height: 43px; }
	#ih .ih-catbtn, #ih .ih-stk-city, #ih .ih-stk-phone { display: none !important; }
	#ih .ih-mcontacts { grid-area: contacts; display: flex; align-items: center; gap: 6px; height: 40px; padding: 0 12px 0 10px; border: 0; border-radius: 10px; background: var(--brand-tint); font-size: 15px; font-weight: 600; color: var(--brand); }
	#ih .ih-acts { display: contents; }
	#ih .ih-act-account, #ih .ih-act-wish, #ih .ih-act-l { display: none; }
	#ih .ih-act-cart { grid-area: cart; align-items: center; justify-content: center; width: 44px; height: 44px; margin-left: 4px; }
	#ih .ih-act-cart .ih-i { font-size: 24px; }
	#ih .ih-badge-cta { top: 4px; right: 2px; min-width: 17px; height: 17px; font-size: 10px; padding: 0 3px; }
	#ih .ih-search { grid-area: search; padding: 0 8px; }
	#ih .ih-search #sosearchpro .search, #ih .ih-search .ih-search-fb { padding: 0 6px 0 12px; }
	#ih .ih-search #sosearchpro .search input.form-control, #ih .ih-search .ih-search-fb input[type="search"] { font-size: 16px; }

	#ih .ih-mstrip { display: flex; align-items: center; gap: 4px; height: 44px; padding: 0 6px 0 4px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--bg-subtle); }
	#ih .ih-mcity { display: flex; flex: none; align-items: center; gap: 3px; height: 44px; padding: 0 6px; border: 0; background: none; font-size: 15px; font-weight: 700; color: var(--ink); }
	#ih .ih-mslot { display: flex; flex: 1; align-items: center; gap: 4px; min-width: 0; }
	#ih .ih-mdiv { flex: none; width: 1px; height: 20px; background: #C9CED4; }
	#ih .ih-mtel { display: flex; flex: none; align-items: center; height: 44px; padding: 0 8px; font-size: 15px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
	#ih .ih-mslot .ih-st { white-space: nowrap; }
	#ih.is-confirm .ih-mconfirm { display: flex; flex-direction: column; gap: 10px; margin: 8px 12px 10px; padding: 12px; border-radius: 12px; background: var(--ink); color: #fff; }
	#ih .ih-mconfirm b { font-size: 15px; font-weight: 600; }
	#ih .ih-mconfirm > div { display: flex; gap: 8px; }
	#ih .ih-mconfirm button { flex: 1; height: 44px; border: 0; border-radius: 9px; font-size: 15px; }
	#ih .ih-mconfirm .ih-b-cta { background: var(--cta); color: var(--ink); font-weight: 700; }
	#ih .ih-mconfirm .ih-b-white { background: #fff; color: var(--ink); font-weight: 600; }

	/* Липкая: одна строка — бургер, поиск, «Контакты», корзина */
	#ih.is-stuck .ih-main-in { grid-template-columns: 44px minmax(0, 1fr) auto 44px; grid-template-areas: "burger search contacts cart"; grid-template-rows: 56px; gap: 4px; padding: 0 4px; }
	#ih.is-stuck .ih-logo { display: none; }
	#ih.is-stuck .ih-search { padding: 0; }
	#ih.is-stuck .ih-search #sosearchpro .search, #ih.is-stuck .ih-search .ih-search-fb { height: 40px; padding: 0 10px; }
	#ih.is-stuck .ih-search #sosearchpro .search button.button-search, #ih.is-stuck .ih-search .ih-search-fb button[type="submit"] { display: none; }
	#ih.is-stuck .ih-act-cart { margin-left: 0; }
	#ih.is-stuck .ih-badge-cta { top: 4px; right: 2px; }

	/* Окна поверх страницы */
	#ih-layers .ih-sheet { position: fixed; right: 0; bottom: 0; left: 0; z-index: 1100; max-height: calc(100vh - 54px); max-height: calc(100dvh - 54px); overflow-y: auto; border-radius: 20px 20px 0 0; background: #fff; overscroll-behavior: contain; }
	#ih-layers .ih-sheet-h { position: sticky; top: 0; z-index: 2; padding: 8px 6px 8px 16px; border-bottom: 1px solid var(--border); background: #fff; }
	#ih-layers .ih-grab { width: 40px; height: 4px; margin: 0 auto 6px; border-radius: 2px; background: var(--border-input); }
	#ih-layers .ih-sheet-hr { display: flex; align-items: center; gap: 4px; }
	#ih-layers .ih-sheet-t { flex: 1; font-size: 20px; font-weight: 700; }
	#ih-layers .ih-sheet-tt { display: flex; flex: 1; flex-direction: column; }
	#ih-layers .ih-sheet-tt .ih-sheet-t { flex: none; }
	#ih-layers .ih-sheet-s { font-size: 12px; color: var(--muted-2); }
	#ih-layers .ih-link-m { height: 44px; padding: 0 8px; border: 0; background: none; font-size: 14px; font-weight: 600; color: var(--brand); }
	#ih-layers .ih-x-m { width: 44px; height: 44px; background: none; }
	#ih-layers .ih-sheet-b { display: flex; flex-direction: column; gap: 12px; padding: 12px 16px 20px; }
	#ih-layers .ih-sheet-addr { display: flex; align-items: flex-start; gap: 6px; font-size: 14px; color: var(--muted); }
	#ih-layers .ih-sheet-addr .ih-i, #ih-layers .ih-mcard-m .ih-i { font-size: 18px; color: var(--brand); }
	#ih-layers .ih-mbtn { display: flex; align-items: center; justify-content: center; gap: 8px; height: 48px; border-radius: 10px; font-size: 15px; font-weight: 600; }
	#ih-layers .ih-mbtn-tg { background: var(--brand); color: #fff; }
	#ih-layers .ih-mbtn-voice { border: 1.5px solid var(--brand-line); background: #fff; color: var(--brand); }
	#ih-layers .ih-mbtn-voice b { font-weight: 500; color: var(--ink); font-variant-numeric: tabular-nums; }
	#ih-layers .ih-mcard { display: flex; flex-direction: column; gap: 10px; padding: 14px; border: 1px solid var(--border); border-radius: 14px; }
	#ih-layers .ih-mcard-h { display: flex; flex-direction: column; gap: 4px; }
	#ih-layers .ih-mcard-n { font-size: 15px; font-weight: 700; }
	#ih-layers .ih-st-l { font-size: 13px; }
	#ih-layers .ih-st-l.is-open { color: var(--ok-text); }
	#ih-layers .ih-mcall { display: flex; align-items: center; justify-content: center; gap: 8px; height: 52px; border-radius: 10px; background: var(--cta); font-size: 18px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
	#ih-layers .ih-mcall .ih-i { font-size: 22px; }
	#ih-layers .ih-mrest { display: flex; flex-direction: column; }
	#ih-layers .ih-mrest a { display: flex; align-items: center; justify-content: space-between; height: 44px; border-top: 1px solid var(--border); font-size: 16px; font-weight: 500; color: var(--ink); font-variant-numeric: tabular-nums; }
	#ih-layers .ih-mrest .ih-i { color: var(--brand); }
	#ih-layers .ih-mcard-m { display: flex; flex-direction: column; gap: 8px; padding-top: 10px; border-top: 1px solid var(--border); font-size: 14px; }
	#ih-layers .ih-mcard-m a, #ih-layers .ih-mcard-m span { display: flex; align-items: flex-start; gap: 8px; }
	#ih-layers .ih-mcard-m a { color: var(--brand); }
	#ih-layers .ih-mcard-m span { color: var(--ink-2); }
	#ih-layers .ih-mcard-m .ih-i { margin-top: 1px; color: var(--muted-2); }
	#ih-layers .ih-citylist { padding: 4px 16px 16px; }
	#ih-layers .ih-citylist .ih-cityitem { width: 100%; height: 48px; padding: 0; border-bottom: 1px solid var(--border); border-radius: 0; font-size: 16px; }
	#ih-layers .ih-citylist .ih-cityitem.is-current { background: none; }
	#ih-layers .ih-citylist .ih-cityitem .ih-i { font-size: 22px; }

	#ih-layers .ih-burger { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1100; display: flex; flex-direction: column; background: #fff; }
	#ih-layers .ih-burger-top { display: flex; align-items: center; gap: 8px; height: 56px; padding: 0 4px 0 12px; border-bottom: 1px solid var(--border); }
	#ih-layers .ih-burger-top img { display: block; width: auto; height: 43px; }
	#ih-layers .ih-burger-body { flex: 1; overflow-y: auto; padding: 8px 16px 24px; overscroll-behavior: contain; }
	#ih-layers .ih-bscreen { display: flex; flex-direction: column; }
	#ih-layers .ih-bh { padding: 10px 0 4px; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted-2); }
	#ih-layers .ih-bitem ~ .ih-bh { padding-top: 18px; }
	#ih-layers .ih-bitem { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 48px; padding: 0; border: 0; border-bottom: 1px solid var(--border); background: none; font-size: 16px; font-weight: 500; color: var(--ink); text-align: left; }
	#ih-layers .ih-bitem .ih-i { font-size: 20px; color: var(--muted-2); }
	#ih-layers .ih-bitem-sub { padding-left: 14px; font-weight: 400; color: var(--ink-2); }
	#ih-layers .ih-bitem-all { font-weight: 600; color: var(--brand); }
	#ih-layers .ih-bitem-all .ih-i { color: var(--brand); }
	#ih-layers .ih-bitem[aria-expanded="true"] .ih-i { transform: rotate(180deg); }
	#ih-layers .ih-bback { display: flex; align-items: center; gap: 6px; height: 48px; padding: 0; border: 0; background: none; font-size: 15px; font-weight: 600; color: var(--brand); }
	#ih-layers .ih-bt { padding: 4px 0 8px; font-size: 22px; font-weight: 700; }
	#ih-layers .ih-bfoot { display: flex; gap: 8px; margin-top: 18px; }
	#ih-layers .ih-bcity { display: flex; align-items: center; gap: 4px; height: 48px; padding: 0 12px; border: 1.5px solid var(--border-input); border-radius: 10px; background: #fff; font-size: 15px; font-weight: 700; color: var(--ink); }
	#ih-layers .ih-bcontacts { display: flex; flex: 1; align-items: center; justify-content: center; gap: 6px; height: 48px; border: 0; border-radius: 10px; background: var(--brand-tint); font-size: 15px; font-weight: 600; color: var(--brand); }
	#ih-layers .ih-bcontacts .ih-i { font-size: 20px; }

	/* Футер */
	#if .if-grid { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 24px 16px 8px; }
	#if .if-card { gap: 12px; padding: 0 0 12px; border: 0; border-radius: 0; background: none; }
	#if .if-card-slot { gap: 12px; }
	#if .if-card .ih-pill { background: none; padding: 0; height: auto; font-size: 13px; }
	#if .if-phones { gap: 8px; }
	#if .if-phones a { display: flex; align-items: center; justify-content: center; gap: 6px; height: 48px; border: 1px solid var(--border-input); border-radius: 10px; background: #fff; font-size: 15px; line-height: 1.4; }
	#if .if-phones .if-phone-i { display: block; font-size: 18px; color: var(--brand); }
	#if .if-meta { gap: 6px; padding-top: 0; border-top: 0; font-size: 14px; }
	#if .if-meta .ih-i { font-size: 18px; }
	#if .if-acts { flex-direction: column; align-items: stretch; gap: 8px; }
	#if .if-acts .ih-btn { justify-content: center; height: 48px; }
	#if .if-citybtn, #if .if-citypop { display: none !important; }
	#if .if-col { gap: 0; padding-top: 0; border-top: 1px solid var(--border-input); }
	#if .if-col-t { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 52px; padding: 0; font-size: 16px; letter-spacing: 0; text-transform: none; color: var(--ink); cursor: pointer; pointer-events: auto; }
	#if .if-col-t .ih-i { display: block; font-size: 24px; color: var(--muted); }
	#if .if-col-t[aria-expanded="true"] .ih-i { transform: rotate(180deg); }
	#if .if-col-l { display: none; padding-bottom: 8px; }
	#if .if-col.is-open .if-col-l { display: flex; }
	#if .if-l { display: flex; align-items: center; min-height: 44px; padding: 0; }
	#if .if-l.is-sub { padding-left: 14px; }
	#if .if-bot { flex-direction: column; align-items: flex-start; gap: 8px; margin: 0 16px; padding: 12px 0 calc(var(--cookie-h, 0px) + var(--page-bar-h, 0px) + 16px); }
	#if .if-bot-logo { display: none; }
	#if .if-legal { order: 1; gap: 0 16px; font-size: 13px; }
	#if .if-legal a { display: flex; align-items: center; min-height: 32px; }
	#if .if-copy { order: 2; min-width: 0; font-size: 12px; }
}

@media (min-width: 1024px) and (max-width: 1199px) {
	#ih .ih-dept .ih-st { display: none; }
}