/* ==========================================================
   BeeSMM — redesign.css
   Отдельный файл стилей обновлённого дизайна.

   Зачем отдельный: templates/newdesign.php намеренно отключает
   custom.css (wp_dequeue_style 'custom-style'), поэтому общие
   стили не могут жить там — иначе не дойдут до страниц услуг.

   Разметка НЕ меняется — только оформление.
   Откат: удалить файл и строку подключения в functions.php.

   Селекторы начинаются с body — это нужно, чтобы перебить
   встроенные стили в footer.php, которые идут позже в коде.
   ========================================================== */


/* ----------------------------------------------------------
   1. Единый фон страницы
   Раньше картинка задавалась отдельно на .stage и .contacts,
   каждая обрезала её по-своему — на стыке был виден шов,
   а подвал оставался плоско-чёрным.
   Теперь один слой на всю страницу, секции только притемняют.
   ---------------------------------------------------------- */

html {
  background-color: #0b0b0c;
}

html body {
  background-color: transparent;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background:
    url(../img/bg-honeycomb.webp) center center / cover no-repeat;
  pointer-events: none;
}

/* Убираем персональные фоны у секций, чтобы был виден общий слой */
body #bee-hero .stage {
  background-image: none;
  background-color: transparent;
}

body footer.footer {
  background-color: transparent;
}

body .footer__container {
  background-color: rgba(0, 0, 0, 0.5);
}

body .footer__lang {
  background-color: transparent;
}


/* ----------------------------------------------------------
   2. Блок «Контакты»
   Приведён к виду соседних блоков со статистикой:
   та же ширина, тот же градиент, обводка и скругление.
   ---------------------------------------------------------- */

/* Боковые отступы повторяют положение соседнего блока внутри
   контейнера 1600px. max() не даёт им уйти в минус на узких экранах. */
body .contacts {
  background-image: none;
  background-color: transparent;
  max-width: none;
  margin: 0;
  padding: 56px max(24px, calc(50% - 800px)) 48px max(24px, calc(50% - 800px));
}

/* Притемнение секции. Было 78–90% — текстура полностью пропадала */
body .contacts::before {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.40), rgba(0, 0, 0, 0.58));
}

body .contacts .section-title {
  font-size: 36px;
  margin: 0 auto 26px;
}

/* Градиент, обводка и радиус — те же значения, что у блока статистики */
body .contacts__grid {
  max-width: none;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  background: linear-gradient(rgba(36, 36, 39, 0.82) 0%, rgba(15, 15, 17, 0.72) 100%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 21px;
  overflow: hidden;
}

/* Иконка слева, подпись и значение справа */
body .contact-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "icon title"
    "icon text";
  align-items: center;
  column-gap: 18px;
  row-gap: 5px;
  text-align: left;
  padding: 27px 40px;
  min-width: 0;
}

body .contact-item + .contact-item {
  border-left: 1px solid rgba(255, 255, 255, 0.09);
}

body .contact-item__icon-wrapper {
  grid-area: icon;
  width: 56px;
  height: 56px;
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(245, 166, 35, 0.10);
  border: 1px solid rgba(245, 166, 35, 0.28);
}

body .contact-item__icon {
  width: 32px;
  height: 32px;
  object-fit: contain;
}

body .contact-item__title {
  grid-area: title;
  font-size: 17px;
  font-weight: 400;
  color: #bdbdbd;
  margin: 0;
}

body .contact-item__text {
  grid-area: text;
  font-size: 20px;
  line-height: 1.4;
  color: #fff;
  font-weight: 600;
}

body .contact-item__text p {
  margin: 0;
  overflow-wrap: anywhere;
}


/* ---------- Планшеты ---------- */

@media (max-width: 1024px) {
  body .contacts {
    padding: 44px 16px 38px;
  }

  body .contacts__grid {
    margin: 0 auto;
  }

  body .contact-item {
    padding: 20px 26px;
  }

  body .contact-item__text {
    font-size: 18px;
  }
}


/* ---------- Телефоны: карточки в столбик ---------- */

