/* Главная (экран 3 карты) по макету v2; «Популярные категории» — вариант Б (выбран заказчиком 2026-10-25). Значения — токены. Классы — tsg-. */

/* ---------- Контейнер и ритм секций ---------- */
/* край секций — как у шапки и подвала: контейнер WoodMart считается без полей (ревью 2026-10-25) */
html body .main-page-wrapper>.container{max-width:var(--container);padding-left:var(--gutter);padding-right:var(--gutter)}
/* расстояние между секциями — токен, а не отступы строк WPBakery (vc_custom / wd-rs: 0…110 px) */
:root{--tsg-sec:var(--section-y)}
@media (max-width:767px){:root{--tsg-sec:48px}}   /* .section на телефоне в макете v2 */
html body .wpb-content-wrapper>.vc_row:not(.wd-slide .vc_row):not(.tsg-about):not(.footer-container .vc_row){margin-top:0!important;margin-bottom:var(--tsg-sec)!important}
html body .vc_row.tsg-about{padding-top:0!important;padding-bottom:var(--tsg-sec)!important}
html body .main-page-wrapper :has(>.site-content),html body .main-page-wrapper .site-content{padding-top:0!important;margin-top:0!important}   /* WoodMart: 40 px под шапкой; на главной отступ — у первого экрана (20 px, макет) */
html body .tsg-products .wd-products-tabs{margin-bottom:0}
/* «Недавно смотрели» без просмотров пуста, но строка держала отступ */
html body .wpb-content-wrapper>.vc_row.tsg-recent:not(:has(.wd-product)){display:none}

/* ---------- Секция и заголовок секции ---------- */
.tsg-section{font-family:var(--font)}
.tsg-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:32px}
.tsg-section-head h2{margin:0;font-family:var(--font);font-size:36px;font-weight:600;line-height:1.15;letter-spacing:-.015em;color:var(--fg);text-transform:none}
@media (max-width:767px){
  .tsg-section-head{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:20px}
  .tsg-section-head h2{font-size:26px}
}

