/* ============================================================
   BE-DARK — пілот дизайн-системи «темне бенто» (15.07.2026)
   Сторінка: /business_english1/ (noindex-експеримент).
   Гейт: body.be-dark ПОВЕРХ body.page-biz-english — реюз сітки .crs-*
   із course-page.css; цей файл вантажиться окремим <link> ПІСЛЯ
   склейки combined-inner (через $extraHead) → виграє каскадом.

   База (референс-напрям): модульна композиція, темна тема, велика
   типографіка, карткова архітектура, виразні цифри.

   КОЛЬОРИ (рішення Di 15.07, друга ітерація): схема = /business_english/ —
   градієнт-поверхня --grad-cta-zone зі скримом (успадкована з course-page.css),
   скло-картки rgba(255,255,255,.07), cyan #6FE3FA, сайтові --grad-accent /
   --grad-cta. Історія: перша ітерація була нейтральний вугільний ряд
   #0A0A0A/#141414 із violet-акцентом дії — знято цим самим комітом.
   ============================================================ */

body.page-biz-english.be-dark{
  /* КОЛЬОРОВА СХЕМА = /business_english/ (Di 15.07): поверхня сторінки —
     успадкований градієнт --grad-cta-zone зі скримом .32 (course-page.css,
     власний override тла ЗНЯТО), скло-картки, cyan #6FE3FA, сайтові
     --grad-accent/--grad-cta (перевизначення violet ЗНЯТО). Бенто-композиція
     без змін — токени bed-* мапляться на скло-поверхні оригіналу. */
  --bed-s1: rgba(255,255,255,.07);
  --bed-s2: rgba(255,255,255,.11);
  --bed-line: rgba(255,255,255,.14);
  --bed-line-2: rgba(255,255,255,.22);
  --crs-title: #FFFFFF;
  --crs-ink: #F2F7F9;
  --crs-ink-2: #F2F7F9;
  --crs-ink-3: #F2F7F9;
  --crs-ink-4: #F2F7F9;
  --crs-cyan: #6FE3FA;
  --crs-surface: var(--bed-s1);
  --crs-line: var(--bed-line);
  /* ритм секцій: щільніше (64 → 56) */
  --bl-section-y: 56px;
  /* Ціни (Варіант A, 17.07.2026): секція цін тема-нативна через токени theme-2026.
     Темна база в тон сторінки + світлий текст; меш-аврора трохи ярніша за світлу
     тему (кольорове світло на темному читається делікатно). Картки лишаються теплими
     (перегук зі світлою темою) і ефектно «висять» на темній базі. */
  --price-surface: linear-gradient(160deg,#3A5468 0%,#3F4E74 55%,#48406E 100%); /* світліше V3 (Di 17.07): плита ще світліша над темною сторінкою; білий 7,9:1, муут 4,7:1 (AA ок) */
  --price-mesh:
    radial-gradient(115% 80% at 88% -10%, rgba(108,92,231,.16), transparent 55%),
    radial-gradient(120% 90% at -10% 112%, rgba(20,131,160,.15), transparent 58%),
    radial-gradient(110% 85% at 55% 120%, rgba(255,122,89,.13), transparent 60%);
  --price-ink: #FFFFFF;
  --price-ink-muted: rgba(242,247,249,.72);
}

/* Світле на темному: grayscale-згладжування (Важіль 1, 17.07.2026) — на macOS/iOS
   субпіксельний растр потовщує світлі штрихи, текст здається жирнішим за свою вагу.
   Той самий лік, що вже на нав-пігулці (theme-2026). Ваги §9б НЕ чіпаємо, лише
   спосіб растеризації. Діє на весь текст темної сторінки. */
body.be-dark{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* --- Герой: текстовий блок на плашці (бенто-картка, як у референса) --- */
body.be-dark .bed-hero-card{
  background: var(--bed-s1);
  border: 1px solid var(--bed-line);
  border-radius: var(--bl-radius-bento-lg, 24px);
  padding: 44px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 18px 44px rgba(0,0,0,.45);
}

/* --- Герой: велика типографіка + пара CTA --- */
body.page-biz-english.be-dark .crs-h1{
  font-size: var(--t-h1-hero, 46px);
  letter-spacing: -.025em;
}
body.page-biz-english.be-dark .crs-lead{ max-width: 46ch; }

body.be-dark .bed-cta{ display: flex; flex-wrap: wrap; gap: 16px; margin-top: 32px; }
body.be-dark .bed-btn{
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 56px; padding: 14px 32px; border-radius: 999px;
  font-size: var(--t-secondary, 18px); font-weight: 700; line-height: 1.2;
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
body.be-dark a.bed-btn--primary{
  background: var(--grad-cta); color: #fff;
  box-shadow: var(--bl-shadow-cta, 0 14px 34px rgba(0,0,0,.35));
}
body.be-dark a.bed-btn--primary:hover{
  color: #fff; transform: translateY(-2px);
  box-shadow: var(--bl-shadow-cta-hover, 0 20px 44px rgba(0,0,0,.45));
}
body.be-dark a.bed-btn--ghost{
  background: rgba(255,255,255,.05);
  border: 1px solid var(--bed-line-2);
  color: var(--crs-ink);
}
body.be-dark a.bed-btn--ghost:hover{
  color: var(--crs-ink); background: rgba(255,255,255,.09);
  transform: translateY(-2px);
}
body.be-dark .bed-btn:focus-visible{ outline: 3px solid var(--crs-cyan); outline-offset: 2px; }

/* Фото — жива картка на темному */
body.page-biz-english.be-dark .crs-media img{
  border-radius: var(--bl-radius-bento-lg, 24px);
  border: 1px solid var(--bed-line-2);
  box-shadow: 0 30px 70px rgba(0,0,0,.55);
}

/* --- Виразні цифри: bento-ряд довіри під героєм ---
   Ваги за §9б: label 14px caps+track ≥.06em → 800 дозволено;
   цифра ≥34px → 800; опис 16px/450. */
body.be-dark .bed-stats{
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px; margin-top: 48px;
}
body.be-dark .bed-stat{
  background: var(--bed-s1);
  border: 1px solid var(--bed-line);
  border-radius: var(--bl-radius-bento, 20px);
  padding: 28px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 18px 44px rgba(0,0,0,.45);
  display: flex; flex-direction: column;
}
body.be-dark .bed-stat__l{
  font-size: var(--t-label, 14px); font-weight: 800;
  text-transform: uppercase; letter-spacing: .14em;
  color: var(--crs-ink-4);
}
body.be-dark .bed-stat__v{
  display: flex; align-items: baseline; gap: 6px;
  font-size: clamp(34px, 3.6vw, 52px); font-weight: 800;
  letter-spacing: -.03em; line-height: 1.05;
  color: #fff; margin-top: 16px; /* 14→16: сітка 4px (аудит п.3) */
}
body.be-dark .bed-stat__v .u{ color: var(--crs-cyan); }
/* Суфікс-слово (напр. «занять», «хв», «міс» — рендерить двіжок класом .u-txt;
   «+» і «%» лишаються повнорозмірними): підпис при числі, не гігантський текст.
   18px → вага 700 у стелі §9б. Фікс 18.07.2026: «4–6 занять» на /rozmovna-angliyska/
   не вміщалося в stat-картку. */
body.be-dark .bed-stat__v .u-txt{
  font-size: var(--t-secondary, 18px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
}
body.be-dark .bed-stat__v .crs-st{ width: 26px; height: 26px; align-self: center; color: var(--bl-amber, #F2A93B); }
/* третій рядок .bed-stat__d ЗНЯТО (Di 15.07): картки дворядкові, зміст у лейблі */

/* --- Карткова архітектура: суцільні поверхні замість скла --- */
body.page-biz-english.be-dark .crs-card,
body.page-biz-english.be-dark .crs-mod,
body.page-biz-english.be-dark .crs-step{
  background: var(--bed-s1);
  border: 1px solid var(--bed-line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 18px 44px rgba(0,0,0,.45);
}
body.page-biz-english.be-dark .crs-card,
body.page-biz-english.be-dark .crs-mod{ padding: 28px; }
body.page-biz-english.be-dark .crs-card:hover{
  background: var(--bed-s2);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 26px 56px rgba(0,0,0,.50);
}
body.page-biz-english.be-dark .crs-grid3{ gap: 24px; }
body.page-biz-english.be-dark .crs-card::before{ display: none; } /* без акцентної смужки зверху (Di 15.07) */
/* Підсумок «Що вмітимете» — не вкладений бокс, а рядок під волосяною лінією (Di 15.07):
   прозоро, лише border-top, без радіуса; сторони заподлицо з падінгом картки. */
body.page-biz-english.be-dark .crs-out{
  background: transparent;
  border: 0;
  border-top: 1px solid var(--bed-line);
  border-radius: 0;
  padding: 16px 0 0;
}

/* --- Заголовки розділів: малий капс-лейбл ліворуч (мова референса) ---
   Вага 800 на 14px: виняток §9б — uppercase + letter-spacing ≥ .06em. */
body.page-biz-english.be-dark .crs-h2,
body.theme-2026.page-biz-english.be-dark .be-faq-wrap[aria-labelledby^="faq-title-"] h2,
body.theme-2026.page-biz-english.be-dark .bl-crosslinks-wrap h2.bl-h2-sub{
  font-size: var(--t-label, 14px);
  line-height: var(--bl-lh-heading, 1.2);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .14em; /* .16→.14: єдина розрядка капсу системи (аудит п.4) */
  text-align: left;
  color: var(--crs-ink-4);
  margin: 0 0 24px;
}
/* FAQ реюзає .container (max 1140 / pad 15), решта двіжка — .crs-in (max 1120 / pad 24):
   від цього лівий каповий заголовок FAQ виступав ~19px ліворуч за колонку секцій.
   Прирівнюємо геометрію контейнера FAQ до .crs-in — заголовок і картки збігаються. */
body.page-biz-english.be-dark .be-faq-wrap[aria-labelledby^="faq-title-"] > .container{
  max-width: 1120px; padding-left: 24px; padding-right: 24px;
}
/* Факт-стрічка «Коротко» (Di 15.07, варіант 1): 3 колонки лейбл+значення,
   мова stat-карток; вага 600 на 18px — у стелі §9б (16–19px ≤ 700) */
body.be-dark .bed-facts{
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 32px;
  background: var(--bed-s1);
  border: 1px solid var(--bed-line);
  border-radius: var(--bl-radius-bento, 24px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 18px 44px rgba(0,0,0,.45);
}
body.be-dark .bed-facts__it{ padding: 24px 28px; }
body.be-dark .bed-facts__it + .bed-facts__it{ border-left: 1px solid var(--bed-line); }
body.be-dark .bed-facts__l{
  display: block;
  font-size: var(--t-label, 14px); font-weight: 800;
  text-transform: uppercase; letter-spacing: .14em;
  line-height: 1.2; color: var(--crs-ink-4);
}
body.be-dark .bed-facts__v{
  display: block; margin-top: 8px;
  font-size: var(--t-secondary, 18px); font-weight: 600;
  line-height: var(--bl-lh-sub, 1.3); color: var(--crs-ink);
}
body.be-dark .bed-facts__v a{
  color: var(--crs-cyan);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px;
}

/* ============================================================
   БЕНТО-ПАКЕТ (Di «так на всі» 15.07)
   ============================================================ */

/* 1. Різноформатна сітка: зигзаг широких карток (спани в сумі кратні 3,
   без дірок; лише desktop — на мобайлі сітка 1 колонка). */
@media (min-width: 769px){
  body.be-dark .crs-grid3 > .crs-card:nth-child(1),
  body.be-dark .crs-grid3 > .crs-card:nth-child(4),
  body.be-dark .crs-grid3 > .crs-card:nth-child(5),
  body.be-dark .crs-grid3 > .crs-mod:nth-child(1),
  body.be-dark .crs-grid3 > .crs-mod:nth-child(4),
  body.be-dark .crs-grid3 > .crs-mod:nth-child(6){ grid-column: span 2; }
}

/* 2. Акцентна stat-картка (Рейтинг) — сайтовий акцент-градієнт (як eyebrow-чип) */
body.be-dark .bed-stat--hi{
  background: var(--grad-accent);
  border-color: transparent;
}
body.be-dark .bed-stat--hi .bed-stat__l{ color: rgba(255,255,255,.85); }
body.be-dark .bed-stat--hi .bed-stat__v .u{ color: #fff; }

/* 3. Кроки — одна широка картка-стрічка з роздільниками */
body.be-dark .bed-steps{
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  background: var(--bed-s1);
  border: 1px solid var(--bed-line);
  border-radius: var(--bl-radius-bento-lg, 24px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 18px 44px rgba(0,0,0,.45);
}
body.be-dark .bed-steps__it{ padding: 36px 32px; }
body.be-dark .bed-steps__it + .bed-steps__it{ border-left: 1px solid var(--bed-line); }
body.be-dark .bed-steps__it .crs-step__n{ margin: 0 0 16px; }
body.be-dark .bed-steps__it h3{
  font-size: var(--t-card-title, 24px); line-height: var(--bl-lh-sub, 1.3);
  font-weight: 700; margin: 0 0 8px;
  color: var(--crs-title); text-align: left;
}
body.be-dark .bed-steps__it p{
  font-size: var(--t-read, 22px); line-height: var(--bl-lh-body, 1.5);
  font-weight: 450; margin: 0;
  color: var(--crs-ink-2); text-align: left;
}

/* 4. Бейдж на фото ЗНЯТО (аудит п.2, Di 15.07): носій рейтингу один — stat-картка */

/* Цитата методиста замість proof-блоку (аудит п.7, варіант 1) */
body.page-biz-english.be-dark .crs-proof{ text-align: left; }
body.be-dark .bed-quote__tx{
  margin: 0;
  font-size: var(--t-card-title, 27px); font-weight: 600;
  line-height: 1.4; color: var(--crs-title);
}
body.be-dark .bed-quote__by{
  margin: 16px 0 0;
  font-size: var(--t-label, 14px); font-weight: 800;
  text-transform: uppercase; letter-spacing: .14em;
  color: var(--crs-ink-4);
}

/* Байлайн на темній — приглушений: був майже білий #F2F7F9 (~9.8:1, «кричав»);
   ~5.4:1 у найсвітлішій точці градієнта — вторинний, але лишається AA.
   Бренд-лінк успадковує колір (color:inherit у home-fix). */
body.page-biz-english.be-dark .bl-course-byline{ color: rgba(242,247,249,.70); }

/* 5. Фінальна CTA-картка: велика цифра + заклик + кнопка */
body.be-dark .bed-final{
  display: grid; grid-template-columns: auto 1fr auto;
  gap: 44px; align-items: center;
  padding: 44px;
  background: var(--bed-s1);
  border: 1px solid var(--bed-line);
  border-radius: var(--bl-radius-bento-lg, 24px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 18px 44px rgba(0,0,0,.45);
}
body.be-dark .bed-final__num{
  font-size: clamp(56px, 6.5vw, 84px); font-weight: 800;
  letter-spacing: -.03em; line-height: 1; color: #fff;
}
body.be-dark .bed-final__num .u{ color: var(--crs-cyan); }
body.be-dark .bed-final__cap{
  display: block; margin-top: 12px; /* 10→12: сітка 4px (аудит п.3) */
  font-size: var(--t-label, 14px); font-weight: 800;
  text-transform: uppercase; letter-spacing: .14em;
  color: var(--crs-ink-4);
}
body.be-dark .bed-final__tx h2{
  font-size: var(--t-cta-title, 32px); line-height: var(--bl-lh-heading, 1.2);
  font-weight: 800; letter-spacing: -.02em; margin: 0 0 8px;
  color: var(--crs-title); text-align: left;
}
body.be-dark .bed-final__tx p{
  font-size: var(--t-lead, 22px); line-height: var(--bl-lh-body, 1.5);
  font-weight: 450; margin: 0; color: var(--crs-ink-3);
}
/* Фінальна CTA-картка: на десктопі кнопка вагоміша й ширша (17.07: висота 60,
   шрифт 22 (крок --t-read), поле 16/40, мін-ширина 220, щоб головна дія не програвала цифрі) */
@media (min-width: 769px){
  body.be-dark .bed-final .bed-btn{
    min-height: 60px; padding: 16px 40px;
    font-size: var(--t-read, 22px); min-width: 220px;
  }
}

/* 6. Чипи рівнів на картках модулів (інформаційна бірюза; 14px → вага 600 за §9б) */
body.be-dark .bed-lvl{
  margin-left: auto; flex: 0 0 auto; align-self: flex-start;
  padding: 8px 12px; border-radius: 999px; /* 6→8: сітка 4px (аудит п.3) */
  background: rgba(111,227,250,.14);
  border: 1px solid rgba(111,227,250,.40);
  color: var(--crs-cyan);
  font-size: var(--t-label, 14px); font-weight: 600; line-height: 1.2;
}

/* FAQ-картки в бенто (аудит п.1): радіус і падінг як у решти карток сторінки */
body.theme-2026.page-biz-english.be-dark .faq-card{
  border-radius: var(--bl-radius-bento, 24px);
  padding: 28px;
}

/* Єдиний line-height тіла 1.55 (аудит п.6): topics/out жили на 1.5 через
   локальний токен course-page, абзаци карток — на 1.55 */
body.page-biz-english.be-dark .crs-card p,
body.page-biz-english.be-dark .crs-step p,
body.page-biz-english.be-dark .crs-topics li,
body.page-biz-english.be-dark .crs-out span,
body.page-biz-english.be-dark .bed-steps__it p{ line-height: 1.55; }

/* ============================================================
   ВАРІАНТ B — зниження монотонності карток (Di «B на обидві» 16.07.2026)
   Три довгі скло-секції поспіль (запити / модулі / FAQ) говорили однією
   формою. Розводимо за рівнями: FAQ у плоский поділений список, «запити» —
   легкі контурні плитки без тіні, модулі лишаються єдиним виразним скло-
   рівнем на власній заглибленій підкладці-главі.
   Скоуп: body.page-biz-english.be-dark → business_english + English_for_IT
   (усі мовні варіанти двіжка). :has() — прогресивне покращення: де браузер
   не підтримує, глава просто без окремої підкладки.
   ============================================================ */

/* 1. «Найчастіші запити» — спокійні картки: заливка ЛИШАЄТЬСЯ (без неї
   плитки читались як порожні контури), знімаємо лише важку drop-тінь →
   картки завершені, але тихіші за модулі (у тих тінь лишається акцентом). */
body.page-biz-english.be-dark .crs-card{
  background: var(--bed-s1);
  border-color: var(--bed-line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
body.page-biz-english.be-dark .crs-card:hover{
  background: var(--bed-s2);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

/* 2. Модулі «Що всередині курсу» — єдиний виразний скло-рівень: лишаємо
   тінь (тепер вона акцентна) і трохи чіткішу обводку. */
body.page-biz-english.be-dark .crs-mod{ border-color: var(--bed-line-2); }

/* 3. Окрема підкладка глави модулів: повнорядкова заглиблена панель —
   секція читається як інша сцена, скло-картки виразніше проступають. */
body.page-biz-english.be-dark .crs-wrap:has(.crs-mod){
  background: linear-gradient(180deg, rgba(8,16,24,.30), rgba(8,16,24,.14));
  border-top: 1px solid var(--bed-line);
  border-bottom: 1px solid var(--bed-line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  padding-block: var(--bl-space-72, 72px);
}

/* 4. FAQ — плоский поділений список замість скло-карток: без тіні й
   коробки, лише волосяний роздільник зверху; 2 колонки на десктопі.
   УВАГА: course-page.css заливає .faq-card склом через !important
   (background/border/box-shadow), тому перекриваємо теж !important —
   інакше лишаються бічні рамки й гострі коробки з текстом упритул.
   grid-column ТЕЖ !important: бенто-правила course-page.css
   (.faq-grid > .faq-card:last-child:nth-child(3n+1) → span 6 тощо)
   мають вищу специфічність (0,7,1) за цей селектор і без !important
   вигравали — остання картка діставала span 6, роздувала сітку до 6
   неявних колонок (дві по 0px), і перші картки накладались одна на одну. */
body.page-biz-english.be-dark .be-faq-wrap .faq-grid{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 56px;
  row-gap: 0;
}
body.page-biz-english.be-dark .be-faq-wrap .faq-card{
  grid-column: auto !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid var(--bed-line) !important;
  border-radius: 0;
  box-shadow: none !important;
  padding: 24px 0;
}
@media (max-width: 768px){
  body.page-biz-english.be-dark .crs-wrap:has(.crs-mod){ padding-block: 48px; }
  body.page-biz-english.be-dark .be-faq-wrap .faq-grid{ grid-template-columns: 1fr; column-gap: 0; }
  /* Мобайл: у 1 колонку волосяна лінія .14 майже зникає на темному тлі й
     картки зливаються. Роздільник помітніший (.30) + трохи більший інтервал
     (Варіант A, Di 17.07). Колір !important б'є border-top base-правила вище. */
  body.page-biz-english.be-dark .be-faq-wrap .faq-card{ padding: 22px 0; border-top-color: rgba(255,255,255,.30) !important; }
}

/* --- Мобайл --- */
@media (max-width: 991px){
  body.be-dark .bed-stats{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px; margin-top: 40px;
  }
}
@media (max-width: 768px){
  body.page-biz-english.be-dark{ --bl-section-y: 40px; }
  body.be-dark .bed-cta{ margin-top: 24px; gap: 12px; }
  body.be-dark .bed-btn{ width: 100%; }
  body.be-dark .bed-stat{ padding: 20px; }
  body.be-dark .bed-hero-card{ padding: 28px 24px; }
  body.page-biz-english.be-dark .crs-card,
  body.page-biz-english.be-dark .crs-mod{ padding: 24px; }
  body.be-dark .bed-steps{ grid-template-columns: 1fr; }
  body.be-dark .bed-steps__it{ padding: 24px; }
  body.be-dark .bed-steps__it + .bed-steps__it{ border-left: 0; border-top: 1px solid var(--bed-line); }
  body.be-dark .bed-facts{ grid-template-columns: 1fr; }
  body.be-dark .bed-facts__it{ padding: 16px 20px; }
  body.be-dark .bed-facts__it + .bed-facts__it{ border-left: 0; border-top: 1px solid var(--bed-line); }
  body.theme-2026.page-biz-english.be-dark .faq-card{ padding: 24px; }
  body.page-biz-english.be-dark .be-faq-wrap[aria-labelledby^="faq-title-"] > .container{ padding-left: 16px; padding-right: 16px; }
  body.be-dark .bed-final{ grid-template-columns: 1fr; gap: 24px; padding: 28px 24px; }
  body.be-dark .bed-final .bed-btn{ width: 100%; }
}

/* ============================================================
   РОЗШИРЕННЯ ДВІЖКА (16.07.2026) — хвиля 2: /corporate/ + /ielts/ ×3 мови.
   Нові слоти course-engine: чек-плитки (checklist), проза (prose),
   корпоративні ціни (pricingCorp — темний скін .co-price2 із home-fix).
   ============================================================ */

/* Чек-плитки: тихий рівень (як «запити») — скло-плитка з cyan-галочкою.
   18px → вага 600 у стелі §9б (16–19px ≤ 700). */
body.be-dark .bed-checks{
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
body.be-dark .bed-checks li{
  display: flex; align-items: flex-start; gap: 12px;
  background: var(--bed-s1);
  border: 1px solid var(--bed-line);
  border-radius: var(--bl-radius-bento, 20px);
  padding: 20px 24px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  font-size: var(--t-secondary, 18px); font-weight: 600;
  line-height: var(--bl-lh-sub, 1.3);
  color: var(--crs-ink);
}
body.be-dark .bed-checks .bed-chk{
  flex: 0 0 auto; width: 22px; height: 22px; margin-top: 2px;
  color: var(--crs-cyan);
}

/* Проза .bl-content на темному: base-кольори course-page.css (світлі --c-*)
   перекриваються каскадом (be-dark.css вантажиться після склейки). */
body.be-dark .bl-content h1,
body.be-dark .bl-content h2,
body.be-dark .bl-content h3{ color: var(--crs-title); }
body.be-dark .bl-content p,
body.be-dark .bl-content ul,
body.be-dark .bl-content li{ color: var(--crs-ink-2); }
body.be-dark .bl-content b,
body.be-dark .bl-content strong{ color: #fff; }
body.be-dark .bl-content em{ color: var(--crs-ink); }
body.be-dark .bl-content a{
  color: var(--crs-cyan);
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px;
}

/* Корпоративні ціни (.co-price2 з home-fix.css — світлий скін) → темне бенто:
   картка-сцена як bed-final, num білий із cyan-акцентом, чипи/пігулки скло. */
body.be-dark .co-price-wrap{ padding: var(--bl-section-y, 56px) 0; }
body.be-dark .co-price-wrap h2{ color: var(--crs-title); }
body.be-dark .co-price-wrap .co-sec-sub{ color: var(--crs-ink-3); }
body.be-dark .co-price2{
  max-width: 720px;
  background: var(--bed-s1);
  border: 1px solid var(--bed-line);
  border-radius: var(--bl-radius-bento-lg, 24px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 18px 44px rgba(0,0,0,.45);
  padding: 44px;
}
body.be-dark .co-price2-num{ color: #fff; }
body.be-dark .co-price2-unit{ color: var(--crs-ink-3); }
body.be-dark .co-price2-chips li{
  background: rgba(255,255,255,.05);
  border: 1px solid var(--bed-line-2);
  color: var(--crs-ink);
}
body.be-dark .co-price2-disc-lbl{ color: var(--crs-ink-4); }
body.be-dark .co-price2-pills li{ background: rgba(111,227,250,.14); border: 1px solid rgba(111,227,250,.40); }
body.be-dark .co-price2-pills li strong{ color: var(--crs-cyan); }
body.be-dark .co-price2-pills li span{ color: var(--crs-ink-2); }
body.be-dark .co-price2-note{ color: var(--crs-ink-3); }

/* Хвиля 3 (16.07.2026): підпис-місток калькулятора строків на темному —
   базовий #5C6B78 із партіала time-to-level нечитабельний на темному тлі.
   Потроєння класу дзеркалить специфічність оригіналу (0,3,1) + каскад be-dark. */
body.be-dark p.ttl-note.ttl-note.ttl-note{ color: var(--crs-ink-3); }
body.be-dark p.ttl-note.ttl-note.ttl-note a{ color: var(--crs-cyan); }

@media (max-width: 768px){
  body.be-dark .bed-checks{ grid-template-columns: 1fr; gap: 16px; }
  body.be-dark .bed-checks li{ padding: 16px 20px; }
  body.be-dark .co-price2{ padding: 28px 24px; }
}

/* ============================================================
   Фікс апскейлу малих фото героя (18.07.2026). Фрейм-правило 17.07
   («фото = висота плашки», cover) розтягувало нативи 447–720w понад
   1:1 CSS (до 1.09 уже на DPR1 і 1.7–2.2 на DPR2) → видимі артефакти
   стиснення. Обгортка ставить 'fitNative' => true у hero.image (двіжок
   додає .crs-media--sm): фото тримає власний аспект і не рендериться
   ширше за свій width-атрибут (= натив). Сторінки з 2x-нативами
   (general 1040w / corporate 1094w / ielts 996w / English_for_IT 1200w)
   лишаються на фрейм-правилі. Мобайл не зачеплено (фрейм і так лише ≥769). */
@media (min-width: 769px){
  /* Подвоєння .crs-media--sm: цей блок стоїть у файлі РАНІШЕ за фрейм-правило
     17.07 (@769, рівна специфічність) — без подвоєння програвав би каскадом */
  body.page-biz-english.be-dark .crs-media--sm.crs-media--sm{
    align-self: center; overflow: visible;
    border: 0; border-radius: 0; box-shadow: none;
    text-align: center;
  }
  body.page-biz-english.be-dark .crs-media--sm.crs-media--sm picture{ position: static; }
  body.page-biz-english.be-dark .crs-media--sm.crs-media--sm img{
    width: auto; height: auto; max-width: 100%;
    object-fit: unset; object-position: unset;
    border: 1px solid var(--bed-line-2);
    border-radius: var(--bl-radius-bento-lg, 24px);
    box-shadow: 0 30px 70px rgba(0,0,0,.55);
  }
}
/* === Герой: фрейм фото = висота текстової плашки; фото кропиться автоматично (Di 17.07, п.4) ===
   Десктоп: рядок героя рівновисокий, висоту задає ПЛАШКА (текст), бо фото абсолютне й не впливає
   на висоту рядка. Фото заповнює фрейм object-fit:cover по центру. Рамку/тінь/радіус перенесено
   з <img> на фрейм (overflow:hidden інакше обрізав би тінь). Мобайл (<=768) не чіпаємо. */
@media (min-width: 769px){
  body.page-biz-english.be-dark .crs-hero{ align-items: stretch; }
  body.page-biz-english.be-dark .crs-media{
    position: relative; align-self: stretch; min-height: 0; overflow: hidden;
    border-radius: var(--bl-radius-bento-lg, 24px);
    border: 1px solid var(--bed-line-2);
    box-shadow: 0 30px 70px rgba(0,0,0,.55);
  }
  body.page-biz-english.be-dark .crs-media picture{ position: absolute; inset: 0; display: block; }
  body.page-biz-english.be-dark .crs-media img{
    width: 100%; height: 100%; object-fit: cover; object-position: center;
    border: 0; border-radius: 0; box-shadow: none;
  }
}

/* ============================================================
   НАСКРІЗНА ЗВІРКА 17.07.2026 — дірки-сироти у бенто при «неповних»
   кількостях карток (виявлено рендером; накладань НЕМА). Дві сітки мали
   неадаптований трек-каунт → остання картка висіла сама у ряду:
   1) факт-стрічка з 4 фактами (English_for_IT ×2, corporate ×3);
   2) audience з 3 карток (IELTS ×2). Обидва фікси через :has() (той самий
   прийом, що вже у файлі; де не підтримується — лишається як було).
   Скоуп ≥769px: на ≤768 обидві сітки вже в 1 колонку.
   ============================================================ */
@media (min-width: 769px){
  /* 1. Факт-стрічка з рівно 4 фактами → 2×2 замість «3 + сирота». Роздільники
     хрестом: вертикаль лишається (border-left колонки 2 успадкований), горизонталь
     додаємо (border-top на 3-й і 4-й факти), а 3-й факт (кол.1 ряд2) втрачає
     border-left, щоб не було зайвої вертикалі ліворуч. */
  body.be-dark .bed-facts:has(> .bed-facts__it:nth-child(4)):not(:has(> .bed-facts__it:nth-child(5))){
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.be-dark .bed-facts:has(> .bed-facts__it:nth-child(4)):not(:has(> .bed-facts__it:nth-child(5))) > .bed-facts__it:nth-child(n+3){
    border-top: 1px solid var(--bed-line);
  }
  body.be-dark .bed-facts:has(> .bed-facts__it:nth-child(4)):not(:has(> .bed-facts__it:nth-child(5))) > .bed-facts__it:nth-child(3){
    border-left: 0;
  }
  /* 2. Audience з рівно 3 карток → рівний ряд 3-up: знімаємо span-2 з першої
     (бенто-span розрахований на 6). Лише crs-card (audience); модулі не чіпаємо. */
  body.be-dark .crs-grid3:has(> .crs-card:nth-child(3):last-child) > .crs-card:nth-child(1){
    grid-column: auto;
  }
}