@media (max-width: 767px) {
  body .contacts {
    padding: 34px 16px 30px;
  }

  body .contacts .section-title {
    font-size: 26px;
    margin: 0 auto 18px;
  }

  body .contacts__grid {
    grid-template-columns: 1fr;
    border-radius: 16px;
  }

  body .contact-item {
    padding: 18px 20px;
  }

  body .contact-item + .contact-item {
    border-left: none;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }

  body .contact-item__icon-wrapper {
    width: 50px;
    height: 50px;
    border-radius: 13px;
  }

  body .contact-item__icon {
    width: 28px;
    height: 28px;
  }

  body .contact-item__title {
    font-size: 15px;
  }

  body .contact-item__text {
    font-size: 18px;
  }
}


/* ----------------------------------------------------------
   3. Единая подложка для всех блоков
   Было: у каждого свой плотный градиент.
   Стало: прозрачное притемнение — сквозь блоки видны соты.
   ---------------------------------------------------------- */

body #bee-hero .micro,
body #bee-hero .trust,
body #bee-hero .feature,
body #bee-hero .bottom,
body .contacts__grid {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.10);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

/* Притемнение секции ослаблено: теперь карточки темнят сами */
body .contacts::before {
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.42) 46%, rgba(0, 0, 0, 0.66) 100%);
}

/* Единый тон: секционные затемнения убраны, притемнение теперь одно на всю страницу */
body .footer__container {
  background-color: transparent;
}


/* ----------------------------------------------------------
   4. Подвал
   Чёрный фон, подпись над сетями, выровненные иконки.
   ---------------------------------------------------------- */

body footer.footer {
  background-color: #000;
}

body .footer__container {
  background-color: transparent;
  align-items: center;
  gap: 28px;
}

body .footer__right {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 32px;
  flex-wrap: wrap;
}