/* ---------- Популярные категории: плитки (бенто), фото целиком справа от текста ---------- */
.tsg-bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:190px;gap:16px}
.tsg-cat{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);grid-template-rows:auto auto 1fr auto;column-gap:12px;row-gap:4px;padding:20px 22px;border-radius:var(--r-lg);background:var(--bg-raised);color:var(--fg);overflow:hidden;text-decoration:none;transition:background var(--t)}
.tsg-cat h3{grid-column:1;margin:0;font-family:var(--font);font-size:19px;font-weight:600;line-height:1.2;text-transform:none;letter-spacing:0;color:inherit;hyphens:manual;-webkit-hyphens:manual}
.tsg-cnt{grid-column:1;font-size:13px;line-height:1.4;color:var(--fg-muted);hyphens:manual;-webkit-hyphens:manual}
.tsg-cat-more{grid-column:1;grid-row:4;align-self:end;display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:500;color:var(--fg-2)}
.tsg-cat-more .tsg-icon{width:16px;height:16px}
.tsg-cat img{grid-column:2;grid-row:1/-1;align-self:center;justify-self:end;width:100%;height:120px;object-fit:contain;object-position:right center;mix-blend-mode:multiply;transition:transform 300ms ease;transform-origin:right center}
@media (hover:hover){
  .tsg-cat:hover{background:var(--accent-soft);color:var(--fg)}
  .tsg-cat:hover .tsg-cat-more{color:var(--accent)}
  .tsg-cat:hover img{transform:scale(1.03)}
}
.tsg-cat.big{grid-column:span 2;grid-row:span 2;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
.tsg-cat.big h3{font-size:28px}
.tsg-cat.big .tsg-cnt{font-size:15px}
.tsg-cat.big img{height:250px}
.tsg-cat.wide{grid-column:span 2}
.tsg-cat.wide:not(.all){grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.tsg-cat.wide:not(.all) img{height:140px}
.tsg-cat.all{display:flex;flex-direction:column;gap:4px;background:var(--accent);color:var(--accent-fg)}
.tsg-cat.all .tsg-cnt,.tsg-cat.all .tsg-cat-more{color:rgba(255,255,255,.85)}
.tsg-cat.all .tsg-cat-more{margin-top:auto;align-self:flex-start}
@media (hover:hover){.tsg-cat.all:hover{background:var(--accent-hover);color:var(--accent-fg)}.tsg-cat.all:hover .tsg-cat-more{color:var(--accent-fg)}}
@media (min-width:1101px){.tsg-bento:has(>.tsg-cat.all:nth-child(6)) .tsg-cat.big{grid-row:span 1}}   /* пять разделов (CEFLA): большая плитка 2×1 — два ряда по четыре места, «Весь каталог» на полряда (ревью 2026-11-01) */
html body .wpb-content-wrapper>.vc_row.tsg-promos-row:not(:has(.tsg-section)){display:none!important}   /* акций нет — без пустого ряда (двойной отступ) */
.tsg-hero .wd-slider:not(:has(.wd-slide+.wd-slide)) :is(.wd-nav-arrows,.wd-nav-pagin-wrap){display:none}   /* один слайд — без стрелок и точек */
@media (min-width:1101px) and (max-width:1366px){   /* плитки ~250 px: слова в названиях не помещались */
  .tsg-cat:not(.big):not(.wide){grid-template-columns:minmax(0,1fr) minmax(0,.6fr)}
  .tsg-cat h3{font-size:17px}
}
@media (min-width:1101px) and (max-width:1199px){.tsg-cat h3{font-size:16px}}
@media (max-width:1100px){
  .tsg-bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:auto}
  .tsg-cat{min-height:150px}
  .tsg-cat img{height:110px}
  .tsg-cat.big{grid-row:span 1}
  .tsg-cat.big img,.tsg-cat.wide:not(.all) img{height:130px}
  .tsg-cat.all{min-height:110px}
}
@media (max-width:767px){
  .tsg-bento{gap:10px}
  .tsg-cat{padding:14px;min-height:0;column-gap:8px}
  .tsg-cat h3{font-size:15px}
  .tsg-cat .tsg-cnt,.tsg-cat .tsg-cat-more{display:none}
  .tsg-cat:not(.big):not(.wide){grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr}
  .tsg-cat:not(.big):not(.wide) img{grid-column:1;grid-row:2;height:72px;margin-top:8px;align-self:end}
  .tsg-cat.big,.tsg-cat.wide:not(.all){grid-template-columns:minmax(0,1fr) minmax(0,.9fr)}
  .tsg-cat.big h3{font-size:19px}
  .tsg-cat.big .tsg-cnt,.tsg-cat.wide .tsg-cnt{display:block;font-size:12px}
  .tsg-cat.big img,.tsg-cat.wide:not(.all) img{height:88px}
  .tsg-cat.all .tsg-cnt,.tsg-cat.all .tsg-cat-more{display:inline-flex;margin-top:6px}
}
@media (max-width:374px){.tsg-cat h3{font-size:14px}}   /* «наконечники» в плитке 2 колонки на 320 */

/* ---------- Общие части секций: «Все …» и стрелки ленты справа от заголовка ---------- */
.tsg-head-right{display:flex;align-items:center;gap:16px}
.tsg-link-more{display:inline-flex;align-items:center;gap:6px;height:40px;font-family:var(--font);font-size:15px;font-weight:500;color:var(--fg);text-decoration:none;white-space:nowrap}
.tsg-link-more .tsg-icon{width:16px;height:16px}
@media (hover:hover){.tsg-link-more:hover{color:var(--accent)}}
.tsg-slider-nav{display:flex;gap:8px}
html body .tsg-arr{display:flex;align-items:center;justify-content:center;width:40px;height:40px;min-height:0;padding:0;border-radius:50%;border:1px solid var(--border-strong);background:var(--bg);color:var(--fg);box-shadow:none;cursor:pointer;transition:background var(--t),border-color var(--t),color var(--t)}
.tsg-arr .tsg-icon{width:18px;height:18px}
.tsg-arr.prev .tsg-icon{transform:translateX(-1px)}
.tsg-arr.next .tsg-icon{transform:translateX(1px)}
@media (hover:hover){html body .tsg-arr:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}}
html body .tsg-arr:disabled{opacity:.35!important;pointer-events:none}
.tsg-slider-nav.is-static{display:none}   /* листать нечего — стрелок нет (home.js) */
@media (max-width:1023px){.tsg-slider-nav{display:none}}   /* листание пальцем (решение 2026-10-15) */
@media (max-width:767px){
  .tsg-section-head .tsg-head-right{width:100%;justify-content:space-between}
}

