/* ============================================================
   DEPLOY-MARKER: v3.2 (лого на body-рівні absolute — скролиться з hero, рівень бургера)
   Якщо Ви бачите цей рядок у файлі на сервері — новий CSS залився.
   ============================================================ */
/* Головна — точкові правки композиції (scoped під .home).
   Не зачіпає глобальні класи поза головною: усі селектори під .home. */

/* CSS-змінна для висоти sticky-меню (JS оновлює в site-menu.php).
   Fallback 64px — на випадок, якщо JS ще не виконався. */
:root{
  --nav-h:64px;
  /* === Дизайн-токени (аудит 2026-06-04). Базовий крок сітки — 8px. === */
  /* Відступи */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-6:24px;
  --sp-8:32px; --sp-10:40px; --sp-12:48px; --sp-16:64px;
  /* Вертикальний ритм секцій */
  --section-pad-y:48px; --section-pad-y-mobile:32px;
  /* Кегль: caption-токен для бровок/дрібного (доповнює --fs-* з redesign.css) */
  --fs-caption:12px;
  /* Насиченість Manrope за ролями (для поступової міграції) */
  --fw-eyebrow:850; --fw-heading:700; --fw-strong:800; --fw-body:760;
}

/* Перша секція на сторінках home-v2: відступ під меню за єдиною шкалою (8-px база).
   max() гарантує мінімум 96px зі шкали; calc(--nav-h+16) — точна висота меню + крок 16. */
body.home-v2 .main-section-article:first-of-type{
  padding-top: max(96px, calc(var(--nav-h) + 16px)) !important;
}
@media (max-width:768px){
  body.home-v2 .main-section-article:first-of-type{
    padding-top: max(56px, calc(var(--nav-h) + 16px)) !important;
  }
}

/* 1. ЄДИНИЙ КОНТЕЙНЕР 1140px + узгоджений горизонтальний padding */
.home .main-section > .container,
.home .main-section-article > .container{
  max-width:1140px; width:auto!important;
  margin-left:auto; margin-right:auto;
  padding-left:24px; padding-right:24px;
  box-sizing:border-box;
}
.home #faq{ max-width:1140px!important; padding-left:24px!important; padding-right:24px!important; }
.home .faq-cards-grid,
.home #чого-у-нас-немає .no-grid{ max-width:1140px!important; padding-left:24px!important; padding-right:24px!important; }

/* 1. Прибиваємо контент до однієї лівої межі (центровані заголовки секцій лишаються центрованими) */
.home .main-section-article > .container,
.home .main-section > .container{ text-align:left; }
.home .main-section-article > .container > h2,
.home .main-section > .container > h2,
.home .main-section-article > .container > .h6,
.home .main-section > .container > .h6{ text-align:center; }

/* 3. РЕГІСТР H2 СЕКЦІЙ — звичайний (текст не змінюємо, лише знімаємо uppercase з CSS) */
.home .main-section h2,
.home .main-section-article h2{ text-transform:none; }

/* 4 + ШКАЛА: ритм заголовок → підзаголовок → контент */
.home .main-section h2,
.home .main-section-article h2{ margin:0 0 16px; }            /* заголовок → підзаголовок 16 */
.home .main-section .h6,
.home .main-section-article .h6{ margin:0 0 48px; }           /* підзаголовок → контент 48 */
.home .main-section-article p{ margin:0 0 12px; }             /* абзац → абзац 12 */

/* 1 + ШКАЛА: відступи між секціями 96 (десктоп) */
.home .main-section,
.home .main-section-article{ padding-top:96px!important; padding-bottom:96px!important; }

/* ШКАЛА: картки — gap 24, padding усередині 24 */
.home .faq-cards-grid,
.home #чого-у-нас-немає .no-grid{ gap:24px!important; }
.home .faq-cards-grid .faq-card,
.home #чого-у-нас-немає .no-item{ padding:24px!important; }

/* МОБАЙЛ */
@media (max-width:768px){
  .home .main-section,
  .home .main-section-article{ padding-top:56px!important; padding-bottom:56px!important; }
  .home .main-section > .container,
  .home .main-section-article > .container{ padding-left:16px; padding-right:16px; }
  .home #faq,
  .home .faq-cards-grid,
  .home #чого-у-нас-немає .no-grid{ padding-left:16px!important; padding-right:16px!important; }
  .home .main-section .h6,
  .home .main-section-article .h6{ margin:0 0 32px; }          /* підзаголовок → контент 32 */
  .home .faq-cards-grid,
  .home #чого-у-нас-немає .no-grid{ gap:16px!important; }
  .home .faq-cards-grid .faq-card,
  .home #чого-у-нас-немає .no-item{ padding:20px!important; }
}

/* === Сітка/бровки: єдина ліва лінія всіх бровок === */
/* Секція «Відгуки» мала .container max-width:1160px (решта 1140) → бровка зсувалась
   на ~10px ліворуч. Зводимо до спільної ширини, щоб усі бровки стояли на одній
   вертикалі від лівого краю контент-колонки. */
body.home-v2 #відгуки-англійська > .container{ max-width:1140px!important; } /* !important: new.css підключається пізніше і тією ж специфічністю ставить 1160px */

/* === Футер: видимий, статичний (не липкий), вигляд лишаємо === */
body.home-v2 .footer{ position:static!important; transform:none!important; opacity:1!important; pointer-events:auto!important; display:flex!important; }
body.home-v2 .footer.footer-hidden{ transform:none!important; opacity:1!important; }
/* Футер у самий низ: прибираємо відступ body, зарезервований під колишній фіксований футер */
body.home-v2{ padding-bottom:0!important; margin-bottom:0!important; }

/* === Уніфікація контентних розділів: одна ширина / одна ліва лінія (десктоп) === */
/* Прибираємо легасі Bootstrap-офсети (від'ємні поля .row + порожні col-1), щоб
   контент усіх контентних секцій починався від лівого краю контейнера (≈167px),
   як і бровки. CTA-картки (Давайте разом / Який рівень / Обговоримо) НЕ чіпаємо —
   вони лишаються навмисно вужчими й центрованими. */
@media (min-width:769px){
  body.home-v2 .main-section .container > .row{ margin-left:0!important; margin-right:0!important; }
  body.home-v2 .main-section .container > .row > .col-lg-1,
  body.home-v2 .main-section .container > .row > .col-sm-1{ display:none!important; }
  body.home-v2 .main-section .container > .row > [class*="col-"]:first-child{ padding-left:0!important; }
}

/* === Меню: перемикач мов — окремий glass-pill у правому верхньому кутку === */
body.home-v2 .bl-nav__lang{
  position:fixed!important; top:14px!important; right:16px!important; left:auto!important; bottom:auto!important;
  transform:none!important; z-index:1002!important;
  background:rgba(255,255,255,.5)!important; -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.6)!important; border-radius:999px!important; padding:7px 13px!important;
}
/* Десктоп (2026-06-05): меню-пігулка по ЦЕНТРУ екрана; перемикач мов винесено
   з меню в окрему скляну плашку у правому верхньому куті (та сама прозорість, що й меню). */
@media (min-width:769px){
  body.home-v2 .bl-nav{ left:0!important; right:0!important; transform:none!important;   /* центр через margin:auto, БЕЗ transform — інакше fixed-плашка мови рахується від меню */
    margin-left:auto!important; margin-right:auto!important; width:max-content!important; max-width:calc(100% - 36px)!important;
    background:linear-gradient(180deg,rgba(255,255,255,.20),rgba(255,255,255,.08))!important; }
  body.home-v2 .bl-nav__shell{ display:flex!important; align-items:center!important; gap:18px!important;
    width:auto!important; max-width:none!important; padding-left:26px!important; padding-right:26px!important; }
  /* мова — ОКРЕМА плашка, правий верх, скло такої ж прозорості, як меню */
  body.home-v2 .bl-nav__lang{ position:fixed!important; top:14px!important; right:25px!important; left:auto!important; bottom:auto!important;
    transform:none!important; margin:0!important; z-index:1002!important;
    background:linear-gradient(180deg,rgba(255,255,255,.20),rgba(255,255,255,.08))!important;
    -webkit-backdrop-filter:blur(24px) saturate(1.16); backdrop-filter:blur(24px) saturate(1.16);
    border:1px solid rgba(255,255,255,.40)!important; border-radius:999px!important; padding:9px 16px!important; }
}
/* Мобайл: бургер-скло ліворуч + лого центр; перемикач у кутку; «Контакти» лише в меню */
@media (max-width:768px){
  body.home-v2 .bl-nav__shell{ display:flex!important; justify-content:flex-start!important; align-items:center!important; }
  body.home-v2 .bl-nav__burger{ justify-self:start!important;
    background:rgba(255,255,255,.18)!important; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
    border:1px solid rgba(255,255,255,.34)!important; border-radius:13px!important; }
  body.home-v2 .bl-nav__mobile-logo{ display:none!important; }       /* лого винесено в hero (.hero-logo) */
  body.home-v2 .bl-nav__mobile-contact{ display:none!important; }
  body.home-v2 .bl-nav__lang{ display:none!important; }               /* перемикач мов — у бургер-меню (.bl-nav__lang-item) */
}

/* === Канали зв'язку у потоці сторінки (2026-06-07, замінили фіксований floatbar) ===
   .bl-chrow — спільний ряд кнопок (contact-channels.php): CTA-капсула головної + футер.
   Токени СІТКА.md; фолбеки — для внутрішніх сторінок, де new.css (:root) не вантажиться. */
.bl-chrow{ display:flex; flex-wrap:wrap; justify-content:center; gap:var(--bl-space-8,8px); }
.bl-chrow__btn{ display:inline-flex; align-items:center; justify-content:center; gap:var(--bl-space-8,8px);
  min-height:48px; padding:0 var(--bl-space-20,20px); border-radius:var(--bl-radius-sm,14px);
  background:#fff; border:var(--bl-border,1px solid rgba(15,23,42,.065));
  box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055));
  color:var(--bl-text,rgba(15,23,42,.92)); font-size:var(--bl-fs-14,14px); font-weight:760; line-height:var(--bl-lh-solid,1);
  text-decoration:none; transition:background .15s; }