/* Сети — что продвигаем */
body .beesmm-fsocial {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

body .beesmm-fsocial::before {
  content: "Что продвигаем?";
  flex: 0 0 100%;
  text-align: center;
  font-size: 13px;
  line-height: 1.2;
  color: #9a9a9f;
  margin-bottom: 6px;
}

/* BEESMM: подпись над иконками соцсетей — по языку страницы */
html[lang^="ua"] body .beesmm-fsocial::before,
html[lang^="uk"] body .beesmm-fsocial::before { content: "Що просуваємо?"; }
html[lang^="en"] body .beesmm-fsocial::before { content: "What are we promoting?"; }

body .beesmm-fsocial a {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  flex: 0 0 auto;
}

/* Контакты — телеграм и почта */
body .footer__social {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

body .footer__social a {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

body .footer__social a img,
body .footer__social-icon {
  width: 22px;
  height: 22px;
  object-fit: contain;
  display: block;
}

@media (max-width: 1024px) {
  body .footer__container {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    gap: 22px;
  }
  body .footer__right {
    justify-content: center;
    gap: 26px;
  }
}

@media (max-width: 767px) {
  body .footer__right {
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }
  body .beesmm-fsocial {
    gap: 10px;
  }
  body .beesmm-fsocial a,
  body .footer__social a {
    width: 38px;
    height: 38px;
  }
}


/* --- fsocial иконки: нужны на страницах услуг, где нет стилей footer.php --- */
body .beesmm-fsocial a[href*="/instagram"] { background-image: url(/wp-content/themes/beesmm/assets/img/s-instagram-150x150.png); }
body .beesmm-fsocial a[href*="/telegram"] { background-image: url(/wp-content/themes/beesmm/assets/img/s-telegram-150x150.png); }
body .beesmm-fsocial a[href*="/tiktok"] { background-image: url(/wp-content/themes/beesmm/assets/img/s-tiktok-150x150.png); }
body .beesmm-fsocial a[href*="/youtube"] { background-image: url(/wp-content/themes/beesmm/assets/img/s-youtube-150x150.png); }
body .beesmm-fsocial a[href*="/twitch"] { background-image: url(/wp-content/themes/beesmm/assets/img/s-twitch-150x150.png); }
body .beesmm-fsocial a[href*="/facebook"] { background-image: url(/wp-content/themes/beesmm/assets/img/s-facebook-150x150.png); }


/* ----------------------------------------------------------
   5. Юридическая страница (соглашение)
   Внутри модалки оформление сбрасывается ниже.
   ---------------------------------------------------------- */

body .agreement__content {
  max-width: 940px;
  margin: 0 auto;
  padding: 48px 32px 72px;
  background: rgba(0, 0, 0, 0.78);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  color: #e8e8ea;
  line-height: 1.7;
}

body .agreement__content p { margin: 0 0 14px; }
body .agreement__content h1,
body .agreement__content h2,
body .agreement__content h3 { color: #fff; margin: 28px 0 12px; line-height: 1.3; }

body .agreement-back { margin: 0 0 28px; }
body .agreement-back:last-child { margin: 34px 0 0; }

body .agreement-back a {
  display: inline-block;
  padding: 10px 20px;
  border-radius: 10px;
  background: rgba(245, 166, 35, 0.12);
  border: 1px solid rgba(245, 166, 35, 0.4);
  color: #f5a623;
  text-decoration: none;
  font-size: 15px;
}

body .agreement-back a:hover { background: rgba(245, 166, 35, 0.2); }

/* Внутри окна на главной — оставляем как было */
body #agreement-modal .agreement__content {
  max-width: none;
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
}

body #agreement-modal .agreement-back { display: none; }

@media (max-width: 767px) {
  body .agreement__content {
    padding: 28px 18px 48px;
    border-radius: 14px;
    font-size: 15px;
  }
}

/* На юридической странице контакты не нужны — они остаются в подвале */
body:has(.agreement-back) section.contacts { display: none; }

/* Отступ от шапки: логотип 150px налезал на панель с текстом */
body:has(.agreement-back) .agreement-back:first-child { margin-top: 170px; }
body:has(.agreement-back) .agreement__content { margin-top: 40px; }
@media (max-width: 767px) {
  body:has(.agreement-back) .agreement-back:first-child { margin-top: 120px; }
  body:has(.agreement-back) .agreement__content { margin-top: 24px; }
}


/* === подвал услуг = как главная === */
body .footer__container{display:grid;grid-template-columns:1fr auto 1fr;gap:28px;align-items:center;justify-content:space-between;max-width:100%;padding:24px max(24px,calc(50% - 800px));margin:0;}
body .footer__logo{width:auto;justify-self:start;}
body .footer__logo img{width:90px;height:auto;max-width:90px;display:block;}
body .footer__center{display:flex;justify-content:center;}
body .footer__center a, body .footer__center a:link, body .footer__center a:visited{font-size:15px;color:#FF8A00 !important;text-decoration:none;}
body .footer__right{display:flex;gap:32px;align-items:flex-end;justify-content:flex-end;flex-wrap:wrap;}
body .footer__lang{display:flex;gap:8px;justify-content:center;padding:0 18px 20px;}
body .footer__lang a{font-size:20px;color:#fff;text-decoration:none;}
body .footer__lang-separator{font-size:20px;color:#fff;}
@media (max-width:1024px){
body .footer__container{grid-template-columns:1fr;justify-items:center;text-align:center;gap:22px;}
body .footer__logo{justify-self:center;}
body .footer__right{justify-content:center;}
}
@media (max-width:767px){
body .footer__right{flex-direction:column;align-items:center;gap:20px;}
}

/* === шрифт и доводка подвала как на главной === */
body .contacts, body .contacts *, body .footer, body .footer * { font-family: "TildaSans", -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
body .contact-item__icon { filter: drop-shadow(0 6px 14px rgba(0,0,0,.5)); }
/* активный язык белый, остальные серые */
body .footer__lang-link { color: #8e8e8e !important; }
body .footer__lang-link--active { color: #fff !important; }

/* цветные PNG иконки контактов — без плоской тени, крупнее */
body .contact-item__icon { width: 40px; height: 40px; filter: none; }

/* оранжевый ссылок контактов как на главной (255,138,0) вместо лососевого */
body .contact-item__text a, body .contact-item__text a:link, body .contact-item__text a:visited { color: #FF8A00 !important; }


/* BEESMM: мобильный фон (fixed не рендерится на iOS) */
@media (max-width:900px){
  body::before{position:fixed;top:0;left:0;right:0;bottom:0;height:100vh;background-size:600px auto;background-repeat:repeat;background-position:top center;}
  body{background-image:none !important;}
}


/* BEESMM: значок скидки — рисуем «−N%» из data-p (цифра спрятана из текста, чтобы скрипт корзины читал только цену) */
.c-badge::before{content:"\2212" attr(data-p) "%";}


/* BEESMM: длинный unit (напр. «зрителей прямой эфир (на 15 минут)») — переносим, чтобы не вылезал за карточку */
.pcard .c-unit,.pcard .package-card__label,.c-unit.package-card__label,.c-unit{white-space:normal !important;overflow-wrap:break-word !important;word-break:normal;line-height:1.25;overflow:visible !important;text-overflow:clip !important;}


/* ================================================================
   BEESMM: цвета соцсетей (Вариант А — по классу body.bee-soc-<slug>)
   8 цветовых элементов по памятке. Instagram = дефолт (не переопределяем,
   но добавим для единообразия). Оранжевый Bee НЕ трогаем.
   ================================================================ */

/* --- instagram (дефолт, для единообразия) --- */
.bee-soc-instagram h1 .ig{background:linear-gradient(100deg,#FF7A00 0%,#FF6A0D 22%,#FF3D3A 62%,#FF2D46 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;width:fit-content;padding-right:.16em;}
.bee-soc-instagram .sec-h .ttl em{background:linear-gradient(100deg,#FF7A00 0%,#FF6A0D 22%,#FF3D3A 62%,#FF2D46 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;font-style:normal;}
.bee-soc-instagram .chip{border:1px solid rgba(255,122,0,0.55)!important;background:linear-gradient(90deg,rgba(255,122,0,0.16),rgba(255,45,70,0.16))!important;}
.bee-soc-instagram .hero{background:radial-gradient(120% 120% at 85% 30%,rgba(255,45,70,0.24),transparent 60%),radial-gradient(100% 100% at 20% 0%,rgba(255,122,0,0.3),transparent 55%),linear-gradient(180deg,rgba(16,20,24,.9),rgba(11,12,14,.92))!important;}
.bee-soc-instagram .hicon{filter:drop-shadow(0 0 42px rgba(255,122,0,0.85)) drop-shadow(0 0 62px rgba(255,45,70,0.35))!important;}
.bee-soc-instagram .podium{background:radial-gradient(ellipse at 50% 42%,rgba(255,122,0,0.9),rgba(255,45,70,0.26) 56%,transparent 78%)!important;box-shadow:0 0 70px 22px rgba(255,122,0,0.3)!important;}
.bee-soc-instagram .pB .p.on{border-color:#FF7A00!important;background:linear-gradient(180deg,rgba(255,122,0,0.12),rgba(255,45,70,0.1))!important;box-shadow:inset 0 0 26px rgba(255,122,0,0.22)!important;}
.bee-soc-instagram .modal__submit{background-image:radial-gradient(circle,#3D47D9 0%,#E97CBB 50%,#F9E7BB 100%)!important;}

/* --- tiktok --- */
.bee-soc-tiktok h1 .ig{background:linear-gradient(100deg,#00F2EA 0%,#2EC6CE 22%,#D12C6C 62%,#FF0050 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;width:fit-content;padding-right:.16em;}
.bee-soc-tiktok .sec-h .ttl em{background:linear-gradient(100deg,#00F2EA 0%,#2EC6CE 22%,#D12C6C 62%,#FF0050 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;font-style:normal;}
.bee-soc-tiktok .chip{border:1px solid rgba(0,242,234,0.55)!important;background:linear-gradient(90deg,rgba(0,242,234,0.16),rgba(255,0,80,0.16))!important;}
.bee-soc-tiktok .hero{background:radial-gradient(120% 120% at 85% 30%,rgba(255,0,80,0.24),transparent 60%),radial-gradient(100% 100% at 20% 0%,rgba(0,242,234,0.3),transparent 55%),linear-gradient(180deg,rgba(16,20,24,.9),rgba(11,12,14,.92))!important;}
.bee-soc-tiktok .hicon{filter:drop-shadow(0 0 42px rgba(0,242,234,0.85)) drop-shadow(0 0 62px rgba(255,0,80,0.35))!important;}
.bee-soc-tiktok .podium{background:radial-gradient(ellipse at 50% 42%,rgba(0,242,234,0.9),rgba(255,0,80,0.26) 56%,transparent 78%)!important;box-shadow:0 0 70px 22px rgba(0,242,234,0.3)!important;}
.bee-soc-tiktok .pB .p.on{border-color:#00F2EA!important;background:linear-gradient(180deg,rgba(0,242,234,0.12),rgba(255,0,80,0.1))!important;box-shadow:inset 0 0 26px rgba(0,242,234,0.22)!important;}
.bee-soc-tiktok .modal__submit{background-image:radial-gradient(circle,#E761BD 0%,#83F5E5 100%)!important;}

/* --- telegram --- */
.bee-soc-telegram h1 .ig{background:linear-gradient(100deg,#2AABEE 0%,#29A9EA 22%,#23A0DD 62%,#229ED9 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;width:fit-content;padding-right:.16em;}
.bee-soc-telegram .sec-h .ttl em{background:linear-gradient(100deg,#2AABEE 0%,#29A9EA 22%,#23A0DD 62%,#229ED9 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;font-style:normal;}
.bee-soc-telegram .chip{border:1px solid rgba(42,171,238,0.55)!important;background:linear-gradient(90deg,rgba(42,171,238,0.16),rgba(34,158,217,0.16))!important;}
.bee-soc-telegram .hero{background:radial-gradient(120% 120% at 85% 30%,rgba(34,158,217,0.24),transparent 60%),radial-gradient(100% 100% at 20% 0%,rgba(42,171,238,0.3),transparent 55%),linear-gradient(180deg,rgba(16,20,24,.9),rgba(11,12,14,.92))!important;}
.bee-soc-telegram .hicon{filter:drop-shadow(0 0 42px rgba(42,171,238,0.85)) drop-shadow(0 0 62px rgba(34,158,217,0.35))!important;}
.bee-soc-telegram .podium{background:radial-gradient(ellipse at 50% 42%,rgba(42,171,238,0.9),rgba(34,158,217,0.26) 56%,transparent 78%)!important;box-shadow:0 0 70px 22px rgba(42,171,238,0.3)!important;}
.bee-soc-telegram .pB .p.on{border-color:#2AABEE!important;background:linear-gradient(180deg,rgba(42,171,238,0.12),rgba(34,158,217,0.1))!important;box-shadow:inset 0 0 26px rgba(42,171,238,0.22)!important;}
.bee-soc-telegram .modal__submit{background-image:radial-gradient(circle,#2AABEE 0%,#229ED9 100%)!important;}

/* --- youtube --- */
.bee-soc-youtube h1 .ig{background:linear-gradient(100deg,#FF0000 0%,#F60000 22%,#D50000 62%,#CC0000 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;width:fit-content;padding-right:.16em;}
.bee-soc-youtube .sec-h .ttl em{background:linear-gradient(100deg,#FF0000 0%,#F60000 22%,#D50000 62%,#CC0000 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;font-style:normal;}
.bee-soc-youtube .chip{border:1px solid rgba(255,0,0,0.55)!important;background:linear-gradient(90deg,rgba(255,0,0,0.16),rgba(204,0,0,0.16))!important;}
.bee-soc-youtube .hero{background:radial-gradient(120% 120% at 85% 30%,rgba(204,0,0,0.24),transparent 60%),radial-gradient(100% 100% at 20% 0%,rgba(255,0,0,0.3),transparent 55%),linear-gradient(180deg,rgba(16,20,24,.9),rgba(11,12,14,.92))!important;}
.bee-soc-youtube .hicon{filter:drop-shadow(0 0 42px rgba(255,0,0,0.85)) drop-shadow(0 0 62px rgba(204,0,0,0.35))!important;}
.bee-soc-youtube .podium{background:radial-gradient(ellipse at 50% 42%,rgba(255,0,0,0.9),rgba(204,0,0,0.26) 56%,transparent 78%)!important;box-shadow:0 0 70px 22px rgba(255,0,0,0.3)!important;}
.bee-soc-youtube .pB .p.on{border-color:#FF0000!important;background:linear-gradient(180deg,rgba(255,0,0,0.12),rgba(204,0,0,0.1))!important;box-shadow:inset 0 0 26px rgba(255,0,0,0.22)!important;}
.bee-soc-youtube .modal__submit{background-image:radial-gradient(circle,#FF0000 0%,#CC0000 100%)!important;}

/* --- twitch --- */
.bee-soc-twitch h1 .ig{background:linear-gradient(100deg,#9146FF 0%,#8C41FB 22%,#7C31EC 62%,#772CE8 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;width:fit-content;padding-right:.16em;}
.bee-soc-twitch .sec-h .ttl em{background:linear-gradient(100deg,#9146FF 0%,#8C41FB 22%,#7C31EC 62%,#772CE8 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;font-style:normal;}
.bee-soc-twitch .chip{border:1px solid rgba(145,70,255,0.55)!important;background:linear-gradient(90deg,rgba(145,70,255,0.16),rgba(119,44,232,0.16))!important;}
.bee-soc-twitch .hero{background:radial-gradient(120% 120% at 85% 30%,rgba(119,44,232,0.24),transparent 60%),radial-gradient(100% 100% at 20% 0%,rgba(145,70,255,0.3),transparent 55%),linear-gradient(180deg,rgba(16,20,24,.9),rgba(11,12,14,.92))!important;}
.bee-soc-twitch .hicon{filter:drop-shadow(0 0 42px rgba(145,70,255,0.85)) drop-shadow(0 0 62px rgba(119,44,232,0.35))!important;}
.bee-soc-twitch .podium{background:radial-gradient(ellipse at 50% 42%,rgba(145,70,255,0.9),rgba(119,44,232,0.26) 56%,transparent 78%)!important;box-shadow:0 0 70px 22px rgba(145,70,255,0.3)!important;}
.bee-soc-twitch .pB .p.on{border-color:#9146FF!important;background:linear-gradient(180deg,rgba(145,70,255,0.12),rgba(119,44,232,0.1))!important;box-shadow:inset 0 0 26px rgba(145,70,255,0.22)!important;}
.bee-soc-twitch .modal__submit{background-image:radial-gradient(circle,#9146FF 0%,#772CE8 100%)!important;}

/* --- facebook --- */
.bee-soc-facebook h1 .ig{background:linear-gradient(100deg,#1877F2 0%,#207FF3 22%,#3A9DF4 62%,#42A5F5 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;width:fit-content;padding-right:.16em;}
.bee-soc-facebook .sec-h .ttl em{background:linear-gradient(100deg,#1877F2 0%,#207FF3 22%,#3A9DF4 62%,#42A5F5 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;font-style:normal;}
.bee-soc-facebook .chip{border:1px solid rgba(24,119,242,0.55)!important;background:linear-gradient(90deg,rgba(24,119,242,0.16),rgba(66,165,245,0.16))!important;}
.bee-soc-facebook .hero{background:radial-gradient(120% 120% at 85% 30%,rgba(66,165,245,0.24),transparent 60%),radial-gradient(100% 100% at 20% 0%,rgba(24,119,242,0.3),transparent 55%),linear-gradient(180deg,rgba(16,20,24,.9),rgba(11,12,14,.92))!important;}
.bee-soc-facebook .hicon{filter:drop-shadow(0 0 42px rgba(24,119,242,0.85)) drop-shadow(0 0 62px rgba(66,165,245,0.35))!important;}
.bee-soc-facebook .podium{background:radial-gradient(ellipse at 50% 42%,rgba(24,119,242,0.9),rgba(66,165,245,0.26) 56%,transparent 78%)!important;box-shadow:0 0 70px 22px rgba(24,119,242,0.3)!important;}
.bee-soc-facebook .pB .p.on{border-color:#1877F2!important;background:linear-gradient(180deg,rgba(24,119,242,0.12),rgba(66,165,245,0.1))!important;box-shadow:inset 0 0 26px rgba(24,119,242,0.22)!important;}
.bee-soc-facebook .modal__submit{background-image:radial-gradient(circle,#1877F2 0%,#42A5F5 100%)!important;}


/* BEESMM: табы мобильные — длинные названия («Зрители прямой эфир») не должны вылезать за экран */
@media (max-width:1024px){
  .tabs{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
  .tabs .tab{min-width:0 !important;white-space:normal !important;overflow-wrap:break-word !important;word-break:break-word;line-height:1.15;hyphens:auto;}
}


/* BEESMM: центр заголовка моб — слово соцсети (h1 .ig) по центру на телефонах (было слева из-за fit-content) */
@media (max-width:1024px){
  .hero h1{text-align:center;}
  .hero h1 .ig{margin-left:auto;margin-right:auto;}
}


/* BEESMM: значок страны в заголовке блока подписчиков (планета/флаг) */
.sec-h .ttl .ttl_flag{display:inline-block;width:26px;height:20px;object-fit:contain;vertical-align:-3px;margin-left:6px;}
@media (max-width:600px){.sec-h .ttl .ttl_flag{width:20px;height:16px;vertical-align:-2px;margin-left:4px;}}


/* BEESMM: эмодзи реакций под количеством */
.c-smiles{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px;margin:2px 0 0;line-height:1;}
.c-smiles img.emoji,.c-smiles img{width:17px;height:17px;vertical-align:middle;margin:0;display:inline-block;}
@media (max-width:600px){.c-smiles img.emoji,.c-smiles img{width:14px;height:14px;}}