/* Лента: поля под тень карточки и scroll-padding (известные проблемы screen-build 2026-10-15) */
.tsg-slider{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:16px 4px 32px;margin:-16px -4px -32px;scroll-padding-inline:4px}
.tsg-slider::-webkit-scrollbar{display:none}
.tsg-slider>*{flex:0 0 calc((100% - 48px)/4);scroll-snap-align:start;min-width:0}
@media (min-width:768px){.tsg-slider{padding:16px 14px 32px;margin:-16px -14px -32px;scroll-padding-inline:14px}}
@media (min-width:768px) and (max-width:1100px){.tsg-slider>*{flex-basis:calc((100% - 32px)/3)}}
@media (max-width:767px){.tsg-slider{gap:10px}.tsg-slider>*{flex-basis:72%}}

/* ---------- Первый экран: баннер-слайдер и две промо-карточки ---------- */
html body .vc_row.tsg-hero{background:none!important}
/* растяжку строки первого экрана делает скрипт WPBakery (data-vc-full-width) уже после отрисовки — до него блок был на ~50 px шире и при загрузке «прыгал» (Alfie 2026-11-10).
   Фона у строки нет — растяжка не нужна: строка всегда в сетке, inline-стили скрипта перебиты */
html body .vc_row.tsg-hero[data-vc-full-width]{position:relative!important;left:0!important;width:auto!important;max-width:none!important;padding-left:0!important;padding-right:0!important;margin-left:-15px!important;margin-right:-15px!important}
html body .tsg-hero>.woodmart-row-gradient{display:none}   /* синяя полоса за первым экраном — градиент строки WoodMart */
/* колонки баннера и промо — одной высоты; промо делят её пополам */
html body .vc_row.tsg-hero{padding-top:20px!important}
html body .tsg-hero .vc_inner{display:flex;flex-wrap:wrap;gap:14px;margin-left:0!important;margin-right:0!important}
html body .tsg-hero .vc_inner::before,html body .tsg-hero .vc_inner::after{display:none}   /* clearfix WPBakery во flex с gap — лишний элемент и 14 px */
html body .tsg-hero .vc_inner>.wpb_column>.vc_column-inner{padding-left:0!important;padding-right:0!important}
@media (min-width:1101px){html body .tsg-hero .vc_inner>.wpb_column{width:auto!important;flex:2 1 0;min-width:0}html body .tsg-hero .vc_inner>.wpb_column:last-child{flex:1 1 0}}   /* 2fr / 1fr, как в макете */
html body .tsg-hero .vc_inner>.wpb_column,html body .tsg-hero .vc_inner>.wpb_column>.vc_column-inner{margin-bottom:0!important}   /* у колонки слайдера vc_custom mb 20 — промо были ниже слайдера */
html body .tsg-hero .vc_inner .wpb_wrapper>*:last-child{margin-bottom:0!important}
/* высоту строки задаёт слайдер: промо не растягивают её своим содержимым */
@media (min-width:1101px){
  html body .tsg-hero .vc_inner>.wpb_column:last-child>.vc_column-inner{position:relative}
  html body .tsg-hero .vc_inner>.wpb_column:last-child>.vc_column-inner>.wpb_wrapper{position:absolute;inset:0}
}
html body .tsg-hero .vc_inner>.wpb_column>.vc_column-inner{height:100%;padding-top:0;padding-bottom:0}
html body .tsg-hero .vc_inner>.wpb_column:last-child>.vc_column-inner>.wpb_wrapper{display:grid;grid-template-rows:1fr 1fr;gap:14px;height:100%}
html body .tsg-hero .promo-banner-wrapper{height:100%;margin:0!important}
@media (max-width:1100px){
  html body .tsg-hero .vc_inner>.wpb_column{width:100%!important;flex:0 0 100%;max-width:100%}   /* WPBakery md-7/5 ставит рядом до 992 */
  html body .tsg-hero .vc_inner>.wpb_column:last-child>.vc_column-inner>.wpb_wrapper{grid-template-rows:auto;grid-template-columns:1fr 1fr}
}
@media (max-width:767px){html body .tsg-hero .vc_inner{row-gap:10px}html body .tsg-hero .vc_inner>.wpb_column:last-child>.vc_column-inner>.wpb_wrapper{grid-template-columns:1fr;gap:10px}}
html body .tsg-hero .wd-slider{border-radius:var(--r-lg);overflow:hidden}
/* высота баннера — как в макете (решение Air 2026-10-25): 380, на телефоне 460 (фото над текстом); у слайдера сайта 520 / 720 в настройках */
html body .tsg-hero .wd-slider .wd-slide{min-height:380px!important}
html body .tsg-hero .wd-slider .wd-slide .vc_row{margin-left:0!important;margin-right:0!important}   /* −15 px у строки WPBakery съедали поле текста */
/* слайд по макету v2 из полей слайда WoodMart (inc/home.php tsg_hero_slides): фон — «Цвет фона»; текст и кнопка — светлые или тёмные по контрасту с ним;
   фото товара — справа от текста (::after контейнера, размер по пропорциям картинки, без обрезки); слайд без текста — готовая картинка на всю площадь */
