.product-tabs {
  display: flex;
  border-bottom: 1px solid #ddd;
  margin-bottom: 20px;
}

.tab-button {
  background: none;
  border: none;
  padding: 12px 24px;
  font-size: 16px;
  cursor: pointer;
  position: relative;
  color: #555;
  transition: all 0.3s;
}

.tab-button.active {
  color: #000;
  font-weight: bold;
}

.tab-button.active::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 3px;
  background: #e74c3c; /* Цвет акцентной линии */
}

.tab-button:hover:not(.active) {
  color: #e74c3c;
}

.tab-content {
  display: none;
  padding: 20px;
  animation: fadeIn 0.3s;
}

.tab-content.active {
  display: block;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* KB: подпись "Центральный офис" под адресом в шапке — на ВСЕХ беседках, только десктоп (бейджи видны лишь там) */
@media (min-width:980px){
  [data-elem-id="1771274348547"]{top:38px !important;height:auto !important}
  [field="tn_text_1771274348547"]::after{content:"Центральный офис";display:block;font-family:'TTFirsNeue',Arial,sans-serif;font-size:10px;font-weight:500;line-height:16px;color:#000;opacity:.5;margin-top:0}
}

/* Сквозное меню (kb-nav): десктоп-полоса под шапкой + мобильный бургер */
.kb-nav{background:#fff;border-bottom:1px solid #f3eee7}
.kb-nav__in{max-width:1200px;margin:0 auto;display:flex;justify-content:center;flex-wrap:wrap;gap:38px;padding:15px 20px}
.kb-nav a,.kb-nav a:link,.kb-nav a:visited{font-family:'TTFirsNeue','TT Firs Neue',Arial,sans-serif;font-size:15px;font-weight:600;color:#34322f !important;text-decoration:none;white-space:nowrap;transition:color .15s}
.kb-nav a:hover{color:#e8781f !important}
.kb-burger{display:none}
@media (max-width:760px){
  .kb-burger{display:flex;flex-direction:column;justify-content:center;gap:4px;width:38px;height:38px;background:none;border:none;cursor:pointer;padding:8px;flex:none}
  .kb-burger span{display:block;height:2px;width:22px;background:#34322f;border-radius:2px}
  .kb-nav{display:none;border-top:1px solid #f3eee7}
  .kb-nav.kb-nav--open{display:block}
  .kb-nav__in{flex-direction:column;align-items:stretch;gap:0;padding:2px 18px}
  .kb-nav a{padding:14px 0;border-bottom:1px solid #f2f4f6;font-size:16px}
  .kb-nav a:last-child{border-bottom:none}
}

/* KBNAVDRAWER: мобильное меню — выезд слева */
.kb-nav__x{display:none}
@media (max-width:980px){
  .kb-nav{display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;width:300px;max-width:84vw;
    background:#fff;z-index:99990;transform:translateX(-105%);transition:transform .28s ease;
    box-shadow:0 0 42px rgba(0,0,0,.22);overflow-y:auto;border-top:none;border-bottom:none;padding:58px 0 26px}
  .kb-nav.kb-nav--open{transform:translateX(0)}
  .kb-nav__in{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0 26px}
  .kb-nav .kb-nav__in a,.kb-nav .kb-nav__in a:link,.kb-nav .kb-nav__in a:visited{padding:14px 0!important;border-bottom:none!important;font-size:22px!important;line-height:1.3!important;font-weight:600!important;color:#26282c!important}
  .kb-nav__x{display:block;position:absolute;top:10px;right:12px;width:46px;height:46px;background:none;border:none;
    font-size:38px;line-height:44px;color:#26282c;cursor:pointer;padding:0;text-align:center;font-weight:300}
  body:has(.kb-nav--open)::after{content:'';position:fixed;inset:0;background:rgba(20,21,20,.45);z-index:99980}
  body:has(.kb-nav--open){overflow:hidden}
}
/* /KBNAVDRAWER */
/* HIDEWORKS: пункт «Реализованные беседки» скрыт по решению владельца */
a[href="/#works"],a[href="#works"]{display:none!important}
/* /HIDEWORKS */


/* Подписи к фото — по центру. Правило владельца 28.07.2026: везде, где есть
   подрисуночная подпись (статьи блога, карточки, будущие блоки каталога). */
figcaption,
.kb-article-fig figcaption{text-align:center}

/* KBFOOTBES: мобильный подвал — знак крупнее, мессенджеры квадратными плашками.
   Глифы нарисованы кругами, поэтому растягиваем SVG на всю плашку и обрезаем
   по квадрату со скруглением: круг заполняет плашку, внутри остаётся сам знак. */
.gfmob-static .fbrand .lic,.gfmob-static .fbrand .lic img{width:84px!important;height:84px!important}
.gfmob-static .fsoc{gap:12px!important}
.gfmob-static .fsoc a{width:64px!important;height:64px!important;border-radius:16px!important;
overflow:hidden!important;background:none!important;padding:0!important}
.gfmob-static .fsoc a svg{display:block!important;width:100%!important;height:100%!important;
transform:scale(1.44)!important}

/*KBLOGOTXT*/
/* Надпись логотипа — Onest в кривых. Файлы имеют новые имена, поэтому
   браузеры не смогут достать старую версию TT Firs Neue из 30-дневного кэша.
   Герб остаётся отдельной картинкой слева, текст в разметке сохранён для
   поиска и скринридеров, визуально его подменяет фон. */
/* Размеры выставлены по обмеру логотипа бань: высота прописных «БЕСЕДКИ»
   равна высоте «БАНИ» (13,5 px в шапке, 16,5 px в подвале), строка рубрики —
   8 px. Артборды Тильды масштабируются на 1,13, поэтому в CSS числа меньше. */
/* Базовые правила работают и в обычных блоках Тильды, и в сгенерированных
   обёртках каталога/блога. */
.kblogo-slot{width:93px!important;height:54px!important}
.kblogo-slot .kblogo-txt{display:block!important;height:54px!important;
  font-size:0!important;line-height:0!important;color:transparent!important;
  background:url(/kb/images/logo-besedki-onest.svg?v=20260817a) left center/contain no-repeat!important}
.kblogo-fslot{width:102px!important;height:63px!important}
.kblogo-fslot .kblogo-ftxt{display:block!important;height:63px!important;
  font-size:0!important;line-height:0!important;color:transparent!important;
  background:url(/kb/images/logo-besedki-onest-footer.svg?v=20260817a) left top/contain no-repeat!important}

@media (min-width:761px){
  .ghbar .kblogo-slot{top:31px!important;left:88px!important;
    width:93px!important;height:54px!important}
  /* подвал: герб сверху, надпись под ним и по центру герба — как у бань.
     Сдвиг: по горизонтали — на ось герба, по вертикали — чтобы просвет под
     гербом был 5 px, как в вертикальном локапе бань (у слота Тильды свой
     отступ сверху, поэтому без сдвига получается 22 px). */
  .gfbar .kblogo-fslot{width:102px!important;height:63px!important;
    transform:translate(-20px,-14px)}
}
/* Мобильные шапка и подвал: старый живой текст TT Firs скрывается, вместо
   него показывается тот же Onest-SVG, что и на десктопе. */
.kmhd .kmhd-brand.kblogo-mob{display:block!important;flex:0 0 80px!important;
  width:80px!important;height:47px!important;max-width:80px!important;
  font-size:0!important;line-height:0!important;color:transparent!important;
  background:url(/kb/images/logo-besedki-onest.svg?v=20260817a) left center/contain no-repeat!important}
.kmhd .kblogo-mob>*{display:none!important}
.gfmob-static .fbrand .btx.kblogo-fmob{display:block!important;flex:none!important;
  width:112px!important;height:68px!important;font-size:0!important;line-height:0!important;
  background:url(/kb/images/logo-besedki-onest-footer.svg?v=20260817a) center top/contain no-repeat!important}
.gfmob-static .fbrand .btx.kblogo-fmob>*{display:none!important}
/*/KBLOGOTXT*/


/* addr-fit */
/* Адрес офиса длиннее прежнего. Плашка в шапке —
   фиксированной высоты, поэтому адрес держим в одну строку. 10.09.2026 */
.ghbar [data-elem-id="1771274348547"]{width:214px!important}
.ghbar [data-elem-id="1771274348547"] .tn-atom{font-size:11px!important;letter-spacing:-.3px!important;white-space:nowrap!important}