.bl-chrow__btn:hover{ background:rgba(47,96,117,.06); }
.bl-chrow__btn:active{ background:rgba(47,96,117,.10); }
.bl-chrow__btn svg{ color:var(--bl-blue,#2F6075); width:20px; height:20px; flex:0 0 auto; }
@media (max-width:768px){
  .bl-chrow{ display:grid; grid-template-columns:repeat(4,1fr); width:100%; }
  .bl-chrow__btn{ flex-direction:column; gap:var(--bl-space-4,4px); min-height:56px;
    padding:var(--bl-space-8,8px) var(--bl-space-4,4px); font-size:var(--bl-fs-11,11px); }
  .bl-chrow__btn svg{ width:22px; height:22px; }
}

/* CTA-капсула «Записатися» (cta-channels.php + футер) — світла, у потоці.
   Заголовок НАД кнопками на всіх брейкпоінтах (рішення 08.06: зліва губився,
   колонка повторює мобільну логіку); десктоп — більше повітря 32/40. */
.bl-ctaband{ width:max-content; max-width:min(1120px,100% - 32px); margin:0 auto;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--bl-space-16,16px);
  padding:var(--bl-space-32,32px) var(--bl-space-40,40px);
  background:var(--bl-card,rgba(255,255,255,.86));
  border:var(--bl-border,1px solid rgba(15,23,42,.065)); border-radius:var(--bl-radius-xl,32px);
  box-shadow:var(--bl-shadow,0 12px 38px rgba(15,23,42,.07)); }
.bl-ctaband__title{ font-size:var(--bl-fs-14,14px); font-weight:850; letter-spacing:.06em; text-transform:uppercase;
  color:var(--bl-blue,#2F6075); white-space:nowrap; line-height:var(--bl-lh-heading,1.2); }
@media (max-width:768px){
  .bl-ctaband{ width:auto; max-width:calc(100% - 32px); gap:var(--bl-space-12,12px);
    padding:var(--bl-space-20,20px) var(--bl-space-16,16px); border-radius:var(--bl-radius-lg,24px); }
}

/* === Піщана CTA-секція «Записатися» (cta-channels.php) — Варіант 1 (2026-06-09) ===
   Тепла кремова підкладка #F4EFE8 (канвас hero, у гамі) + teal-акцент: м'який розрив
   ритму без «важкості» (темну teal-смугу відкочено — мрачно). Скоуп ЛИШЕ .bl-cta .bl-ctaband--sand;
   футерний .bl-ctaband лишається світлим. Кнопка — hero-лого-градієнт. Токени + px-фолбеки. */
.bl-cta .bl-ctaband--sand{ width:100%; max-width:1120px; gap:var(--bl-space-16,16px);
  padding:var(--bl-space-48,48px) var(--bl-space-40,40px);
  background:#F4EFE8; border:1px solid rgba(20,35,60,.06);
  box-shadow:0 16px 44px rgba(20,35,60,.08); }
.bl-cta .bl-ctaband--sand .bl-ctaband__eyebrow{ font-size:var(--bl-fs-12,12px); font-weight:850;
  letter-spacing:.12em; text-transform:uppercase; line-height:var(--bl-lh-heading,1.2); color:var(--bl-blue,#2F6075); }
.bl-cta .bl-ctaband--sand .bl-ctaband__title2{ margin:0; max-width:22ch; text-align:center;
  font-size:var(--bl-fs-30,30px); line-height:var(--bl-lh-heading,1.2); font-weight:700; color:var(--bl-text,rgba(15,23,42,.92)); }
.bl-cta .bl-ctaband--sand .bl-ctaband__sub{ margin:0; max-width:46ch; text-align:center;
  font-size:var(--bl-fs-16,16px); line-height:var(--bl-lh-body,1.6); color:var(--bl-muted,rgba(15,23,42,.66)); }
.bl-cta .bl-ctaband--sand .bl-chrow{ margin-top:var(--bl-space-4,4px); }
@media (max-width:768px){
  .bl-cta .bl-ctaband--sand{ padding:var(--bl-space-32,32px) var(--bl-space-16,16px); border-radius:var(--bl-radius-lg,24px); }
  .bl-cta .bl-ctaband--sand .bl-ctaband__title2{ font-size:var(--bl-fs-24,24px); }
}
/* Варіант 1 (09.06, пізніше): band «Перший крок» став формою — поле телефону в потоці
   замість кнопки-якоря (прибрано зворотний скрол до дубль-форми «Давайте разом»). Сабміт —
   лого-градієнт (зберігає прайм-вагу зони рішення); «або в месенджер» — м'який місток до .bl-chrow. */
.bl-cta .bl-ctaband--sand .cta-unified{ margin-top:var(--bl-space-8,8px); width:100%; max-width:440px; }
.bl-cta .bl-ctaband--sand .cta-unified button[type=submit]{
  background:linear-gradient(135deg,#3A7690 0%,#244A5B 100%); color:#fff; border:none; }
.bl-cta .bl-ctaband--sand .cta-unified button[type=submit]:hover,
.bl-cta .bl-ctaband--sand .cta-unified button[type=submit]:focus-visible{
  background:linear-gradient(135deg,#3A7690 0%,#244A5B 100%); color:#fff; }
.bl-cta .bl-ctaband--sand .bl-ctaband__or{ margin:var(--bl-space-4,4px) 0 0; text-align:center;
  font-size:var(--bl-fs-13,13px); line-height:var(--bl-lh-body,1.6); color:var(--bl-muted,rgba(15,23,42,.62)); }

/* Класичний футер (footer.php) — усі сторінки; .bl-footer перебиває легасі
   footer{position:fixed;…;z-index:9999} із bundle.min/bundle.slim */
.bl-footer{ position:static; width:100%; box-sizing:border-box; z-index:auto;
  padding:var(--bl-space-40,40px) var(--bl-space-16,16px) var(--bl-space-32,32px);
  background:var(--bl-soft,#F8FAFC); border-top:var(--bl-border,1px solid rgba(15,23,42,.065)); box-shadow:none; }
.bl-footer__in{ max-width:1120px; margin:0 auto; display:flex; flex-direction:column; align-items:center; gap:var(--bl-space-16,16px); }
/* у футері «Записатися» — та сама CTA-капсула .bl-ctaband (одна мова дизайну з головною);
   max-width:100% — капсула в контейнері footer__in, а не у вʼюпорті */
.bl-footer .bl-ctaband{ max-width:100%; }
/* Курсові сторінки: сильна CTA-band з інлайн-формою (footer-cta.php) над мета-рядком — на всю ширину footer__in. */
.bl-footer .bl-footer-cta{ width:100%; }
.bl-footer .bl-footer-cta .bl-ctaband--sand{ width:100%; max-width:100%; }
/* A (2026-06-09): на курсових футер БІЛИЙ (не прохолодно-сірий) — піщана band стоїть на білому,
   як на головній. Прибирає темпратурний клеш «тепле на холодному» і «картку на панелі». */
body.course-page .bl-footer{ background:#fff; border-top:0; }
.bl-footer .bl-chrow{ justify-content:center; }
/* метарядок — один inline-рядок «© · гео · тел · мови»: крапки-розділювачі переносяться природно;
   волосяна лінія зверху (2026-06-11) — «фундамент» футера, ширина = константа 680 */
.bl-footer .bl-footer__meta{ margin:var(--bl-space-16,16px) auto 0; text-align:center;
  width:100%; max-width:680px; padding-top:var(--bl-space-24,24px); border-top:1px solid rgba(15,23,42,.08);
  font-size:var(--bl-fs-14,14px); line-height:var(--bl-lh-body,1.5); color:var(--bl-muted,rgba(15,23,42,.66)); }
.bl-footer__tel{ color:var(--bl-blue,#2F6075); font-weight:760; text-decoration:none; white-space:nowrap; }
.bl-footer__tel:hover{ text-decoration:underline; }
.bl-footer__lang{ white-space:nowrap; }
.bl-footer__lang a{ color:var(--bl-blue,#2F6075); font-weight:760; text-decoration:none; }
.bl-footer__lang a:hover{ text-decoration:underline; }
.bl-footer__lang .bl-lang-cur{ font-weight:850; color:var(--bl-text,rgba(15,23,42,.92)); }
/* Футер-навігація v2 (2026-06-11): 4 групи у 3 колонках (середня — дві групи
   одна над одною), спільна ширинна константа з CTA-капсулою — 680px
   (min-width капсули = width навігації, десктоп; без JS-вимірювань).
   Метарядок відбито волосяною лінією — «фундамент» блока. */
.bl-footer__nav{ display:grid; grid-template-columns:auto auto auto; justify-content:space-between;
  column-gap:var(--bl-space-40,40px);
  width:100%; max-width:680px; margin:var(--bl-space-8,8px) auto 0; }
.bl-footer__col-t{ display:block; margin-bottom:var(--bl-space-12,12px); font-size:var(--bl-fs-12,12px); font-weight:850;
  letter-spacing:.14em; text-transform:uppercase; color:var(--bl-muted,rgba(15,23,42,.52)); }
.bl-footer__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--bl-space-12,12px); }
.bl-footer__list + .bl-footer__col-t{ margin-top:var(--bl-space-24,24px); } /* друга група в колонці */
.bl-footer__list a{ font-size:var(--bl-fs-14,14px); line-height:var(--bl-lh-body,1.5);
  color:var(--bl-muted,rgba(15,23,42,.66)); text-decoration:none; }
.bl-footer__list a:hover{ color:var(--bl-blue,#2F6075); text-decoration:underline; }
@media (min-width:769px){
  .bl-footer .bl-ctaband{ min-width:680px; } /* = max-width .bl-footer__nav: спільна ширинна константа */
}
@media (max-width:768px){
  .bl-footer{ padding:var(--bl-space-32,32px) var(--bl-space-16,16px) var(--bl-space-24,24px); }
  .bl-footer .bl-chrow{ max-width:480px; }
  /* Мобайл (2026-06-11, патерн Apple): групи одна під одною на всю ширину,
     заголовки — горизонтальні роздільники; список кожної групи — у 2 CSS-колонки.
     Жодної двоколонкової кладки різнорідних блоків — без зависань і дірок. */
  .bl-footer__nav{ display:block; max-width:480px; }
  .bl-footer__nav .bl-footer__col + .bl-footer__col{ margin-top:var(--bl-space-24,24px); }
  .bl-footer__list{ display:block; column-count:2; column-gap:var(--bl-space-24,24px); }
  .bl-footer__list li{ break-inside:avoid; margin-bottom:var(--bl-space-12,12px); }
  .bl-footer__list li:last-child{ margin-bottom:0; }
  .bl-footer__list a{ font-size:var(--bl-fs-13,13px); }
}

/* === Узгодження заголовків/бровок (дизайн-аудит 2026-06-04, гібрид) ===
   Раніше: бровка ліворуч (167), а h2 центрований блок 920px (253) → різнобій.
   Рішення: де контент лівобічний — заголовок ліворуч; де центрований — бровку теж по центру. */
@media (min-width:769px){
  /* Прайс лишається вужчим/центрованим (дефолт redesign.css: max-width:920px; margin:30px auto). */

  /* R1 ЛІВА група (контент лівобічний на 167): заголовок ліворуч, на лінію контенту.
     «Чого у нас немає» винесено в центр — див. нижче (правка 2026-06-04 #4). */
  body.home-v2 #курси-англійської-харків > .container h2,
  body.home-v2 #як-ми-навчаємо > .container h2{
    max-width:none!important; margin-left:0!important; margin-right:0!important; text-align:left!important;
  }

  /* R2 Відгуки — ряд по центру (під центрованим заголовком), замість колишнього лівого притискання. */
  body.home-v2 #відгуки-англійська .container > .row{ margin-left:auto!important; margin-right:auto!important; }

  /* перемикач мов у бургер-меню — лише мобайл (кутове hero-лого видалено з розмітки 07.06 — kicker) */
  body.home-v2 .bl-nav__lang-item{ display:none!important; }
}
/* Мобайл: бар-контейнер прозорий — лишається лише бургер ліворуч; лого в hero; мови в бургер-меню */
@media (max-width:768px){
  body.home-v2 .bl-nav{ left:10px!important; right:auto!important; transform:none!important;
    width:auto!important; max-width:calc(100% - 20px)!important;
    background:transparent!important; border:none!important; box-shadow:none!important;
    -webkit-backdrop-filter:none!important; backdrop-filter:none!important; }
  /* бургер-меню: фіксована ширина під бургером (інлайн head.php #mobile-nav-tidy лишає
     left:0;right:0;width:auto → за вузького .bl-nav меню стискалось у смужку) */
  body.home-v2 .bl-nav__menu{ left:0!important; right:auto!important;
    width:min(300px, calc(100vw - 24px))!important; }
  /* перемикач мов — рядок усередині відкритого бургер-меню */
  body.home-v2 .bl-nav__menu .bl-nav__lang-item{ display:block!important; margin-top:2px; padding-top:4px;
    border-top:1px solid rgba(15,23,42,.08); }
  body.home-v2 .bl-nav__lang-item .bl-nav__lang-row{ display:flex!important; gap:22px; align-items:center;
    padding:11px 13px; font-size:15px; font-weight:820; }
  body.home-v2 .bl-nav__lang-item a,
  body.home-v2 .bl-nav__lang-item span{ color:rgba(47,96,117,.72)!important; text-decoration:none; }
  /* Кутове hero-лого (.hero-logo) видалено з розмітки 07.06 — брендинг переніс kicker над H1. */
  /* Mobile-центрування копі (Варіант 2, 08.06): new.css дає .hero-container align-items:flex-start
     + padding-top calc(nav-h+108) → блок «висів» угорі з ~30% порожнечі внизу. Перемикаємо на center
     зі збалансованим padding: верх = nav-h+24 (мінімальний інсет, бургер низ ~52px не зачіпає),
     низ 40px; align-items:center розподіляє порожнечу симетрично — кадр заповнений. */
  body.home-v2 #hero-top{ align-items:center!important;
    padding-top:calc(var(--nav-h,58px) + var(--bl-space-24,24px))!important;
    padding-bottom:160px!important; } /* оптичний центр (QA 08.06): блок був низько (272/154);
    при align-items:center приріст padding-bottom піднімає блок на половину → +120px тут = ~60px вище
    (баланс ~212/214). 160 кратне 4; структурний hero-відступ, поза іменованими токенами шкали. */
  body.home-v2 .hero-copy{ margin-top:0!important; }
}

/* === Hero-заголовок одним кеглем (2026-06-07): «Преміум-курси англійської онлайн, після яких Ви».
   Прибрано дисплейне слово (72–102px) + менший підрядок; увесь h1 — роль Hero H1 за сіткою §9:
   desktop --bl-fs-h1 (38–58), mobile 26px зі шкали (фраза довга — 34px дає 4–5 рядків у 272px),
   інтерліньяж --bl-lh-display, вага 820, letter-spacing -.02em (заголовки за сіткою). === */
body.home-v2 .hero-claim{ font-size:clamp(38px,3.4vw,50px)!important; line-height:var(--bl-lh-display)!important;
  font-weight:600; letter-spacing:-.02em; color:#2B3446; /* desktop-кегль стиснуто 58→50 (QA 08.06): менша «стіна» при 3-рядковому переносі,
  присутність лишається; --bl-fs-h1 (clamp 38-58) використовувався ТІЛЬКИ цим hero — замінено локальним клемпом, токен не чіпаємо.
  Ведення display(1.1) — для desktop ок; mobile-ведення нижче (heading 1.2). Вага 600, колір hero-палітри. */ }
/* Мікрорядок «Вам відповідає засновник» (10.06): повернуто з eyebrow над H1 під CTA — trust-підпис
   у точці дії (відповідає на «хто підбиратиме?» в момент кліку); шлях до h1 коротший на один шар.
   Caps-стиль лейбла збережено (850/.14em/muted — система ваг). Скидаємо легасі p із bundle.min. */
body.home-v2 .heroK-note{ margin:var(--bl-space-16,16px) 0 0; font-size:var(--bl-fs-12,12px);
  line-height:var(--bl-lh-heading,1.2); font-weight:850; letter-spacing:.14em; text-transform:uppercase;
  color:var(--bl-muted,rgba(15,23,42,.66)); }
@media (max-width:768px){
  body.home-v2 .heroK-note{ margin-top:var(--bl-space-12,12px); font-size:var(--bl-fs-11,11px); letter-spacing:.10em; }
}
body.home-v2 .hero-claim__word,
body.home-v2 .hero-claim__sub{ display:block; margin:0!important;
  font-size:inherit!important; line-height:inherit!important; font-weight:inherit!important;
  letter-spacing:inherit!important; color:inherit!important; text-shadow:none!important; }
/* двотонний h1: підрядок-місток приглушений. Синій із тексту hero прибрано (рішення 08.06):
   єдиний синій об'єкт у hero — CTA-кнопка, текст без кольорових акцентів; «Преміум» успадковує
   колір h1. Спан .hero-claim__accent лишається в розмітці заради повного reset'у — глобальне
   span{font-size:40px;font-weight:500;letter-spacing:-1px;margin:0 0 22px} із легасі
   bundle.min.css інакше робить «Преміум» меншим/тоншим за решту h1 і ламає інтерліньяж рядка. */
body.home-v2 .hero-claim__sub{ color:rgba(43,52,70,.72)!important; }
body.home-v2 .hero-claim__accent{ display:inline; margin:0!important;
  font-size:inherit!important; font-weight:inherit!important; line-height:inherit!important;
  letter-spacing:inherit!important; font-family:inherit!important;
  color:inherit!important; text-shadow:none!important; }
/* balance: без сироти «онлайн,» окремим рядком на десктопі */
body.home-v2 .hero-claim__word{ text-wrap:balance; }
/* Нейтралізація легасі redesign.css 174–175 (#header h1 span:first-child{lh:1.15;mb:24}!important,
   span:not(:first-child){lh:1.3;mb:8}!important — під старий дворівневий h1): їхня ID-специфічність (1,2,3)
   перебивала наші (0,2,1)-правила і ламала інтерліньяж та відступи нового одно-кегльового h1
   («дивний інтерліньяж і нерівні відступи»). Селектори нижче — (1,3,2): перемагають і йдуть пізніше. */
body.home-v2 #header .hero-claim span.hero-claim__word,
body.home-v2 #header .hero-claim span.hero-claim__sub,
body.home-v2 #header .hero-claim span.hero-claim__accent{ line-height:inherit!important; margin:0!important; }
/* усі 3 рядки h1 — однаковий інтерліньяж (1.1), без додаткового повітря перед «після яких Ви» (рішення 07.06) */
@media (max-width:768px){
  body.home-v2 .hero-claim{ font-size:var(--bl-fs-26)!important; line-height:var(--bl-lh-heading,1.2)!important; } /* ведення 1.1→1.2 (QA 08.06): 26px — заголовок, не дисплей; кирилиця просить простору між рядками */
  /* копі ширше (272 замість 240): «Преміум-курси / англійської онлайн, / після яких Ви» — 3 рядки без розриву по дефісу */
  body.home-v2 .hero-copy{ width:calc(100% - 24px)!important; }
}
/* Прайс-секція: контейнер центрується дефолтом Bootstrap .container (як решта секцій) — окреме правило прибрано. */

/* === R3: вертикальний ритм — токени + виняток «Нам-довіряють» (аудит 2026-06-04).
   Решта розділів уже 48/48 (десктоп) і 32/32 (мобайл) — у ритмі. Тут лише довірча смуга: 24/48 і 16/32. === */
@media (min-width:769px){
  body.home-v2 #Нам-довіряють{ padding-top:var(--sp-6)!important; padding-bottom:var(--section-pad-y)!important; } /* 24 / 48 */
}
@media (max-width:768px){
  body.home-v2 #Нам-довіряють{ padding-top:var(--sp-4)!important; padding-bottom:var(--section-pad-y-mobile)!important; } /* 16 / 32 */
}

/* === R4: підрівняння до сітки (радіуси/відступи/кегль) — аудит 2026-06-04 === */
/* Радіус 28→24 (--bl-radius-lg): уніфікація з рештою карток. */
body.home-v2 #відгуки-англійська .carousel-wrapper,
body.home-v2 #відгуки-англійська .featured-work,
body.home-v2 #як-ми-навчаємо .school-experience__content{ border-radius:var(--bl-radius-lg,24px)!important; }
/* Відступи поза кроком → у сітку. */
body.home-v2 #досягнення .achv-card{ padding:var(--sp-6) var(--sp-4)!important; }        /* 26 16 → 24 16 */
body.home-v2 #як-ми-навчаємо .school-experience__content{ padding:var(--sp-8)!important; } /* 34 → 32 */
@media (max-width:768px){
  body.home-v2 #як-ми-навчаємо .school-experience__content{ padding:var(--sp-6)!important; } /* 26 → 24 (мобайл) */
}
/* Hero-нотатку .bl-fc__note прибрано з розмітки 2026-06-07 (дубль із мікрорядком .heroK-note). */

/* === R5: ваги/інтерліньяж. (Оновлено 2026-06-07: за підтвердженою консультацією проміжні ваги
   уніфіковано — див. секцію «Типографічна уніфікація» наприкінці файла.) === */

/* ===================== Дизайн-правки 2026-06-04 (ітерація 2) ===================== */

/* #3: бровки прибрано. JS більше не інжектить бровки; лишилася лише «СТАРТ»,
   захардкоджена в розмітці (teaching.php). CSS-приховування інших бровок більше не потрібне. */

/* #4: «Чого у нас немає» — заголовок по центру. */
@media (min-width:769px){
  body.home-v2 #чого-у-нас-немає > .container h2{
    max-width:920px!important; margin-left:auto!important; margin-right:auto!important; text-align:center!important;
  }
}

/* #1 + вирівнювання (2026-06-04): заголовок «Навчання під Ваше життя» перенесено в ліву колонку (розмітка sections.php).
   Ряд — flex + align-items:stretch: ВЕРХ фото = верх заголовка; колонки однакової висоти.
   Фото заповнює всю висоту колонки (picture flex:1 + img absolute cover) — НИЗ підпису = низ останнього рядка тексту.
   object-position збережено вгору, щоб не зрізати обличчя. */
@media (min-width:992px){
  body.home-v2 #курси-англійської-харків .row{ display:flex!important; align-items:stretch!important; column-gap:var(--bl-space-32,32px)!important; } /* боковий зазор фото↔тези (desktop): +32px до 2×15px col-падінгів ≈ 62px (2026-06-09) */
  body.home-v2 #курси-англійської-харків .row > .col-lg-1{ display:none!important; }
  body.home-v2 #курси-англійської-харків .col-lg-6.featured-work{ float:none!important; width:auto!important; flex:1 1 0!important;
    padding-left:0!important; } /* знімаємо col-падінг 15px: h2 стає вровінь із контент-краєм контейнера (інші блоки) */
  body.home-v2 #курси-англійської-харків .featured-work .service-list{ margin-left:0!important; } /* компенсація легасі -16px: іконки на той самий край, що й h2 */
  body.home-v2 #курси-англійської-харків .col-lg-6.featured-work > h2{ text-align:left!important; max-width:none!important; margin:0 0 var(--bl-space-32)!important; } /* повітря під заголовком: 18→32 (крок шкали) */
  body.home-v2 #курси-англійської-харків figure.col-lg-5{ float:none!important; width:auto!important; flex:1 1 0!important; margin:0!important;
    display:flex!important; flex-direction:column!important; }
  body.home-v2 #курси-англійської-харків figure.col-lg-5 picture{ position:relative!important; display:block!important; flex:1 1 0!important; min-height:0!important; }
  body.home-v2 #курси-англійської-харків figure.col-lg-5 img{ position:absolute!important; inset:0!important; width:100%!important; height:100%!important;
    object-fit:cover!important; object-position:50% 26%!important; border-radius:var(--bl-radius-lg,24px)!important; }
  body.home-v2 #курси-англійської-харків figure.col-lg-5 figcaption{ flex:0 0 auto!important; margin-top:12px!important; }
}

/* Мобайл (≤767px, колонки stacked): відбити фото від карток-тез — без відступу зливалося з блоком вище (2026-06-09) */
@media (max-width:767px){
  body.home-v2 #курси-англійської-харків figure.col-lg-5{ margin-top:var(--bl-space-32,32px)!important; }
}

/* #2: «Онлайн, але не конвеєр» — медіа-колонка на одну висоту з текстом (верх і низ урівень).
   Сітка була align-items:center (медіа центрувалась у вищій текстовій → зазор ~23px зверху/знизу).
   Stretch + розподіл space-between: головне фото вгорі, міні-сітка внизу, надлишок — у проміжок (без обрізання). */
@media (min-width:769px){
  body.home-v2 #як-ми-навчаємо .school-experience{ align-items:stretch!important; }
  body.home-v2 #як-ми-навчаємо .school-experience__media{ display:flex!important; flex-direction:column!important; justify-content:space-between!important; }
}

/* === Hero CTA-кнопка «Підібрати мій формат» — головні uk/ru/en + експеримент (2026-06-05, ширша пігулка 2026-06-07) === */
body.home-v2 .header .heroK-cta{ display:inline-flex; align-items:center; gap:10px; margin-top:48px; /* перед-CTA найбільший крок ритму (40→48, Варіант 2) */
  padding:16px 48px; border-radius:999px; color:#fff; /* 48px — крок шкали 4px */
  background:linear-gradient(135deg,#3A7690 0%,#244A5B 100%); /* лого-градієнт сталь→чорнило (БРІФ v4); світлий стоп #3A7690 = білий текст 5.03:1 */
  font-weight:800; font-size:18px; line-height:1; letter-spacing:normal; text-decoration:none; /* 17→18 у шкалу §9; normal явно — щоб спани не успадкували легасі -1px із bundle.min.css */
  box-shadow:0 14px 30px rgba(36,74,91,.48), inset 0 1px 0 rgba(255,255,255,.22); /* hero: щільніша тінь .48 через світлий відеофон */
  transition:transform .15s, box-shadow .15s, background .15s; }
body.home-v2 .header .heroK-cta:hover{ transform:translateY(-2px);
  background:linear-gradient(135deg,#356D86 0%,#1C3D4C 100%);
  box-shadow:0 16px 34px rgba(36,74,91,.50), inset 0 1px 0 rgba(255,255,255,.24); }
body.home-v2 .header .heroK-cta:active{ transform:translateY(0); /* кнопка «сідає»: підйом прибрано, зовнішня тінь менша + внутрішня */
  background:linear-gradient(135deg,#2F6075 0%,#173643 100%);
  box-shadow:inset 0 2px 6px rgba(0,0,0,.20), 0 4px 10px rgba(36,74,91,.28); }
body.home-v2 .header .heroK-cta:focus-visible{ outline:none; /* видиме кільце за формою пігулки (WCAG 2.1/2.2 AA) */
  box-shadow:0 0 0 3px rgba(58,118,144,.38), 0 14px 30px rgba(36,74,91,.48), inset 0 1px 0 rgba(255,255,255,.22); }
/* скидаємо легасі span{font-size:40px;font-weight:500;letter-spacing:-1px;margin:0 0 22px} із bundle.min.css:
   без цього текст кнопки рендериться Manrope 500 зі стиснутим трекінгом -1px замість 800/.02em */
body.home-v2 .header .heroK-cta > span{ font-size:inherit; font-weight:inherit; letter-spacing:inherit; line-height:1.2; margin:0; }
body.home-v2 .header .heroK-cta svg{ flex:0 0 auto; transition:transform .2s ease; }
body.home-v2 .header .heroK-cta:hover svg{ transform:translateX(4px); }
.heroK-cta__short{ display:none; }   /* короткий напис — лише мобайл */
@media (max-width:768px){
  body.home-v2 .header .heroK-cta{ margin-top:40px; padding:16px 32px; font-size:16px; } /* mobile: перед-CTA 32→40; padding 14→16 у шкалу */
  .heroK-cta__full{ display:none; }
  .heroK-cta__short{ display:inline; }
}

/* Тези «Навчання під Ваше життя» (3 тези, 2026-06-08): fs-30 desktop / fs-24 mobile (нові кроки шкали;
   фолбеки — на випадок кешованого new.css без токенів). Колір — другорядний сірий rgba(43,52,70,.72)
   із двох рівнів типографічної системи (не суцільний чорний); ієрархію з h2 секції тримає колір. */
body.home-v2 #курси-англійської-харків .featured-work .service-list-col2 .h3{
  font-size:var(--bl-fs-30,30px) !important;
  font-weight:800 !important;
  line-height:var(--bl-lh-heading) !important;
  color:rgba(43,52,70,.72) !important;
  margin:0 !important;
}
/* Капсули тез (варіант C, 2026-06-08): кожна теза — міні-картка в мові карток сторінки
   («Чого у нас немає»): фон --bl-card, бордер --bl-border, радіус lg, м'яка тінь.
   Розмітка не змінювалась — стилі на наявних .service-list. Вищі капсули + stretch-ряд
   зменшують кроп фото поруч. !important на padding/margin — перебиває redesign.css
   (padding:0/margin-bottom:24px з !important). Flex — іконка по центру тексту. */
body.home-v2 #курси-англійської-харків .featured-work .service-list{
  display:flex !important; align-items:center !important;
  background:var(--bl-card,rgba(255,255,255,.86));
  border:var(--bl-border,1px solid rgba(15,23,42,.065));
  border-radius:var(--bl-radius-lg,24px);
  box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055));
  padding:var(--bl-space-24,24px) !important;
  margin-bottom:var(--bl-space-24,24px) !important;
}
body.home-v2 #курси-англійської-харків .featured-work .service-list:last-child{ margin-bottom:0 !important; }
@media (max-width:768px){
  body.home-v2 #курси-англійської-харків .featured-work .service-list-col2 .h3{
    font-size:var(--bl-fs-24,24px) !important;
  }
  body.home-v2 #курси-англійської-харків .featured-work .service-list{
    padding:var(--bl-space-16,16px) !important;
    margin-bottom:var(--bl-space-12,12px) !important;
  }
}

/* === Типографічна уніфікація головної (2026-06-07, підтверджена консультація) ===
   Система: ТРИ робочі ваги — 850 (eyebrow caps і дисплейні числа) / 800 (заголовки, акценти,
   перший hero-результат) / 600 (текст, підписи, другорядне). Проміжні 720/740/750/760/770/780/820 → у систему.
   ДВА рівні сірого тексту: основний rgba(43,52,70,.92), другорядний rgba(43,52,70,.72)
   (.72 замість .64 з консультації — щоб тримати WCAG AA ≥4.5:1 на світлому фоні hero/секцій). */

/* hero: три тези (Варіант 2, 08.06) — двотон + один акцент-рядок замість рівного блоку 800/.92.
   Кегль зі шкали (fs-30 desktop / fs-18 mobile — модульні співвідношення 1.93 / 1.44).
   Маса «глиби» прибирається вагою й кольором: акцент-рядок 1 «говорите вільно» 700/.92 (точка
   входу), рядки 2–3 — 600/.72 (другорядний рівень). Інтерліньяж heading→sub (1.2→1.3) для повітря.
   Перебиває new.css: clamp(24–31)/740/-.028em desktop, clamp(17–19) mobile, 16.5px ≤380px. */
body.home-v2 .hero-result-line{ font-size:var(--bl-fs-30,30px)!important; line-height:var(--bl-lh-sub,1.3)!important;
  font-weight:600!important; letter-spacing:-.02em!important; color:rgba(43,52,70,.72)!important; }
body.home-v2 .hero-result-line:first-child{ font-weight:700!important; color:rgba(43,52,70,.92)!important; }
@media (max-width:768px){
  body.home-v2 .hero-result-line{ font-size:var(--bl-fs-18,18px)!important; }
}

/* .heroK-wrap — обгортка CTA + мікрорядок .heroK-note під кнопкою (повернуто 10.06; стилі — вище, секція hero).
   width:max-content стискає обгортку до ширини пігулки → align-items:center центрує підпис відносно
   КНОПКИ, а не колонки (рішення 10.06: «кнопка + підпис» — одна капсула; ліва вісь hero не чіпається,
   бо сама обгортка лишається на ній). max-width — запобіжник на вузьких екранах. */
body.home-v2 .heroK-wrap{ display:flex; flex-direction:column; align-items:center; width:max-content; max-width:100%; }
body.home-v2 .heroK-note{ text-align:center; }

/* ваги 7xx/82x → 800 (заголовки, акценти) */
body.home-v2 .bl-nav__lang,
body.home-v2 .bl-nav__mobile-contact,
body.home-v2 .price-card__title,
body.home-v2 #відгуки-англійська .reviewer a,
body.home-v2 #як-ми-навчаємо .school-experience__card h3,
body.home-v2 .pl-badge,
body.home-v2 .pl-p,
body.home-v2 .pl-d{ font-weight:800!important; }

/* ваги 7xx → 600 (текст і другорядне) */
body.home-v2 .bl-nav__menu a,
body.home-v2 #досягнення .achv-label,
body.home-v2 #open-reviews-modal,
body.home-v2 .pl-head,
body.home-v2 .komu-card p{ font-weight:600!important; }

/* сірі → два рівні: eyebrow .52 і pl-head .48 → --bl-muted (читабельність AA) */
body.home-v2 .section-eyebrow{ color:var(--bl-muted)!important; }
body.home-v2 .pl-head{ color:var(--bl-muted)!important; }

/* === Ритм hero (аудит 07.06, варіант 1) ===
   1) Нейтралізація легасі .header span{margin:0 0 22px} із bundle.min.css: він додавав 22px
      до кожного рядка результатів (фактичний крок 16+22=38px) і розсипав блок — внутрішні
      відступи були БІЛЬШІ за міжблокові (інвертований ритм).
   2) Монотонна шкала відступів: усередині блоку (24/16) < H1→блок (32/24) < перед CTA (40/32,
      задано в правилах .heroK-cta вище). Хейрлайн результатів коротшає автоматично. */
body.home-v2 .hero-result-line{ margin:0!important; }
body.home-v2 .hero-results{ gap:20px!important; }   /* desktop: 24→20 (Варіант 2) */
body.home-v2 .hero-claim{ margin-bottom:28px!important; } /* H1→результати: 32→28 (Варіант 2) */
@media (max-width:768px){
  body.home-v2 .hero-results{ gap:16px!important; }       /* mobile: повітря в «зоні смакування» (12→16, QA 08.06) */
  body.home-v2 .hero-claim{ margin-bottom:24px!important; } /* mobile: H1→тези 20→24 (відділяє заголовок від вигод) */
}

/* === Варіант 2 аудиту (07.06): лого-kicker над H1, єдина ліва вісь ===
   1) Kicker MYENGLISH (SVG із branding/, кольори бренду #2E3A47 + #2F6075) відкриває композицію;
      старі лого прибрано: кутове .hero-logo (з розмітки) і центр меню десктопа (.bl-nav__logo-item).
   2) Хейрлайн і лівий індент результатів прибрано — всі блоки на одній вертикалі. */
body.home-v2 .bl-nav__menu .bl-nav__logo-item{ display:none!important; }
/* Лок-ап logo2026 (узгоджено 08.06, варіант А): єдиний PNG із вордмаркою і підписом
   «by Business Language» (права виключка — властивість знака). Начертання не змінювати. */
body.home-v2 .hero-kicker{ display:block; margin:0 0 40px; /* лого→eyebrow: 32→40 (Варіант 2): відділяє бренд від повідомлення */
  padding:0; text-decoration:none; background:none; border:0; }
body.home-v2 .hero-kicker img{ display:block; width:auto; height:64px; } /* підпис ≈16px — читається */
@media (max-width:768px){
  body.home-v2 .hero-kicker{ margin-bottom:16px; } /* mobile: 24→16 */
  body.home-v2 .hero-kicker img{ height:56px; }    /* ширина ≈245px ≤ колонки 272px; підпис ≈14px */
}
/* Акцентний штрих ліворуч від блоку результатів (Варіант 2, опція 08.06): структурний маркер
   замість важкого хейрлайну — 2px на всю висоту блоку результатів, нейтральний (не синій:
   єдиний синій об'єкт hero лишається CTA). Результати свідомо інсетимо на 20/12px — штрих «володіє»
   групою (як вертикальне правило цитати); H1/eyebrow/CTA лишаються на головній лівій осі. */
body.home-v2 .hero-results{ position:relative!important; padding-left:var(--bl-space-20,20px)!important; }
/* !important на всіх властивостях: new.css вантажиться ПІСЛЯ home-fix і має власний
   .hero-results::before (1px градієнт, top/bottom:4px) тієї ж специфічності (0,2,1) — без !important
   він би переміг за порядком. Перебиваємо на 2px нейтральний штрих на всю висоту блоку. */
body.home-v2 .hero-results::before{ content:""!important; position:absolute!important; left:0!important;
  right:auto!important; top:0!important; bottom:0!important; height:auto!important; width:2px!important;
  border-radius:1px!important; background:rgba(43,52,70,.28)!important; }
@media (max-width:768px){
  body.home-v2 .hero-results{ padding-left:var(--bl-space-12,12px)!important; }
}

/* Корпоративна /corporate/ (id=#corporate-uk): hero-підзаголовок у тидну колонку
   (без рваних повноширинних рядків на десктопі) + ритм у блоці «Що отримує керівник». */
/* Спільний стиль підзаголовків корпоративної: hero (#corporate-uk) і блок
   «Що отримує керівник». Обидва — .boss-sub: однаковий p-стиль (18px, сірий,
   bold, центр), тидна колонка max-width 720, рівні рядки (balance). */
body.home-v2 #corporate-uk .boss-sub,
body.home-v2 .boss-benefits .boss-sub{
  max-width:720px; margin:0 auto var(--sp-12,48px);
  text-wrap:balance;
}
body.home-v2 .boss-benefits h2{ margin:0 0 var(--sp-3,12px); }
@media (max-width:768px){
  body.home-v2 #corporate-uk .boss-sub,
  body.home-v2 .boss-benefits .boss-sub{ margin-bottom:var(--sp-8,32px); }
}

/* === Hero: відео за кнопкою (постер за замовчуванням, без автоплею) === */
/* Відео лежить над постером (z2), але під лівим градієнтом (::before z3) — текст лишається читабельним під час відтворення */
body.home-v2 #hero-video{ z-index:2; opacity:0; visibility:hidden; transition:opacity .45s ease; }
body.home-v2 .header.is-video-on #hero-video{ opacity:1; visibility:visible; }

/* кнопка «Запустити відео» — акуратна капсула в куті (без окремого кола; постер за замовчуванням) */
body.home-v2 .hero-play{
  position:absolute; z-index:11; top:auto; bottom:9%; right:4%; left:auto;
  display:inline-flex; flex-direction:row; align-items:center; gap:6px;
  margin:0; padding:7px 14px; line-height:1; border:1px solid rgba(255,255,255,.55); border-radius:999px;
  background:rgba(255,255,255,.5); cursor:pointer;   /* напівпрозора — рецесує, не конкурує з CTA */
  -webkit-backdrop-filter:blur(8px) saturate(1.1); backdrop-filter:blur(8px) saturate(1.1);
  box-shadow:0 4px 14px rgba(15,23,42,.10);
  -webkit-tap-highlight-color:transparent; transition:transform .2s ease, box-shadow .2s ease, background .2s ease, opacity .3s ease;
}
body.home-v2 .hero-play:hover,
body.home-v2 .hero-play:focus-visible{ transform:translateY(-1px); background:rgba(255,255,255,.68); box-shadow:0 8px 20px rgba(15,23,42,.16); }
/* колишнє коло → лише маленька ▶-іконка всередині капсули */
body.home-v2 .hero-play__circle{
  display:flex; align-items:center; justify-content:center;
  width:auto; height:auto; margin:0; line-height:0; font-size:0;   /* margin:0 — гасить легасі margin-bottom:22px зі span у #header */
  background:none; border:0; border-radius:0; box-shadow:none;
  color:var(--bl-blue,#2F6075); -webkit-backdrop-filter:none; backdrop-filter:none;
}
body.home-v2 .hero-play__circle svg{ display:block; width:12px; height:12px; margin-left:1px; }
body.home-v2 .hero-play__label{
  margin:0; font-size:13px; font-weight:600; line-height:1; letter-spacing:.01em; color:#1c2433;   /* margin:0 — той самий легасі-гард */
  background:none; padding:0; border-radius:0; box-shadow:none; white-space:nowrap;
  -webkit-backdrop-filter:none; backdrop-filter:none;
}
body.home-v2 .header.is-video-on .hero-play{ opacity:0; visibility:hidden; pointer-events:none; }

/* контрол під час відтворення — у ТОМУ Ж куті, тим самим стилем (без стрибка) */
body.home-v2 .hero-vctrl{
  position:absolute; z-index:12; top:auto; left:auto; right:4%; bottom:9%;
  display:flex; gap:6px;
}
body.home-v2 .hero-vctrl[hidden]{ display:none; }
body.home-v2 .hero-vctrl__btn{
  border:1px solid rgba(255,255,255,.55); border-radius:999px; padding:6px 12px; cursor:pointer;
  font-family:inherit; font-size:12px; font-weight:600; line-height:1;
  background:rgba(255,255,255,.5); color:#1c2433;
  -webkit-backdrop-filter:blur(8px) saturate(1.1); backdrop-filter:blur(8px) saturate(1.1);
  box-shadow:0 4px 14px rgba(15,23,42,.10); transition:background .18s ease;
}
body.home-v2 .hero-vctrl__btn:hover,
body.home-v2 .hero-vctrl__btn:focus-visible{ background:rgba(255,255,255,.68); }
/* лишаємо лише значок паузи — кнопку «Фото» приховано */
body.home-v2 .hero-vctrl__btn[data-act="photo"]{ display:none; }

@media (max-width:768px){
  /* мобайл: та сама капсула й контрол, у правому нижньому куті (не центр) */
  body.home-v2 .hero-play{ right:4%; bottom:7%; }
  body.home-v2 .hero-vctrl{ right:4%; bottom:7%; }
}

/* ============================================================
   /corporate-offer/ — компоненти комерційної пропозиції (co-*)
   Сітка: токени --c-… і --fs-… (redesign.css :root); 4px-шкала відступів.
   Скоуп body.course-page — на головну не впливає.
   ============================================================ */
body.course-page .co-sec{ padding:48px 0; }
body.course-page .co-sec h2{ text-align:center; margin:0 0 16px; }
body.course-page .co-sec-sub,
body.course-page .co-hero-sub{ color:var(--c-text-secondary); max-width:760px; margin:0 auto 32px; text-align:center; }
/* hero-sub у .main-section-article: легасі `.main-section-article p{margin-left:0}` (redesign/home-fix,
   специфічність вища) притискав блок 760px ліворуч → текст лише «здавався» нецентрованим. Повертаємо auto. */
body.course-page .co-hero .co-hero-sub{ margin-left:auto !important; margin-right:auto !important; }
body.course-page .co-sec-note{ color:var(--c-text-muted); font-size:var(--fs-sm); margin:24px auto 0; max-width:760px; }

/* Кліренс під фіксованим bl-nav (низ ~70px): +48px на body.course-page; секція додає ще ~48px → h1 на ~96px.
   Правило :first-of-type не влучає (перший <div> сторінки = .bl-nav__lang), тому кліренс — через body.
   Home (без .course-page) НЕ чіпаємо: там hero навмисно під меню. */
body.course-page{ padding-top:48px; }

/* Hero */
body.course-page .co-hero h1{ text-align:center; }
body.course-page .co-hero h1 .co-h1-a{ display:block; }
body.course-page .co-hero h1 .co-h1-b{ display:block; font-size:.6em; font-weight:600; line-height:1.2; color:var(--c-text-secondary); margin-top:8px; }
body.course-page .co-stats{
  list-style:none; margin:32px auto; padding:0; max-width:920px;
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px; text-align:center;
}
body.course-page .co-stats li{ display:flex; flex-direction:column; gap:4px; }
body.course-page .co-stat-num{ color:var(--c-primary); font-weight:800; font-size:var(--fs-xl); line-height:1.1; }
body.course-page .co-stat-lbl{ color:var(--c-text-secondary); font-size:var(--fs-sm); }
body.course-page .co-hero-cta{ margin:8px 0 0; }
body.course-page a.bl-btn-primary{
  display:inline-block; background:var(--c-primary); color:#fff; text-decoration:none;
  font-weight:700; font-size:var(--fs-base); padding:16px 32px; border-radius:8px;
  transition:background .18s ease;
}
body.course-page a.bl-btn-primary:hover,
body.course-page a.bl-btn-primary:focus-visible{ background:var(--c-primary-hover); }

/* Картки з галочкою (вигоди / чому BL) */
body.course-page .co-card-check{ display:flex; align-items:flex-start; gap:12px; }
body.course-page .co-check{
  flex:0 0 auto; width:26px; height:26px; border-radius:999px;
  background:var(--c-primary-50,#EAF1F3); color:var(--c-primary);
  display:inline-flex; align-items:center; justify-content:center; font-weight:800; font-size:15px;
}
body.course-page .co-card-check .faq-a{ color:var(--c-text); font-size:var(--fs-base); }

/* Кроки запуску */
body.course-page .co-steps{
  list-style:none; margin:32px auto 0; padding:0; max-width:1000px;
  display:grid; grid-template-columns:repeat(5,1fr); gap:16px;
}
body.course-page .co-steps li{
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:12px;
  background:var(--c-surface); border:1px solid var(--c-border); border-radius:8px; padding:24px 16px;
}
body.course-page .co-step-n{
  width:40px; height:40px; border-radius:999px; background:var(--c-primary); color:#fff;
  display:inline-flex; align-items:center; justify-content:center; font-weight:800; font-size:var(--fs-lg);
}
body.course-page .co-step-t{ color:var(--c-text); font-size:var(--fs-sm); line-height:1.35; }

/* Чипи (платформи / навички) */
body.course-page .co-chips{ list-style:none; margin:24px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
body.course-page .co-chips li{
  background:#fff; border:1px solid var(--c-border); border-radius:999px; padding:10px 20px;
  color:var(--c-text); font-weight:600; font-size:var(--fs-sm);
}
body.course-page .co-chips-lg li{ font-size:var(--fs-base); padding:12px 24px; }

/* Дві колонки: прогрес + звітність */
body.course-page .co-cols{ display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:1000px; margin:32px auto 0; align-items:start; }
body.course-page .co-col-card{ background:var(--c-surface); border:1px solid var(--c-border); border-radius:8px; padding:24px; }
body.course-page .co-col-t{ color:var(--c-primary); font-size:var(--fs-lg); margin:0 0 16px; text-align:center; }
body.course-page .co-pump-t{ margin-top:32px; } /* «Що прокачаємо» — підблок у секції програм (corporate-offer) */
body.course-page .faq-grid--single{ max-width:640px; } /* одна картка (ціни IELTS — лише інді) — не розтягувати на всю ширину */
body.course-page .co-col .co-chips{ justify-content:flex-start; }
body.course-page .co-ticks{ list-style:none; margin:16px 0 0; padding:0; }
body.course-page .co-ticks li{ position:relative; padding-left:28px; margin:10px 0; color:var(--c-text-secondary); font-size:var(--fs-sm); line-height:1.4; }
body.course-page .co-ticks li::before{ content:"\2713"; position:absolute; left:0; top:0; color:var(--c-primary); font-weight:800; }

/* Програми — теги з лінками */
body.course-page .co-tags{ list-style:none; margin:24px auto 0; padding:0; display:flex; flex-wrap:wrap; gap:12px; justify-content:center; max-width:900px; }
body.course-page .co-tags li a, body.course-page .co-tags li span{
  display:inline-block; background:#fff; border:1px solid var(--c-border); border-radius:8px; padding:12px 20px;
  color:var(--c-text); font-weight:600; font-size:var(--fs-sm); text-decoration:none;
}
body.course-page .co-tags li a:hover, body.course-page .co-tags li a:focus-visible{ border-color:var(--c-primary); color:var(--c-primary); }
body.course-page .co-tags li span{ color:var(--c-text-muted); }

/* Ціни — компактний макет «велике число + чипи» */
body.course-page .co-price2{ max-width:640px; margin:8px auto 0; text-align:center; }
body.course-page .co-price2-main{ display:flex; flex-direction:column; align-items:center; gap:4px; }
body.course-page .co-price2-num{ font-size:clamp(36px,6vw,52px); font-weight:800; color:var(--c-primary); line-height:1.05; }
body.course-page .co-price2-unit{ color:var(--c-text-secondary); font-size:var(--fs-base); }
body.course-page .co-price2-chips{ list-style:none; display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:16px 0 0; padding:0; }
body.course-page .co-price2-chips li{ background:var(--c-surface); border:1px solid var(--c-border); border-radius:999px; padding:8px 16px; color:var(--c-text); font-weight:600; font-size:var(--fs-sm); }
body.course-page .co-price2-disc{ margin:24px 0 0; }
body.course-page .co-price2-disc-lbl{ display:block; color:var(--c-text-muted); font-size:var(--fs-sm); margin:0 0 10px; }
body.course-page .co-price2-pills{ list-style:none; display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:0; padding:0; }
body.course-page .co-price2-pills li{ display:inline-flex; align-items:baseline; gap:6px; background:var(--c-primary-50,#EAF1F3); border-radius:999px; padding:8px 16px; }
body.course-page .co-price2-pills li strong{ color:var(--c-primary); font-weight:800; font-size:var(--fs-base); }
body.course-page .co-price2-pills li span{ color:var(--c-text-secondary); font-size:var(--fs-sm); }
body.course-page .co-price2-note{ color:var(--c-text-muted); font-size:var(--fs-sm); margin:20px 0 0; }

/* Комерційні умови + фінальний CTA-підзаголовок */
body.course-page .co-terms{ max-width:640px; margin:0 auto; background:var(--c-surface); border:1px solid var(--c-border); border-radius:12px; padding:24px 28px; }
body.course-page .co-terms h2{ font-size:var(--fs-lg); margin:0 0 12px; text-align:left; color:var(--c-text); }
body.course-page .co-terms p{ color:var(--c-text-secondary); margin:6px 0; max-width:none; text-align:left; }
body.course-page .co-final-sub{ color:var(--c-text-secondary); max-width:680px; margin:0 auto 24px; }

/* Мобайл */
@media (max-width:768px){
  body.course-page .co-sec{ padding:32px 0; }
  body.course-page .co-stats{ grid-template-columns:repeat(2,1fr); gap:16px; margin:24px auto; }
  body.course-page .co-steps{ grid-template-columns:1fr; gap:12px; }
  body.course-page .co-cols{ grid-template-columns:1fr; gap:16px; }
}

/* ============================================================
   Секція тестів рівня на головній (.bl-lt) — 2026-06-10.
   4 картки-лінки на тести CEFR; прогресія рівня — шкала 1/4…4/4
   у teal (без «драбинки» висот і кольорових шапок).
   Розмітка: new/partials/level-tests.php (uk/ru/en + гео-клони).
   ============================================================ */
body.home-v2 .bl-lt .bl-lt__sub{ margin:var(--bl-space-8,8px) auto var(--bl-space-32,32px); max-width:56ch; text-align:center;
  font-size:var(--bl-fs-16,16px); line-height:var(--bl-lh-body,1.5); color:var(--bl-muted,rgba(15,23,42,.66)); }
body.home-v2 .bl-lt__grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--bl-space-16,16px);
  width:min(1100px,calc(100% - 32px)); margin:0 auto; }
body.home-v2 .bl-lt__card{ display:flex; flex-direction:column; gap:var(--bl-space-8,8px);
  padding:var(--bl-space-24,24px) var(--bl-space-20,20px);
  background:var(--bl-card,rgba(255,255,255,.86)); border:var(--bl-border,1px solid rgba(15,23,42,.065));
  border-radius:var(--bl-radius-md,18px); box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055));
  text-decoration:none; transition:transform .18s ease,box-shadow .18s ease; }
body.home-v2 .bl-lt__card:hover{ transform:translateY(-3px); box-shadow:var(--bl-shadow,0 12px 38px rgba(15,23,42,.07)); text-decoration:none; }
body.home-v2 .bl-lt__bars{ display:flex; gap:var(--bl-space-4,4px); margin-bottom:var(--bl-space-4,4px); }
body.home-v2 .bl-lt__bars span{ width:18px; height:3px; border-radius:2px; background:var(--c-primary-50,#EAF1F3); }
body.home-v2 .bl-lt__bars span.on{ background:var(--bl-blue,#2F6075); }
body.home-v2 .bl-lt__cefr{ font-size:var(--bl-fs-24,24px); line-height:var(--bl-lh-heading,1.2);
  font-weight:var(--fw-strong,800); letter-spacing:-.02em; color:var(--bl-text,rgba(15,23,42,.92)); }
body.home-v2 .bl-lt__name{ font-size:var(--bl-fs-14,14px); font-weight:var(--fw-heading,700); color:var(--bl-text,rgba(15,23,42,.92)); }
body.home-v2 .bl-lt__desc{ flex:1; font-size:var(--bl-fs-13,13px); line-height:var(--bl-lh-body,1.5); color:var(--bl-muted,rgba(15,23,42,.66)); }
body.home-v2 .bl-lt__go{ margin-top:var(--bl-space-4,4px); font-size:var(--bl-fs-14,14px);
  font-weight:var(--fw-heading,700); color:var(--bl-blue,#2F6075); }
body.home-v2 .bl-lt__card:hover .bl-lt__go{ color:var(--bl-blue-hover,#234A5C); }
body.home-v2 .bl-lt .bl-lt__note{ margin:var(--bl-space-32,32px) auto 0; max-width:60ch; text-align:center; text-wrap:balance;
  font-size:var(--bl-fs-14,14px); line-height:var(--bl-lh-body,1.5); color:var(--bl-muted,rgba(15,23,42,.66)); }
@media (max-width:900px){
  body.home-v2 .bl-lt__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--bl-space-12,12px); }
}
@media (max-width:480px){
  body.home-v2 .bl-lt__card{ padding:var(--bl-space-20,20px) var(--bl-space-16,16px); }
  body.home-v2 .bl-lt__cefr{ font-size:var(--bl-fs-20,20px); }
}

/* ============================================================
   Секція «Напрями» на головній (.bl-cn) — 2026-06-10.
   6 карток-лінків на курсові сторінки (маршрутизація за метою);
   стоїть ПІСЛЯ CTA-смуги (cta-final) і ПЕРЕД teaching.
   Розмітка: new/partials/courses-nav.php (uk/ru/en + гео-клони).
   Фон — bl-surface (ритм: піщана смуга → сіра секція → білий teaching).
   ============================================================ */
body.home-v2 .bl-cn .bl-cn__sub{ margin:var(--bl-space-8,8px) auto var(--bl-space-32,32px); max-width:56ch; text-align:center;
  font-size:var(--bl-fs-16,16px); line-height:var(--bl-lh-body,1.5); color:var(--bl-muted,rgba(15,23,42,.66)); }
body.home-v2 .bl-cn__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--bl-space-16,16px);
  width:min(1100px,calc(100% - 32px)); margin:0 auto; }
body.home-v2 .bl-cn__card{ display:flex; flex-direction:column; gap:var(--bl-space-8,8px);
  padding:var(--bl-space-24,24px) var(--bl-space-20,20px);
  background:var(--bl-card,rgba(255,255,255,.86)); border:var(--bl-border,1px solid rgba(15,23,42,.065));
  border-radius:var(--bl-radius-md,18px); box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055));
  text-decoration:none; transition:transform .18s ease,box-shadow .18s ease; }
body.home-v2 .bl-cn__card:hover{ transform:translateY(-3px); box-shadow:var(--bl-shadow,0 12px 38px rgba(15,23,42,.07)); text-decoration:none; }
body.home-v2 .bl-cn__name{ font-size:var(--bl-fs-18,18px); line-height:var(--bl-lh-heading,1.2);
  font-weight:var(--fw-heading,700); letter-spacing:-.01em; color:var(--bl-text,rgba(15,23,42,.92)); }
body.home-v2 .bl-cn__desc{ flex:1; font-size:var(--bl-fs-13,13px); line-height:var(--bl-lh-body,1.5); color:var(--bl-muted,rgba(15,23,42,.66)); }
body.home-v2 .bl-cn__go{ margin-top:var(--bl-space-4,4px); font-size:var(--bl-fs-14,14px);
  font-weight:var(--fw-heading,700); color:var(--bl-blue,#2F6075); }
body.home-v2 .bl-cn__card:hover .bl-cn__go{ color:var(--bl-blue-hover,#234A5C); }
@media (max-width:900px){
  body.home-v2 .bl-cn__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--bl-space-12,12px); }
}
@media (max-width:480px){
  body.home-v2 .bl-cn__card{ padding:var(--bl-space-20,20px) var(--bl-space-16,16px); }
}

/* ============================================================
   Контакт-модал (.contact-modal) — копія з new.css БЕЗ скоупа
   body.home-experiment (2026-06-10): модал тепер на всіх сторінках
   (partials/contact-modal.php через page-foot.php), а new.css на
   внутрішніх не вантажиться. Токени — з фолбеками. На головній
   дубль безпечний: значення ідентичні. Правити — ТУТ.
   ============================================================ */
html.contact-modal-open{overflow:hidden}
.contact-modal{border:0;padding:0;background:transparent;color:var(--bl-text,rgba(15,23,42,.92));width:min(480px,calc(100vw - 28px));border-radius:28px;box-shadow:none}
.contact-modal::backdrop{background:rgba(15,23,42,.42);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.contact-modal__inner{position:relative;padding:30px;border-radius:28px;background:rgba(255,255,255,.96);box-shadow:0 28px 80px rgba(15,23,42,.28),inset 0 1px 0 rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.70)}
.contact-modal__x{position:absolute;top:14px;right:14px;width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(15,23,42,.08);border-radius:999px;background:#fff;color:rgba(15,23,42,.68);font-size:26px;line-height:1;cursor:pointer}
.contact-modal__eyebrow{margin:0 0 10px;color:var(--bl-blue,#2F6075);font-size:12px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
.contact-modal__header h2{margin:0 34px 10px 0;color:var(--bl-text,rgba(15,23,42,.92));font-size:clamp(26px,4vw,34px);line-height:1.08;font-weight:820;letter-spacing:-.035em}
.contact-modal__header p{margin:0;color:var(--bl-muted,rgba(15,23,42,.66));font-size:16px;line-height:1.5;font-weight:620}
.contact-modal__channels{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:12px;margin-top:24px}
.contact-modal__channel{position:relative;display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:var(--bl-radius-md,18px);text-decoration:none;background:rgba(255,255,255,.92);border:1px solid rgba(15,23,42,.07);box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055));transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.contact-modal__channel:hover,.contact-modal__channel:focus-visible{transform:translateY(-2px);box-shadow:0 12px 30px rgba(15,23,42,.12);border-color:rgba(47,96,117,.22);outline:none}
.contact-modal__ic{flex:0 0 44px;width:44px;height:44px;display:grid;place-items:center;border-radius:13px;color:#fff;box-shadow:0 6px 16px rgba(15,23,42,.16)}
.contact-modal__ic svg{width:24px;height:24px}
.contact-modal__channel--telegram .contact-modal__ic{background:linear-gradient(180deg,#2AABEE,#229ED9)}
.contact-modal__channel--whatsapp .contact-modal__ic{background:linear-gradient(180deg,#42D862,#25D366)}
.contact-modal__channel--signal .contact-modal__ic{background:linear-gradient(180deg,#5B86F8,#3A76F0)}
.contact-modal__channel--phone .contact-modal__ic{background:linear-gradient(180deg,#3D7E99,var(--bl-blue,#2F6075))}
.contact-modal__meta{display:flex;flex-direction:column;gap:2px;min-width:0}
.contact-modal__name{font-size:16px;font-weight:800;line-height:1.15;letter-spacing:-.01em;color:var(--bl-text,rgba(15,23,42,.92))}
.contact-modal__sub{font-size:13px;font-weight:600;line-height:1.25;color:var(--bl-muted,rgba(15,23,42,.66))}
.contact-modal__channel--featured{border-color:rgba(47,96,117,.28);box-shadow:0 8px 24px rgba(47,96,117,.12)}
.contact-modal__badge{position:absolute;top:-9px;right:12px;padding:3px 9px;border-radius:999px;background:var(--bl-blue,#2F6075);color:#fff;font-size:10px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;line-height:1;box-shadow:0 4px 12px rgba(47,96,117,.28)}

/* ============================================================
   Static-сторінки (/ukr/, /, /eng/ через static-engine) —
   компоненти контенту 2026-06-10: відгуки (.bl-rv), таблиця CEFR
   (.bl-cefr), чек-лист (.bl-checks), чипи (.bl-chips), кроки
   (.bl-steps), картки рівнів (.bl-lvl), CTA (.bl-btn, .bl-cta-card).
   Скоуп body.static-page — на головну не впливає. Токени з
   фолбеками (new.css/:root на внутрішніх не вантажиться).
   Сітка: СІТКА.md (4px-шкала, --bl-fs-*, радіуси, тіні).
   ============================================================ */

/* Кнопка-CTA контентних сторінок */
body.static-page .bl-btn{
  display:inline-block; background:var(--bl-blue,#2F6075); color:#fff; text-decoration:none;
  font-weight:700; font-size:var(--bl-fs-16,16px); line-height:var(--bl-lh-sub,1.3);
  padding:var(--bl-space-16,16px) var(--bl-space-32,32px); border-radius:var(--bl-radius-sm,14px);
  box-shadow:0 8px 24px rgba(47,96,117,.18); transition:background .18s ease, transform .18s ease;
}
body.static-page .bl-btn:hover,
body.static-page .bl-btn:focus-visible{ background:var(--bl-blue-hover,#234A5C); color:#fff; transform:translateY(-1px); }
body.static-page .bl-btn-row{ text-align:center; margin:var(--bl-space-32,32px) 0 var(--bl-space-16,16px); }

/* Відгуки: підсумок-капсула + картки (masonry через columns) */
body.static-page .bl-rv__sum{
  display:flex; flex-wrap:wrap; align-items:baseline; justify-content:center; gap:var(--bl-space-8,8px) var(--bl-space-12,12px);
  margin:var(--bl-space-24,24px) auto var(--bl-space-32,32px); padding:var(--bl-space-12,12px) var(--bl-space-24,24px);
  width:fit-content; background:var(--bl-card,rgba(255,255,255,.86)); border:var(--bl-border,1px solid rgba(15,23,42,.065));
  border-radius:999px; box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055));
}
body.static-page .bl-rv__sum-stars{ color:#fc0; font-size:var(--bl-fs-18,18px); line-height:1; letter-spacing:.06em; }
body.static-page .bl-rv__sum-num{ font-size:var(--bl-fs-18,18px); font-weight:var(--fw-strong,800); color:var(--bl-text,rgba(15,23,42,.92)); }
body.static-page .bl-rv__sum-cnt{ font-size:var(--bl-fs-14,14px); color:var(--bl-muted,rgba(15,23,42,.66)); }
body.static-page .bl-rv{ columns:2; column-gap:var(--bl-space-24,24px); }
body.static-page .bl-rv__card{
  break-inside:avoid; -webkit-column-break-inside:avoid; margin:0 0 var(--bl-space-24,24px);
  padding:var(--bl-space-24,24px); background:var(--bl-card,rgba(255,255,255,.86));
  border:var(--bl-border,1px solid rgba(15,23,42,.065)); border-radius:var(--bl-radius-md,18px);
  box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055));
}
body.static-page .bl-rv__head{ display:flex; align-items:center; gap:var(--bl-space-12,12px); margin-bottom:var(--bl-space-12,12px); }
body.static-page .bl-rv__ava{ flex:0 0 56px; width:56px; height:56px; border-radius:999px; object-fit:cover; }
body.static-page .bl-rv__meta{ display:flex; flex-direction:column; gap:2px; min-width:0; }
body.static-page .bl-rv__name,
body.static-page .bl-rv__name a{ font-size:var(--bl-fs-16,16px); font-weight:var(--fw-heading,700); line-height:var(--bl-lh-heading,1.2); color:var(--bl-text,rgba(15,23,42,.92)); text-decoration:none; }
body.static-page .bl-rv__name a:hover,
body.static-page .bl-rv__name a:focus-visible{ color:var(--bl-blue,#2F6075); }
body.static-page .bl-rv__stars{ color:#fc0; font-size:var(--bl-fs-14,14px); line-height:1; letter-spacing:.06em; }
body.static-page .bl-rv__star-off{ color:rgba(15,23,42,.18); }
body.static-page .bl-rv__text{ margin:0; font-size:var(--bl-fs-15,15px); line-height:var(--bl-lh-body,1.5); color:var(--bl-muted,rgba(15,23,42,.66)); }
@media (max-width:900px){
  body.static-page .bl-rv{ columns:1; }
  body.static-page .bl-rv__card{ margin-bottom:var(--bl-space-12,12px); padding:var(--bl-space-20,20px); }
}

/* Таблиця CEFR (/ukr/rivni/): картка-обгортка, teal-шапка, зебра */
body.static-page .bl-cefr{
  margin:var(--bl-space-24,24px) 0 var(--bl-space-32,32px); background:#fff;
  border:var(--bl-border,1px solid rgba(15,23,42,.065)); border-radius:var(--bl-radius-lg,24px);
  box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055)); overflow:hidden;
}
body.static-page .bl-cefr__table{ width:100%; border-collapse:collapse; }
body.static-page .bl-cefr__table th{
  background:var(--c-primary-50,#EAF1F3); color:var(--bl-text,rgba(15,23,42,.92));
  font-size:var(--bl-fs-14,14px); font-weight:var(--fw-strong,800); line-height:var(--bl-lh-sub,1.3);
  text-align:left; padding:var(--bl-space-16,16px); border:0;
}
body.static-page .bl-cefr__table td{
  padding:var(--bl-space-16,16px); border:0; border-top:1px solid rgba(15,23,42,.065);
  font-size:var(--bl-fs-15,15px); line-height:var(--bl-lh-body,1.5); color:var(--bl-muted,rgba(15,23,42,.66));
  vertical-align:top; text-align:left;
}
body.static-page .bl-cefr__table tbody tr:nth-child(even) td{ background:var(--bl-soft,#F8FAFC); }
body.static-page .bl-cefr__lvl strong{ color:var(--bl-text,rgba(15,23,42,.92)); font-weight:var(--fw-heading,700); white-space:nowrap; }
body.static-page .bl-cefr__code{
  display:inline-flex; align-items:center; margin-left:var(--bl-space-4,4px); padding:2px var(--bl-space-8,8px);
  border-radius:999px; background:var(--c-primary-50,#EAF1F3); color:var(--bl-blue,#2F6075);
  font-size:var(--bl-fs-12,12px); font-weight:var(--fw-strong,800); line-height:var(--bl-lh-heading,1.2);
}
@media (max-width:768px){
  /* Таблиця → стек карток: видно всі колонки без горизонтального скролу */
  body.static-page .bl-cefr{ background:transparent; border:0; box-shadow:none; overflow:visible; }
  body.static-page .bl-cefr__table,
  body.static-page .bl-cefr__table tbody,
  body.static-page .bl-cefr__table tr,
  body.static-page .bl-cefr__table td{ display:block; }
  body.static-page .bl-cefr__table thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  body.static-page .bl-cefr__table tr{
    margin-bottom:var(--bl-space-12,12px); padding:var(--bl-space-16,16px); background:var(--bl-card,rgba(255,255,255,.86));
    border:var(--bl-border,1px solid rgba(15,23,42,.065)); border-radius:var(--bl-radius-md,18px);
    box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055)); text-align:center;
  }
  body.static-page .bl-cefr__table td{ padding:var(--bl-space-8,8px) 0 0; border-top:0; background:none!important; }
  body.static-page .bl-cefr__table td.bl-cefr__lvl{ padding-top:0; font-size:var(--bl-fs-18,18px); }
  body.static-page .bl-cefr__table td[data-label]::before{
    content:attr(data-label); display:block; margin-bottom:2px;
    font-size:var(--bl-fs-12,12px); font-weight:var(--fw-heading,700); line-height:var(--bl-lh-sub,1.3);
    color:rgba(15,23,42,.52);
  }
}

/* Чек-лист (гарантії, переваги сертифіката) */
body.static-page .bl-checks{
  list-style:none; margin:var(--bl-space-24,24px) 0 var(--bl-space-32,32px); padding:0;
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--bl-space-12,12px);
}
body.static-page .bl-checks li{
  display:flex; align-items:flex-start; gap:var(--bl-space-12,12px); margin:0;
  padding:var(--bl-space-16,16px) var(--bl-space-20,20px); background:var(--bl-card,rgba(255,255,255,.86));
  border:var(--bl-border,1px solid rgba(15,23,42,.065)); border-radius:var(--bl-radius-md,18px);
  box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055));
  font-size:var(--bl-fs-15,15px); line-height:var(--bl-lh-body,1.5); color:var(--bl-text,rgba(15,23,42,.92));
}
body.static-page .bl-check{
  flex:0 0 auto; width:26px; height:26px; border-radius:999px;
  background:var(--c-primary-50,#EAF1F3); color:var(--bl-blue,#2F6075);
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:var(--fw-strong,800); font-size:var(--bl-fs-15,15px); line-height:1;
}
@media (max-width:768px){
  body.static-page .bl-checks{ grid-template-columns:1fr; }
}

/* Чипи (приводи подарувати) */
body.static-page .bl-chips{
  list-style:none; margin:var(--bl-space-24,24px) 0 var(--bl-space-32,32px); padding:0;
  display:flex; flex-wrap:wrap; gap:var(--bl-space-12,12px);
}
body.static-page .bl-chips li{
  margin:0; background:#fff; border:var(--bl-border,1px solid rgba(15,23,42,.065)); border-radius:999px;
  padding:var(--bl-space-8,8px) var(--bl-space-20,20px); color:var(--bl-text,rgba(15,23,42,.92));
  font-weight:600; font-size:var(--bl-fs-14,14px); line-height:var(--bl-lh-body,1.5);
  box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055));
}

/* Кроки «як це працює» */
body.static-page .bl-steps{
  list-style:none; counter-reset:none; margin:var(--bl-space-24,24px) 0 var(--bl-space-32,32px); padding:0;
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--bl-space-16,16px);
}
body.static-page .bl-steps li{
  display:flex; flex-direction:column; align-items:flex-start; gap:var(--bl-space-12,12px); margin:0;
  padding:var(--bl-space-24,24px) var(--bl-space-20,20px); background:var(--bl-card,rgba(255,255,255,.86));
  border:var(--bl-border,1px solid rgba(15,23,42,.065)); border-radius:var(--bl-radius-md,18px);
  box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055));
}
body.static-page .bl-step-n{
  width:40px; height:40px; border-radius:999px; background:var(--bl-blue,#2F6075); color:#fff;
  display:inline-flex; align-items:center; justify-content:center;
  font-weight:var(--fw-strong,800); font-size:var(--bl-fs-18,18px); line-height:1;
}
body.static-page .bl-step-t{ font-size:var(--bl-fs-15,15px); line-height:var(--bl-lh-body,1.5); color:var(--bl-muted,rgba(15,23,42,.66)); }
@media (max-width:768px){
  body.static-page .bl-steps{ grid-template-columns:1fr; gap:var(--bl-space-12,12px); }
  body.static-page .bl-steps li{ flex-direction:row; align-items:flex-start; }
}

/* Картки рівнів CEFR (/ukr/poslugy/) */
body.static-page .bl-lvl{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--bl-space-16,16px);
  margin:var(--bl-space-24,24px) 0 var(--bl-space-32,32px);
}
body.static-page .bl-lvl__card{
  display:flex; flex-direction:column; gap:var(--bl-space-8,8px); margin:0;
  padding:var(--bl-space-24,24px) var(--bl-space-20,20px); background:var(--bl-card,rgba(255,255,255,.86));
  border:var(--bl-border,1px solid rgba(15,23,42,.065)); border-radius:var(--bl-radius-md,18px);
  box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055));
}
body.static-page .bl-lvl__code{
  align-self:flex-start; padding:2px var(--bl-space-8,8px); border-radius:999px;
  background:var(--c-primary-50,#EAF1F3); color:var(--bl-blue,#2F6075);
  font-size:var(--bl-fs-12,12px); font-weight:var(--fw-strong,800); line-height:var(--bl-lh-heading,1.2);
}
body.static-page .bl-lvl__name{ margin:0; font-size:var(--bl-fs-18,18px); font-weight:var(--fw-heading,700); line-height:var(--bl-lh-heading,1.2); color:var(--bl-text,rgba(15,23,42,.92)); }
body.static-page .bl-lvl__desc{ margin:0; font-size:var(--bl-fs-14,14px); line-height:var(--bl-lh-body,1.5); color:var(--bl-muted,rgba(15,23,42,.66)); }
@media (max-width:768px){
  body.static-page .bl-lvl{ grid-template-columns:1fr; gap:var(--bl-space-12,12px); }
}

/* Сітка напрямів на static-сторінках: повторне використання карток
   .bl-cn__* головної; модифікатор задає лише розкладку в колонці контенту */
body.static-page .bl-cn__grid--static{ width:100%; margin:var(--bl-space-24,24px) 0 var(--bl-space-32,32px); }
body.static-page div.bl-cn__card{ cursor:default; }
body.static-page div.bl-cn__card:hover{ transform:none; box-shadow:var(--bl-shadow-soft,0 6px 22px rgba(15,23,42,.055)); }

/* Фінальна CTA-картка (сертифікат) + центрована нотатка */
body.static-page .bl-cta-card{
  margin:var(--bl-space-40,40px) auto var(--bl-space-16,16px); padding:var(--bl-space-32,32px) var(--bl-space-24,24px);
  max-width:640px; text-align:center; background:var(--bl-card,rgba(255,255,255,.86));
  border:var(--bl-border,1px solid rgba(15,23,42,.065)); border-radius:var(--bl-radius-lg,24px);
  box-shadow:var(--bl-shadow,0 12px 38px rgba(15,23,42,.07));
}
body.static-page .bl-cta-card__t{ margin:0 0 var(--bl-space-8,8px); font-size:var(--bl-fs-20,20px); font-weight:var(--fw-strong,800); line-height:var(--bl-lh-sub,1.3); color:var(--bl-text,rgba(15,23,42,.92)); }
body.static-page .bl-cta-card__s{ margin:0 0 var(--bl-space-20,20px); font-size:var(--bl-fs-15,15px); line-height:var(--bl-lh-body,1.5); color:var(--bl-muted,rgba(15,23,42,.66)); }
body.static-page .bl-note-center{ text-align:center; margin:var(--bl-space-32,32px) 0 0; }
body.static-page .bl-note-center a{ color:var(--bl-blue,#2F6075); font-weight:var(--fw-heading,700); text-decoration:none; }
body.static-page .bl-note-center a:hover{ color:var(--bl-blue-hover,#234A5C); }