/* все слайды — высотой самого высокого: у Swiper autoHeight, при длинном тексте автопрокрутка двигала страницу (ревью 2026-10-30) */
html body .tsg-hero .wd-slider .wd-carousel-wrap{height:auto!important;align-items:stretch!important}
html body .tsg-hero .wd-slider .wd-slide{height:auto!important;background:linear-gradient(100deg,var(--accent-hover) 0%,var(--accent) 55%,var(--accent-light) 100%);color:var(--tsg-s-fg,var(--fg));container-type:inline-size;--tsg-img-h:280px}   /* фото по верху: квадратные фото не уходят под стрелки (ревью 2026-10-30) */
html body .tsg-hero .wd-slider .wd-slide-container{position:relative;z-index:1}
html body .tsg-hero .wd-slider .wd-slide-inner{flex:1 1 0;min-width:0}
html body .tsg-hero .wd-slider .wd-slide-container::after{content:"";flex:none;align-self:flex-start;margin-top:24px;width:min(46%,calc(var(--tsg-img-h) * var(--tsg-s-r,1.5)));aspect-ratio:var(--tsg-s-r,1.5);margin-right:24px;background:var(--tsg-s-img) center/contain no-repeat;border-radius:var(--r-md);filter:drop-shadow(0 16px 28px rgba(0,0,0,.2));pointer-events:none}
html body .tsg-hero .wd-slider .wd-slide .vc_column-inner{padding:36px 36px 56px!important}   /* снизу — место под полоски-точки */
html body .tsg-hero .wd-slide .wpb_wrapper>*{margin-top:0!important;margin-bottom:0!important}
html body .tsg-hero .wd-slide .wpb_wrapper>*+*{margin-top:12px!important}   /* надзаголовок → заголовок 12, заголовок → кнопка 20, как в макете */
html body .tsg-hero .wd-slide .wpb_wrapper>.wd-button-wrapper{margin-top:20px!important}
@media (max-width:767px){
  html body .tsg-hero .wd-slider .wd-slide{min-height:460px!important}   /* все слайды одной высоты — при автопрокрутке страница не прыгает */
  html body .tsg-hero .wd-slider .wd-slide-container{flex-direction:column;align-items:stretch}
  html body .tsg-hero .wd-slider .wd-slide-container::after{order:-1;align-self:flex-start;width:min(calc(100% - 40px),calc(180px * var(--tsg-s-r,1.5)));margin:20px 20px 0;filter:drop-shadow(0 12px 20px rgba(0,0,0,.25))}
  html body .tsg-hero .wd-slider .wd-slide-inner{flex:none;margin-top:auto}
  html body .tsg-hero .wd-slider .wd-slide .vc_column-inner{padding:20px 20px 56px!important}   /* снизу — полоски-точки */
}
html body .tsg-hero .wd-slide .woodmart-title-container{max-width:none!important}   /* ширина заголовка — колонкой текста, а не 300 / 240 px из настроек слайда */
html body .tsg-hero .wd-slide .woodmart-title-container{font-family:var(--font);font-size:clamp(26px,4.4cqi,38px)!important;font-weight:600!important;line-height:1.1!important;letter-spacing:-.02em;text-transform:none;color:var(--tsg-s-fg,var(--fg))!important;hyphens:manual;overflow-wrap:break-word}
html body .tsg-hero .wd-slide .wd-text-block,html body .tsg-hero .wd-slide .wd-text-block p{font-family:var(--font);font-size:13px!important;font-weight:600;line-height:1.4!important;letter-spacing:.06em;text-transform:uppercase;color:var(--tsg-s-fg,var(--fg))!important}
html body .tsg-hero .wd-slide .wd-text-block{opacity:.9}   /* .8 давало 4,497:1 на третьем слайде */
html body .tsg-hero .wd-slide .wd-text-block :is(span,strong,b){color:inherit!important;font-weight:inherit}   /* синий акцент в надзаголовке — из текста слайда; на цветном фоне — цветом текста */
html body .tsg-hero .wd-slide .btn{min-height:0;height:48px;padding:0 22px;border-radius:var(--r-pill);font-family:var(--font);font-size:15px;font-weight:500;text-transform:none;letter-spacing:0;box-shadow:none;background-color:var(--tsg-s-btn,var(--accent))!important;color:var(--tsg-s-btn-fg,var(--accent-fg))!important;transition:background-color var(--t),color var(--t)}
@media (hover:hover){html body .tsg-hero .wd-slide .btn:hover{background-color:var(--tsg-s-btn-h,var(--accent-hover))!important;color:var(--tsg-s-btn-fg-h,var(--accent-fg))!important}}
/* точки слайдов — полоски, активная длиннее; зона клика 24 px (известная проблема 2026-10-14: в состояниях менять только цвет) */
html body .tsg-hero .wd-slider .wd-nav-pagin-wrap{left:36px;right:auto;bottom:24px;width:auto;text-align:left}
html body .tsg-hero .wd-slider .wd-nav-pagin{gap:8px}
html body .tsg-hero .wd-slider .wd-nav-pagin-item{width:28px;height:24px;margin:0;padding:10px 0;display:block}
html body .tsg-hero .wd-slider .wd-nav-pagin-item.wd-active{width:44px}
html body .tsg-hero .wd-slider .wd-nav-pagin-item span{display:block;width:100%;height:4px;margin:0;border:0;border-radius:var(--r-pill);background-color:var(--tsg-pagin,rgba(10,18,40,.55));transform:none;transition:background-color var(--t)}
html body .tsg-hero .wd-slider .wd-nav-pagin-item.wd-active span{background-color:var(--tsg-pagin-on,var(--accent))}   /* слайды сайта — светлые фото: белые полоски и стрелки терялись (ревью 2026-10-25) */
/* стрелки — круглые полупрозрачные справа снизу */
html body .tsg-hero .wd-slider .wd-btn-arrow{position:absolute;top:auto!important;bottom:20px;left:auto!important;width:40px;height:40px;margin:0!important;transform:none!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;border-radius:50%;background:rgba(10,18,40,.45);color:var(--accent-fg);display:flex;align-items:center;justify-content:center;transition:background var(--t)}
html body .tsg-hero .wd-slider .wd-btn-arrow.wd-prev{right:72px!important}
html body .tsg-hero .wd-slider .wd-btn-arrow.wd-next{right:24px!important}
@media (hover:hover){html body .tsg-hero .wd-slider .wd-btn-arrow:hover{background:rgba(10,18,40,.65)}}
html body .tsg-hero .wd-slider .wd-arrow-inner{width:18px;height:18px;font-size:0;line-height:0;background:currentColor;-webkit-mask:var(--ti-chevron-left) center/contain no-repeat;mask:var(--ti-chevron-left) center/contain no-repeat}
html body .tsg-hero .wd-slider .wd-next .wd-arrow-inner{-webkit-mask-image:var(--ti-chevron-right);mask-image:var(--ti-chevron-right)}
html body .tsg-hero .wd-slider .wd-arrow-inner::before,html body .tsg-hero .wd-slider .wd-arrow-inner::after{display:none}
html body .tsg-hero .wd-slider :focus-visible{outline:2px solid var(--accent-fg)!important;outline-offset:0!important;box-shadow:0 0 0 4px var(--accent)!important}
html body .tsg-hero .wd-slide .btn:focus-visible{outline:2px solid var(--tsg-s-fg,var(--accent))!important;outline-offset:2px!important;box-shadow:none!important}   /* кольцо с отступом цветом текста — видно и на акцентном фоне */
html body .tsg-hero .wd-slide .wd-slide-link:focus-visible{outline-offset:-6px!important;box-shadow:inset 0 0 0 4px var(--accent)!important}   /* ссылка на весь слайд: кольцо внутрь, снаружи его срезает overflow слайдера */
html body .tsg-hero .wd-slider .wd-nav-pagin-item{border-radius:var(--r-pill)}
@media (max-width:1023px){html body .tsg-hero .wd-slider .wd-nav-arrows{display:none}}
/* промо-карточки: светлый фон, значок справа сверху; фото баннера на карточке не показывается (макет v2) */
html body .tsg-hero .promo-banner{height:100%;margin:0;border-radius:var(--r-lg);background:var(--bg-raised);overflow:hidden}
html body .tsg-hero .promo-banner .main-wrapp-img{display:none}
html body .tsg-hero .promo-banner .wrapper-content-banner{position:relative;inset:auto;height:100%;padding:22px}
html body .tsg-hero .promo-banner .content-banner{display:flex;flex-direction:column;height:100%;max-width:none;gap:6px}
html body .tsg-hero .promo-banner .banner-title{margin:0;max-width:70%;font-family:var(--font);font-size:20px!important;font-weight:600!important;line-height:1.2!important;letter-spacing:0;text-transform:none;color:var(--fg)}
html body .tsg-hero .promo-banner .banner-inner,html body .tsg-hero .promo-banner .banner-inner p{max-width:70%;font-size:13px;line-height:1.45;color:var(--fg-muted)!important}   /* у баннеров «светлая схема» — белый текст */
html body .tsg-hero .promo-banner .banner-inner p{max-width:none}
html body .tsg-hero .promo-banner .banner-btn-wrapper{margin-top:auto;padding-top:12px}
html body .tsg-hero .promo-banner .btn{min-height:0;height:40px;padding:0 16px;border-radius:var(--r-pill);border:1px solid var(--accent);background:transparent;color:var(--accent);font-family:var(--font);font-size:14px;font-weight:500;text-transform:none;letter-spacing:0;box-shadow:none;transition:background var(--t)}
@media (hover:hover){html body .tsg-hero .promo-banner:hover .btn{background:var(--accent-soft)}}
html body .tsg-hero .promo-banner:has(.wd-promo-banner-link:focus-visible){box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--accent)}
html body .tsg-hero .promo-banner .wd-promo-banner-link:focus-visible{outline:none!important}
html body .tsg-hero .promo-banner::after{content:"";position:absolute;right:22px;top:22px;width:28px;height:28px;background:var(--accent);-webkit-mask:var(--ti-pencil) center/contain no-repeat;mask:var(--ti-pencil) center/contain no-repeat;pointer-events:none}
/* значки по порядку карточек: 1-я — «Выезд специалиста» (карандаш, решение Air 2026-10-14), 2-я — доставка */
html body .tsg-hero .tsg-promo-2::after{-webkit-mask-image:var(--ti-truck);mask-image:var(--ti-truck)}
@media (max-width:767px){
  html body .tsg-hero .wd-slide .woodmart-title-container{font-size:24px!important}
  html body .tsg-hero .wd-slider .wd-nav-pagin-wrap{left:20px;bottom:16px}
  html body .tsg-hero .promo-banner .wrapper-content-banner{padding:16px}
  html body .tsg-hero .promo-banner .banner-title{font-size:17px!important}
}

