/* ===== leadenergy — слайды в ZeroBlock (rec1300376821) ===== */
/* Классы: у главной PNG → slide-img_active, у остальных → slide-img */

.slide-img,
.slide-img_active {
  background: transparent !important;
  filter: grayscale(100%) brightness(.72);   /* по умолчанию приглушены */
  transition: transform .35s ease, filter .35s ease;
  transform-origin: center center;
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent;
}

/* Активная — сразу цветная */
.slide-img_active { 
  filter: none !important; 
}

/* Ховер: масштаб и цвет */
.slide-img:hover,
.slide-img_active:hover,
.slide-img.is-hovered,
.slide-img_active.is-hovered {
  filter: none !important;
  transform: scale(1.5);
}

/* При наведении секции приглушаем все, кроме текущей */
#rec1340701221.hovering-slides .slide-img:not(.is-hovered),
#rec1340701221.hovering-slides .slide-img_active:not(.is-hovered){
  filter: grayscale(100%) opacity(.55) brightness(.55) !important;
}

/* Чтобы увеличение не обрезалось */
#rec1340701221 .t396__artboard { 
  overflow: visible !important; 
}

/* Адаптивный масштаб */
@media (max-width: 1200px){
  .slide-img:hover,
  .slide-img_active:hover,
  .slide-img.is-hovered,
  .slide-img_active.is-hovered {
    transform: scale(1.35);
  }
}
@media (max-width: 768px){
  .slide-img:hover,
  .slide-img_active:hover,
  .slide-img.is-hovered,
  .slide-img_active.is-hovered {
    transform: scale(1.25);
  }
}
@media (max-width: 480px){
  .slide-img:hover,
  .slide-img_active:hover,
  .slide-img.is-hovered,
  .slide-img_active.is-hovered {
    transform: scale(1.18);
  }
}
/* ===== Блок для экранов >= 640px ===== */
@media (min-width: 640px) {
  .slide-img,
  .slide-img_active {
    background: transparent !important;
    filter: grayscale(100%) brightness(.72);
    transition: transform .35s ease, filter .35s ease;
    transform-origin: center center;
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
    -webkit-tap-highlight-color: transparent;
  }

  .slide-img_active { filter: none !important; }

  .slide-img:hover,
  .slide-img_active:hover {
    filter: none !important;
    transform: scale(1.5);
    z-index: 9999 !important;
  }

  #rec1340701221 .t396__artboard { overflow: visible !important; }
}
/* Блок с цифрами */
#rec1310411641 .num-fill{
  opacity:0 !important;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .25s ease;
  z-index:2;           /* заливка сверху */
}
#rec1340701251 .num-outline{
  z-index:1;
}

/* Показываем заливку только при ховере */
#rec1340701251 .num:hover .num-fill,
#rec1340701251 .num-outline:hover ~ .num-fill,
#rec1340701251 .num-fill:hover{
  opacity:1 !important;
  visibility:visible;
  pointer-events:auto;
}
/* === Цвет золота === */
:root { --gold: #D09A0E; }

/* Всегда один и тот же радиус, убираем любые «подсветки» Тильды */
[class*="botton_"] .tn-atom,
[class*="botton_"] .tn-atom:before,
[class*="botton_"] .tn-atom:after {
  border-radius: 17px !important;
  box-shadow: none !important;
  filter: none !important;
  transition: none !important; /* без спец-эффектов */
}

/* Активная (botton_main_tab_N): заливка золотом */
.botton_main_tab_1 .tn-atom,
.botton_main_tab_2 .tn-atom,
.botton_main_tab_3 .tn-atom {
  background-color: var(--gold) !important;
  border: 2px solid var(--gold) !important;
  color: #111 !important;           /* текст на золоте читаемый */
}

/* Неактивные (botton_tab_N): прозрачная, золотой контур */
.botton_tab_1 .tn-atom,
.botton_tab_2 .tn-atom,
.botton_tab_3 .tn-atom {
  background: transparent !important;
  border: 2px solid var(--gold) !important;
  color: #FFFFFF !important;         /* как у тебя сейчас */
}
/* Активная: белый текст поверх золота */
.botton_main_tab_1 .tn-atom,
.botton_main_tab_2 .tn-atom,
.botton_main_tab_3 .tn-atom,
.botton_main_tab_1 .tn-atom:hover,
.botton_main_tab_2 .tn-atom:hover,
.botton_main_tab_3 .tn-atom:hover,
.botton_main_tab_1 .tn-atom:visited,
.botton_main_tab_2 .tn-atom:visited,
.botton_main_tab_3 .tn-atom:visited {
  color: #fff !important;
}

/* если внутри есть span/strong/svg — тоже красим в белый */
.botton_main_tab_1 .tn-atom * ,
.botton_main_tab_2 .tn-atom * ,
.botton_main_tab_3 .tn-atom *  {
  color: #fff !important;
  fill: #fff !important;
  stroke: #fff !important;
}
#rec1315478571,
#rec1315478571 .t396__artboard {
  filter: none !important;
  backdrop-filter: none !important;
  mix-blend-mode: normal !important;
  isolation: isolate !important;
  background: transparent !important;
}
/* === 1) Делаем кликабельный курсор и включаем события === */
[class*="botton_"],
[class*="botton_"] .tn-atom {
  cursor: pointer !important;
  pointer-events: auto !important;
  z-index: 100 !important;          /* подняли над соседями */
  position: relative;               /* чтобы z-index сработал */
}

/* Если сверху есть декоративные элементы — отключим им клики */
#rec1315478571 .t396__elem:not([class*="botton_"]) .tn-atom,
#rec1315478571 .t396__elem:not([class*="botton_"]) .tn-atom > * {
  pointer-events: none;             /* только если что-то реально перекрывает */
}

/* === 2) Ховеры (лёгкая обратная связь) === */
.botton_tab_1 .tn-atom:hover,
.botton_tab_2 .tn-atom:hover,
.botton_tab_3 .tn-atom:hover {
  background: rgba(208,154,14,.12) !important; /* мягкая золотая подсветка */
  border-color: var(--gold) !important;
}

/* Активные — как и было, плюс чуть «нажимаются» */
.botton_main_tab_1 .tn-atom:hover,
.botton_main_tab_2 .tn-atom:hover,
.botton_main_tab_3 .tn-atom:hover {
  filter: brightness(.98) !important;
}

/* Клавиатурный фокус — чтобы было видно табом */
[class*="botton_"] .tn-atom:focus-visible {
  outline: 2px solid var(--gold) !important;
  outline-offset: 2px !important;
  border-radius: 17px !important;
}