/* ---------- «Товары»: заголовок, вкладки-«таблетки», «Все товары» и стрелки справа ---------- */
html body .tsg-products .wd-tabs-header{display:flex!important;flex-direction:row!important;flex-wrap:wrap;align-items:center!important;justify-content:flex-start!important;gap:16px 24px;margin-bottom:32px;padding:0;border:0;text-align:left}   /* WoodMart на ≤1023 ставит колонкой по центру */
html body .tsg-products .wd-tabs-header .tabs-name{flex:1 1 auto;text-align:left}
html body .tsg-products .wd-tabs-header::after{display:none}
html body .tsg-products .wd-tabs-header .tabs-name{margin:0;padding:0;border:0;font-family:var(--font);font-size:36px!important;font-weight:600;line-height:1.15;letter-spacing:-.015em;color:var(--fg);text-transform:none}
html body .tsg-products .wd-tabs-header .tabs-name::after{display:none}
html body .tsg-products .wd-tabs-header .wd-nav-wrapper{margin:0 0 0 auto;padding:0;border:0;overflow:visible!important;-webkit-mask-image:none!important;mask-image:none!important}   /* WoodMart гасит край и режет кольцо фокуса */
html body .tsg-products .wd-nav-tabs{display:flex;gap:8px;margin:0}
html body .tsg-products .wd-nav-tabs>li{margin:0;display:flex;line-height:1}
html body .tsg-products .wd-nav-tabs>li>a{display:inline-flex;align-items:center;box-sizing:border-box;height:40px!important;min-height:0!important;line-height:1;padding:0 16px;border-radius:var(--r-pill);border:1px solid var(--border);background:var(--bg);color:var(--fg-2);font-family:var(--font);font-size:14px;font-weight:500;text-transform:none;letter-spacing:0;transition:background var(--t),color var(--t),border-color var(--t)}
html body .tsg-products .wd-nav-tabs>li>a::after,html body .tsg-products .wd-nav-tabs>li>a .nav-link-text::after{display:none}
html body .tsg-products .wd-nav-tabs>li>a .nav-link-text{color:inherit;font:inherit;text-transform:none}
html body .tsg-products .wd-nav-tabs>li.wd-active>a{background:var(--accent-soft);border-color:var(--accent-soft);color:var(--accent)}
@media (hover:hover){html body .tsg-products .wd-nav-tabs>li:not(.wd-active)>a:hover{border-color:var(--border-strong);color:var(--fg)}}
html body .tsg-products .wd-carousel-container .wd-nav-arrows{display:none}
@media (max-width:767px){
  html body .tsg-products .wd-tabs-header{gap:12px 8px;margin-bottom:20px}
  html body .tsg-products .wd-tabs-header .tabs-name{width:100%;font-size:26px!important}
  html body .tsg-products .wd-tabs-header .wd-nav-wrapper{margin:0}
  html body .tsg-products .wd-nav-tabs{gap:6px}
  html body .tsg-products .wd-nav-tabs>li>a{padding:0 12px}
  html body .tsg-products .tsg-head-right{margin-left:auto}
}
@media (max-width:374px){
  html body .tsg-products .wd-nav-tabs>li>a{padding:0 8px;font-size:13px}
  html body .tsg-products .wd-nav-tabs{gap:4px}
  html body .tsg-products .tsg-head-right .tsg-link-more{font-size:14px}
}

/* ---------- «Акции»: бирюзовая панель, 4 карточки в строку (решение Air 2026-10-14); данные — страница «Акции» ---------- */
.tsg-promo-panel{padding:36px 36px 40px;border-radius:var(--r-xl);background:var(--promo-gradient)}
.tsg-promo-panel .tsg-section-head{margin-bottom:24px}
.tsg-promo-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.tsg-promo-card{position:relative;display:flex;flex-direction:column;gap:6px;min-height:0;padding:22px 22px 0;border-radius:var(--r-lg);overflow:hidden;background:var(--bg);color:var(--promo-ink);text-decoration:none;transition:box-shadow var(--t)}
html body .tsg-promo-card h3{position:relative;z-index:1;margin:6px 0 0;font-family:var(--font);font-size:18px;font-weight:600;line-height:1.25;letter-spacing:.02em;text-transform:uppercase;color:var(--promo-ink)}
.tsg-promo-card p{position:relative;z-index:1;max-width:95%;margin:0;font-size:14px;line-height:1.4;color:var(--promo-ink-2)}
.tsg-promo-card img{display:block;flex:none;width:calc(100% + 44px);max-width:none;height:160px;margin:auto -22px 0;padding-top:12px;object-fit:cover;object-position:center 60%;mix-blend-mode:multiply;transition:transform 300ms ease}   /* в потоке под текстом: тексты акций сайта длиннее макетных */
.tsg-pr-go{position:absolute;right:14px;bottom:14px;z-index:1;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--r-sm);background:var(--promo-soft);color:var(--promo-accent);transition:background var(--t),color var(--t)}
.tsg-pr-go .tsg-icon{width:18px;height:18px}
@media (hover:hover){
  .tsg-promo-card:hover{box-shadow:var(--shadow-promo)}
  .tsg-promo-card:hover img{transform:scale(1.03)}
  .tsg-promo-card:hover .tsg-pr-go{background:var(--accent);color:var(--accent-fg)}
}
@media (max-width:1100px){
  .tsg-promo-panel{padding:28px 24px 32px}
  .tsg-promo-row{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767px){
  .tsg-promo-panel{margin:0 -7px;padding:22px 0 24px 16px;border-radius:var(--r-lg)}
  .tsg-promo-panel .tsg-section-head{padding-right:16px}
  .tsg-promo-row{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 16px 4px 4px;margin:-4px 0 -4px -4px;scroll-padding-inline:4px}
  .tsg-promo-row::-webkit-scrollbar{display:none}
  .tsg-promo-card{padding:18px 18px 0;scroll-snap-align:start}
  .tsg-promo-card img{width:calc(100% + 36px);margin:auto -18px 0;height:140px}
  html body .tsg-promo-card h3{font-size:16px}
  .tsg-promo-card p{font-size:13px}
}

/* ---------- «Новости»: фото на всю карточку, дата и заголовок поверх ---------- */
.tsg-post{position:relative;display:flex;align-items:flex-end;aspect-ratio:4/4.2;padding:22px;border-radius:var(--r-lg);overflow:hidden;background:var(--bg-sunken);color:var(--accent-fg);text-decoration:none}
.tsg-post img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 400ms ease}
@media (hover:hover){.tsg-post:hover img{transform:scale(1.04)}}
.tsg-post::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,18,40,0) 20%,rgba(10,18,40,.68) 50%,var(--scrim) 72%)}   /* AA на светлых фото (ревью 2026-10-25) */
.tsg-post .txt{position:relative;z-index:1;display:grid;gap:8px}
html body .tsg-post,html body .tsg-post:hover{color:var(--accent-fg)}
.tsg-post time{font-size:13px;color:var(--accent-fg);text-shadow:0 1px 2px rgba(10,18,40,.6)}
html body .tsg-post h3{margin:0;font-family:var(--font);font-size:18px;font-weight:600;line-height:1.3;letter-spacing:0;text-transform:none;color:var(--accent-fg)}
@media (max-width:767px){.tsg-post{padding:14px;aspect-ratio:4/5}html body .tsg-post h3{font-size:14px}.tsg-news>*{flex-basis:78%}}

/* ---------- «О компании»: заголовок слева, SEO-текст целиком справа (решение Air 2026-10-14) ---------- */
html body .vc_row.tsg-about,html body .tsg-about .vc_column-inner{background-color:var(--bg)!important}
html body .tsg-about .vc_column-inner>.wpb_wrapper{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start}
html body .tsg-about .title-wrapper{margin:0}
html body .tsg-about .woodmart-title-container{font-family:var(--font);font-size:28px!important;font-weight:600!important;line-height:1.25!important;letter-spacing:-.01em;text-transform:none;color:var(--fg)!important}
html body .tsg-about .wd-text-block{display:grid;gap:14px;max-width:760px;margin:0!important;max-height:none!important;overflow:visible!important}
html body .tsg-about .wd-text-block p{margin:0;font-family:var(--font);font-size:16px;line-height:1.65;color:var(--fg-2)}
html body .tsg-about .wd-text-block::after,html body .tsg-about .wd-collapsible-content::after{display:none!important}
@media (max-width:1100px){html body .tsg-about .vc_column-inner>.wpb_wrapper{grid-template-columns:minmax(0,1fr);gap:20px}}
@media (max-width:767px){
  html body .tsg-about .woodmart-title-container{font-size:22px!important}
  html body .tsg-about .wd-text-block p{font-size:15px}
}