/**
 * Панель онлайн-курса (Gentelella): цвета проекта на всех ширинах;
 * кастомная фикс-сетка под шапкой AIRo — только десктоп (min-width: 992px).
 * На мобилке ведёт себя как исходный шаблон Gentelella (airo-course-panel.css).
 */

:root {
  /* Нижняя панель «пред/след урок» — тот же голубой, что акценты QuickFit / мотив блока 6 */
  --airo-lesson-nav-label-cyan: #a0e1f3;
  /* Зазор под шапку AIRo: чуть меньше, чем раньше (90px), чтобы панель курса ближе к шапке */
  --airo-course-header-offset: 84px;
  --airo-course-burger-bar-height: 72px;
  /* Высота полосы как у .sidebar-footer (padding 5px + ячейка ~7+3+17px) + запас */
  --airo-lesson-footer-bar-height: 40px;
  /* 3D-плитка: нижняя панель урока + заголовки спойлеров (.airo-course-modnav-matrix) */
  --airo-course-tile-3d-bg: linear-gradient(180deg, #181818 0%, #101010 100%);
  --airo-course-tile-3d-bg-hover: linear-gradient(180deg, #1c2226 0%, #121418 100%);
  --airo-course-tile-3d-bg-open: linear-gradient(180deg, #15191c 0%, #0e1012 100%);
  --airo-course-tile-3d-shadow: inset 0 1px 0 rgba(110, 197, 255, 0.1), inset 0 -2px 10px rgba(0, 0, 0, 0.65);
  --airo-course-tile-3d-shadow-hover: inset 0 1px 0 rgba(110, 197, 255, 0.15), inset 0 -2px 10px rgba(0, 0, 0, 0.72),
    inset 0 0 18px rgba(160, 225, 243, 0.08);
  --airo-course-tile-3d-shadow-open: inset 0 1px 0 rgba(110, 197, 255, 0.12), inset 0 3px 12px rgba(0, 0, 0, 0.55);
  --airo-course-tile-3d-shadow-active: inset 0 2px 8px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(110, 197, 255, 0.08);
  --airo-course-tile-3d-border: 1px solid rgba(0, 0, 0, 0.5);
}

body.airo-course-panel-page {
  background-color: #0e0e0e;
  color: #e0e0e0;
  /* Подписи модулей слева (RU/EN, все ширины) — тот же оттенок, что акценты урока */
  --airo-side-nav-cyan: #a0e1f3;
  --airo-side-nav-cyan-rgb: 160, 225, 243;
}

/* Высота одной сцены QuickFit = .right_col (шапка AIRo + top_nav уже не в 100dvh) */
body.airo-course-welcome-quickfit-page {
  --airo-course-quickfit-hero-minh: max(
    12rem,
    calc(
      100dvh - var(--airo-course-header-offset) - var(--airo-course-burger-bar-height) -
        env(safe-area-inset-bottom, 0px)
    )
  );
  /* 829+: z = min(1, w×0.97 / эталон). Чем больше число — тем сильнее сжатие при той же колонке (см. airo-course-panel.js) */
  --airo-qf-design-px: 1680;
  --airo-qf-zoom: 1;
  /* Блок 5: «резиновые» отступы/кегль; −5% к размеру всей тройки (scale и zoom) */
  --airo-qf-block5-scale: 1.42025;
  --airo-qf-block5-zoom: 1.24545;
  /* CTA: зазор между вводным абзацем и подзаголовком «Что тебе нужно…» */
  --airo-qf-block5-cta-after-intro: 1.4em;
  /* Сцена 5-го слайда выше стандартной + место по вертикали под три рамки */
  --airo-qf-block5-hero-minh: max(
    calc(var(--airo-course-quickfit-hero-minh) + min(22vh, 280px)),
    16rem
  );
}

/*
 * QuickFit: нельзя «уезжать» лентой влево/вправо (iOS ловит жест, rubber-band).
 * html-класс на airo-course-welcome-quickfit.html; :has — для других вариантов разметки.
 */
html.airo-qf-welcome-page,
html:has(body.airo-course-welcome-quickfit-page) {
  overflow-x: hidden;
  width: 100%;
  max-width: 100%;
  position: relative;
}

body.airo-course-welcome-quickfit-page {
  overflow-x: hidden;
  max-width: 100%;
  width: 100%;
  position: relative;
  overscroll-behavior-x: none;
}

body.airo-course-welcome-quickfit-page .airo-course-panel-main,
body.airo-course-welcome-quickfit-page .container.body,
body.airo-course-welcome-quickfit-page .main_container {
  overflow-x: hidden;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

/*
 * Моб. QuickFit: раньше здесь был touch-action: pan-y на html/body — iOS/Safari часто
 * «натыкались» в этот слой: скролл .right_col не срабатывал, пока жест не станет «жёстким».
 * Вертикальные жесты задаём только на прокручиваемой колонке (см. .right_col ниже).
 */

/* ---- Цвета и оформление (все ширины; без смены раскладки Gentelella) ---- */

/* Боковая панель: тёмный 3D-рельеф (inset + градиент + тень) */
body.airo-course-panel-page .left_col,
body.airo-course-panel-page .left_col.scroll-view {
  background: linear-gradient(155deg, #1a1a1a 0%, #0c0c0c 40%, #101010 100%) !important;
  border-top: 2px solid rgba(255, 255, 255, 0.35) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 1px 0 0 rgba(110, 197, 255, 0.12),
    inset 2px 2px 5px rgba(255, 255, 255, 0.04),
    inset -3px -4px 12px rgba(0, 0, 0, 0.9),
    5px 0 22px rgba(0, 0, 0, 0.7) !important;
  border-right: 1px solid rgba(0, 0, 0, 0.65) !important;
}

/* Главная панель курса — тот же вид */
body.airo-course-panel-page.airo-online-course-panel .left_col,
body.airo-course-panel-page.airo-online-course-panel .left_col.scroll-view {
  background: linear-gradient(155deg, #1a1a1a 0%, #0c0c0c 40%, #101010 100%) !important;
  border-top: 2px solid rgba(255, 255, 255, 0.35) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 1px 0 0 rgba(110, 197, 255, 0.12),
    inset 2px 2px 5px rgba(255, 255, 255, 0.04),
    inset -3px -4px 12px rgba(0, 0, 0, 0.9),
    5px 0 22px rgba(0, 0, 0, 0.7) !important;
}

/* Имя под аватаром: светлый голубой, без тени (не путается с кнопкой/ссылкой) */
body.airo-course-panel-page .profile_info h2,
body.airo-course-panel-page.nav-sm .profile_info h2 {
  color: var(--airo-side-nav-cyan) !important;
  text-shadow: none;
}

/*
 * Табличка аватара как в карточке Instagram: рельеф 3D, форма чуть портретнее 1:1 (выше по вертикали).
 * Общий класс .airo-ig-plate — сайдбар и угол справа (.airo-ig-plate--compact).
 */
body.airo-course-panel-page .profile.clearfix {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Широкая панель (nav-md): аватар + имя в ОДНУ горизонтальную линию; блок сдвинут от левой кромки */
body.airo-course-panel-page.nav-md .profile.clearfix {
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 10px 10px 12px 16px;
}

body.airo-course-panel-page.nav-md .profile_pic.airo-ig-plate {
  flex: 0 0 auto;
}

body.airo-course-panel-page.nav-md .profile_info {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  padding: 0;
  text-align: left;
  box-sizing: border-box;
}

body.airo-course-panel-page.nav-md .profile_info h2 {
  margin: 0;
  text-align: left;
  line-height: 1.2;
  font-size: clamp(8px, 0.4vw + 7px, 12px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
  max-width: 100%;
}

/* Первый блок колонки — аватар и имя (без верхней полоски Admin / fa-dashboard) */
body.airo-course-panel-page .left_col.scroll-view > .profile.clearfix {
  padding-top: 10px;
}

body.airo-course-panel-page.nav-md .left_col.scroll-view > .profile.clearfix {
  padding-top: 12px;
}

body.airo-course-panel-page .airo-ig-plate {
  position: relative;
  box-sizing: border-box;
  padding: 3px;
  border-radius: 0;
  background: #cfe8f8;
  border-top: 2px solid rgba(255, 255, 255, 0.98);
  border-left: 2px solid rgba(255, 255, 255, 0.92);
  border-right: 2px solid rgba(12, 28, 52, 0.55);
  border-bottom: 2px solid rgba(8, 18, 38, 0.62);
  box-shadow:
    1px 1px 0 rgba(255, 255, 255, 0.45) inset,
    -1px -1px 0 rgba(0, 0, 0, 0.12) inset,
    2px 3px 6px rgba(0, 0, 0, 0.14);
  flex-shrink: 0;
}

body.airo-course-panel-page .profile_pic.airo-ig-plate {
  float: none;
  width: 44px;
  height: 56px;
}

/* Левая панель курса: плашка аватара в тон фона + аккуратный 3D-рельеф */
body.airo-course-panel-page .left_col .profile_pic.airo-ig-plate {
  width: 52px;
  height: 64px;
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: linear-gradient(165deg, #191919 0%, #111111 46%, #0d0d0d 100%) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  border-left: 1px solid rgba(var(--airo-side-nav-cyan-rgb), 0.16);
  border-right: 1px solid rgba(0, 0, 0, 0.7);
  border-bottom: 1px solid rgba(0, 0, 0, 0.82);
  box-shadow:
    inset 1px 1px 0 rgba(255, 255, 255, 0.08),
    inset -1px -1px 0 rgba(0, 0, 0, 0.35),
    inset 0 -7px 10px rgba(0, 0, 0, 0.4),
    0 3px 10px rgba(0, 0, 0, 0.34);
}

body.airo-course-panel-page .left_col .profile_pic.airo-ig-plate img.airo-course-panel-avatar {
  width: 44px;
  height: 56px;
  margin: 0 auto !important;
  display: block;
}

body.airo-course-panel-page .airo-ig-plate--compact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  width: 32px;
  height: 40px;
  margin-right: 10px;
  padding: 2px;
  background: linear-gradient(165deg, #191919 0%, #111111 46%, #0d0d0d 100%) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  border-left: 1px solid rgba(var(--airo-side-nav-cyan-rgb), 0.16);
  border-right: 1px solid rgba(0, 0, 0, 0.7);
  border-bottom: 1px solid rgba(0, 0, 0, 0.82);
  box-shadow:
    inset 1px 1px 0 rgba(255, 255, 255, 0.08),
    inset -1px -1px 0 rgba(0, 0, 0, 0.35),
    inset 0 -5px 8px rgba(0, 0, 0, 0.38),
    0 2px 8px rgba(0, 0, 0, 0.3);
}

body.airo-course-panel-page a.user-profile .airo-ig-plate--compact img.airo-course-panel-avatar {
  margin: 0 auto !important;
  display: block;
}

body.airo-course-panel-page .airo-ig-plate img.airo-course-panel-avatar {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border-radius: 0;
  object-fit: cover;
  object-position: center top;
  display: block;
  border: none;
  box-sizing: border-box;
  box-shadow:
    inset 0 2px 4px rgba(0, 0, 0, 0.28);
  transform: translateX(0) !important;
}

/* Gentelella: круг у .user-profile img — убираем, фото внутри таблички */
body.airo-course-panel-page a.user-profile img.airo-course-panel-avatar {
  width: 100% !important;
  height: 100% !important;
  border-radius: 0 !important;
  margin-right: 0 !important;
}

body.airo-course-panel-page .profile_info {
  float: none;
  width: auto;
  flex: 1;
  min-width: 0;
  padding: 8px 8px 8px 0;
}

/* Узкая панель (nav-sm), все ширины: Gentelella скрывает .profile — показываем; Welcome/имя целиком, перенос строк */
body.airo-course-panel-page.nav-sm .profile {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  padding: 6px 4px 8px;
  gap: 4px;
  flex-shrink: 0;
  overflow: visible;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  text-align: center;
}

body.airo-course-panel-page.nav-sm .profile_pic.airo-ig-plate {
  width: 36px;
  height: 44px;
  padding: 2px;
  flex-shrink: 0;
  margin-left: auto;
  margin-right: auto;
  align-self: center;
}

body.airo-course-panel-page.nav-sm .left_col .profile_pic.airo-ig-plate img.airo-course-panel-avatar {
  width: 100%;
  height: 100%;
  margin: 0;
}

body.airo-course-panel-page.nav-sm .profile_info {
  width: 100%;
  max-width: 100%;
  padding: 4px 2px 0;
  text-align: center;
  overflow: visible;
  min-width: 0;
}

body.airo-course-panel-page.nav-sm .profile_info h2 {
  margin: 0;
  width: 100%;
  max-width: 100%;
  font-size: clamp(6.5px, 2.2vw, 9px);
  line-height: 1.2;
  font-weight: 600;
  text-align: center;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  word-break: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  box-sizing: border-box;
}

/* Узкий сайдбар: не обрезать слева/справа по X (Gentelella/clip) */
body.airo-course-panel-page.nav-sm .left_col,
body.airo-course-panel-page.nav-sm .left_col.scroll-view {
  overflow-x: visible !important;
}

/*
 * Узкая панель: Bootstrap .col-md-3 даёт padding 15+15px — полоска 70px, «окно» ~40px, всё визуально влево.
 * Убираем боковые padding у левой колонки, чтобы иконка/текст/аватар совпадали с центром полосы.
 */
body.airo-course-panel-page.nav-sm .main_container > .left_col,
body.airo-course-panel-page.nav-sm .container .col-md-3.left_col {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}

body.airo-course-panel-page.nav-sm #sidebar-menu .menu_section,
body.airo-course-panel-page.nav-sm #sidebar-menu .menu_section > .nav.side-menu {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body.airo-course-panel-page .menu_section h3 {
  color: var(--airo-side-nav-cyan) !important;
  text-shadow: 0 0 4px rgba(var(--airo-side-nav-cyan-rgb), 0.4);
}

/* Подписи + иконки вне active: var(--airo-side-nav-cyan) (img — filter ниже) */
body.airo-course-panel-page .nav.side-menu > li > a,
body.airo-course-panel-page #sidebar-menu .nav.side-menu > li > a .airo-side-nav-label {
  color: var(--airo-side-nav-cyan) !important;
  text-shadow: 0 0 2px rgba(var(--airo-side-nav-cyan-rgb), 0.35);
  transition:
    color 0.2s ease,
    text-shadow 0.2s ease,
    background-color 0.2s ease,
    box-shadow 0.2s ease;
}

/* Подпись + стрелка: flex; перебивает Gentelella .nav>li>a { display:block; padding:13px 15px } */
body.airo-course-panel-page #sidebar-menu .nav.side-menu > li > a {
  display: flex !important;
  align-items: center;
  gap: 6px;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

/* PNG: перекраска в тот же светлый голубой, что и подписи */
body.airo-course-panel-page #sidebar-menu .nav.side-menu > li > a .airo-side-nav-icon {
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  object-fit: contain;
  display: block;
  opacity: 1;
  filter: brightness(0) saturate(100%) invert(62%) sepia(85%) saturate(1500%) hue-rotate(192deg) brightness(1.1) contrast(1.02);
  transition: filter 0.2s ease;
}

body.airo-course-panel-page #sidebar-menu .nav.side-menu > li > a .airo-side-nav-label {
  flex: 1 1 auto;
  min-width: 0;
  line-height: 1.3;
}

body.airo-course-panel-page #sidebar-menu .nav.side-menu > li > a > .fa-chevron-down {
  flex: 0 0 auto;
  align-self: center;
  color: var(--airo-side-nav-cyan) !important;
  text-shadow: 0 0 6px rgba(var(--airo-side-nav-cyan-rgb), 0.45);
  opacity: 0.9;
  transition: color 0.2s ease, text-shadow 0.2s ease, opacity 0.2s ease;
}

body.airo-course-panel-page
  #sidebar-menu
  .nav.side-menu
  > li:not(.active):not(.active-sm)
  > a:hover
  > .fa-chevron-down,
body.airo-course-panel-page
  #sidebar-menu
  .nav.side-menu
  > li:not(.active):not(.active-sm)
  > a:focus-visible
  > .fa-chevron-down {
  color: var(--airo-side-nav-cyan) !important;
  text-shadow: 0 0 6px rgba(var(--airo-side-nav-cyan-rgb), 0.85), 0 0 14px rgba(var(--airo-side-nav-cyan-rgb), 0.45);
  opacity: 1;
}

/*
 * Узкий сайдбар (nav-sm) — как в c68c86e: колонка, иконка сверху / подпись снизу, по центру.
 * Важно: не обнулять margin у <a> — у Gentelella .nav.side-menu > li > a { margin-bottom: 6px } даёт зазор между кнопками.
 * Padding как в airo-course-panel.css: .nav-sm .nav.side-menu li a { padding: 10px 5px }.
 */
/* Узкая панель: базовая разметка (мобилка + десктоп). Детали для колонки 70px — только @media (min-width: 992px). */
body.airo-course-panel-page.nav-sm #sidebar-menu {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  text-align: center;
}

/* Выпадающий список: не тянем подписи урока по центру (как в c68+точечные правила 2/3/5) */
body.airo-course-panel-page.nav-sm #sidebar-menu ul.nav.child_menu {
  text-align: left !important;
}

body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li {
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}

body.airo-course-panel-page.nav-sm .left_col .main_menu_side {
  text-align: center;
}

body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li > a {
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center;
  gap: 4px;
  width: 100%;
  min-width: 0;
  padding: 10px 5px !important;
  text-align: center;
  box-sizing: border-box;
  margin-left: 0;
  margin-right: 0;
}

body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li > a .airo-side-nav-icon {
  width: 26px !important;
  height: 26px !important;
  max-width: 100%;
  margin: 0 auto 4px;
  flex: 0 0 auto;
  object-fit: contain;
  object-position: center;
  display: block;
}

body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li > a .airo-side-nav-label {
  display: block;
  width: 100%;
  text-align: center;
  flex: 0 1 auto;
  min-width: 0;
  box-sizing: border-box;
}

/*
 * airo-course-panel: .main_menu span.fa { float: right } и .active a span.fa { text-align: right } —
 * в колонке flex ломают поток, иконка/подпись/стрелка уезжают от центра.
 */
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li > a > .fa,
body.airo-course-panel-page.nav-sm #sidebar-menu.main_menu .nav.side-menu > li > a > .fa {
  float: none !important;
  display: block;
  align-self: center;
  text-align: center !important;
  width: 100% !important;
  max-width: 100%;
  margin: 0 auto !important;
  margin-top: 2px;
}

/* Широкая панель: больше воздуха по вертикали, подписи мельче (clamp) — одна строка без троеточия при нормальной длине */
body.airo-course-panel-page.nav-md #sidebar-menu .nav.side-menu > li > a {
  padding: 12px 8px 12px calc(14px + 1.25%) !important;
  margin-bottom: 12px !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-direction: row !important;
  gap: 4px;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Подпись не растягивается на flex:1 — иначе между текстом и chevron визуально «пусто»; иконка+текст вместе, стрелка сразу после текста. */
body.airo-course-panel-page.nav-md #sidebar-menu .nav.side-menu > li > a .airo-side-nav-label {
  flex: 0 1 auto;
  min-width: 0;
  line-height: 1.2;
  letter-spacing: -0.03em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
  font-size: clamp(8px, 0.5vw + 5.5px, 11.5px);
}

/* Все chevron у одной вертикали у правого края кнопки (после padding-right) */
body.airo-course-panel-page.nav-md #sidebar-menu .nav.side-menu > li > a > .fa-chevron-down {
  margin-left: auto;
  flex: 0 0 auto;
  align-self: center;
}

/*
 * Только десктоп: узкая панель nav-sm (колонка 70px в сетке) — моб. ≤991 не трогаем, там своя 62px и уже «четко».
 */
@media (min-width: 992px) {
  /* Узкий сайдбар 70px: сдвиг от оптического «тяжелого» левого inset + выравнивание ширин li с/без active */
  body.airo-course-panel-page.nav-sm #sidebar-menu {
    position: relative;
    transform: translate3d(1px, 0, 0);
  }

  body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li {
    border-right: 5px solid transparent;
  }

  body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li.active,
  body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li.current-page,
  body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li.active-sm {
    border-right-color: #1abb9c;
  }

  body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li > a .airo-side-nav-label {
    font-size: 7.5px;
    line-height: 1.12;
    letter-spacing: -0.03em;
  }

  body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(4) > a .airo-side-nav-label {
    font-size: 6.76px;
    line-height: 1.1;
  }

  /* Широкая панель: десктоп — больше «воздуха» между кнопками + сдвиг от левого края */
  body.airo-course-panel-page.nav-md #sidebar-menu .nav.side-menu > li > a {
    padding: 14px 10px 14px calc(16px + 2%) !important;
    margin-bottom: 16px !important;
  }
}

body.airo-course-panel-page .main_menu span.fa {
  color: var(--airo-side-nav-cyan);
  text-shadow: 0 0 6px rgba(var(--airo-side-nav-cyan-rgb), 0.35);
  transition: color 0.2s ease, filter 0.2s ease, text-shadow 0.2s ease;
}

/* Наведение: тот же оттенок, подсветка всей кнопки + усиление подписи/иконок (правила ниже) */
body.airo-course-panel-page .nav.side-menu > li:not(.active):not(.active-sm) > a:hover,
body.airo-course-panel-page .nav.side-menu > li:not(.active):not(.active-sm) > a:focus-visible {
  color: var(--airo-side-nav-cyan) !important;
  text-shadow: 0 0 4px rgba(var(--airo-side-nav-cyan-rgb), 0.5), 0 0 12px rgba(var(--airo-side-nav-cyan-rgb), 0.35);
  background-color: rgba(var(--airo-side-nav-cyan-rgb), 0.12) !important;
  box-shadow: inset 0 0 18px rgba(var(--airo-side-nav-cyan-rgb), 0.22);
}

body.airo-course-panel-page
  #sidebar-menu
  .nav.side-menu
  > li:not(.active):not(.active-sm)
  > a:hover
  .airo-side-nav-label,
body.airo-course-panel-page
  #sidebar-menu
  .nav.side-menu
  > li:not(.active):not(.active-sm)
  > a:focus-visible
  .airo-side-nav-label {
  color: var(--airo-side-nav-cyan) !important;
  text-shadow: 0 0 4px rgba(var(--airo-side-nav-cyan-rgb), 0.55), 0 0 10px rgba(var(--airo-side-nav-cyan-rgb), 0.4);
}

body.airo-course-panel-page .nav.side-menu > li:not(.active):not(.active-sm) > a:hover .fa:not(.fa-chevron-down),
body.airo-course-panel-page .nav.side-menu > li:not(.active):not(.active-sm) > a:focus-visible .fa:not(.fa-chevron-down) {
  color: var(--airo-side-nav-cyan) !important;
  text-shadow: 0 0 5px rgba(var(--airo-side-nav-cyan-rgb), 0.75), 0 0 12px rgba(var(--airo-side-nav-cyan-rgb), 0.45);
}

/* Наведение: тот же цвет, чуть ярже — форма не меняется (без oреолов и толстого sepia) */
body.airo-course-panel-page
  #sidebar-menu
  .nav.side-menu
  > li:not(.active):not(.active-sm)
  > a:hover
  .airo-side-nav-icon,
body.airo-course-panel-page
  #sidebar-menu
  .nav.side-menu
  > li:not(.active):not(.active-sm)
  > a:focus-visible
  .airo-side-nav-icon,
body.airo-course-panel-page.nav-sm
  #sidebar-menu
  .nav.side-menu
  > li:not(.active):not(.active-sm)
  > a:hover
  .airo-side-nav-icon,
body.airo-course-panel-page.nav-sm
  #sidebar-menu
  .nav.side-menu
  > li:not(.active):not(.active-sm)
  > a:focus-visible
  .airo-side-nav-icon {
  filter: brightness(0) saturate(100%) invert(62%) sepia(85%) saturate(1500%) hue-rotate(192deg) brightness(1.2) contrast(1.02);
}

body.airo-course-panel-page .nav.side-menu > li > a .fa:not(.fa-chevron-down) {
  color: var(--airo-side-nav-cyan);
  text-shadow: 0 0 4px rgba(var(--airo-side-nav-cyan-rgb), 0.4);
  transition: color 0.2s ease, text-shadow 0.2s ease;
}

/* nav-md на самом body — см. десктоп-блок ниже для таймлайна подменю */

body.airo-course-panel-page .nav.child_menu li:hover,
body.airo-course-panel-page .nav.child_menu li.active {
  background-color: rgba(255, 255, 255, 0.08);
}

/* Текст пунктов внутри вложенного списка — задаётся блоком «выпадающий список модулей» ниже */

body.airo-course-panel-page .nav.side-menu > li.current-page,
body.airo-course-panel-page .nav.side-menu > li.active {
  border-right-color: rgba(160, 225, 243, 0.15);
}

/* Активный модуль: голубой неон в «сеточку» (как раньше был список) */
body.airo-course-panel-page .nav.side-menu > li.active > a,
body.airo-course-panel-page.nav-sm .nav.side-menu > li.active-sm > a {
  text-shadow: none;
  color: #0a0a0a !important;
  background-color: #a0e1f3 !important;
  background-image:
    linear-gradient(45deg, rgba(30, 144, 255, 0.92) 25%, transparent 25%, transparent 75%, rgba(30, 144, 255, 0.92) 75%, rgba(30, 144, 255, 0.92)),
    linear-gradient(45deg, rgba(30, 144, 255, 0.92) 25%, transparent 25%, transparent 75%, rgba(30, 144, 255, 0.92) 75%, rgba(30, 144, 255, 0.92)) !important;
  background-size: 2px 2px !important;
  background-position:
    0 0,
    1px 1px !important;
  box-shadow:
    inset 0 0 14px rgba(160, 225, 243, 0.95),
    inset 0 0 24px rgba(30, 144, 255, 0.2),
    0 0 14px rgba(160, 225, 243, 0.55),
    0 1px 3px rgba(0, 0, 0, 0.12) !important;
  border-radius: 3px;
}

/* Активный пункт: снова аккуратный чёрный силуэт (как исходник), без лишних теней */
body.airo-course-panel-page .nav.side-menu > li.active > a .airo-side-nav-icon,
body.airo-course-panel-page.nav-sm .nav.side-menu > li.active-sm > a .airo-side-nav-icon {
  filter: brightness(0) saturate(100%) !important;
}

/*
 * Активная кнопка: подпись чёрная — селектор обязан содержать #sidebar-menu, иначе проигрывает
 * body...#sidebar-menu...li>a .airo-side-nav-label { color: var(--airo-side-nav-cyan) !important } (та же специфичность + порядок).
 */
body.airo-course-panel-page #sidebar-menu .nav.side-menu > li.active > a .airo-side-nav-label,
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li.active-sm > a .airo-side-nav-label {
  color: #0a0a0a !important;
  text-shadow: none !important;
}

body.airo-course-panel-page #sidebar-menu .nav.side-menu > li.active > a > .fa-chevron-down,
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li.active-sm > a > .fa-chevron-down {
  color: #0a0a0a !important;
  text-shadow: none !important;
  opacity: 1;
}

body.airo-course-panel-page #sidebar-menu .nav.side-menu > li.active > a .fa:not(.fa-chevron-down),
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li.active-sm > a .fa:not(.fa-chevron-down) {
  color: #0a0a0a !important;
  text-shadow: none !important;
}

/* Фон всплывающего списка — см. #sidebar-menu ul.nav.child_menu в конце файла */

body.airo-course-panel-page.nav-sm .nav.side-menu li.active-sm {
  border-right-color: rgba(160, 225, 243, 0.15);
}

body.airo-course-panel-page .sidebar-footer {
  background: #0a0a0a !important;
  border-top: 1px solid rgba(160, 225, 243, 0.12);
}

body.airo-course-panel-page .sidebar-footer a {
  background: rgba(0, 0, 0, 0.35);
  color: var(--airo-side-nav-cyan);
  text-shadow: 0 0 3px rgba(var(--airo-side-nav-cyan-rgb), 0.4);
  transition:
    color 0.2s ease,
    background 0.2s ease,
    text-shadow 0.2s ease,
    box-shadow 0.2s ease;
  -webkit-tap-highlight-color: rgba(160, 225, 243, 0.25);
}

body.airo-course-panel-page .sidebar-footer a .glyphicon {
  color: inherit;
}

body.airo-course-panel-page .sidebar-footer a:hover,
body.airo-course-panel-page .sidebar-footer a:focus-visible,
body.airo-course-panel-page .sidebar-footer a:active {
  background: rgba(var(--airo-side-nav-cyan-rgb), 0.12) !important;
  color: var(--airo-side-nav-cyan) !important;
  text-shadow: 0 0 5px rgba(var(--airo-side-nav-cyan-rgb), 0.65), 0 0 12px rgba(var(--airo-side-nav-cyan-rgb), 0.35);
  box-shadow: inset 0 0 12px rgba(var(--airo-side-nav-cyan-rgb), 0.18);
}

body.airo-course-panel-page .profile_img {
  border-color: rgba(255, 255, 255, 0.5);
}

body.airo-course-panel-page .right_col {
  background: #0e0e0e !important;
  color: #e0e0e0;
}

/* Скролл правой колонки: тёмный трек, голубоватый бегунок (не системный белый) */
body.airo-course-panel-page .main_container > .right_col {
  scrollbar-width: thin;
  scrollbar-color: rgba(90, 150, 200, 0.85) #161616;
}

body.airo-course-panel-page .main_container > .right_col::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

body.airo-course-panel-page .main_container > .right_col::-webkit-scrollbar-track {
  background: #121212;
  border-radius: 5px;
}

body.airo-course-panel-page .main_container > .right_col::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #4a8ec8 0%, #2d5a82 100%);
  border-radius: 5px;
  box-shadow: 0 0 6px rgba(160, 225, 243, 0.35);
  border: 1px solid rgba(0, 0, 0, 0.25);
}

body.airo-course-panel-page .main_container > .right_col::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #6ab8e8 0%, #3d78a8 100%);
  box-shadow: 0 0 10px rgba(160, 225, 243, 0.5);
}

body.airo-course-panel-page .main_container > .right_col::-webkit-scrollbar-corner {
  background: #121212;
}

body.airo-course-panel-page .top_nav,
body.airo-course-panel-page .nav_menu,
body.airo-course-panel-page .top_nav .nav_menu > nav {
  /* Верхняя панель: как нижняя навигация уроков (3D, рельеф, чёткая граница) */
  background: linear-gradient(180deg, #1a1a1a 0%, #0c0c0c 45%, #101010 100%) !important;
  border: none !important;
}

body.airo-course-panel-page .nav_menu {
  border-top: 1px solid rgba(var(--airo-side-nav-cyan-rgb), 0.14);
  border-bottom: 1px solid rgba(var(--airo-side-nav-cyan-rgb), 0.14);
  box-shadow:
    inset 0 1px 0 rgba(var(--airo-side-nav-cyan-rgb), 0.18),
    inset 0 2px 6px rgba(255, 255, 255, 0.06),
    inset 0 -9px 14px rgba(0, 0, 0, 0.52),
    0 6px 22px rgba(0, 0, 0, 0.58),
    0 1px 0 rgba(var(--airo-side-nav-cyan-rgb), 0.08);
  position: relative;
  z-index: 20;
}

/* Длинная верхняя панель: дополнительный рельеф, как у нижней, но без изменения сетки */
body.airo-course-panel-page .top_nav .nav_menu > nav {
  border-top: 1px solid rgba(var(--airo-side-nav-cyan-rgb), 0.12);
  box-shadow:
    inset 0 1px 0 rgba(var(--airo-side-nav-cyan-rgb), 0.12),
    inset 0 -10px 14px rgba(0, 0, 0, 0.35);
}

body.airo-course-panel-page .top_nav .navbar-nav > li > a {
  color: #e0e0e0 !important;
}

/* Бургер и блок имени — голубые (как неон проекта) */
body.airo-course-panel-page .toggle a,
body.airo-course-panel-page .top_nav .toggle a {
  color: #a0e1f3 !important;
  background: var(--airo-course-tile-3d-bg) !important;
  box-shadow: var(--airo-course-tile-3d-shadow);
  border-left: 1px solid rgba(var(--airo-side-nav-cyan-rgb), 0.18);
  border-right: 1px solid rgba(0, 0, 0, 0.55);
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border-radius: 2px;
}

body.airo-course-panel-page .toggle a:hover,
body.airo-course-panel-page .toggle a:focus-visible,
body.airo-course-panel-page .top_nav .toggle a:hover,
body.airo-course-panel-page .top_nav .toggle a:focus-visible {
  color: #c5eef8 !important;
  background: var(--airo-course-tile-3d-bg-hover) !important;
  box-shadow: var(--airo-course-tile-3d-shadow-hover);
}

body.airo-course-panel-page a.user-profile,
body.airo-course-panel-page .top_nav .navbar-nav > li > a.user-profile {
  color: #a0e1f3 !important;
}

/* Блок с именем в правой части: не упирается в левый край и не обрезается */
body.airo-course-panel-page .top_nav .navbar-right {
  padding-left: clamp(6px, 1vw, 12px);
}

body.airo-course-panel-page .top_nav .navbar-right > li {
  overflow: visible;
}

body.airo-course-panel-page a.user-profile {
  margin-left: 6px !important;
  padding-left: 8px !important;
}

body.airo-course-panel-page a.user-profile .airo-topnav-user-name,
body.airo-course-panel-page a.user-profile .fa-angle-down {
  color: inherit;
}

body.airo-course-panel-page .top_nav .nav > li > a.user-profile:hover,
body.airo-course-panel-page .top_nav .nav > li > a.user-profile:focus {
  color: #c5eef8 !important;
}

body.airo-course-panel-page .top_nav .nav > li > a:focus,
body.airo-course-panel-page .top_nav .nav > li > a:hover,
body.airo-course-panel-page .top_nav .nav .open > a,
body.airo-course-panel-page .top_nav .nav .open > a:focus,
body.airo-course-panel-page .top_nav .nav .open > a:hover {
  background: rgba(30, 144, 255, 0.15);
}

body.airo-course-panel-page .top_nav .nav > li > a.user-profile:focus,
body.airo-course-panel-page .top_nav .nav > li > a.user-profile:hover,
body.airo-course-panel-page .top_nav .nav .open > a.user-profile,
body.airo-course-panel-page .top_nav .nav .open > a.user-profile:focus,
body.airo-course-panel-page .top_nav .nav .open > a.user-profile:hover {
  color: #c5eef8 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.airo-course-panel-page .top_nav .nav > li > a.user-profile:hover .airo-topnav-user-name,
body.airo-course-panel-page .top_nav .nav > li > a.user-profile:focus .airo-topnav-user-name,
body.airo-course-panel-page .top_nav .nav .open > a.user-profile .airo-topnav-user-name {
  color: #c5eef8 !important;
  text-shadow: 0 0 6px rgba(var(--airo-side-nav-cyan-rgb), 0.45);
}

/*
 * Иконка сообщений в top_nav: без квадратной подсветки, только голубая иконка с glow.
 * Селектор соответствует реальной разметке Gentelella: <li class="dropdown"><a class="dropdown-toggle info-number">.
 * Раньше селектор был .dropdown.info-number > a — в актуальной разметке info-number стоит на <a>, не на <li>,
 * поэтому правило не применялось и конверт оставался белым.
 */
body.airo-course-panel-page .top_nav .navbar-right .dropdown > a.info-number,
body.airo-course-panel-page .top_nav .navbar-right .dropdown.info-number > a {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  outline: 0 !important;
  -webkit-tap-highlight-color: transparent;
}

body.airo-course-panel-page .top_nav .navbar-right .dropdown > a.info-number i.fa-envelope-o,
body.airo-course-panel-page .top_nav .navbar-right .dropdown.info-number > a i.fa-envelope-o,
body.airo-course-panel-page .top_nav a.dropdown-toggle.info-number i.fa-envelope-o,
body.airo-course-panel-page .top_nav a.info-number[data-open-airo-ai-chat] i.fa-envelope-o {
  color: #a0e1f3 !important;
  -webkit-text-fill-color: #a0e1f3 !important;
  text-shadow: 0 0 4px rgba(var(--airo-side-nav-cyan-rgb), 0.4);
  transition: color 0.2s ease, text-shadow 0.2s ease;
}

body.airo-course-panel-page .top_nav .nav > li.dropdown > a.info-number:hover,
body.airo-course-panel-page .top_nav .nav > li.dropdown > a.info-number:focus,
body.airo-course-panel-page .top_nav .nav > li.dropdown > a.info-number:active,
body.airo-course-panel-page .top_nav .nav .open > a.info-number,
body.airo-course-panel-page .top_nav .nav .open > a.info-number:hover,
body.airo-course-panel-page .top_nav .nav .open > a.info-number:focus,
body.airo-course-panel-page .top_nav .nav .open > a.info-number:active,
body.airo-course-panel-page .top_nav .nav > li.dropdown.info-number > a:hover,
body.airo-course-panel-page .top_nav .nav > li.dropdown.info-number > a:focus,
body.airo-course-panel-page .top_nav .nav > li.dropdown.info-number > a:active {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  outline: 0 !important;
}

body.airo-course-panel-page .top_nav .navbar-right .dropdown > a.info-number:hover i.fa-envelope-o,
body.airo-course-panel-page .top_nav .navbar-right .dropdown > a.info-number:focus i.fa-envelope-o,
body.airo-course-panel-page .top_nav .nav .open > a.info-number i.fa-envelope-o,
body.airo-course-panel-page .top_nav a.dropdown-toggle.info-number:hover i.fa-envelope-o,
body.airo-course-panel-page .top_nav a.dropdown-toggle.info-number:focus i.fa-envelope-o,
body.airo-course-panel-page .top_nav a.info-number[data-open-airo-ai-chat]:hover i.fa-envelope-o,
body.airo-course-panel-page .top_nav a.info-number[data-open-airo-ai-chat]:focus i.fa-envelope-o {
  color: #a0e1f3 !important;
  -webkit-text-fill-color: #a0e1f3 !important;
  text-shadow:
    0 0 5px rgba(var(--airo-side-nav-cyan-rgb), 0.75),
    0 0 12px rgba(var(--airo-side-nav-cyan-rgb), 0.45);
}

/*
 * Бейдж с числом новых сообщений: квадратный (без border-radius), фон #a0e1f3, цифра чёрная.
 * .bg-green в airo-course-panel.css задаёт зелёный фон с !important — перебиваем точным селектором + !important.
 */
body.airo-course-panel-page .top_nav .navbar-right .dropdown > a.info-number .badge,
body.airo-course-panel-page .top_nav .navbar-right .dropdown > a.info-number .badge.bg-green,
body.airo-course-panel-page .top_nav .navbar-right .dropdown > a.info-number .atcm-unread-badge {
  border-radius: 3px !important;
  background: #a0e1f3 !important;
  background-color: #a0e1f3 !important;
  border: 1px solid rgba(0, 0, 0, 0.55) !important;
  color: #000 !important;
  font-weight: 700;
  text-shadow: none !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.45),
    inset 0 -1px 0 rgba(0, 0, 0, 0.25),
    0 0 6px rgba(var(--airo-side-nav-cyan-rgb), 0.45),
    0 0 10px rgba(160, 225, 243, 0.35);
}

/*
 * Иконки в нижней части левой панели курса (Настройки/Полный экран/Блокировка/Выйти).
 * По требованию убраны на всех страницах онлайн-курса (.airo-course-panel-page),
 * включая режимы узкой и широкой панели и мобильную версию.
 * HTML не трогаю — скрываю целиком блок .sidebar-footer вместе с его 4 ячейками.
 */
body.airo-course-panel-page .sidebar-footer {
  display: none !important;
}

/*
 * Аватар в шапке Gentelella vs сайдбар:
 * — десктоп: в top_nav только имя (табличка слева в колонке курса).
 * — мобилка: nav-md = панель закрыта → аватар справа; nav-sm = панель открыта → аватар только в сайдбаре.
 */
@media (min-width: 992px) {
  body.airo-course-panel-page a.user-profile .airo-ig-plate {
    display: none !important;
  }
}

body.airo-course-panel-page .navbar-nav .open .dropdown-menu {
  background: #1a1a1a;
  border-color: rgba(30, 144, 255, 0.35);
}

body.airo-course-panel-page .dropdown-menu > li > a {
  color: #e0e0e0 !important;
}

body.airo-course-panel-page ul.msg_list li {
  background: #141414;
}

body.airo-course-panel-page ul.msg_list li a .message {
  color: #bbb;
}

/* ---- Только десктоп: фикс-зона под шапкой AIRo + сетка (не затрагивает мобилку) ---- */
@media (min-width: 992px) {
  body.airo-course-panel-page {
    overflow: hidden;
  }

  .airo-course-panel-main {
    position: fixed;
    top: var(--airo-course-header-offset);
    left: 0;
    right: 0;
    bottom: 0;
    padding-top: 0;
    overflow: hidden;
    box-sizing: border-box;
    z-index: 10;
  }

  .airo-course-panel-main > .container.body {
    position: relative;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
  }

  /*
   * 70px + 1fr: колонка урока не смещается при nav-md/nav-sm.
   * Сайдбар только во 2-й строке. Строка 1: top_nav на всю ширину; бургер в сетке nav — левая колонка 70px (как узкая панель).
   */
  body.airo-course-panel-page .main_container {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    grid-template-areas:
      'courseTop courseTop'
      'courseSide courseMain';
    height: 100%;
    min-height: 0;
    align-items: stretch;
    overflow: visible;
  }

  body.airo-course-panel-page .main_container > .left_col {
    grid-area: courseSide;
    position: relative !important;
    float: none !important;
    justify-self: start;
    align-self: stretch;
    width: 230px !important;
    min-width: 0;
    min-height: 0 !important;
    z-index: 10 !important;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  body.airo-course-panel-page .main_container > .left_col > .left_col.scroll-view {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  body.airo-course-panel-page.nav-sm .main_container > .left_col {
    width: 70px !important;
  }

  /*
   * Шапка курса должна быть выше .left_col (z-index: 10), иначе контекст наложения top_nav (2)
   * остаётся под сайдбаром — в nav-sm страдает выпадающее меню профиля (клики/отрисовка).
   */
  body.airo-course-panel-page .main_container > .top_nav {
    grid-area: courseTop;
    position: relative;
    z-index: 12;
    margin-left: 0 !important;
    width: 100% !important;
    max-width: 100%;
    flex-shrink: 0;
  }

  body.airo-course-panel-page .main_container > .right_col {
    grid-area: courseMain;
    position: relative;
    z-index: 0;
    margin-left: 0 !important;
    min-height: 0 !important;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  body.airo-course-panel-page .left_col .main_menu_side {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  body.airo-course-panel-page .left_col .main_menu_side::-webkit-scrollbar {
    width: 0;
    height: 0;
    background: transparent;
  }

  body.airo-course-panel-page .profile {
    flex-shrink: 0;
  }

  body.airo-course-panel-page .sidebar-footer {
    flex-shrink: 0;
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    z-index: 1;
  }

  body.airo-course-panel-page .left_col.scroll-view > br {
    display: none;
  }

  body.airo-course-panel-page .top_nav {
    min-height: var(--airo-course-burger-bar-height);
  }

  body.airo-course-panel-page .nav_menu {
    margin-bottom: 0;
    float: none;
    min-height: var(--airo-course-burger-bar-height);
    display: block;
    box-sizing: border-box;
  }

  /* Бургер — колонка 70px (над узкой панелью); имя и иконки — колонка 2 */
  body.airo-course-panel-page .main_container > .top_nav .nav_menu > nav {
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr);
    align-items: center;
    align-content: center;
    width: 100%;
    min-height: var(--airo-course-burger-bar-height);
    min-width: 0;
    padding: 0;
    box-sizing: border-box;
  }

  body.airo-course-panel-page .main_container > .top_nav .nav_menu > nav > .navbar-right {
    grid-column: 2;
    padding: 0 10px;
    min-width: 0;
  }

  body.airo-course-panel-page .main_container > .top_nav .toggle {
    grid-column: 1;
    grid-row: 1;
    float: none;
    margin: 0;
    padding-top: 0;
    width: 100%;
    max-width: 70px;
    min-height: var(--airo-course-burger-bar-height);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    justify-self: center;
  }

  body.airo-course-panel-page .top_nav .toggle a {
    padding: 0 12px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: var(--airo-course-burger-bar-height);
    box-sizing: border-box;
  }

  body.airo-course-panel-page .top_nav .navbar-right {
    float: none !important;
    width: 100% !important;
    max-width: none;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 !important;
    min-height: var(--airo-course-burger-bar-height);
    min-width: 0;
    box-sizing: border-box;
  }

  body.airo-course-panel-page .top_nav .navbar-right > li {
    float: none !important;
    display: flex;
    align-items: center;
  }

  body.airo-course-panel-page .top_nav .navbar-nav > li > a {
    display: inline-flex;
    align-items: center;
    min-height: var(--airo-course-burger-bar-height);
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    box-sizing: border-box;
  }

  body.airo-course-panel-page a.user-profile {
    gap: 8px;
  }

  /*
   * Gentelella: .nav-sm span.fa { display: none } — стрелка у имени в top_nav показываем принудительно.
   * Не используем pointer-events: none на span: клик «пробивал» не до a.dropdown-toggle, а до слоя ниже (right_col), меню не открывалось.
   */
  body.airo-course-panel-page.nav-sm .top_nav span.fa {
    display: inline-block !important;
    vertical-align: middle;
    line-height: 1;
  }

  /* Меню профиля над колонкой контента; z-index не на самой <a> — иначе ul.dropdown-menu оказывается под слоем */
  body.airo-course-panel-page.nav-sm .top_nav .navbar-nav > li.dropdown {
    position: relative;
    z-index: 200;
  }

  body.airo-course-panel-page.nav-sm .top_nav .navbar-nav > li.dropdown .dropdown-menu {
    z-index: 201 !important;
  }

  body.airo-course-panel-page.nav-sm .top_nav,
  body.airo-course-panel-page.nav-sm .top_nav .nav_menu,
  body.airo-course-panel-page.nav-sm .top_nav .nav_menu > nav {
    overflow: visible !important;
  }

  body.airo-course-panel-page.nav-sm .top_nav .navbar-nav > li.dropdown.open > .dropdown-menu {
    display: block !important;
  }

  /*
   * Широкая левая колонка (nav-md на body): подменю — вертикальная линия и кружки слева от текста,
   * без наложения; .airo-lesson-complete — пройденный урок (зелёный «светящийся» кружок).
   */
  body.airo-course-panel-page.nav-md #sidebar-menu ul.nav.child_menu > li {
    position: relative;
    padding-left: 44px !important;
    min-height: 40px;
    box-sizing: border-box;
  }

  body.airo-course-panel-page.nav-md #sidebar-menu ul.nav.child_menu > li > a {
    display: block;
    padding: 10px 8px 10px 0 !important;
    position: relative;
    z-index: 2;
  }

  body.airo-course-panel-page.nav-md #sidebar-menu ul.nav.child_menu > li::before {
    content: "" !important;
    display: block !important;
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    margin-top: 0;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #5f7388;
    border: 2px solid rgba(255, 255, 255, 0.75);
    box-sizing: border-box;
    z-index: 2;
    bottom: auto;
    right: auto;
  }

  body.airo-course-panel-page.nav-md #sidebar-menu ul.nav.child_menu > li::after {
    content: "" !important;
    display: block !important;
    position: absolute;
    left: 22px;
    top: 0;
    bottom: 0;
    border-left: 2px solid rgba(0, 0, 0, 0.22);
    width: 0;
    z-index: 1;
  }

  body.airo-course-panel-page.nav-md #sidebar-menu ul.nav.child_menu > li:first-child::after {
    top: 50%;
  }

  body.airo-course-panel-page.nav-md #sidebar-menu ul.nav.child_menu > li:last-child::after {
    bottom: 50%;
  }

  body.airo-course-panel-page.nav-md #sidebar-menu ul.nav.child_menu > li.airo-lesson-complete::before {
    background: #1abb9c;
    border-color: rgba(255, 255, 255, 0.95);
    box-shadow:
      0 0 0 1px rgba(26, 187, 156, 0.45),
      0 0 14px rgba(46, 204, 113, 0.9);
  }

  /*
   * Узкий режим (nav-sm): вылетающее подменю справа — в шаблоне position:absolute; left:100%; top:0.
   * Наш overflow:hidden на main/колонке обрезал панель на десктопе; здесь — как в stock Gentelella.
   */
  body.airo-course-panel-page.nav-sm .airo-course-panel-main {
    overflow: visible !important;
  }

  body.airo-course-panel-page.nav-sm .airo-course-panel-main > .container.body {
    overflow: visible !important;
  }

  body.airo-course-panel-page.nav-sm .main_container {
    overflow: visible !important;
  }

  body.airo-course-panel-page.nav-sm .main_container > .left_col {
    overflow: visible !important;
  }

  body.airo-course-panel-page.nav-sm .main_container > .left_col > .left_col.scroll-view {
    overflow: visible !important;
  }

  body.airo-course-panel-page.nav-sm .left_col .main_menu_side {
    overflow: visible !important;
  }

  /* Узкая колонка на десктопе — острые края (без скругления правой стороны) */
  body.airo-course-panel-page.nav-sm .main_container > .left_col {
    border-radius: 0;
    border-top: 2px solid rgba(255, 255, 255, 0.35);
    border-right: 2px solid rgba(0, 0, 0, 0.35);
    border-bottom: 2px solid rgba(0, 0, 0, 0.28);
    box-shadow:
      inset 2px 0 0 rgba(255, 255, 255, 0.12),
      4px 0 18px rgba(0, 0, 0, 0.3);
    box-sizing: border-box;
  }

  /* Верх всплывающей панели = top:0 относительно li (как в Gentelella), тень как отдельная «плашка» */
  body.airo-course-panel-page.nav-sm .nav.side-menu > li > ul.nav.child_menu {
    top: 0 !important;
    margin-top: 0 !important;
    border-top-left-radius: 0;
    border-top-right-radius: 2px;
    box-shadow: 4px 4px 12px rgba(0, 0, 0, 0.35);
  }

  body.airo-course-panel-page.nav-sm .profile_info h2 {
    font-size: clamp(8px, 0.55vw, 10px);
    line-height: 1.2;
  }

  /* Десктоп, узкая панель: плашка аватара шире, чтобы совпадать по границам с блоком имени ниже */
  body.airo-course-panel-page.nav-sm .profile_pic.airo-ig-plate {
    width: 44px;
    height: 56px;
  }
}

/* ---- Мобилка (≤991px): весь блок курса под AIRo без щели; бургер-полоса не отрывается от контента ---- */
@media (max-width: 991px) {
  /* Резервируем место под полосу прокрутки документа — иначе при смене overflow ширина «дрожит» и пересчитывается высота шапки */
  html:has(body.airo-course-panel-page) {
    scrollbar-gutter: stable;
    /* iOS: без этого жест у .right_col «протекает» в viewport (rubber-band) и на touchend откатывается */
    overscroll-behavior: none;
  }

  /* QuickFit welcome: без резерва полосы на html — иначе в DevTools/узкой вёрстке «немного» лишней ширины */
  html.airo-qf-welcome-page:has(body.airo-course-welcome-quickfit-page) {
    scrollbar-gutter: auto;
  }

  body.airo-course-panel-page {
    overflow: hidden;
    width: 100%;
    min-height: 100%;
    min-height: 100dvh;
    overscroll-behavior: none;
    /* Высота шапки AIRo только из CSS — без inline JS, чтобы контент не прыгал */
    --airo-course-header-offset: 88px;
  }

  /*
   * QuickFit: 100dvh с прячущейся полосой URL пересчитывается на границах скролла → «откат»;
   * 100svh стабильнее. Не трогаем остальные уроки панели.
   */
  body.airo-course-panel-page.airo-course-welcome-quickfit-page {
    min-height: 100svh;
  }

  /*
   * nav-sm: подменю вылетает вправо (left:100%) — на мобилке иначе режется overflow:hidden у main/container.
   * Дублируем десктоп-правило из @media (min-width:992px) — иначе список не виден.
   */
  body.airo-course-panel-page.nav-sm .airo-course-panel-main {
    overflow: visible !important;
  }

  body.airo-course-panel-page.nav-sm .airo-course-panel-main > .container.body {
    overflow: visible !important;
  }

  body.airo-course-panel-page.nav-sm .main_container {
    overflow: visible !important;
  }

  body.airo-course-panel-page.nav-sm .main_container > .left_col {
    overflow: visible !important;
    z-index: 6000;
  }

  body.airo-course-panel-page.nav-sm .main_container > .left_col > .left_col.scroll-view,
  body.airo-course-panel-page.nav-sm .left_col .main_menu_side {
    overflow: visible !important;
  }

  body.airo-course-panel-page.nav-sm .profile {
    padding-top: 6px;
  }

  /* Открытая синяя колонка: табличка чуть ниже и меньше — меньше перерасчётов по высоте при появлении блока */
  body.airo-course-panel-page.nav-sm .left_col.scroll-view > .profile.clearfix {
    padding-top: 4px;
  }

  body.airo-course-panel-page.nav-sm .profile_pic.airo-ig-plate {
    width: 38px;
    height: 48px;
    padding: 2px;
    margin-left: auto;
    margin-right: auto;
  }

  /* Один фон с полосой top_nav — не просвечивает чёрный body между шапкой и панелью */
  .airo-course-panel-main {
    position: fixed;
    top: var(--airo-course-header-offset);
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    padding-top: 0;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    min-height: 0;
    overflow: hidden;
    box-sizing: border-box;
    z-index: 10;
    background-color: #121212;
  }

  .airo-course-panel-main > .container.body {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    min-height: 0;
    overflow: hidden;
    padding-left: 0;
    padding-right: 0;
  }

  body.airo-course-panel-page .container.body {
    width: 100%;
    max-width: none;
  }

  /* Колонка курса: колонка + бургер-полоса + контент — одна колонка; скролл только у контента */
  body.airo-course-panel-page .main_container {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    float: none !important;
    margin: 0;
    padding: 0;
  }

  body.airo-course-panel-page .main_container > .top_nav {
    flex: 0 0 auto;
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    margin-left: 0 !important;
  }

  body.airo-course-panel-page .main_container .nav_menu {
    margin-bottom: 0 !important;
  }

  body.airo-course-panel-page .main_container > .right_col {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overflow-anchor: none;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
    scrollbar-gutter: stable;
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    margin-left: 0 !important;
  }

  /* Верхняя полоса: бургер не сжимается и не пропадает — flex вместо float+70% ширины */
  body.airo-course-panel-page .top_nav .nav_menu {
    overflow: visible !important;
  }

  body.airo-course-panel-page .top_nav .nav_menu > nav {
    display: flex !important;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    gap: 0;
    /* Одна и та же высота при nav-md / nav-sm (аватар в шапке скрывается — без «ёрзания» строки) */
    min-height: 48px;
  }

  body.airo-course-panel-page .top_nav .toggle {
    float: none !important;
    flex: 0 0 48px;
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px;
    padding-top: 0 !important;
    margin: 0 !important;
    position: relative;
    z-index: 6;
  }

  body.airo-course-panel-page .top_nav .toggle a {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    padding: 8px !important;
    box-sizing: border-box;
  }

  body.airo-course-panel-page .top_nav .toggle a .fa-bars {
    font-size: 22px !important;
    line-height: 1;
    color: #a0e1f3 !important;
  }

  body.airo-course-panel-page .top_nav .navbar-right {
    float: none !important;
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    margin: 0 !important;
    margin-left: auto !important;
  }

  body.airo-course-panel-page .top_nav .navbar-right > li {
    float: none !important;
    flex: 0 0 auto;
    max-width: 100%;
  }

  /* Имя и блок профиля не зависят от nav-md/nav-sm — отличается только видимость аватарки ниже */
  body.airo-course-panel-page a.user-profile {
    display: inline-flex !important;
    align-items: center;
    max-width: min(calc(100vw - 56px - env(safe-area-inset-right, 0px)), 280px);
    min-width: 0;
    padding-left: 4px !important;
    padding-right: max(4px, env(safe-area-inset-right, 0px)) !important;
    gap: 4px;
    flex-shrink: 1;
  }

  body.airo-course-panel-page a.user-profile .airo-topnav-user-name {
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
    flex-shrink: 0;
    min-width: min-content;
    font-size: clamp(11px, 3.2vw, 13px);
    color: #a0e1f3 !important;
  }

  body.airo-course-panel-page .airo-ig-plate--compact {
    width: 28px;
    height: 34px;
    margin-right: 6px;
    padding: 2px;
    flex-shrink: 0;
  }

  /* Табличка в сайдбаре при nav-sm; в top_nav скрыта, но место сохраняем — без сдвига строки */
  body.airo-course-panel-page.nav-sm a.user-profile .airo-ig-plate {
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.airo-course-panel-page.nav-md a.user-profile .airo-ig-plate {
    visibility: visible !important;
    pointer-events: auto !important;
    display: inline-flex !important;
    align-items: stretch;
    justify-content: center;
    vertical-align: middle;
  }

  body.airo-course-panel-page.nav-sm .navbar-right .dropdown.info-number > a {
    padding-left: 4px !important;
    padding-right: 6px !important;
  }

  /* Узкая левая колонка: чуть уже + 3D-рельеф под тёмную панель (overflow: visible — flyout) */
  body.airo-course-panel-page.nav-sm .container.body .col-md-3.left_col {
    width: 62px !important;
    min-width: 62px;
    max-width: 62px;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-radius: 0;
    border-top: 1px solid rgba(30, 144, 255, 0.2);
    border-left: none;
    border-right: 1px solid rgba(0, 0, 0, 0.75);
    border-bottom: 2px solid rgba(0, 0, 0, 0.5);
    box-shadow:
      inset 1px 1px 2px rgba(255, 255, 255, 0.07),
      inset -2px 0 6px rgba(0, 0, 0, 0.65),
      4px 0 20px rgba(0, 0, 0, 0.6),
      0 0 0 1px rgba(30, 144, 255, 0.06);
    overflow: visible !important;
    box-sizing: border-box;
  }

  /*
   * nav-md (панель скрыта): бургер у левого края.
   * nav-sm (синяя колонка): отступ 62px — бургер не под колонкой.
   * right_col по-прежнему без margin-left — основной контент не уезжает.
   */
  body.airo-course-panel-page.nav-md .top_nav .nav_menu > nav {
    padding-left: 0;
    box-sizing: border-box;
  }

  body.airo-course-panel-page.nav-sm .top_nav .nav_menu > nav {
    padding-left: 62px;
    box-sizing: border-box;
  }

  body.airo-course-panel-page .main_container > .right_col,
  body.airo-course-panel-page .container.body .right_col {
    margin-left: 0 !important;
  }

  /* Моб. вьюпорт: nav-md — как десктоп-логика: вдоль + мелкий кегль у подписи (общие правила .airo-side-nav-label) */
  body.airo-course-panel-page.nav-md #sidebar-menu .nav.side-menu > li > a {
    padding: 10px 8px 10px 14px !important;
    margin-bottom: 10px !important;
  }

  body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li > a .airo-side-nav-label {
    font-size: clamp(6.5px, 2.05vw, 9px);
    line-height: 1.15;
    letter-spacing: -0.03em;
  }

  body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(4) > a .airo-side-nav-label {
    font-size: clamp(6.24px, 1.92vw, 8.84px);
    line-height: 1.1;
  }

}

@media (max-width: 829px) {
  body.airo-course-panel-page {
    --airo-course-header-offset: 56px;
  }
}

/* Имя в top_nav показываем на всех мобильных ширинах (включая DevTools/F12 узкие пресеты). */

/*
 * Название AIRo в шапке: в курсе не переопределяем — в style.css (#1e90ff), без «как .active на дашборде».
 *
 * Карточка списка уроков: тот же голубой, без сетки; длинные списки прокручиваются.
 * Сетка только у активной строки модуля (см. .nav.side-menu > li.active > a выше).
 */
body.airo-course-panel-page #sidebar-menu ul.nav.child_menu {
  background-color: #a0e1f3 !important;
  background-image: none !important;
  max-height: min(48vh, 420px);
  overflow-y: auto !important;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.28) rgba(160, 225, 243, 0.35);
  box-shadow:
    inset 0 0 10px rgba(160, 225, 243, 0.45),
    4px 4px 14px rgba(0, 0, 0, 0.28) !important;
  border: 1px solid rgba(0, 0, 0, 0.18) !important;
  padding: 8px 8px 14px !important;
  box-sizing: border-box;
}

body.airo-course-panel-page #sidebar-menu ul.nav.child_menu > li:last-child > a {
  padding-bottom: 10px !important;
}

body.airo-course-panel-page #sidebar-menu ul.nav.child_menu::-webkit-scrollbar {
  width: 6px;
}

body.airo-course-panel-page #sidebar-menu ul.nav.child_menu::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.22);
  border-radius: 4px;
}

body.airo-course-panel-page #sidebar-menu ul.nav.child_menu > li > a {
  color: #0a0a0a !important;
  font-weight: 500;
  font-size: 13px !important;
  line-height: 1.3 !important;
  padding-left: 8px !important;
  padding-right: 6px !important;
  box-sizing: border-box;
}

/*
 * Модуль 4 «Обучение упражнениям»: без горизонтального скролла — только вертикальный у списка;
 * текст ближе к левому краю, перенос строк вместо прокрутки вбок.
 */
body.airo-course-panel-page #sidebar-menu .nav.side-menu > li:nth-child(4) > ul.nav.child_menu {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
  padding-left: 2px !important;
  padding-right: 2px !important;
}

body.airo-course-panel-page #sidebar-menu .nav.side-menu > li:nth-child(4) ul.nav.child_menu > li {
  margin-bottom: 9px;
  padding-left: 2px !important;
  padding-right: 2px !important;
}

body.airo-course-panel-page #sidebar-menu .nav.side-menu > li:nth-child(4) ul.nav.child_menu > li:last-child {
  margin-bottom: 0;
}

body.airo-course-panel-page #sidebar-menu .nav.side-menu > li:nth-child(4) ul.nav.child_menu > li > a {
  display: block;
  white-space: normal !important;
  overflow: visible;
  font-size: clamp(9.36px, 2.35vw, 10.92px) !important;
  line-height: 1.35 !important;
  letter-spacing: -0.02em;
  font-weight: 500;
  color: #0a0a0a !important;
  padding: 6px 1px !important;
  text-align: left !important;
  box-sizing: border-box;
  overflow-wrap: anywhere;
  word-wrap: break-word;
}

/* Подпись на кнопке модуля 4 — чуть плотнее кернинг; мобилка: мельче подпись см. max-width 991 */
body.airo-course-panel-page #sidebar-menu .nav.side-menu > li:nth-child(4) > a .airo-side-nav-label {
  letter-spacing: -0.03em;
}

/*
 * Десктоп (широкая панель nav-md): у модуля 4 нельзя жать padding у li/ul — иначе линии/кружки таймлайна
 * наезжают на текст. Слева полоса с точками (как у остальных списков), справа — записи.
 */
@media (min-width: 992px) {
  body.airo-course-panel-page.nav-md #sidebar-menu .nav.side-menu > li:nth-child(4) > ul.nav.child_menu {
    padding: 8px 4px 14px !important;
  }

  body.airo-course-panel-page.nav-md #sidebar-menu .nav.side-menu > li:nth-child(4) ul.nav.child_menu > li {
    padding-left: 44px !important;
    padding-right: 4px !important;
  }

  body.airo-course-panel-page.nav-md #sidebar-menu .nav.side-menu > li:nth-child(4) ul.nav.child_menu > li > a {
    padding: 10px 8px 10px 0 !important;
  }
}

body.airo-course-panel-page #sidebar-menu .nav.child_menu > li:hover,
body.airo-course-panel-page #sidebar-menu .nav.child_menu > li.active {
  background-color: rgba(0, 0, 0, 0.07) !important;
}

/*
 * Узкая панель (nav-sm), модули 2, 3 и 5 — по одной записи: плашка по высоте кнопки (верх/низ бордюра совпадают),
 * подпись по центру. Десктоп и мобилка; display:flex при .active / .active-sm (пока открыто подменю).
 */
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(2) > ul.nav.child_menu,
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(3) > ul.nav.child_menu,
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(5) > ul.nav.child_menu {
  top: 0 !important;
  bottom: 0 !important;
  max-height: none !important;
  height: auto;
  padding: 4px !important;
  box-sizing: border-box;
}

body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(2).active > ul.nav.child_menu,
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(2).active-sm > ul.nav.child_menu,
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(3).active > ul.nav.child_menu,
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(3).active-sm > ul.nav.child_menu,
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(5).active > ul.nav.child_menu,
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(5).active-sm > ul.nav.child_menu {
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
}

body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(2) > ul.nav.child_menu > li > a,
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(3) > ul.nav.child_menu > li > a,
body.airo-course-panel-page.nav-sm #sidebar-menu .nav.side-menu > li:nth-child(5) > ul.nav.child_menu > li > a {
  text-align: center;
}

/* Широкая панель: список в потоке под строкой модуля */
body.airo-course-panel-page.nav-md #sidebar-menu ul.nav.child_menu {
  position: relative;
  z-index: 5;
}

/*
 * Узкая панель (nav-sm): как в Gentelella — список слева от колонки, верх совпадает с строкой li (top:0).
 * Глобальный position:relative ломал это и сдвигал список вниз под кнопку.
 */
body.airo-course-panel-page.nav-sm #sidebar-menu ul.nav.child_menu {
  position: absolute !important;
  left: 100% !important;
  top: 0 !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  width: 210px;
  max-width: min(210px, calc(100vw - 72px));
  z-index: 7000 !important;
  border-top-left-radius: 0 !important;
}

/* Мобилка: список уроков — ограничение по высоте экрана, скролл внутри карточки */
@media (max-width: 991px) {
  body.airo-course-panel-page #sidebar-menu ul.nav.child_menu {
    max-height: min(50vh, 300px) !important;
  }
}

/* Страница урока (онлайн-чат и др.): основная колонка растягивается по высоте */
body.airo-course-lesson-page .main_container > .right_col {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

body.airo-course-lesson-page .right_col .airo-course-lesson-inner {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

/* Boomstream: фон z:1 → сетка z:2 → видео z:3; сетка только снаружи iframe */
.airo-course-boom-video-wrap {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  padding: clamp(8px, 1.5vw, 20px) clamp(28px, 7vw, 96px) clamp(28px, 7vw, 96px);
  box-sizing: border-box;
  background-color: #0e0e0e;
  overflow: visible;
}

/* Заголовок по вертикали по центру между полосой top_nav и верхом рамки видео */
.airo-course-welcome-slot {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 0;
  width: 100%;
}

/* Hero: Neuro, две строки (line1 / line2); кегль меньше, но заметно крупный */
body.airo-course-welcome-quickfit-page .airo-course-welcome-quickfit-title {
  margin: 0;
  padding: 0 1rem;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.18em;
  text-align: center;
  max-width: min(38rem, 100%);
  font-family: var(--font-headings, 'neuro', sans-serif);
  font-weight: 400;
  font-size: clamp(1rem, 3.6vw, 34px);
  line-height: 1.2;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-shadow:
    0 1px 2px rgba(0, 0, 0, 0.65),
    0 0 16px rgba(0, 0, 0, 0.28);
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-quickfit-title-line1,
body.airo-course-welcome-quickfit-page .airo-course-welcome-quickfit-title-line2 {
  display: block;
  width: 100%;
  white-space: nowrap;
  text-align: center;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-quickfit-title-line1 {
  color: #ffffff;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-quickfit-title-line2 {
  color: #a0e1f3;
}

.airo-course-welcome-heading {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  width: min(94%, 902px);
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  font-family: var(--font-headings, 'neuro', sans-serif);
  font-weight: 400;
  font-size: clamp(1.15rem, 4.5vw, 2.05rem);
  line-height: 1.15;
  letter-spacing: 0.04em;
  text-align: center;
  text-transform: uppercase;
  color: #a0e1f3;
  flex-shrink: 0;
}

/* Разминка: фиксированный регистр RU/EN («Joint Warm-Up», не весь капс) */
body.airo-course-warmup-page .airo-course-welcome-heading {
  text-transform: none;
}

/* Упражнения 1–2: заголовок без принудительного капса (EN / кавычки) */
body.airo-course-exercise-01-page .airo-course-welcome-heading,
body.airo-course-exercise-02-page .airo-course-welcome-heading,
body.airo-course-exercise-03-page .airo-course-welcome-heading,
body.airo-course-exercise-04-page .airo-course-welcome-heading,
body.airo-course-exercise-05-page .airo-course-welcome-heading,
body.airo-course-exercise-06-page .airo-course-welcome-heading,
body.airo-course-exercise-07-page .airo-course-welcome-heading,
body.airo-course-exercise-08-page .airo-course-welcome-heading,
body.airo-course-exercise-09-page .airo-course-welcome-heading,
body.airo-course-exercise-10-page .airo-course-welcome-heading,
body.airo-course-exercise-11-page .airo-course-welcome-heading,
body.airo-course-exercise-12-page .airo-course-welcome-heading,
body.airo-course-7min-program-page .airo-course-welcome-heading {
  text-transform: none;
}

.airo-course-boom-video-stage {
  position: relative;
  overflow: visible;
  flex-shrink: 0;
  width: 100%;
  max-width: min(960px, 100%);
  margin: 0 auto;
}

/* Мобилка: заголовок у верха (у полосы top_nav), видео сразу под ним — без вертикального центра по экрану */
@media (max-width: 991px) {
  body.airo-course-boom-lesson-page.airo-course-panel-page .airo-course-welcome-slot {
    flex: 0 0 auto;
    justify-content: flex-start;
    min-height: 0;
  }

  body.airo-course-boom-lesson-page.airo-course-panel-page:not(.airo-course-beginning-path-page) .airo-course-boom-video-wrap {
    flex: 1 1 auto;
    min-height: 0;
    /* Как разминка (airo-course-warmup.css): зазор заголовок ↔ видео */
    gap: clamp(22px, 4vw, 34px);
    padding-top: clamp(4px, 1.5vw, 12px);
    padding-bottom: clamp(18px, 5vw, 36px);
  }

}

/*
 * Десктоп: как на разминке — слот заголовка по высоте контента, у верха (не flex:1 на весь экран).
 * Упражнения 1–12, 7-мин., разминка: зазор заголовок↔video = те же clamp, что airo-course-warmup.css. Разминка — третий блок в wrap, gap тот же.
 */
@media (min-width: 992px) {
  body.airo-course-boom-lesson-page.airo-course-panel-page:not(.airo-course-beginning-path-page)
    .airo-course-boom-video-wrap
    > .airo-course-welcome-slot {
    flex: 0 0 auto;
    justify-content: flex-start;
    min-height: 0;
  }

  body.airo-course-boom-lesson-page.airo-course-panel-page:not(.airo-course-beginning-path-page):not(
      .airo-course-warmup-page
    )
    .airo-course-boom-video-wrap {
    /* 1:1 с разминкой — зазор между заголовком и видео */
    gap: clamp(40px, 5.2vh, 72px);
  }
}

/* Слой фона под сеткой и видео (внутри сцены, по площади блока 16:9) */
.airo-course-boom-video-backdrop {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  background-color: #0e0e0e;
  pointer-events: none;
}

.airo-course-boom-video-deco {
  position: absolute;
  width: min(51vw, 414px);
  max-width: 68%;
  height: auto;
  opacity: 1;
  pointer-events: none;
  z-index: 2;
  object-fit: contain;
  /* Контраст линий на тёмном фоне; сам слой — без полупрозрачности (opacity: 1) */
  filter:
    brightness(1.45)
    contrast(1.65)
    drop-shadow(0 0 6px rgba(160, 225, 243, 0.35))
    drop-shadow(0 0 1px rgba(200, 240, 255, 0.4));
}

/* ВПР: чуть ниже и левее (−5% к |top| и |right|); ВЛН: выше и правее (+15% к |bottom| и |left|) */
.airo-course-boom-video-deco--tr {
  top: -98px;
  right: -183px;
}

.airo-course-boom-video-deco--bl {
  bottom: -88px;
  left: -164px;
}

.airo-course-boom-video-frame {
  position: relative;
  z-index: 3;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 2px solid #a0e1f3;
  border-radius: 2px;
  background: transparent;
  box-shadow:
    0 0 22px rgba(160, 225, 243, 0.38),
    0 0 40px rgba(160, 225, 243, 0.22),
    0 0 56px rgba(160, 225, 243, 0.1);
}

.airo-course-boom-video-frame-inner {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  background: #000;
}

.airo-course-boom-video-frame-inner iframe {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

/* Старые браузеры без aspect-ratio */
@supports not (aspect-ratio: 16 / 9) {
  .airo-course-boom-video-frame {
    height: 0;
    padding-bottom: 56.25%;
    aspect-ratio: auto;
  }
}

@media (max-width: 480px) {
  .airo-course-boom-video-deco {
    width: min(57vw, 256px);
    max-width: 73%;
  }

  .airo-course-boom-video-deco--tr {
    top: -57px;
    right: -102px;
  }

  .airo-course-boom-video-deco--bl {
    bottom: -51px;
    left: -91px;
  }
}

/*
 * Страница «Начало пути»: сетка не режется overflow родителей;
 * скролл контента — только у правой колонки по вертикали.
 */
@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container {
    overflow: visible !important;
  }
}

@media (min-width: 992px) {
  body.airo-course-boom-lesson-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-boom-lesson-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-boom-lesson-page.airo-course-panel-page .main_container,
  body.airo-course-beginning-path-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-beginning-path-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-beginning-path-page.airo-course-panel-page .main_container,
  body.airo-course-7min-program-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-7min-program-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-7min-program-page.airo-course-panel-page .main_container,
  body.airo-course-online-chat-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-online-chat-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-online-chat-page.airo-course-panel-page .main_container,
  body.airo-course-module-navigator-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-module-navigator-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-module-navigator-page.airo-course-panel-page .main_container {
    overflow: visible !important;
  }

  /*
   * Разминка / упр. 1–12 / 7-мин. (все с .airo-course-warmup-page): один скролл у .right_col — видео + текстовая версия
   * в одной ленте (без вложенного overflow у .boom-video-wrap). «Начало пути» — отдельно, airo-course-beginning-path.css.
   */
  body.airo-course-boom-lesson-page.airo-course-panel-page.airo-course-warmup-page:not(.airo-course-beginning-path-page)
    .main_container
    > .right_col {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
  }

  body.airo-course-boom-lesson-page.airo-course-panel-page.airo-course-warmup-page:not(.airo-course-beginning-path-page)
    .right_col
    .airo-course-lesson-inner {
    flex: 0 0 auto;
    min-height: min-content;
  }
}

@media (max-width: 828px) {
  /* См. дубль @media 828 — overflow:visible !important снимал lock по X, ленту тянуло (iOS) */
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container {
    overflow-x: hidden !important;
    overflow-y: visible !important;
  }
}

@media (max-width: 991px) {
  body.airo-course-boom-lesson-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-boom-lesson-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-boom-lesson-page.airo-course-panel-page .main_container,
  body.airo-course-beginning-path-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-beginning-path-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-beginning-path-page.airo-course-panel-page .main_container,
  body.airo-course-7min-program-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-7min-program-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-7min-program-page.airo-course-panel-page .main_container,
  body.airo-course-online-chat-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-online-chat-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-online-chat-page.airo-course-panel-page .main_container,
  body.airo-course-module-navigator-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-module-navigator-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-module-navigator-page.airo-course-panel-page .main_container {
    overflow: visible !important;
  }

  /*
   * Boom без «текстовой версии» (.warmup-page): правило оставлено на будущее; сейчас все boom-уроки курса — с .warmup-page,
   * тогда срабатывает overflow-y: auto у .right_col из блока выше (≤991 базово — см. .main_container > .right_col).
   */
  body.airo-course-boom-lesson-page.airo-course-panel-page:not(.airo-course-beginning-path-page):not(
      .airo-course-warmup-page
    )
    .main_container
    > .right_col {
    overflow-x: hidden !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: auto;
  }
}

/*
 * iOS Safari: position:fixed у потомков overflow:auto (right_col / mix overflow-x:hidden + overflow-y)
 * ведёт себя как привязка к скроллу — нижняя панель «пропадает».
 * Уроки с .warmup-page: вертикальный скролл у .right_col (видео + текстовая версия); без вложенного scroll у .boom-video-wrap.
 */
body.airo-course-boom-lesson-page.airo-course-panel-page .airo-course-lesson-inner,
body.airo-course-beginning-path-page.airo-course-panel-page .airo-course-lesson-inner,
body.airo-course-7min-program-page.airo-course-panel-page .airo-course-lesson-inner,
body.airo-course-online-chat-page.airo-course-panel-page .airo-course-lesson-inner,
body.airo-course-welcome-quickfit-page.airo-course-panel-page .airo-course-lesson-inner,
body.airo-course-module-navigator-page.airo-course-panel-page .airo-course-lesson-inner {
  overflow: visible !important;
}

@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .airo-course-lesson-inner {
    overflow-x: hidden !important;
    overflow-y: visible !important;
  }
}

/*
 * Нижняя полоса урока — как .sidebar-footer: те же цвета и высота ячеек.
 * position: fixed + left/width от ширины левой колонки: слева полоска с 4 иконками, справа — навигация урока;
 * верх и низ совпадают с полоской сайдбара (общий нижний край области курса). При узкой панели полоса тянется вправо до края экрана.
 */
/* Вложенный скролл только у boom-уроков без .warmup-page (сейчас в курсе не используется). */
body.airo-course-boom-lesson-page.airo-course-panel-page:not(.airo-course-beginning-path-page):not(.airo-course-warmup-page)
  .airo-course-boom-video-wrap {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
}

/* Разминка / упр. / 7-мин.: одна прокрутка у .right_col — обёртка видео не scrollport. */
body.airo-course-warmup-page.airo-course-boom-lesson-page.airo-course-panel-page:not(.airo-course-beginning-path-page)
  .airo-course-boom-video-wrap {
  flex: 0 0 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: visible !important;
  -webkit-overflow-scrolling: auto;
  overscroll-behavior-y: auto;
}

@media (min-width: 992px) {
  /* 7-мин.: блок znacomstvo — без фоновой картинки */
  body.airo-course-7min-program-page.airo-course-panel-page .airo-course-beginning-znacomstvo {
    --airo-bp-rc-pad: 20px;
    position: relative;
    z-index: 0;
    flex: 0 0 auto;
    width: calc(100% + 2 * var(--airo-bp-rc-pad));
    max-width: none;
    margin-top: 0;
    margin-left: calc(-1 * var(--airo-bp-rc-pad));
    margin-right: calc(-1 * var(--airo-bp-rc-pad));
    margin-bottom: 0;
    min-height: clamp(120px, 18svh, 280px);
    box-sizing: border-box;
    background-color: transparent;
    background-image: none;
    overflow: hidden;
  }
}

/* Мобилка: второй блок; на десктопе правила в @media (min-width: 992px) выше — глобально не дублируем, иначе перебивает min-height */
@media (max-width: 991px) {
  body.airo-course-7min-program-page.airo-course-panel-page .airo-course-beginning-znacomstvo {
    --airo-bp-rc-pad: 10px;
    position: relative;
    z-index: 0;
    flex: 0 0 auto;
    width: calc(100% + 2 * var(--airo-bp-rc-pad));
    max-width: none;
    margin-top: 0;
    margin-left: calc(-1 * var(--airo-bp-rc-pad));
    margin-right: calc(-1 * var(--airo-bp-rc-pad));
    margin-bottom: 0;
    min-height: clamp(80px, 14svh, 200px);
    box-sizing: border-box;
    background-color: transparent;
    background-image: none;
    overflow: hidden;
  }
}

/* «Начало пути» — .airo-course-beginning-znacomstvo__inner в airo-course-beginning-path.css */
body.airo-course-7min-program-page.airo-course-panel-page .airo-course-beginning-znacomstvo__inner {
  min-height: inherit;
  width: 100%;
  max-width: min(960px, 100%);
  margin: 0 auto;
  padding: clamp(20px, 4vw, 40px) clamp(28px, 7vw, 96px);
  box-sizing: border-box;
}

body.airo-course-boom-lesson-page.airo-course-panel-page .main_container > .right_col,
body.airo-course-beginning-path-page.airo-course-panel-page .main_container > .right_col,
body.airo-course-7min-program-page.airo-course-panel-page .main_container > .right_col,
body.airo-course-online-chat-page.airo-course-panel-page .main_container > .right_col,
body.airo-course-module-navigator-page.airo-course-panel-page .main_container > .right_col {
  padding-bottom: calc(var(--airo-lesson-footer-bar-height) + env(safe-area-inset-bottom, 0px) + 6px) !important;
  box-sizing: border-box;
}
/* QuickFit: отступ под fixed-nav — padding у .hero--qf-block6 (тот же icon-fon), не зазор .right_col; см. ниже .right_col + .scale-outer */

body.airo-course-boom-lesson-page.airo-course-panel-page .airo-course-lesson-footer-nav,
body.airo-course-beginning-path-page.airo-course-panel-page .airo-course-lesson-footer-nav,
body.airo-course-online-chat-page.airo-course-panel-page .airo-course-lesson-footer-nav,
body.airo-course-welcome-quickfit-page.airo-course-panel-page .airo-course-lesson-footer-nav,
body.airo-course-module-navigator-page.airo-course-panel-page .airo-course-lesson-footer-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100vw;
  max-width: 100vw;
  margin: 0;
  display: flex;
  flex-direction: row;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  box-sizing: border-box;
  padding: 5px 0 0;
  padding-bottom: env(safe-area-inset-bottom, 0px);
  /* Тёмный 3D, в духе .left_col: рельеф + тонкий голубой акцент сверху */
  background: linear-gradient(180deg, #1a1a1a 0%, #0c0c0c 45%, #101010 100%) !important;
  border: none;
  border-top: 1px solid rgba(var(--airo-side-nav-cyan-rgb), 0.14);
  box-shadow:
    inset 0 1px 0 rgba(var(--airo-side-nav-cyan-rgb), 0.12),
    inset 0 2px 4px rgba(255, 255, 255, 0.04),
    0 -5px 20px rgba(0, 0, 0, 0.55);
  z-index: 10050;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  /* Жесты прокрутки должны идти в .right_col (overflow:auto), а не в fixed nav без scroll */
  pointer-events: none;
}

body.airo-course-panel-page .airo-course-lesson-footer-nav .airo-course-lesson-nav-link {
  pointer-events: auto;
}

/* Десктоп: ширина левой колонки = ширина полоски с иконками */
@media (min-width: 992px) {
  body.airo-course-boom-lesson-page.airo-course-panel-page.nav-md .airo-course-lesson-footer-nav,
  body.airo-course-beginning-path-page.airo-course-panel-page.nav-md .airo-course-lesson-footer-nav,
  body.airo-course-online-chat-page.airo-course-panel-page.nav-md .airo-course-lesson-footer-nav,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page.nav-md .airo-course-lesson-footer-nav,
  body.airo-course-module-navigator-page.airo-course-panel-page.nav-md .airo-course-lesson-footer-nav {
    left: 230px;
    width: calc(100vw - 230px);
    max-width: calc(100vw - 230px);
  }

  body.airo-course-boom-lesson-page.airo-course-panel-page.nav-sm .airo-course-lesson-footer-nav,
  body.airo-course-beginning-path-page.airo-course-panel-page.nav-sm .airo-course-lesson-footer-nav,
  body.airo-course-online-chat-page.airo-course-panel-page.nav-sm .airo-course-lesson-footer-nav,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page.nav-sm .airo-course-lesson-footer-nav,
  body.airo-course-module-navigator-page.airo-course-panel-page.nav-sm .airo-course-lesson-footer-nav {
    left: 70px;
    width: calc(100vw - 70px);
    max-width: calc(100vw - 70px);
  }
}

/* Мобилка: панель скрыта (nav-md) — на всю ширину; панель 62px (nav-sm) — как отступ у top_nav */
@media (max-width: 991px) {
  body.airo-course-boom-lesson-page.airo-course-panel-page.nav-md .airo-course-lesson-footer-nav,
  body.airo-course-beginning-path-page.airo-course-panel-page.nav-md .airo-course-lesson-footer-nav,
  body.airo-course-online-chat-page.airo-course-panel-page.nav-md .airo-course-lesson-footer-nav,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page.nav-md .airo-course-lesson-footer-nav,
  body.airo-course-module-navigator-page.airo-course-panel-page.nav-md .airo-course-lesson-footer-nav {
    left: 0;
    width: 100%;
    max-width: 100vw;
  }

  body.airo-course-boom-lesson-page.airo-course-panel-page.nav-sm .airo-course-lesson-footer-nav,
  body.airo-course-beginning-path-page.airo-course-panel-page.nav-sm .airo-course-lesson-footer-nav,
  body.airo-course-online-chat-page.airo-course-panel-page.nav-sm .airo-course-lesson-footer-nav,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page.nav-sm .airo-course-lesson-footer-nav,
  body.airo-course-module-navigator-page.airo-course-panel-page.nav-sm .airo-course-lesson-footer-nav {
    left: 62px;
    width: calc(100vw - 62px);
    max-width: calc(100vw - 62px);
  }
}

/*
 * Уроки, узкий экран (≤991): панель на всю ширину визуального viewport.
 * iPhone Safari: fixed внутри цепочки overflow/transform иногда даёт width:auto → flex-% → «нулевые» ячейки
 * (виден только фон nav). justify-content: stretch у flex невалиден / ломает раскладку в WebKit.
 * translateZ(0) только на <a>, не на nav — иначе дети могут оказаться под слоем фона контейнера.
 * overflow-y:hidden у .airo-course-panel-main часто даёт «полоса кликабельна, кнопки не видны» — снимаем по Y для .airo-course-lesson-page;
 * z-index панели < 21050 (airo-energy-modal).
 * JS (airoCourseLessonFooterIosMount): на узкой ширине <nav> переносится сразу после .airo-course-panel-main —
 * класс --body-root; правила ниже дублируют ширину для прямого потомка body.
 */
@media (max-width: 991px) {
  body.airo-course-panel-page.airo-course-lesson-page > .airo-course-lesson-footer-nav.airo-course-lesson-footer-nav--body-root {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.airo-course-panel-page.airo-course-lesson-page .airo-course-panel-main,
  body.airo-course-panel-page.airo-course-lesson-page .airo-course-panel-main > .container.body {
    overflow-y: visible !important;
  }

  body.airo-course-panel-page.airo-course-lesson-page .airo-course-lesson-footer-nav {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    bottom: 0 !important;
    position: fixed !important;
    z-index: 20000 !important;
    visibility: visible !important;
    opacity: 1 !important;
    -webkit-transform: none;
    transform: none;
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
    justify-items: stretch;
    gap: 0;
    overflow: visible;
    pointer-events: auto;
    touch-action: manipulation;
    background: linear-gradient(180deg, #1a1a1a 0%, #0c0c0c 45%, #101010 100%) !important;
    border-top: 1px solid rgba(var(--airo-side-nav-cyan-rgb), 0.14);
    box-shadow:
      inset 0 1px 0 rgba(var(--airo-side-nav-cyan-rgb), 0.12),
      inset 0 2px 4px rgba(255, 255, 255, 0.04),
      0 -5px 20px rgba(0, 0, 0, 0.55);
  }

  body.airo-course-panel-page.airo-course-lesson-page .airo-course-lesson-footer-nav .airo-course-lesson-nav-link {
    flex: none !important;
    min-width: 0 !important;
    width: 100%;
    min-height: 48px;
    position: relative;
    z-index: 3;
    mix-blend-mode: normal;
    isolation: isolate;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    background: var(--airo-course-tile-3d-bg) !important;
    box-shadow: var(--airo-course-tile-3d-shadow) !important;
    color: var(--airo-lesson-nav-label-cyan) !important;
    -webkit-tap-highlight-color: rgba(160, 225, 243, 0.15);
  }

  body.airo-course-panel-page.airo-course-lesson-page .airo-course-lesson-footer-nav .airo-course-lesson-nav-hit {
    color: var(--airo-lesson-nav-label-cyan) !important;
    -webkit-text-fill-color: var(--airo-lesson-nav-label-cyan);
  }

  body.airo-course-panel-page.airo-course-lesson-page
    .airo-course-lesson-footer-nav
    .airo-course-lesson-nav-link:hover,
  body.airo-course-panel-page.airo-course-lesson-page
    .airo-course-lesson-footer-nav
    .airo-course-lesson-nav-link:focus-visible {
    background: var(--airo-course-tile-3d-bg-hover) !important;
    box-shadow: var(--airo-course-tile-3d-shadow-hover) !important;
  }

  /* Одна широкая ячейка (7 мин / онлайн-чат): на grid 1fr+1fr не оставляем пустую колонку */
  body.airo-course-7min-program-page.airo-course-panel-page.airo-course-lesson-page .airo-course-lesson-footer-nav,
  body.airo-course-online-chat-page.airo-course-panel-page.airo-course-lesson-page .airo-course-lesson-footer-nav {
    grid-template-columns: 1fr;
  }
}

/*
 * Только QuickFit welcome (airo-course-welcome-quickfit.html), мобилка: нижняя панель урока.
 * Предок .airo-course-welcome-quickfit-wrap больше не overflow-x:clip — панель снаружи clip у .airo-qf-scale-outer.
 * Доп. страховка: safe-area, min-height, z-index/opacity/visibility, цвет текста и иконок (iPhone WebKit).
 */
@media (max-width: 991px) {
  body.airo-course-welcome-quickfit-page.airo-course-panel-page.airo-course-lesson-page .airo-course-lesson-footer-nav {
    isolation: isolate;
    z-index: 20010 !important;
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    box-sizing: border-box !important;
    min-height: calc(44px + 5px + env(safe-area-inset-bottom, 0px));
    padding-top: 5px;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  body.airo-course-welcome-quickfit-page.airo-course-panel-page.airo-course-lesson-page
    .airo-course-lesson-footer-nav
    .airo-course-lesson-nav-link {
    z-index: 2 !important;
    position: relative;
    opacity: 1 !important;
    visibility: visible !important;
    min-height: 48px;
    align-self: stretch;
    line-height: 1.25;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  body.airo-course-welcome-quickfit-page.airo-course-panel-page.airo-course-lesson-page
    .airo-course-lesson-footer-nav
    .airo-course-lesson-nav-hit,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page.airo-course-lesson-page
    .airo-course-lesson-footer-nav
    .airo-course-lesson-nav-arrow,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page.airo-course-lesson-page
    .airo-course-lesson-footer-nav
    .airo-course-lesson-nav-label {
    position: relative;
    z-index: 1;
    opacity: 1 !important;
    visibility: visible !important;
    color: #a0e1f3 !important;
    -webkit-text-fill-color: #a0e1f3;
  }

  body.airo-course-welcome-quickfit-page.airo-course-panel-page.airo-course-lesson-page
    .airo-course-lesson-footer-nav
    .airo-course-lesson-nav-arrow
    .fa {
    color: inherit !important;
    opacity: 1 !important;
  }
}

/*
 * Ячейки «назад / вперёд»: простой общий рельеф (без угловых radial / зеркальных градиентов).
 * Обе половины одинаковые; шов только у «назад». Без inset 0 0 0 1px — не даёт чёрной кромки справа.
 */
.airo-course-lesson-nav-link {
  flex: 1 1 50%;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 10px clamp(10px, 2.5vw, 18px);
  min-height: 44px;
  box-sizing: border-box;
  text-decoration: none !important;
  background: var(--airo-course-tile-3d-bg) !important;
  border: none;
  border-radius: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  box-shadow: var(--airo-course-tile-3d-shadow);
  transition:
    background 0.2s ease,
    box-shadow 0.2s ease;
}

.airo-course-lesson-nav-link:hover,
.airo-course-lesson-nav-link:focus-visible {
  background: var(--airo-course-tile-3d-bg-hover) !important;
  box-shadow: var(--airo-course-tile-3d-shadow-hover);
  outline: none;
}

.airo-course-lesson-nav-link--prev {
  justify-content: flex-start;
  border-right: 1px solid rgba(0, 0, 0, 0.55);
}

.airo-course-lesson-nav-link--next {
  justify-content: flex-end;
}

.airo-course-lesson-nav-link--prev .airo-course-lesson-nav-hit {
  justify-content: flex-start;
}

.airo-course-lesson-nav-link--next .airo-course-lesson-nav-hit {
  justify-content: flex-end;
}

/* Онлайн-чат: одна кнопка «вперёд» — содержимое справа, как у .airo-course-lesson-nav-link--next на других страницах */

/* Завершающий урок: одна широкая кнопка — тот же стиль, что у пары */
body.airo-course-7min-program-page .airo-course-lesson-nav-link--prev {
  flex: 1 1 100%;
  border-right: none;
}

/* Онлайн-чат: одна широкая «вперёд» */
body.airo-course-online-chat-page .airo-course-lesson-nav-link--next {
  flex: 1 1 100%;
}

/* Стрелка + текст: #a0e1f3 (как акцент в 6-м блоке), на всех устройствах */
.airo-course-lesson-nav-hit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  color: var(--airo-lesson-nav-label-cyan);
  text-shadow: 0 0 2px rgba(160, 225, 243, 0.4);
  font-family: var(--font-main, 'Montserrat', sans-serif);
  font-weight: 600;
  font-size: clamp(0.65rem, 2.05vw, 0.8rem);
  line-height: 1.25;
  letter-spacing: normal;
  text-transform: none;
  transition:
    color 0.18s ease,
    text-shadow 0.18s ease;
}

.airo-course-lesson-nav-link:hover .airo-course-lesson-nav-hit,
.airo-course-lesson-nav-link:focus-visible .airo-course-lesson-nav-hit {
  color: var(--airo-lesson-nav-label-cyan);
  text-shadow:
    0 0 4px rgba(160, 225, 243, 0.55),
    0 0 10px rgba(160, 225, 243, 0.3);
}

.airo-course-lesson-nav-arrow {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  line-height: 1;
  color: inherit;
}

.airo-course-lesson-nav-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: inherit;
}

@media (max-width: 380px) {
  .airo-course-lesson-nav-link {
    padding: 9px 8px;
    min-height: 42px;
  }

  .airo-course-lesson-nav-hit {
    font-size: 0.62rem;
    gap: 8px;
  }

  .airo-course-lesson-nav-arrow {
    font-size: 15px;
  }
}

/* --- «Нужна помощь?» / Need help? (online chat): декоративный неоновый шар (icon-shar.png) --- */
/*
 * Плавное «плавание»: дуга; короче цикл + больше амплитуда → энергичнее.
 */
@keyframes floatBall {
  0% {
    transform: translate3d(32px, 27px, 0);
  }
  13.69% {
    transform: translate3d(17px, 7px, 0);
  }
  27.38% {
    transform: translate3d(6px, -17px, 0);
  }
  41.07% {
    transform: translate3d(-7px, -39px, 0);
  }
  54.76% {
    transform: translate3d(-32px, -59px, 0);
  }
  66.07% {
    transform: translate3d(-7px, -39px, 0);
  }
  77.38% {
    transform: translate3d(6px, -17px, 0);
  }
  88.69% {
    transform: translate3d(17px, 7px, 0);
  }
  100% {
    transform: translate3d(32px, 27px, 0);
  }
}

body.airo-course-online-chat-page .airo-course-online-chat-stack,
body.airo-course-module-navigator-page .airo-course-online-chat-stack {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

body.airo-course-online-chat-page .airo-course-online-chat-stage,
body.airo-course-module-navigator-page .airo-course-online-chat-stage {
  position: relative;
  overflow: visible;
  flex: 1 1 auto;
  min-height: min(100%, calc(100vh - 120px));
  isolation: isolate;
}

/* Навигатор: компактнее по высоте — hero + аккордеон в одной колонке со скроллом */
body.airo-course-module-navigator-page .airo-course-online-chat-stage {
  min-height: 0;
}

body.airo-course-online-chat-page .airo-course-online-chat-ball-shell,
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero--sleva
  .airo-course-online-chat-ball-shell {
  position: absolute;
  left: clamp(-280px, -32vw, -200px);
  bottom: clamp(-280px, -34vw, -200px);
  width: min(1500px, 300vw);
  max-width: none;
  z-index: 1;
  pointer-events: none;
  user-select: none;
  line-height: 0;
  transform: translateX(10%);
}

/* Навигатор и QuickFit второй экран: тот же шар и floatBall, зеркально справа */
body.airo-course-module-navigator-page .airo-course-online-chat-ball-shell,
body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sprava .airo-course-online-chat-ball-shell {
  position: absolute;
  left: auto;
  right: clamp(-280px, -32vw, -200px);
  bottom: clamp(-280px, -34vw, -200px);
  width: min(1500px, 300vw);
  max-width: none;
  z-index: 1;
  pointer-events: none;
  user-select: none;
  line-height: 0;
  transform: translateX(-10%);
}

body.airo-course-online-chat-page .airo-course-online-chat-ball,
body.airo-course-module-navigator-page .airo-course-online-chat-ball,
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero--sleva
  .airo-course-online-chat-ball,
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero--sprava
  .airo-course-online-chat-ball {
  display: block;
  width: 100%;
  height: auto;
  opacity: 0.6;
  animation: floatBall 3.5s linear infinite;
}

@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--sleva
    .airo-course-online-chat-ball-shell {
    transform: translateX(-45%);
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--sprava
    .airo-course-online-chat-ball-shell {
    transform: translateX(45%);
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--shar-dual
    .airo-course-welcome-shar-dual__shell--left {
    transform: translateX(-55%);
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--shar-dual
    .airo-course-welcome-shar-dual__shell--right {
    transform: translateX(55%);
  }
}

@media (max-width: 991px) {
  body.airo-course-online-chat-page .airo-course-online-chat-ball-shell {
    transform: translateX(-45%);
  }

  body.airo-course-module-navigator-page .airo-course-online-chat-ball-shell {
    transform: translateX(45%);
  }
}

@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--sleva
    .airo-course-online-chat-ball-shell {
    width: min(1535px, calc(300vw * 1.023));
    transform: translateX(-15%) translateY(-3%);
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--sprava
    .airo-course-online-chat-ball-shell {
    width: min(1535px, calc(300vw * 1.023));
    transform: translateX(15%) translateY(-3%);
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--shar-dual
    .airo-course-welcome-shar-dual__shell--left {
    width: min(1080px, 220vw);
    transform: translateX(-24%) translateY(-3%);
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--shar-dual
    .airo-course-welcome-shar-dual__shell--right {
    width: min(1080px, 220vw);
    transform: translateX(24%) translateY(-3%);
  }
}

@media (min-width: 992px) {
  body.airo-course-online-chat-page .airo-course-online-chat-ball-shell {
    width: min(1535px, calc(300vw * 1.023));
    transform: translateX(-15%) translateY(-3%);
  }

  body.airo-course-module-navigator-page .airo-course-online-chat-ball-shell {
    width: min(1535px, calc(300vw * 1.023));
    transform: translateX(15%) translateY(-3%);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.airo-course-online-chat-page .airo-course-online-chat-ball,
  body.airo-course-module-navigator-page .airo-course-online-chat-ball,
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--sleva
    .airo-course-online-chat-ball,
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--sprava
    .airo-course-online-chat-ball,
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-shar-dual__ball {
    animation: none;
  }
}

body.airo-course-online-chat-page .airo-course-online-chat-main,
body.airo-course-module-navigator-page .airo-course-online-chat-main {
  position: relative;
  z-index: 2;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: clamp(28px, 6vh, 64px) clamp(18px, 4vw, 28px) clamp(100px, 22vh, 220px);
  box-sizing: border-box;
}

/* Навигатор модулей: блок контента сверху + скролл при необходимости — всё на одном экране по возможности */
body.airo-course-module-navigator-page .airo-course-online-chat-main {
  justify-content: flex-start;
  align-items: stretch;
  width: 100%;
  max-width: 100%;
  /* Мобилка: компактный зазор (без «дыры» от vh); десктоп — см. media ниже */
  padding-top: clamp(
      8px,
      min(2.7vh, 5.5vw),
      20px
    ) !important;
  padding-bottom: calc(var(--airo-lesson-footer-bar-height) + env(safe-area-inset-bottom, 0px) + 10px);
  padding-left: clamp(12px, 3vw, 22px);
  padding-right: clamp(12px, 3vw, 22px);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  gap: 0;
}

@media (min-width: 992px) {
  body.airo-course-module-navigator-page .airo-course-online-chat-main {
    /* Выше по экрану, умеренный верхний предел — без пустоты под шапкой */
    padding-top: clamp(12px, 3.6vh, 48px) !important;
  }
}

body.airo-course-module-navigator-page .airo-course-module-navigator-hero {
  --modnav-hero-strip-max: 340px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  flex-shrink: 0;
  margin-bottom: 12px;
}

/* Навигатор модулей: заголовок neuro (1-е слово белое, 2-е — голубое) + icon-rama */
body.airo-course-module-navigator-page .airo-course-module-navigator-title {
  margin: 0 0 14px;
  width: min(var(--modnav-hero-strip-max), 100%);
  max-width: 100%;
  padding: 0;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.45em;
  text-align: center;
  font-family: var(--font-headings, 'neuro', sans-serif);
  font-weight: 400;
  /* Всегда крупнее подписи в полоске (rama-caption) */
  font-size: clamp(1.32rem, 4.85vw, 1.95rem);
  letter-spacing: 0.06em;
  line-height: 1.2;
  text-transform: uppercase;
}

body.airo-course-module-navigator-page .airo-course-module-navigator-title-w1 {
  color: #ffffff;
}

body.airo-course-module-navigator-page .airo-course-module-navigator-title-w2 {
  color: #7ec8ea;
}

@media (min-width: 992px) {
  body.airo-course-module-navigator-page .airo-course-module-navigator-hero {
    --modnav-hero-strip-max: 400px;
  }

  body.airo-course-module-navigator-page .airo-course-module-navigator-title {
    font-size: clamp(1.72rem, 2.85vw, 2.5rem);
    /* Заголовок ближе к полоске */
    margin-bottom: 10px;
  }
}

@media (max-width: 991px) {
  body.airo-course-module-navigator-page .airo-course-module-navigator-title {
    /* Полоска ближе к заголовку */
    margin-bottom: 12px;
    font-size: clamp(1.34rem, 5.9vw, 1.92rem);
  }
}

/* icon-rama: та же ширина, что у заголовка — общие левый/правый края */
body.airo-course-module-navigator-page .airo-course-module-navigator-rama-wrap {
  position: relative;
  display: block;
  width: min(var(--modnav-hero-strip-max), 100%);
  max-width: 100%;
  aspect-ratio: 366 / 63;
  height: auto;
  margin: 0 auto;
  line-height: 0;
  overflow: hidden;
  border-radius: 0;
  flex-shrink: 0;
  box-shadow:
    0 0 28px rgba(140, 210, 245, 0.22),
    0 0 12px rgba(160, 225, 243, 0.12),
    0 0 4px rgba(200, 235, 255, 0.08);
}

body.airo-course-module-navigator-page .airo-course-module-navigator-rama-img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  /* contain оставлял полосы по краям на тёмном фоне — не как на макете */
  object-fit: cover;
  object-position: center;
  vertical-align: top;
}

body.airo-course-module-navigator-page .airo-course-module-navigator-rama-caption-box {
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 12px;
  margin: 0;
  pointer-events: none;
}

body.airo-course-module-navigator-page .airo-course-module-navigator-rama-caption {
  margin: 0;
  padding: 0;
  max-width: 100%;
  box-sizing: border-box;
  text-align: center;
  font-family: var(--font-main, 'Montserrat', sans-serif);
  font-weight: 600;
  /* +3% к кеглю; мобилка и десктоп */
  font-size: calc(1.03 * clamp(13px, 2.75vw, 15px));
  line-height: 1.15;
  letter-spacing: 0.01em;
  color: #0a0a0a;
  text-shadow: none;
  overflow-wrap: break-word;
  hyphens: auto;
}

@media (min-width: 992px) {
  body.airo-course-module-navigator-page .airo-course-module-navigator-rama-caption {
    font-size: calc(1.03 * clamp(14px, 1.45vw, 16px));
  }
}

@media (max-width: 380px) {
  body.airo-course-module-navigator-page .airo-course-module-navigator-rama-caption {
    font-size: calc(1.03 * 13px);
  }
}

/*
 * Метал-аккордеон в .airo-course-modnav-matrix: закрытая строка — 3D-плитка как нижняя панель.
 * Открытая строка и :active — как в коммите c98c766 (голубой #a0e1f3 + сетка 45°, тёмный текст).
 */
body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link {
  display: flex !important;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0;
  width: 100%;
  padding: 10px 12px;
  box-sizing: border-box;
  text-align: left;
  text-decoration: none !important;
  color: #a0e1f3 !important;
  border-radius: 0;
  border: var(--airo-course-tile-3d-border);
  background: var(--airo-course-tile-3d-bg) !important;
  background-image: none !important;
  box-shadow: var(--airo-course-tile-3d-shadow);
  text-shadow: none;
  outline: none;
  transition:
    color 0.2s ease,
    text-shadow 0.2s ease,
    background 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease,
    border-radius 0.2s ease;
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link.collapsed:hover,
body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link.collapsed:focus-visible {
  color: #a0e1f3 !important;
  text-shadow: 0 0 6px rgba(160, 225, 243, 0.35);
  border-color: rgba(0, 0, 0, 0.55);
  background: var(--airo-course-tile-3d-bg-hover) !important;
  box-shadow: var(--airo-course-tile-3d-shadow-hover);
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link:not(.collapsed) {
  color: #0a0a0a !important;
  text-shadow: none;
  background-color: #a0e1f3 !important;
  background-image:
    linear-gradient(
      45deg,
      rgba(30, 144, 255, 0.92) 25%,
      transparent 25%,
      transparent 75%,
      rgba(30, 144, 255, 0.92) 75%,
      rgba(30, 144, 255, 0.92)
    ),
    linear-gradient(
      45deg,
      rgba(30, 144, 255, 0.92) 25%,
      transparent 25%,
      transparent 75%,
      rgba(30, 144, 255, 0.92) 75%,
      rgba(30, 144, 255, 0.92)
    ) !important;
  background-size: 2px 2px !important;
  background-position:
    0 0,
    1px 1px !important;
  box-shadow:
    inset 0 0 14px rgba(160, 225, 243, 0.85),
    inset 0 0 24px rgba(30, 144, 255, 0.2),
    0 0 14px rgba(160, 225, 243, 0.55),
    0 1px 3px rgba(0, 0, 0, 0.12) !important;
  border-radius: 3px 3px 0 0;
  border-color: rgba(0, 0, 0, 0.25);
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link:not(.collapsed):hover,
body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link:not(.collapsed):focus-visible {
  color: #0a0a0a !important;
  text-shadow:
    0 0 1px rgba(190, 230, 255, 0.45),
    0 0 5px rgba(140, 200, 235, 0.38),
    0 0 10px rgba(30, 144, 255, 0.28),
    0 0 16px rgba(30, 144, 255, 0.18),
    0 0 22px rgba(135, 206, 250, 0.1);
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link:active {
  color: #0a0a0a !important;
  text-shadow: none;
  background-color: #a0e1f3 !important;
  background-image:
    linear-gradient(
      45deg,
      rgba(30, 144, 255, 0.92) 25%,
      transparent 25%,
      transparent 75%,
      rgba(30, 144, 255, 0.92) 75%,
      rgba(30, 144, 255, 0.92)
    ),
    linear-gradient(
      45deg,
      rgba(30, 144, 255, 0.92) 25%,
      transparent 25%,
      transparent 75%,
      rgba(30, 144, 255, 0.92) 75%,
      rgba(30, 144, 255, 0.92)
    ) !important;
  background-size: 2px 2px !important;
  background-position:
    0 0,
    1px 1px !important;
  box-shadow:
    inset 0 0 14px rgba(160, 225, 243, 0.95),
    inset 0 0 24px rgba(30, 144, 255, 0.22),
    0 0 16px rgba(160, 225, 243, 0.65),
    0 1px 3px rgba(0, 0, 0, 0.12) !important;
  border-color: rgba(0, 0, 0, 0.25);
  border-radius: 3px;
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-chevron {
  flex-shrink: 0;
  margin-left: auto;
  align-self: center;
  font-size: 12px;
  color: #a0e1f3 !important;
  text-shadow: none;
  transition:
    transform 0.25s ease,
    color 0.2s ease,
    text-shadow 0.2s ease;
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link.collapsed:hover .airo-course-modnav-chevron,
body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link.collapsed:focus-visible .airo-course-modnav-chevron {
  color: #a0e1f3 !important;
  text-shadow: 0 0 5px rgba(160, 225, 243, 0.45);
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link:active .airo-course-modnav-chevron {
  color: rgba(0, 0, 0, 0.92) !important;
  text-shadow: none;
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link:not(.collapsed) .airo-course-modnav-chevron {
  transform: rotate(180deg);
  color: rgba(0, 0, 0, 0.65) !important;
  text-shadow: none;
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link:not(.collapsed):hover .airo-course-modnav-chevron,
body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link:not(.collapsed):focus-visible .airo-course-modnav-chevron {
  color: rgba(0, 0, 0, 0.9) !important;
  text-shadow:
    0 0 2px rgba(175, 225, 245, 0.42),
    0 0 6px rgba(130, 195, 235, 0.32),
    0 0 11px rgba(30, 144, 255, 0.22),
    0 0 16px rgba(135, 206, 250, 0.1);
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link:not(.collapsed):active .airo-course-modnav-chevron {
  color: #0a0a0a !important;
  text-shadow: none;
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link > span {
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
  color: #a0e1f3 !important;
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link:not(.collapsed) > span,
body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-link:active > span {
  color: #0a0a0a !important;
}

body.airo-course-panel-page .airo-course-modnav-matrix .airo-course-modnav-metal-body.panel-body {
  margin: 0;
  padding: 10px 12px;
  border-radius: 0;
  border: var(--airo-course-tile-3d-border);
  border-top: none;
  background: #121212 !important;
  background-image: none !important;
  box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.5);
  color: var(--airo-side-nav-cyan);
  font-family: var(--font-main, 'Montserrat', sans-serif);
  font-size: 13px;
  line-height: 1.45;
}

body.airo-course-panel-page .airo-course-modnav-item .panel-collapse.in .airo-course-modnav-metal-body.panel-body,
body.airo-course-panel-page .airo-course-modnav-item .panel-collapse.collapsing .airo-course-modnav-metal-body.panel-body {
  text-shadow: none;
  color: #0a0a0a !important;
  background-color: #a0e1f3 !important;
  background-image: none !important;
  box-shadow:
    inset 0 2px 14px rgba(0, 0, 0, 0.08),
    inset 0 0 18px rgba(255, 255, 255, 0.28),
    inset 0 0 24px rgba(30, 144, 255, 0.12) !important;
  border-radius: 0;
  border-color: rgba(0, 0, 0, 0.28);
}

/* Аккордеон: в разметке один столбец 1–10; на десктопе — сетка 2×5 через grid + display:contents */
body.airo-course-module-navigator-page .airo-course-modnav-accordion-wrap {
  width: 100%;
  max-width: 100%;
  flex: 1 1 auto;
  min-height: 0;
  margin-top: calc(4px + 5vh);
}

@media (min-width: 992px) {
  body.airo-course-module-navigator-page .airo-course-modnav-accordion-wrap {
    box-sizing: border-box;
    width: 100%;
    max-width: min(1040px, 100%);
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(24px, 4vw, 64px);
    padding-right: clamp(24px, 4vw, 64px);
  }
}

/* Мобилка: заголовок + полоска rama + 10 модулей разом выше на 2% высоты окна; отступ аккордеона как раньше */
@media (max-width: 991px) {
  body.airo-course-module-navigator-page .airo-course-online-chat-main {
    transform: translateY(-2vh);
  }

  body.airo-course-module-navigator-page .airo-course-modnav-accordion-wrap {
    margin-top: 4px;
  }
}

body.airo-course-module-navigator-page .airo-course-modnav-grid {
  width: 100%;
  margin: 0;
}

/* Две колонки в разметке: общая сетка не тянет соседний столбец при раскрытии аккордеона */
body.airo-course-module-navigator-page .airo-course-modnav-matrix {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  min-width: 0;
}

body.airo-course-module-navigator-page .airo-course-modnav-col--stack {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}

@media (min-width: 992px) {
  body.airo-course-module-navigator-page .airo-course-modnav-matrix {
    flex-direction: row;
    align-items: flex-start;
    gap: 12px;
  }

  body.airo-course-module-navigator-page .airo-course-modnav-matrix > .airo-course-modnav-col {
    flex: 1 1 0;
    min-width: 0;
  }
}

/* Нумерация 1. … 10.: порядок в DOM 1…10 */
body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-matrix {
  counter-reset: airo-modnav-num;
}

body.airo-course-module-navigator-page .airo-course-modnav-matrix > .airo-course-modnav-col > .panel {
  flex: 0 0 auto;
  width: 100%;
}

body.airo-course-module-navigator-page .airo-course-modnav-grid.panel-group {
  margin-bottom: 0;
}

/* Bootstrap 3: сброс отступов у панелей внутри столбцов */
body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-matrix .airo-course-modnav-col > .panel {
  float: none !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  clear: none !important;
}

body.airo-course-module-navigator-page
  #modnavAccordionMetal
  .airo-course-modnav-matrix
  .airo-course-modnav-col
  > .panel
  + .panel {
  margin-top: 0 !important;
}

body.airo-course-module-navigator-page .airo-course-modnav-item.panel {
  margin: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  min-width: 0;
  counter-increment: airo-modnav-num;
}

body.airo-course-module-navigator-page .airo-course-modnav-item .panel-heading {
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
}

body.airo-course-module-navigator-page .airo-course-modnav-item .panel-title {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  text-align: left;
  width: 100%;
}

body.airo-course-module-navigator-page .airo-course-modnav-metal-head-wrap {
  padding: 0;
}

/* Модуль 6: ВАЖНО! / IMPORTANT! — красный неон при любых состояниях строки */
body.airo-course-module-navigator-page .airo-course-modnav-warn-neon {
  color: #ff2020 !important;
  text-shadow:
    0 0 8px rgba(255, 70, 70, 0.95),
    0 0 16px rgba(255, 30, 40, 0.9),
    0 0 26px rgba(255, 0, 20, 0.65),
    0 0 38px rgba(255, 40, 40, 0.4) !important;
}

body.airo-course-module-navigator-page .airo-course-modnav-metal-link:hover .airo-course-modnav-warn-neon {
  color: #ff3535 !important;
  text-shadow:
    0 0 10px rgba(255, 100, 100, 1),
    0 0 20px rgba(255, 40, 50, 0.95),
    0 0 34px rgba(255, 10, 30, 0.8),
    0 0 48px rgba(255, 60, 60, 0.5) !important;
}

/* АКТИВНОЕ состояние плитки модуля 6 (panel раскрыт):
 * — оригинальный текст «ВАЖНО!» / «IMPORTANT!» остаётся как есть
 *   (включая «!» и красный цвет);
 * — убираем ТОЛЬКО неон-эффект (text-shadow);
 * — добавляем тонкую чёрную обводку (hairline) для читаемости
 *   на светлом активном фоне.
 *
 * НЕактивное состояние НЕ затрагиваем — там остаётся красный неон. */
body.airo-course-module-navigator-page .airo-course-modnav-metal-link:not(.collapsed) .airo-course-modnav-warn-neon,
body.airo-course-module-navigator-page .airo-course-modnav-metal-link:not(.collapsed):hover .airo-course-modnav-warn-neon,
body.airo-course-module-navigator-page .airo-course-modnav-metal-link:not(.collapsed):focus-visible .airo-course-modnav-warn-neon,
body.airo-course-module-navigator-page .airo-course-modnav-metal-link:not(.collapsed):active .airo-course-modnav-warn-neon {
  text-shadow: none !important;
  -webkit-text-stroke: 0.5px rgba(0, 0, 0, 0.85);
  paint-order: stroke fill;
}

/* Нумерация модулей 1. … 10.; стиль плитки заголовка — общий блок .airo-course-modnav-matrix выше */
body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-metal-link::before {
  /* точка + обычный пробел U+0020 (явно, чтобы не терялся у границы flex) */
  content: counter(airo-modnav-num) ".\0020";
  flex-shrink: 0;
  margin-right: 0;
  padding-right: 0.05em;
  font-weight: 700;
  align-self: flex-start;
  white-space: pre;
  color: #a0e1f3;
}

/* Номер модуля — тот же неон/цвет, что у строки */
body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-metal-link.collapsed:hover::before,
body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-metal-link.collapsed:focus-visible::before,
body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-metal-link:not(.collapsed)::before,
body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-metal-link:not(.collapsed):hover::before,
body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-metal-link:active::before {
  text-shadow: inherit;
}

body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-metal-link:not(.collapsed)::before,
body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-metal-link:not(.collapsed):hover::before,
body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-metal-link:active::before {
  color: #0a0a0a;
}

body.airo-course-module-navigator-page .airo-course-modnav-item .panel-collapse {
  border: none;
  background: transparent;
}

body.airo-course-module-navigator-page .airo-course-modnav-metal-placeholder {
  margin: 0;
  opacity: 1;
  color: inherit;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html {
  margin: 0;
  color: #0a0a0a;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html p {
  margin: 0 0 0.85em;
  color: inherit;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html p:last-child {
  margin-bottom: 0;
}

/* Десктоп: тексты внутри спойлеров навигатора — ровная колонка, без жёстких <br> (перенос по ширине) */
@media (min-width: 992px) {
  body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-acc-html {
    max-width: min(100%, 60ch);
    margin-left: 0;
    margin-right: auto;
    text-wrap: pretty;
    overflow-wrap: break-word;
    word-break: normal;
    hyphens: none;
    -webkit-hyphens: none;
  }

  body.airo-course-module-navigator-page #modnavAccordionMetal .airo-course-modnav-acc-html br {
    display: none;
  }
}

body.airo-course-module-navigator-page .airo-course-modnav-accent {
  color: var(--airo-side-nav-cyan);
  font-weight: 600;
}

/* «Адаптация упражнений»: уровни, подзаголовок преимуществ, список с • */
body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-adapt .airo-course-modnav-adapt-level {
  margin-bottom: 1.35em;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-adapt .airo-course-modnav-adapt-level-head {
  margin: 0 0 0.4em !important;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-adapt .airo-course-modnav-adapt-benefits-heading {
  text-align: center;
  color: var(--airo-side-nav-cyan);
  font-weight: 600;
  font-size: 1.22em;
  line-height: 1.35;
  margin: 1.45em 0 0.65em !important;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-adapt .airo-course-modnav-adapt-benefits-list {
  list-style: none;
  padding-left: 0;
  margin: 0.35em 0 0.9em;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-adapt .airo-course-modnav-adapt-benefits-list li {
  position: relative;
  padding-left: 1.2em;
  margin-bottom: 0.7em;
  line-height: 1.45;
  color: inherit;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-adapt .airo-course-modnav-adapt-benefits-list li:last-child {
  margin-bottom: 0;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-adapt .airo-course-modnav-adapt-benefits-list li::before {
  content: '•';
  position: absolute;
  left: 0;
  color: #0a0a0a;
  font-weight: 600;
}

/* «ВАЖНО / здоровье»: разделители, подзаголовки разделов (синий акцент — .airo-course-modnav-accent в разметке) */
body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-health .airo-course-modnav-health-sep {
  border: none;
  border-top: 1px solid rgba(10, 10, 10, 0.14);
  margin: 1rem 0;
  padding: 0;
  height: 0;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-health .airo-course-modnav-health-section {
  margin: 0;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-health .airo-course-modnav-health-section-lead {
  font-weight: 700;
  margin: 0 0 0.45em !important;
  color: #0a0a0a;
  font-size: 0.92em;
  letter-spacing: 0.02em;
  line-height: 1.35;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-health .airo-course-modnav-health-section p:not(.airo-course-modnav-health-section-lead) {
  margin-top: 0;
}

/* «Питание и сон»: крупные заголовки разделов, синие подзаголовки, обычный текст */
body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-nutrition .airo-course-modnav-nutrition-section {
  margin: 0;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-nutrition .airo-course-modnav-nutrition-title {
  position: relative;
  margin: 0 0 0.55em !important;
  padding: 0 0 0 1.1em;
  color: var(--airo-side-nav-cyan);
  font-weight: 700;
  font-size: 1.22em;
  line-height: 1.3;
  font-family: inherit;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-nutrition .airo-course-modnav-nutrition-title::before {
  content: '•';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--airo-side-nav-cyan);
  font-weight: 700;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-nutrition .airo-course-modnav-nutrition-subhead {
  margin: 0.75em 0 0.35em !important;
  color: var(--airo-side-nav-cyan);
  font-weight: 600;
  line-height: 1.35;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-nutrition .airo-course-modnav-nutrition-subhead-muted {
  color: #4a5568 !important;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-nutrition h3 + .airo-course-modnav-nutrition-subhead {
  margin-top: 0.35em !important;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-nutrition .airo-course-modnav-nutrition-sep {
  border: none;
  border-top: 1px solid rgba(10, 10, 10, 0.14);
  margin: 1.05rem 0;
  padding: 0;
  height: 0;
}

/* Кнопка 9 «Твоя мотивация»: картинка на всю ширину панели, цитата Neuro #a0e1f3 на #000 (стык с картинкой), основной текст — Montserrat на голубом фоне панели */
body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-motiv9 {
  margin: -10px -12px 0;
  padding: 0 0 10px;
  box-sizing: border-box;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-motiv9 .airo-course-modnav-motiv9-img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-motiv9 .airo-course-modnav-motiv9-quote {
  margin: 0;
  padding: 1.1rem 14px;
  background: #000000;
  text-align: center;
  box-sizing: border-box;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-motiv9 .airo-course-modnav-motiv9-quote p {
  margin: 0 !important;
  color: #a0e1f3;
  font-family: var(--font-headings, 'neuro', sans-serif);
  font-weight: 600;
  font-size: clamp(0.92rem, 2.85vw, 1.2rem);
  line-height: 1.45;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

body.airo-course-module-navigator-page .airo-course-modnav-acc-html.airo-course-modnav-motiv9 .airo-course-modnav-motiv9-body {
  margin: 0 !important;
  padding: 0.85rem 12px 0;
  color: #0a0a0a;
  font-family: var(--font-main, 'Montserrat', sans-serif);
  font-weight: 400;
}

/* «Содержание модулей»: заголовок этапа (Neuro, синий), название (серый — читается на голубой панели), описание — обычный текст */
body.airo-course-module-navigator-page .airo-course-modnav-modules-outline .airo-course-modnav-mod-label {
  font-family: var(--font-headings, 'neuro', sans-serif);
  color: var(--airo-side-nav-cyan) !important;
  font-weight: 700;
  letter-spacing: 0.03em;
  margin: 0 0 0.35em !important;
  font-size: 0.95em;
}

body.airo-course-module-navigator-page .airo-course-modnav-modules-outline .airo-course-modnav-mod-title {
  color: #4a5568 !important;
  font-weight: 600;
  margin: 0 0 0.5em !important;
}

body.airo-course-module-navigator-page .airo-course-modnav-modules-outline .airo-course-modnav-mod-desc {
  color: #0a0a0a !important;
  font-weight: 400;
  margin: 0 0 0.65em !important;
}

body.airo-course-module-navigator-page .airo-course-modnav-modules-outline .airo-course-modnav-mod-block {
  margin-bottom: 1.15em;
}

body.airo-course-module-navigator-page .airo-course-modnav-modules-outline .airo-course-modnav-mod-sep {
  border: none;
  border-top: 1px solid rgba(10, 10, 10, 0.14);
  margin: 1rem 0;
  padding: 0;
  height: 0;
}

body.airo-course-module-navigator-page .airo-course-modnav-modules-outline .airo-course-modnav-mod-outro {
  color: #0a0a0a !important;
  margin: 0.85em 0 0 !important;
  padding-top: 0.85em;
  border-top: 1px solid rgba(10, 10, 10, 0.12);
}

/*
 * Раскрытая голубая панель: был небесный #6ec5ff на #a0e1f3 (низкий контраст).
 * text-shadow-окантовка только ухудшала («троение»). Вместо неё — плотный сине-бирюзовый
 * (#0a4d6e) только при .in / .collapsing; свернутый спойлер — по-прежнему неон на #0e0e0e.
 */
body.airo-course-module-navigator-page
  .airo-course-modnav-item
  .panel-collapse:is(.in, .collapsing)
  .airo-course-modnav-metal-body
  :is(
    .airo-course-modnav-accent,
    .airo-course-modnav-acc-html.airo-course-modnav-adapt .airo-course-modnav-adapt-benefits-heading,
    .airo-course-modnav-acc-html.airo-course-modnav-nutrition .airo-course-modnav-nutrition-title,
    .airo-course-modnav-modules-outline .airo-course-modnav-mod-label
  ),
body.airo-course-module-navigator-page
  .airo-course-modnav-item
  .panel-collapse:is(.in, .collapsing)
  .airo-course-modnav-metal-body
  .airo-course-modnav-acc-html.airo-course-modnav-nutrition
  .airo-course-modnav-nutrition-title::before,
body.airo-course-module-navigator-page
  .airo-course-modnav-item
  .panel-collapse:is(.in, .collapsing)
  .airo-course-modnav-metal-body
  .airo-course-modnav-acc-html.airo-course-modnav-nutrition
  .airo-course-modnav-nutrition-subhead:not(.airo-course-modnav-nutrition-subhead-muted) {
  color: #0a4d6e !important;
  text-shadow: none !important;
}

/* Рамка: волосная линия (inset 0.5px), фон #1F1F1F; острые углы, без свечения. */
body.airo-course-online-chat-page .airo-course-online-chat-prompt {
  width: 100%;
  max-width: min(530px, 94vw);
  margin: 0;
  padding: clamp(32px, 5.75vw, 51px) clamp(28px, 5.2vw, 44px);
  box-sizing: border-box;
  background: #1f1f1f;
  border: none;
  border-radius: 0;
  box-shadow: inset 0 0 0 0.5px #a0e1f3;
  /* Мобилка: ниже (доп. опускание); десктоп — отдельное правило ниже */
  transform: translateY(calc(-1 * clamp(9px, 2.6vh, 36px) + clamp(34px, 8vh, 108px)));
}

body.airo-course-online-chat-page .airo-course-online-chat-prompt-line {
  margin: 0;
  font-family: var(--font-main, 'Montserrat', sans-serif);
  font-weight: 600;
  font-size: clamp(1.32rem, 3.9vw, 1.75rem);
  line-height: 1.4;
  color: #e8e8e8;
  text-align: center;
  max-width: 41ch;
  margin-left: auto;
  margin-right: auto;
}

body.airo-course-online-chat-page .airo-course-online-chat-prompt-line + .airo-course-online-chat-prompt-line {
  margin-top: 0.9em;
}

body.airo-course-online-chat-page .airo-course-online-chat-prompt-line--sub {
  font-weight: 500;
  font-size: clamp(1.21rem, 3.45vw, 1.52rem);
  line-height: 1.42;
  color: #c8dce8;
  max-width: 44ch;
}

@media (min-width: 992px) {
  body.airo-course-online-chat-page .airo-course-online-chat-prompt {
    max-width: min(600px, 88%);
    padding: 51px 46px 55px;
    /* Десктоп: рамка без «лишнего» опускания — как до последнего −20% только для мобилки */
    transform: translateY(calc(-1 * clamp(11px, 3.2vh, 44px) + clamp(28px, 6.5vh, 90px)));
  }

  body.airo-course-online-chat-page .airo-course-online-chat-prompt-line {
    font-size: 1.98rem;
    line-height: 1.38;
    max-width: 37ch;
  }

  body.airo-course-online-chat-page .airo-course-online-chat-prompt-line--sub {
    font-size: 1.63rem;
    line-height: 1.4;
    max-width: 39ch;
  }

  body.airo-course-online-chat-page .airo-course-online-chat-prompt-line + .airo-course-online-chat-prompt-line {
    margin-top: 0.94em;
  }
}

/* Кнопка под рамкой: неон + отражение (как в макете), острые углы */
body.airo-course-online-chat-page .airo-course-online-chat-cta {
  --airo-chat-neon-bg: hsl(203, 99%, 9%);
  --airo-chat-neon: rgb(0, 162, 255);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  flex-shrink: 0;
  /* Базовый clamp ×1.2 ×1.1 — десктоп и мобилка */
  margin-top: calc(1.32 * clamp(28px, 5.5vh, 64px));
  position: relative;
  z-index: 2;
}

body.airo-course-online-chat-page .airo-course-online-chat-neon-btn {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
  background-color: transparent;
  background-image: none;
  color: var(--airo-chat-neon);
  font-weight: 700;
  font-family: 'Open Sans', sans-serif;
  letter-spacing: 0.09em;
  font-size: clamp(1.05rem, 2.85vw, 1.8rem);
  cursor: pointer;
  display: inline-block;
  text-decoration: none;
  border: var(--airo-chat-neon) 0.14em solid;
  padding: 0.3em 1.3em;
  border-radius: 0;
  text-shadow:
    0 0 0.125em hsl(0 0% 100% / 0.5),
    0 0 0.55em currentColor;
  box-shadow:
    inset 0 0 0.5em 0 var(--airo-chat-neon),
    0 0 0.5em 0 var(--airo-chat-neon);
  position: relative;
  transition: background-color 100ms linear;
  box-sizing: border-box;
}

body.airo-course-online-chat-page .airo-course-online-chat-neon-btn::before {
  content: '';
  pointer-events: none;
  position: absolute;
  top: 120%;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--airo-chat-neon);
  border-radius: 0;
  height: 100%;
  width: 100%;
  transform: perspective(1em) rotateX(30deg) scale(1, 0.5);
  filter: blur(1.1em);
  opacity: 0.8;
}

body.airo-course-online-chat-page .airo-course-online-chat-neon-btn::after {
  content: '';
  position: absolute;
  border-radius: 0;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  box-shadow: 0 0 2em 0.5em var(--airo-chat-neon);
  opacity: 0;
  transition: opacity 100ms linear;
}

body.airo-course-online-chat-page .airo-course-online-chat-neon-btn:hover,
body.airo-course-online-chat-page .airo-course-online-chat-neon-btn:focus {
  background: var(--airo-chat-neon);
  color: var(--airo-chat-neon-bg);
  text-shadow: none;
}

body.airo-course-online-chat-page .airo-course-online-chat-neon-btn:hover::after,
body.airo-course-online-chat-page .airo-course-online-chat-neon-btn:focus::after {
  opacity: 1;
}

body.airo-course-online-chat-page .airo-course-online-chat-neon-btn:hover::before,
body.airo-course-online-chat-page .airo-course-online-chat-neon-btn:focus::before {
  opacity: 1;
}

/* Родители с overflow:hidden иначе обрежут шар слева/снизу (как на boom-страницах) */
@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container {
    overflow: visible !important;
  }
}

@media (min-width: 992px) {
  body.airo-course-online-chat-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-online-chat-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-online-chat-page.airo-course-panel-page .main_container,
  body.airo-course-module-navigator-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-module-navigator-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-module-navigator-page.airo-course-panel-page .main_container {
    overflow: visible !important;
  }
}

@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container {
    overflow-x: hidden !important;
    overflow-y: visible !important;
  }
}

@media (max-width: 991px) {
  body.airo-course-online-chat-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-online-chat-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-online-chat-page.airo-course-panel-page .main_container,
  body.airo-course-module-navigator-page.airo-course-panel-page .airo-course-panel-main,
  body.airo-course-module-navigator-page.airo-course-panel-page .airo-course-panel-main > .container.body,
  body.airo-course-module-navigator-page.airo-course-panel-page .main_container {
    overflow: visible !important;
  }
}

/*
 * chat / module-nav: декор вылезает за .right_col — visible по X.
 * QuickFit: этот visible давал поймать ленту и уехать влево/вправо — по X hidden.
 */
body.airo-course-online-chat-page.airo-course-panel-page .main_container > .right_col,
body.airo-course-module-navigator-page.airo-course-panel-page .main_container > .right_col {
  overflow-x: visible !important;
}

body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container > .right_col {
  overflow-x: hidden !important;
  overscroll-behavior-x: none;
}

/*
 * Мобилка (в т.ч. iPhone): то же правило выше растягивает ширину колонки под декор и даёт горизонтальный скролл /
 * «уезжающий» неоновый шар. По X обрезаем — на узком экране углова обрезка шара допустима.
 */
@media (max-width: 900px) {
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container > .right_col {
    overflow-x: hidden !important;
    overscroll-behavior-x: none;
    /* как в базе — с pinch, не «сухой» pan-y: иначе на iPhone скролл липнет */
    touch-action: pan-y pinch-zoom;
  }
}

@media (max-width: 991px) {
  body.airo-course-online-chat-page.airo-course-panel-page .main_container > .right_col,
  body.airo-course-module-navigator-page.airo-course-panel-page .main_container > .right_col,
  body.airo-course-boom-lesson-page.airo-course-warmup-page.airo-course-panel-page .main_container > .right_col {
    overflow-x: hidden !important;
    overscroll-behavior-x: none;
    /* pan-y без pinch-zoom ломал pinch-zoom на части Android (Motorola); iOS вёл себя иначе */
    touch-action: pan-y pinch-zoom;
  }

}

/* «Нужна помощь?»: без вертикального скролла в правой колонке */
body.airo-course-online-chat-page.airo-course-panel-page .main_container > .right_col {
  overflow-y: hidden !important;
}

/* QuickFit: скролл только между сценами; cqh = точная высота колонки (без пиксельного «хвоста») */
/* Верт. скроллбар съедает ширину справа — контент визуально смещён влево; both-edges балансирует поле слева/справа */
body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container > .right_col {
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  /* auto/contain: мягче, чем none — iOS лучше отдаёт скролл колонке без «липкого» жеста */
  overscroll-behavior-y: contain;
  overscroll-behavior-x: none;
  /* жесты по горизонтали не передаём в «уезд» страницы — только вертикальный скролл колонки */
  touch-action: pan-y pinch-zoom;
  /* зазор под fixed lesson-footer: в .hero--qf-block6, не в padding .right_col (плоский #0e0e0e вместо icon-fon) */
  padding-bottom: 0 !important;
  container-type: size;
  container-name: airo-qf;
  scrollbar-gutter: stable both-edges;
}

/*
 * Моб. QuickFit, правый столбец: «тугой» скролл — частые причины (не влияют сами по себе, но суммируются):
 * — контейнер .right_col: overflow-y, overscroll-behavior, touch-action, scrollbar-gutter;
 * — body/html overflow-x + overscroll (гориз. жёстко останавливается, иногда срывает жест);
 * — анимации/фильтры на сцене (luchi, шар, will-change) при скролле = лишние repaints;
 * — container-type: size на .right_col (корневые вычисления) — десктоп/планшет оставляем, на тесном экране ниже;
 * — zoom JS на 829+ — на узкой ширине обычно снят, но при ресайзе возможны кадры веска.
 * Здесь: overscroll + touch-action с pinch-zoom (доступность: зум пальцами как на dashboard), scrollbar-gutter auto.
 */
@media (max-width: 900px) {
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container > .right_col {
    scrollbar-gutter: auto;
    overflow-y: auto !important;
    /* contain: не вешать жест на viewport (Y: auto давал iOS scroll-chaining + откат после touchend) */
    overscroll-behavior-y: contain;
    overscroll-behavior-x: none;
    touch-action: pan-y pinch-zoom;
    overflow-anchor: auto;
  }
}

/*
 * ≤828, телефон: container-type:size на *прокручиваемой* .right_col заставлял движок гонять
 * пересчёт cqh/контейнера при инерции — jank, «то скроллит, то нет». cqw/100cqh на этой ширине
 * не завязаны на этот контейнер (см. min-width:829 в motiv и ниже сцена 2).
 */
@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container > .right_col {
    container-type: normal;
    container-name: none;
  }
}

/* QuickFit: согласовано с max-width:900 — contain; pinch-zoom для единого поведения зума на мобильных */
@media (max-width: 991px) {
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container > .right_col {
    touch-action: pan-y pinch-zoom;
    overscroll-behavior-y: contain;
    overflow-anchor: auto;
  }
}

/* ---- Добро пожаловать в QuickFit: три сцены (фон / блоки) ----
 * .lesson-inner + .quickfit-wrap на одном div: flex задаёт .airo-course-lesson-inner (десктоп ок).
 * Только max-width 828px — flex:0 + min-h:auto (см. блок в @media ниже), иначе MS/WebKit режут сцены по Y. */
body.airo-course-welcome-quickfit-page .airo-course-welcome-quickfit-wrap {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  /*
   * Не режем по X всю обёртку: внутри неё снизу <nav class="airo-course-lesson-footer-nav"> (fixed).
   * iPhone WebKit: overflow-x clip/hidden у предка даёт «полоса без кнопок» — фон nav виден, ячейки обрезаны/не рисуются.
   * Гориз. обрезка только у .airo-qf-scale-outer (холст сцен), не у всего wrap.
   */
  overflow-x: visible;
  overflow-y: visible;
  align-items: stretch;
}

@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page .airo-course-welcome-quickfit-wrap {
    overflow-x: visible;
  }
}

@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page .airo-course-welcome-quickfit-wrap {
    overflow-x: visible;
  }
}

/* Три сцены в холсте. Без flex-grow: иначе оболочка тянется по высоте колонки — снизу пустая #0e0e0e полоса над панелью. */
body.airo-course-welcome-quickfit-page .airo-qf-scale-outer {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  flex: 0 0 auto;
  min-height: 0;
  background: #0e0e0e;
  isolation: isolate;
  overflow-x: clip;
  overflow-y: visible;
}

@media (max-width: 828px) {
  /* hidden вместо clip: в WebKit реже «ловит» гориз. контейнментом верт. жест — только холст сцен */
  body.airo-course-welcome-quickfit-page .airo-qf-scale-outer {
    overflow-x: hidden;
  }
}

body.airo-course-welcome-quickfit-page .airo-qf-scale-root {
  display: block;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  flex: 0 0 auto;
}

/* 992+: .right_col padding 10px 20px с Gentelella — сцена визуально на всю внутреннюю ширину */
@media (min-width: 992px) {
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container > .right_col .airo-qf-scale-outer {
    margin-left: -20px;
    margin-right: -20px;
    width: calc(100% + 40px);
  }
}

/* 829–991: часто padding 10px — меньше выпуск, без выхода за макет */
@media (max-width: 991px) and (min-width: 829px) {
  body.airo-course-welcome-quickfit-page.airo-course-panel-page .main_container > .right_col .airo-qf-scale-outer {
    margin-left: -10px;
    margin-right: -10px;
    width: calc(100% + 20px);
  }
}

/* 829+: зум вешает JS на .airo-qf-scale-outer (вся сцена с фонами сразу), не дублировать zoom на #airoQfScaleRoot */
@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page #airoQfScaleRoot {
    position: relative;
    z-index: 0;
    zoom: 1;
  }
}

@media (max-width: 828px) {
  /* Перебить .airo-course-lesson-page .right_col .airo-course-lesson-inner: высота = две сцены, скролл у .right_col */
  body.airo-course-welcome-quickfit-page.airo-course-panel-page
    .main_container
    > .right_col
    .airo-course-lesson-inner.airo-course-welcome-quickfit-wrap {
    flex: 0 0 auto;
    min-height: auto;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-hero {
  position: relative;
  flex: 0 0 auto; /* grow 0 shrink 0: высота = min-height, не сжимать */
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background-color: #0e0e0e;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  min-height: var(--airo-course-quickfit-hero-minh);
  overflow: visible;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sleva {
  background-image: url('../assets/images/icon-sleva-shar.png');
  overflow: visible;
  isolation: isolate;
}

/* Четвёртый экран: тот же арт, что слева; cover + center — весь кадр, без «задвигания» в угол */
body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--qf-block4 {
  position: relative;
  background-color: #0e0e0e;
  background-image: url('../assets/images/icon-sleva-shar.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  isolation: isolate;
  height: var(--airo-course-quickfit-hero-minh);
  min-height: var(--airo-course-quickfit-hero-minh);
  max-height: var(--airo-course-quickfit-hero-minh);
  box-sizing: border-box;
}

/* Контент по центру; при фикс. высоте секции — прокрутка внутри, не рост страницы на пустой фон */
body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--qf-block4 .airo-course-welcome-hero-inner {
  align-items: stretch;
  justify-content: center;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  width: 100%;
  max-width: 100%;
  padding-left: clamp(18px, 3.5vw, 40px);
  padding-right: clamp(18px, 3.5vw, 40px);
  padding-top: clamp(28px, 5.5vh, 56px);
  /* +3% по высоте к нижней зоне */
  padding-bottom: calc(clamp(28px, 5.5vh, 56px) + 3vh);
  box-sizing: border-box;
}

body.airo-course-welcome-quickfit-page .airo-qf-block4-inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: min(1180px, 100%);
  margin: 0 auto;
  box-sizing: border-box;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  /* Зазор «ТВОЙ НАСТАВНИК» → две колонки */
  gap: clamp(1.6rem, 3.6vh, 2.6rem);
  min-height: 0;
}

/* Пятый экран QuickFit: только плоский тёмный фон, без картинок/шаров (отдельно от др. слайдов) */
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block5 {
  position: relative;
  background-color: #0e0e0e;
  background-image: none;
  isolation: isolate;
  overflow: visible;
  height: auto;
  min-height: var(--airo-qf-block5-hero-minh);
  max-height: none;
  box-sizing: border-box;
  flex: 0 0 auto;
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block5
  .airo-course-welcome-hero-inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: var(--airo-qf-block5-hero-minh);
  height: auto;
  max-height: none;
  overflow: visible;
  width: 100%;
  max-width: 100%;
  padding-top: calc(
    var(--airo-qf-block5-scale, 1.3) * clamp(24px, 5vh, 48px)
  );
  padding-bottom: calc(
    var(--airo-qf-block5-scale, 1.3) * clamp(18px, 3vh, 32px)
  );
  padding-left: calc(
    var(--airo-qf-block5-scale, 1.3) * clamp(12px, 2.4vw, 20px)
  );
  padding-right: calc(
    var(--airo-qf-block5-scale, 1.3) * clamp(12px, 2.4vw, 20px)
  );
  box-sizing: border-box;
}

/* Десктоп: 6-й экран поверх стыка с 5-м — лучи (luchi) не уходят под кромку блока 5 */
@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6 {
    z-index: 1;
  }
}

/* Шестой экран QuickFit: фон assets/images/icon-fon.png */
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6 {
  position: relative;
  background-color: #0e0e0e;
  background-image: url('../assets/images/icon-fon.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* Y — видим; по X — на 829+; на 828 @media ниже: clip + сужение орбиты шара (iOS) */
  overflow: visible;
  isolation: isolate;
  min-height: var(--airo-course-quickfit-hero-minh);
  height: auto;
  max-height: none;
  box-sizing: border-box;
  flex: 0 0 auto;
  /* зазор под fixed lesson-footer: тот же фон, что у сцены 6, без «полосы» .right_col */
  padding-bottom: calc(
    var(--airo-lesson-footer-bar-height) + env(safe-area-inset-bottom, 0px) + 6px
  );
}

/* Блок 6: тот же icon-shar.png, что в других героях. Врапперы — только вёрстка, без визуала/opacity/filter/blend. */
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-shar {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: visible;
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-shar__orbit {
  position: absolute;
  /* крупнее шар, якорь левее — больше покрытие слева; центрирование — только static transform */
  left: calc(50% - min(8.5vw, 84px));
  top: calc(50% - 13.5%);
  width: min(108vmin, 760px);
  max-width: min(99vw, 760px);
  line-height: 0;
  transform: translate(-50%, -50%);
  transform-origin: center center;
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-shar__img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 50%;
  -webkit-tap-highlight-color: transparent;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform-origin: center center;
  /* Траектория «ромб» — на img, не на пустом wrapper (iOS: не крутить отдельный слой вокруг картинки) */
  animation: airoQfBlock6SharOrbit 7s ease-in-out infinite;
  /*
   * Визуал неона: как в других блоках с этим PNG — только на <img> (тот же icon-shar.png).
   */
  opacity: 0.55;
  mix-blend-mode: screen;
  filter: drop-shadow(0 0 28px rgba(120, 220, 255, 0.45))
    drop-shadow(0 0 58px rgba(60, 170, 255, 0.32))
    drop-shadow(0 0 100px rgba(40, 130, 220, 0.22));
}

@supports not (mix-blend-mode: screen) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-shar__img {
    mix-blend-mode: normal;
    opacity: 0.5;
  }
}

/*
 * iOS / file: гориз. скролл: базовый overflow:visible у 6-го героя шёл *после* старых mоб. правил и сбрасывал clip;
 * 108vmin + left:50%-8.5vw вылезали влево. Здесь — после базовых правил, с узкой вёрсткой.
 */
@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page {
    overflow-x: hidden;
    position: relative;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6 {
    overflow-x: clip;
    overflow-y: visible;
    /* убираем отдельный compositor-контекст: на стыке с 5/футером iOS иначе срывало инерцию */
    isolation: auto;
  }

  /* не hidden — иначе на iPhone виден прямоугольник клипа; обрезка по X у героя */
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-shar {
    overflow: visible;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-shar__orbit {
    left: 50%;
    width: min(88vmin, 100%, 100vw);
    max-width: min(100%, 100dvw, 100vw, 600px);
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-welcome {
    /* приподнять роботов выше (~10% к положению 44% → ~40%) — только моб. */
    top: 40%;
    /* как на десктопе: −10% (990px max), на узком — вся ширина сцены */
    width: min(990px, 100%);
    max-width: 100%;
  }
}

/* Ромб: T(-1.5,-5.8) R(12.5) B(0,15) L(-13) — крупный радиус, максимум слева; Catmull–Rom */
@keyframes airoQfBlock6SharOrbit {
  0% {
    transform: translate(-1.5vmin, -5.8vmin) scale(1);
  }
  2.08% {
    transform: translate(-0.337vmin, -5.699vmin) scale(1.0042);
  }
  4.17% {
    transform: translate(0.995vmin, -5.411vmin) scale(1.0083);
  }
  6.25% {
    transform: translate(2.445vmin, -4.959vmin) scale(1.0125);
  }
  8.33% {
    transform: translate(3.963vmin, -4.367vmin) scale(1.0167);
  }
  10.42% {
    transform: translate(5.498vmin, -3.656vmin) scale(1.0208);
  }
  12.5% {
    transform: translate(7vmin, -2.85vmin) scale(1.025);
  }
  14.58% {
    transform: translate(8.419vmin, -1.972vmin) scale(1.0292);
  }
  16.67% {
    transform: translate(9.704vmin, -1.044vmin) scale(1.0333);
  }
  18.75% {
    transform: translate(10.805vmin, -0.091vmin) scale(1.0375);
  }
  20.83% {
    transform: translate(11.671vmin, 0.867vmin) scale(1.0417);
  }
  22.92% {
    transform: translate(12.253vmin, 1.805vmin) scale(1.0458);
  }
  25% {
    transform: translate(12.5vmin, 2.7vmin) scale(1.05);
  }
  27.08% {
    transform: translate(12.388vmin, 3.67vmin) scale(1.0708);
  }
  29.17% {
    transform: translate(11.956vmin, 4.815vmin) scale(1.0917);
  }
  31.25% {
    transform: translate(11.25vmin, 6.084vmin) scale(1.1125);
  }
  33.33% {
    transform: translate(10.315vmin, 7.43vmin) scale(1.1333);
  }
  35.42% {
    transform: translate(9.196vmin, 8.801vmin) scale(1.1542);
  }
  37.5% {
    transform: translate(7.938vmin, 10.15vmin) scale(1.175);
  }
  39.58% {
    transform: translate(6.586vmin, 11.427vmin) scale(1.1958);
  }
  41.67% {
    transform: translate(5.185vmin, 12.581vmin) scale(1.2167);
  }
  43.75% {
    transform: translate(3.781vmin, 13.566vmin) scale(1.2375);
  }
  45.83% {
    transform: translate(2.419vmin, 14.33vmin) scale(1.2583);
  }
  47.92% {
    transform: translate(1.144vmin, 14.824vmin) scale(1.2792);
  }
  50% {
    transform: translate(0vmin, 15vmin) scale(1.3);
  }
  52.08% {
    transform: translate(-1.144vmin, 14.824vmin) scale(1.2683);
  }
  54.17% {
    transform: translate(-2.421vmin, 14.33vmin) scale(1.2367);
  }
  56.25% {
    transform: translate(-3.789vmin, 13.566vmin) scale(1.205);
  }
  58.33% {
    transform: translate(-5.204vmin, 12.581vmin) scale(1.1733);
  }
  60.42% {
    transform: translate(-6.622vmin, 11.427vmin) scale(1.1417);
  }
  62.5% {
    transform: translate(-8vmin, 10.15vmin) scale(1.11);
  }
  64.58% {
    transform: translate(-9.295vmin, 8.801vmin) scale(1.0783);
  }
  66.67% {
    transform: translate(-10.463vmin, 7.43vmin) scale(1.0467);
  }
  68.75% {
    transform: translate(-11.461vmin, 6.084vmin) scale(1.015);
  }
  70.83% {
    transform: translate(-12.245vmin, 4.815vmin) scale(0.9833);
  }
  72.92% {
    transform: translate(-12.773vmin, 3.67vmin) scale(0.9517);
  }
  75% {
    transform: translate(-13vmin, 2.7vmin) scale(0.92);
  }
  77.08% {
    transform: translate(-12.907vmin, 1.805vmin) scale(0.9267);
  }
  79.17% {
    transform: translate(-12.53vmin, 0.867vmin) scale(0.9333);
  }
  81.25% {
    transform: translate(-11.906vmin, -0.091vmin) scale(0.94);
  }
  83.33% {
    transform: translate(-11.074vmin, -1.044vmin) scale(0.9467);
  }
  85.42% {
    transform: translate(-10.072vmin, -1.972vmin) scale(0.9533);
  }
  87.5% {
    transform: translate(-8.938vmin, -2.85vmin) scale(0.96);
  }
  89.58% {
    transform: translate(-7.709vmin, -3.656vmin) scale(0.9667);
  }
  91.67% {
    transform: translate(-6.426vmin, -4.367vmin) scale(0.9733);
  }
  93.75% {
    transform: translate(-5.125vmin, -4.959vmin) scale(0.98);
  }
  95.83% {
    transform: translate(-3.845vmin, -5.411vmin) scale(0.9867);
  }
  97.92% {
    transform: translate(-2.624vmin, -5.699vmin) scale(0.9933);
  }
  100% {
    transform: translate(-1.5vmin, -5.8vmin) scale(1);
  }
}

/*
 * Десктоп (≥829px): тот же «ромб», но нижняя половина ниже — мягче (y≥0 ×0.68, y<0 ×0.9),
 * чтобы screen+свечение не «заливали» панель под контентом. Мобилка: базовая анимация.
 */
@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-shar__img {
    animation-name: airoQfBlock6SharOrbitDesktop;
  }
}

@keyframes airoQfBlock6SharOrbitDesktop {
  0% {
    transform: translate(-1.5vmin, -5.22vmin) scale(1);
  }
  2.08% {
    transform: translate(-0.337vmin, -5.129vmin) scale(1.0042);
  }
  4.17% {
    transform: translate(0.995vmin, -4.87vmin) scale(1.0083);
  }
  6.25% {
    transform: translate(2.445vmin, -4.463vmin) scale(1.0125);
  }
  8.33% {
    transform: translate(3.963vmin, -3.93vmin) scale(1.0167);
  }
  10.42% {
    transform: translate(5.498vmin, -3.29vmin) scale(1.0208);
  }
  12.5% {
    transform: translate(7vmin, -2.565vmin) scale(1.025);
  }
  14.58% {
    transform: translate(8.419vmin, -1.775vmin) scale(1.0292);
  }
  16.67% {
    transform: translate(9.704vmin, -0.94vmin) scale(1.0333);
  }
  18.75% {
    transform: translate(10.805vmin, -0.082vmin) scale(1.0375);
  }
  20.83% {
    transform: translate(11.671vmin, 0.59vmin) scale(1.0417);
  }
  22.92% {
    transform: translate(12.253vmin, 1.227vmin) scale(1.0458);
  }
  25% {
    transform: translate(12.5vmin, 1.836vmin) scale(1.05);
  }
  27.08% {
    transform: translate(12.388vmin, 2.496vmin) scale(1.0708);
  }
  29.17% {
    transform: translate(11.956vmin, 3.274vmin) scale(1.0917);
  }
  31.25% {
    transform: translate(11.25vmin, 4.137vmin) scale(1.1125);
  }
  33.33% {
    transform: translate(10.315vmin, 5.052vmin) scale(1.1333);
  }
  35.42% {
    transform: translate(9.196vmin, 5.985vmin) scale(1.1542);
  }
  37.5% {
    transform: translate(7.938vmin, 6.902vmin) scale(1.175);
  }
  39.58% {
    transform: translate(6.586vmin, 7.77vmin) scale(1.1958);
  }
  41.67% {
    transform: translate(5.185vmin, 8.555vmin) scale(1.2167);
  }
  43.75% {
    transform: translate(3.781vmin, 9.225vmin) scale(1.2375);
  }
  45.83% {
    transform: translate(2.419vmin, 9.744vmin) scale(1.2583);
  }
  47.92% {
    transform: translate(1.144vmin, 10.08vmin) scale(1.2792);
  }
  50% {
    transform: translate(0vmin, 10.2vmin) scale(1.3);
  }
  52.08% {
    transform: translate(-1.144vmin, 10.08vmin) scale(1.2683);
  }
  54.17% {
    transform: translate(-2.421vmin, 9.744vmin) scale(1.2367);
  }
  56.25% {
    transform: translate(-3.789vmin, 9.225vmin) scale(1.205);
  }
  58.33% {
    transform: translate(-5.204vmin, 8.555vmin) scale(1.1733);
  }
  60.42% {
    transform: translate(-6.622vmin, 7.77vmin) scale(1.1417);
  }
  62.5% {
    transform: translate(-8vmin, 6.902vmin) scale(1.11);
  }
  64.58% {
    transform: translate(-9.295vmin, 5.985vmin) scale(1.0783);
  }
  66.67% {
    transform: translate(-10.463vmin, 5.052vmin) scale(1.0467);
  }
  68.75% {
    transform: translate(-11.461vmin, 4.137vmin) scale(1.015);
  }
  70.83% {
    transform: translate(-12.245vmin, 3.274vmin) scale(0.9833);
  }
  72.92% {
    transform: translate(-12.773vmin, 2.496vmin) scale(0.9517);
  }
  75% {
    transform: translate(-13vmin, 1.836vmin) scale(0.92);
  }
  77.08% {
    transform: translate(-12.907vmin, 1.227vmin) scale(0.9267);
  }
  79.17% {
    transform: translate(-12.53vmin, 0.59vmin) scale(0.9333);
  }
  81.25% {
    transform: translate(-11.906vmin, -0.082vmin) scale(0.94);
  }
  83.33% {
    transform: translate(-11.074vmin, -0.94vmin) scale(0.9467);
  }
  85.42% {
    transform: translate(-10.072vmin, -1.775vmin) scale(0.9533);
  }
  87.5% {
    transform: translate(-8.938vmin, -2.565vmin) scale(0.96);
  }
  89.58% {
    transform: translate(-7.709vmin, -3.29vmin) scale(0.9667);
  }
  91.67% {
    transform: translate(-6.426vmin, -3.93vmin) scale(0.9733);
  }
  93.75% {
    transform: translate(-5.125vmin, -4.463vmin) scale(0.98);
  }
  95.83% {
    transform: translate(-3.845vmin, -4.87vmin) scale(0.9867);
  }
  97.92% {
    transform: translate(-2.624vmin, -5.129vmin) scale(0.9933);
  }
  100% {
    transform: translate(-1.5vmin, -5.22vmin) scale(1);
  }
}

/* 6 QuickFit: icon-welcome — по центру; покачивание 4s, плавный цикл без пауз на кадрах */
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-welcome {
  position: absolute;
  z-index: 4;
  left: 50%;
  /* чуть выше 50% — внизу остаётся зона под подпись в .airo-course-welcome-hero-inner */
  top: 42%;
  /* резина: −10% к прежнему max 1100px → 990px */
  width: min(990px, calc(100% - 2 * clamp(12px, 3.5vw, 40px)));
  max-width: min(990px, 100%);
  transform: translate(-50%, -50%);
  line-height: 0;
  pointer-events: none;
  box-sizing: border-box;
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-welcome__img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  -webkit-tap-highlight-color: transparent;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  animation: airoQfBlock6WelcomeSway 4s ease-in-out infinite;
}

@keyframes airoQfBlock6WelcomeSway {
  0% {
    transform: translate3d(-1.1vmin, 0, 0);
  }
  50% {
    transform: translate3d(1.1vmin, 0, 0);
  }
  100% {
    transform: translate3d(-1.1vmin, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-shar__img {
    animation: none;
    transform: translate(-1.5vmin, -5.8vmin) scale(1);
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-welcome__img {
    animation: none;
    transform: none;
  }
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-course-welcome-hero-inner {
  position: relative;
  /* выше .airo-qf-block6-luchi (2), иначе мотив под лучами */
  z-index: 7;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  min-height: var(--airo-course-quickfit-hero-minh);
  width: 100%;
  max-width: 100%;
  padding: clamp(12px, 2.5vh, 28px) clamp(16px, 3.5vw, 40px) clamp(24px, 4vh, 48px);
  box-sizing: border-box;
}

/* 829+: мотив к нижнему краю сцены; роботы — absolute, не в потоке */
@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-course-welcome-hero-inner {
    justify-content: flex-end;
    padding-top: clamp(8px, 1.5vh, 20px);
    /* меньше «воздуха» снизу + см. translateY на .airo-qf-block6-motiv (−7vh) */
    padding-bottom: clamp(0.85rem, 2.2vh, 1.75rem);
  }
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero--qf-block6
  .airo-qf-block6-inner {
  position: relative;
  z-index: 0;
  width: 100%;
  max-width: min(1180px, 100%);
  margin: 0 auto;
  min-height: 0;
  box-sizing: border-box;
  padding-top: 0;
}

@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--qf-block6
    .airo-qf-block6-inner {
    /* моб.: 4 строки; отступ сильно вниз — раньше clamp(..., 27rem) резал 68vh и текст залипал на роботах */
    padding-top: max(17rem, min(76vh, 100svh - 2rem, 40rem));
  }
}

/* 6 QuickFit: мотив под icon-welcome — Neuro, белый / голубой акцент */
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-motiv {
  text-align: center;
  width: 100%;
  /* не сужаем: иначе крупный шрифт + длинная строка → по одному слову в «строке» */
  max-width: 100%;
  margin: 0 auto;
  padding: 0 clamp(8px, 2vw, 16px);
  box-sizing: border-box;
  position: relative;
  z-index: 1;
}

/* Вертикальный сдвиг — только десктоп .motiv--desk */
@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-motiv--desk {
    transform: translateY(calc(-2 * 1vh));
  }
}

/* моб.: 4 строки — отдельный блок; десктоп — три строки */
@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-motiv--mob {
    display: none !important;
  }
}

@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-motiv--desk {
    display: none !important;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-motiv--mob {
    display: block;
    transform: none;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-motiv--mob
    .airo-qf-block6-motiv__line {
    white-space: normal;
    word-break: normal;
  }
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-motiv__line {
  margin: 0 0 0.18em;
  font-family: var(--font-headings, 'neuro', sans-serif);
  font-weight: 600;
  /* ещё +10% к прошлой шкале */
  font-size: clamp(2.22rem, 5.04vw, 3.8rem);
  line-height: 1.2;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.85), 0 0 20px rgba(0, 0, 0, 0.35);
}

@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-motiv__line {
    /* 829+ резина, ещё +10% */
    font-size: clamp(1.98rem, 2.37vw, 3.6rem);
    font-size: clamp(1.98rem, 4.52cqw, 3.6rem);
    font-weight: 700;
    letter-spacing: 0.045em;
    /* у каждого <p> одна смысловая строка */
    white-space: nowrap;
    overflow-wrap: normal;
    word-wrap: normal;
    word-break: normal;
  }
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-motiv__line--white {
  color: #ffffff;
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-motiv--cyan {
  /* брендовый голубой сайта (не --airo-side-nav-cyan) */
  color: #a0e1f3;
}

/* третья строка (PERSISTENCE / НАСТОЙЧИВОСТИ) — чуть ниже, отдельный акцент */
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-motiv__line--tail {
  margin-top: clamp(0.45rem, 1.1vh, 0.7rem);
  font-weight: 700;
}

@media (max-width: 828px) {
  /* десктоп-строки скрыты, но селектор без --mob влиял бы на hidden — явно mob */
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-motiv--mob
    .airo-qf-block6-motiv__line {
    font-size: clamp(1.45rem, 6.4vw, 1.95rem);
    line-height: 1.18;
    letter-spacing: 0.045em;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-motiv--mob
    .airo-qf-block6-motiv__line--tail {
    margin-top: clamp(0.3rem, 0.8vh, 0.5rem);
  }
}

/* 6-й блок: слева; z-index > .hero-inner(0) иначе визуально «съедает» пустой слой */
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-molniya--levo {
  --molniya-edge: min(52vw, 320px);
  /* +15%; сдвиг влево −125px; bottom −50 */
  --molniya-rotw: calc(var(--molniya-edge) * 576 / 540);
  position: absolute;
  z-index: 3;
  left: calc(-0.58 * var(--molniya-rotw) + 35px + 15% - 125px);
  /* не negative bottom: иначе кусок молнии ниже padding edge секции — фон .scale-outer #0e0e0e «полоса» */
  bottom: 0;
  padding-left: max(env(safe-area-inset-left, 0px), 0px);
  padding-bottom: max(env(safe-area-inset-bottom, 0px), 0px);
  width: var(--molniya-edge);
  max-width: min(52vw, 320px);
  line-height: 0;
  pointer-events: none;
  box-sizing: border-box;
  display: block;
  overflow: visible;
}

/* справа: почти вся молния в кадре; кромка 10–16px уходит за кромку — не «0 на экране» */
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-molniya--pravo {
  --molniya-edge: min(52vw, 320px);
  /* 1.232×1.05 */
  --molniya-pravo-w: calc(var(--molniya-edge) * 1.232 * 1.05);
  position: absolute;
  z-index: 3;
  left: auto;
  right: -12px;
  bottom: 0;
  /* вправо 3% + ещё столько же (итого 6vw) */
  transform: translate(6vw, 0);
  padding-right: max(env(safe-area-inset-right, 0px), 0px);
  padding-bottom: max(env(safe-area-inset-bottom, 0px), 0px);
  width: var(--molniya-pravo-w);
  max-width: min(calc(52vw * 1.232 * 1.05), 414.528px);
  line-height: 0;
  pointer-events: none;
  box-sizing: border-box;
  display: block;
  overflow: visible;
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-molniya--levo
  .airo-qf-block6-molniya__img,
body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-molniya--pravo
  .airo-qf-block6-molniya__img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  /* лёгкое свечение как на референсе; при необходимости отключи */
  filter: drop-shadow(0 0 8px rgba(120, 200, 255, 0.45))
    drop-shadow(0 0 20px rgba(100, 180, 255, 0.25));
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-molniya--levo
  .airo-qf-block6-molniya__img {
  object-position: left bottom;
  /* 32° против часовой */
  transform: rotate(-32deg);
  transform-origin: left bottom;
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
  .airo-qf-block6-molniya--pravo
  .airo-qf-block6-molniya__img {
  object-position: right bottom;
}

/* 6-й блок, icon-luchi: десктоп (узкий планшет/окно F12 — см. luchi max-width:900) */
@media (min-width: 901px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-luchi {
    --luchi-w: min(calc(32vw * 2.91), calc(240px * 2.91));
    position: absolute;
    /* под icon-welcome (4) и под .hero-inner (7); над шаром (0) */
    z-index: 2;
    left: auto;
    /* десктоп: выше стыка с блоком 5 — лучи не под кромкой; см. z-index у .hero--qf-block6 */
    top: max(0px, calc(clamp(36px, 5.5vh, 96px) - min(8vh, 88px) - 24px));
    right: calc(clamp(48px, 10vw, 120px) + 14vw + 10vw);
    bottom: auto;
    width: var(--luchi-w);
    max-width: min(calc(36vw * 2.91), calc(240px * 2.91));
    line-height: 0;
    pointer-events: none;
    box-sizing: border-box;
    display: block;
    overflow: visible;
    transform: scaleX(-1);
    transform-origin: right top;
    background: transparent;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-luchi__img {
    display: block;
    width: 100%;
    max-height: min(calc(34vh * 2.91), calc(300px * 2.91));
    height: auto;
    object-fit: contain;
    object-position: left top;
    background: transparent;
    filter: brightness(1.15)
      drop-shadow(0 0 12px rgba(120, 200, 255, 0.55))
      drop-shadow(0 0 28px rgba(100, 180, 255, 0.35));
  }
}

/*
 * 6 QuickFit, мобилка ≤828: luchi ранее требовал overflow-x:visible на .right_col — при overflow-y:auto
 * WebKit ломал вертикальный скролл (залипание/откат на границах 1↔2 и низ/верх). Держим X скрытым
 * на колонке; обрезка luchi внутри .hero--qf-block6 (overflow-x:clip выше) и max-width luchi.
 */
@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-molniya--pravo {
    /* правый край молнии уходит за кромку: заметный кусок за бардьор (как у левого слева) */
    right: -68px;
    bottom: max(6px, env(safe-area-inset-bottom, 0px));
    /* как в базе: translate(6vw, 0) */
    transform: translate(6vw, 0);
    --molniya-pravo-w: min(calc(50vw * 1.1), 220px);
    width: var(--molniya-pravo-w);
    max-width: min(90%, 240px);
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-molniya--levo {
    left: calc(-0.22 * var(--molniya-rotw) + 12px + 5px + 10px);
    bottom: max(16px, calc(10px + env(safe-area-inset-bottom, 0px)));
    transform: translateY(3vh);
  }
}

/*
 * Luchi 6-го экрана: ≤900px. margin-top; +4–5% и +min(3vh,3vw) — ещё чуть вниз от края слайда.
 * Без 100dvw — старые WebView.
 */
@media (max-width: 900px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-luchi {
    position: absolute;
    /* не перекрывать icon-welcome (z-index 4) — иначе лучи «залазят» на центр */
    z-index: 2;
    line-height: 0;
    pointer-events: none;
    box-sizing: border-box;
    display: block;
    overflow: visible;
    background: transparent;
    /* якорь safe-area; вверх margin-top; +4–5% и ещё ~3% вниз — не вылезать на соседний слайд */
    top: max(0px, env(safe-area-inset-top, 0px));
    margin-top: calc(
      -1 * (64px + min(11vh, 96px)) + min(4vh, 5vw) + 10px + min(3vh, 3vw, 22px)
    );
    right: calc(
      max(0px, env(safe-area-inset-right, 0px)) + 4px + min(26vw, 110px) + 6vw
    );
    left: auto;
    bottom: auto;
    max-width: min(100vw, calc(48vw * 2.91), calc(220px * 2.91));
    width: min(100vw, calc(48vw * 2.91), calc(220px * 2.91));
    transform: scaleX(-1);
    transform-origin: right top;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6
    .airo-qf-block6-luchi__img {
    display: block;
    width: 100%;
    height: auto;
    max-height: min(calc(32vh * 2.91), calc(260px * 2.91));
    object-fit: contain;
    object-position: left top;
    background: transparent;
    /* моб.: один drop-shadow вместо двух — filter при скролле колонки даёт jank на слабых GPU */
    filter: brightness(1.1)
      drop-shadow(0 0 16px rgba(100, 190, 255, 0.45));
  }
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: min(calc(54rem * var(--airo-qf-block5-scale, 1.3)), 98vw);
  margin: 0 auto;
  box-sizing: border-box;
  min-height: 0;
  flex: 0 0 auto;
  zoom: var(--airo-qf-block5-zoom, 1.1);
  overflow: visible;
  align-self: center;
}

/* Сетка: 829+ — ⅓ + ⅔; нижняя рамка — span. Три рамки вместе по центру блока, без сдвигов */
body.airo-course-welcome-quickfit-page .airo-qf-block5-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
  justify-items: stretch;
  overflow: visible;
  gap: calc(
      var(--airo-qf-block5-scale, 1.3) * clamp(0.55rem, 1.2vh, 0.8rem)
    )
    calc(var(--airo-qf-block5-scale, 1.3) * clamp(0.65rem, 1.2vw, 0.9rem));
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

@media (min-width: 829px) {
  /* Десктоп: как раньше — одна высота сцены с остальными слайдами, ровные отступы, без тянучки рядов */
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block5 {
    min-height: var(--airo-course-quickfit-hero-minh);
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block5
    .airo-course-welcome-hero-inner {
    min-height: var(--airo-course-quickfit-hero-minh);
    padding: calc(var(--airo-qf-block5-scale, 1.3) * clamp(14px, 2.4vh, 24px))
      calc(var(--airo-qf-block5-scale, 1.3) * clamp(12px, 2.4vw, 20px));
  }

  /* Верх — ⅓ + ⅔, низ — span; align-items: start — из .airo-qf-block5-grid (база) */
  body.airo-course-welcome-quickfit-page .airo-qf-block5-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-card--why {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    transform: translateY(-12%);
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-card--what {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-what-anim {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-card--why
    .airo-qf-block5-hug {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  /* Шаг 1 CTA: на десктопе — одна строка; на мобилке перенос через br */
  br.airo-qf-block5-step__br-mob {
    display: none;
  }
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-card {
  position: relative;
  z-index: 1;
  border: 1px solid rgba(110, 200, 255, 0.75);
  border-radius: 0;
  box-shadow: 0 0 0 0.5px rgba(100, 195, 255, 0.2);
  padding: calc(0.68rem * var(--airo-qf-block5-scale, 1.3))
    calc(0.78rem * var(--airo-qf-block5-scale, 1.3))
    calc(0.7rem * var(--airo-qf-block5-scale, 1.3))
    calc(0.78rem * var(--airo-qf-block5-scale, 1.3));
  background: transparent;
  box-sizing: border-box;
  min-width: 0;
  text-align: left;
  width: 100%;
  max-width: 100%;
  overflow: visible;
}

/* Нижняя: рамка по ширине контента, по центру сетки; вся ширина экрана — только @828, см. ниже */
body.airo-course-welcome-quickfit-page .airo-qf-block5-card.airo-qf-block5-card--span {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: left;
  width: min(100%, max-content);
  max-width: 100%;
  min-width: 0;
  margin-left: auto;
  margin-right: auto;
  justify-self: center;
  box-sizing: border-box;
  padding: 2%;
  left: 0;
}

/* Левая: везде — выравнивание текста; max-content только моб. (иначе каскад ломал ширину на десктопе) */
body.airo-course-welcome-quickfit-page .airo-qf-block5-card--why .airo-qf-block5-hug {
  text-align: left;
  box-sizing: border-box;
}

@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page .airo-qf-block5-card--why .airo-qf-block5-hug {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
    max-width: 100%;
  }
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-card--why
  .airo-qf-block5-hug
  .airo-qf-block5-card__title {
  text-align: left;
  margin: 0 0 calc(0.5em * var(--airo-qf-block5-scale, 1.3)) 0;
}

/* «Почему»: 829+ — деск. вариант (две строки); ≤828 — моб.: одна строка по центру, резиновый кегль */
body.airo-course-welcome-quickfit-page
  .airo-qf-block5-why-title--mob {
  display: none;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-why-title--desk {
  display: block;
}

@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-why-title--mob {
    display: block;
    width: 100%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    white-space: nowrap;
    box-sizing: border-box;
    font-size: calc(
      var(--airo-qf-block5-scale, 1.3) *
        clamp(0.58rem, 0.22rem + 1.05vw + 0.45vmin, 0.88rem)
    );
    line-height: 1.22;
  }

  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-why-title--desk {
    display: none;
  }
}

/* Текст «потому что…»: моб. — фикс. переносы; деск. — тот же текст без <br> в абзацах */
body.airo-course-welcome-quickfit-page
  .airo-qf-block5-why-bodies
  .airo-qf-block5-why-bodies--mob {
  display: none;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-why-bodies
  .airo-qf-block5-why-bodies--desk {
  display: block;
}

@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-why-bodies
    .airo-qf-block5-why-bodies--mob {
    display: block;
  }

  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-why-bodies
    .airo-qf-block5-why-bodies--desk {
    display: none;
  }

  /* Моб. — по 2 смысловых строки на абзац; кегль как у .airo-qf-block5-card__body, по ширине колонки */
  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-why-bodies--mob
    .airo-qf-block5-linegroup {
    text-wrap: pretty;
    width: 100%;
    max-width: 100%;
    font-size: calc(
      var(--airo-qf-block5-scale, 1.3) * clamp(0.78rem, 0.22rem + 0.7vw, 0.9rem)
    );
  }
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-why-bodies--mob
  .airo-qf-block5-why-mob-line {
  display: block;
  width: 100%;
  text-align: justify;
  text-align-last: start;
  line-height: 1.45;
  margin: 0 0 0.2em 0;
  max-width: 100%;
  box-sizing: border-box;
  white-space: normal;
  letter-spacing: 0.01em;
  hyphens: auto;
  -webkit-hyphens: auto;
  overflow-wrap: break-word;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-why-bodies--mob
  .airo-qf-block5-linegroup
  .airo-qf-block5-why-mob-line:last-child {
  margin-bottom: 0;
}

@media (min-width: 829px) {
  /* Деск. первая рамка: заголовок «Почему…» в одну строку по центру */
  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-card--why
    .airo-qf-block5-hug
    .airo-qf-block5-card__title,
  body.airo-course-welcome-quickfit-page .airo-qf-block5-why-title--desk {
    text-align: center;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-why-title--desk {
    white-space: nowrap;
  }
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-linegroup {
  margin: 0 0 calc(0.65em * var(--airo-qf-block5-scale, 1.3)) 0;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-linegroup:last-child {
  margin-bottom: 0;
}

/* «Что тебя ждёт»: одна фраза = одна строка (без переноса), неон-точка слева; узко на моб. — перенос разрешён */
body.airo-course-welcome-quickfit-page .airo-qf-block5-what-lines {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: left;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-what-lines__line {
  position: relative;
  margin: 0 0 calc(0.42em * var(--airo-qf-block5-scale, 1.3)) 0;
  padding: 0 0 0 calc(1.05em * var(--airo-qf-block5-scale, 1.3));
  line-height: 1.4;
  white-space: nowrap;
  text-align: left;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-what-lines__line:last-child {
  margin-bottom: 0;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-what-lines__line::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.38em;
  width: 0.42em;
  height: 0.42em;
  border-radius: 50%;
  background: radial-gradient(
    circle at 30% 25%,
    #e8ffff 0%,
    #6ec5ff 45%,
    #3a8cc8 100%
  );
  box-shadow:
    0 0 0 0.5px rgba(200, 250, 255, 0.85),
    0 0 6px 2px rgba(110, 200, 255, 0.5),
    0 1px 0 rgba(255, 255, 255, 0.35) inset,
    0 4px 10px -1px rgba(50, 180, 255, 0.55);
}

/* Последняя строка: «Подходит» — как основной текст; хвост — голубой */
body.airo-course-welcome-quickfit-page
  .airo-qf-block5-what-lines__line--accent {
  color: #ffffff;
  font-weight: 400;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-what-lines__line--accent
  .airo-qf-block5-what-lines__accent-tail {
  color: #7dd3ff;
  font-weight: 600;
  text-shadow: 0 0 12px rgba(110, 200, 255, 0.25);
}

@media (max-width: 720px) {
  body.airo-course-welcome-quickfit-page .airo-qf-block5-what-lines__line {
    white-space: normal;
  }
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-steps {
  margin: calc(0.15em * var(--airo-qf-block5-scale, 1.3)) 0 0 0;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-step {
  margin: 0 0 calc(0.55em * var(--airo-qf-block5-scale, 1.3)) 0;
  padding: 0;
  text-align: left;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-step:last-child {
  margin-bottom: 0;
}

/* Текст в RU/EN в капсе в json — без text-transform: uppercase, иначе движок
 * «докапсит» снова. В капсе Neuro/webkit режет низ «?»; «?» вынесен в .airo-qf-block5-title__qm. */
body.airo-course-welcome-quickfit-page .airo-qf-block5-card__title {
  margin: 0 0 calc(0.62em * var(--airo-qf-block5-scale, 1.3)) 0;
  font-family: var(--font-headings, "neuro", sans-serif);
  font-weight: 600;
  font-size: calc(
    var(--airo-qf-block5-scale, 1.3) * clamp(0.72rem, 0.38rem + 0.4vw, 0.9rem)
  );
  line-height: 1.55;
  letter-spacing: 0.05em;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
  color: #8ee0ff;
  overflow: visible;
  padding: 0.1em 0 0.28em 0;
  box-sizing: border-box;
  max-width: 100%;
  -webkit-font-smoothing: antialiased;
}

/* «?» в капсе Neuro (webkit) обрезает низ; символ в Montserrat — без обрезки. */
body.airo-course-welcome-quickfit-page
  .airo-qf-block5-card__title
  .airo-qf-block5-title__qm,
body.airo-course-welcome-quickfit-page
  .airo-qf-block5-card__sub
  .airo-qf-block5-title__qm {
  font-family: var(--font-main, "Montserrat", sans-serif);
  font-weight: 700;
  letter-spacing: 0.02em;
  color: inherit;
  text-shadow: inherit;
}

/* CTA подзаголовок: 829+ одна строка; ≤828 — две, без лишнего зазора между ними */
body.airo-course-welcome-quickfit-page .airo-qf-block5-cta-sub--desk {
  display: none;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-cta-sub--mob {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page .airo-qf-block5-cta-sub--desk {
    display: block;
    width: 100%;
    max-width: 100%;
    text-align: center;
    white-space: nowrap;
    line-height: 1.3;
    box-sizing: border-box;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-cta-sub--mob {
    display: none;
  }
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-cta-block
  .airo-qf-block5-card__sub
  .airo-qf-block5-cta-sub--mob
  .airo-qf-block5-cta-sub__l1,
body.airo-course-welcome-quickfit-page
  .airo-qf-block5-cta-block
  .airo-qf-block5-card__sub
  .airo-qf-block5-cta-sub--mob
  .airo-qf-block5-cta-sub__l2 {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
  text-align: center;
  font-size: 1em;
  line-height: 1.18;
  box-sizing: border-box;
  overflow-wrap: normal;
  word-wrap: normal;
  margin: 0;
  padding: 0;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-cta-block
  .airo-qf-block5-card__sub
  .airo-qf-block5-cta-sub--mob
  .airo-qf-block5-cta-sub__l2 {
  margin-top: 0.04em;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-card--span
  .airo-qf-block5-card__title {
  text-align: center;
  margin-bottom: calc(0.68em * var(--airo-qf-block5-scale, 1.3));
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-card--what
  .airo-qf-block5-card__title {
  text-align: center;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-card__sub {
  margin: calc(0.6em * var(--airo-qf-block5-scale, 1.3)) 0
    calc(0.45em * var(--airo-qf-block5-scale, 1.3)) 0;
  font-family: var(--font-headings, "neuro", sans-serif);
  font-weight: 600;
  font-size: calc(
    var(--airo-qf-block5-scale, 1.3) * clamp(0.78rem, 0.35rem + 0.45vw, 0.95rem)
  );
  line-height: 1.48;
  letter-spacing: 0.02em;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.45);
  color: #8ee0ff;
  overflow: visible;
  padding: 0 0 0.12em 0;
  box-sizing: border-box;
  max-width: 100%;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-card__body {
  margin: 0;
  font-size: calc(
    var(--airo-qf-block5-scale, 1.3) * clamp(0.78rem, 0.22rem + 0.7vw, 0.9rem)
  );
  line-height: 1.45;
  letter-spacing: 0.01em;
  color: #ffffff;
  text-align: left;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
}

/* CTA: на всю ширину карточки; max-content + flex давал смещение/вылет текста в Chromium (F12, Android) */
body.airo-course-welcome-quickfit-page .airo-qf-block5-cta-block {
  align-self: stretch;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  text-align: left;
  font-size: 1.06em;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-cta-block
  .airo-qf-block5-card__body.airo-qf-block5-card__body--intro {
  text-align: left;
  max-width: none;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: calc(
    var(--airo-qf-block5-cta-after-intro, 1.4em) * var(--airo-qf-block5-scale, 1.3)
  );
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-cta-block
  .airo-qf-block5-card__sub {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  text-align: center;
  width: 100%;
  min-width: 0;
  margin-top: 0;
  margin-bottom: calc(0.45em * var(--airo-qf-block5-scale, 1.3));
  font-size: calc(
    var(--airo-qf-block5-scale, 1.3) * clamp(0.92rem, 0.42rem + 0.75vw, 1.1rem)
  );
  line-height: 1.28;
  letter-spacing: 0.05em;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.45);
  /* Горизонталь — у рамки (.airo-qf-block5-card); не дублировать боковой padding (инаже уже теснее + вылет) */
  padding: 0.08em 0 0.12em 0;
  overflow: visible;
  max-width: 100%;
  box-sizing: border-box;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-cta-block
  .airo-qf-block5-card__body.airo-qf-block5-card__body--closing {
  text-align: left;
  max-width: none;
  width: 100%;
  margin: calc(0.6em * var(--airo-qf-block5-scale, 1.3)) 0 0 0;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-cta-block
  .airo-qf-block5-steps {
  max-width: none;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  text-align: left;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-cta-block
  .airo-qf-block5-step {
  text-align: left;
  font-size: 1.05em;
  line-height: 1.42;
}

/* Появление снизу при скролле (5-й блок QuickFit, один раз на элемент) */
body.airo-course-welcome-quickfit-page .airo-qf-block5-scroll-anim {
  overflow: visible;
  opacity: 0;
  transform: translateY(40px);
  will-change: opacity, transform;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-block5-scroll-anim.airo-qf-block5-scroll-anim--visible {
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 0.9s ease-out,
    transform 0.9s ease-out;
  will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
  body.airo-course-welcome-quickfit-page .airo-qf-block5-scroll-anim,
  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-scroll-anim.airo-qf-block5-scroll-anim--visible {
    opacity: 1;
    transform: none;
    transition: none;
    will-change: auto;
  }
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-card__body p {
  margin: 0 0 0.75em 0;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-card__body p:last-child {
  margin-bottom: 0;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-list {
  margin: 0;
  padding: 0 0 0 1.1em;
  list-style: disc;
  color: #ffffff;
  font-size: inherit;
  line-height: 1.5;
  text-align: left;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-list li {
  margin-bottom: 0.45em;
  padding-left: 0.15em;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-list li:last-child {
  margin-bottom: 0;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-list--steps {
  list-style: decimal;
  padding-left: 1.35em;
  margin: 0.2em 0 0 0;
}

body.airo-course-welcome-quickfit-page .airo-qf-block5-list--steps li {
  margin-bottom: 0.5em;
}

/* Масштаб блока 4: только 829+; блок 5 — без увеличения (компакт на десктопе) */
@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page .airo-qf-block4-inner {
    zoom: 1.495;
  }
}

/* Как h2 третьего блока (airo-qf-trust / airo-qf-trust-title-center) */
body.airo-course-welcome-quickfit-page .airo-qf-mentor__title {
  margin: 0;
  padding: 0 1rem;
  box-sizing: border-box;
  text-align: center;
  font-family: var(--font-headings, "neuro", sans-serif);
  font-weight: 400;
  font-size: calc(1.1 * clamp(1rem, 3.6vw, 34px));
  line-height: 1.2;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-shadow:
    0 1px 2px rgba(0, 0, 0, 0.8),
    0 0 22px rgba(0, 0, 0, 0.45);
  color: #fff;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__title-tvoy {
  color: #fff;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__title-mentor {
  color: #7dd3ff;
}

/* Ряд: узкая рамка с текстом + компактное фото с неоном; плотный зазор, группа к центру */
body.airo-course-welcome-quickfit-page .airo-qf-mentor__row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  min-width: 0;
  gap: clamp(0.4rem, 0.8vw, 0.7rem);
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__col--text {
  flex: 1 1 auto;
  max-width: min(52rem, 100%);
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__col--photo {
  flex: 0 0 min(180px, 26vw);
  width: min(180px, 26vw);
  max-width: 180px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  /* место для неона за контуром */
  padding: 6px 8px 10px 6px;
  box-sizing: content-box;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__lead {
  margin: 0 0 clamp(0.65rem, 1.1vh, 0.9rem);
  width: 100%;
  max-width: 100%;
  align-self: stretch;
  box-sizing: border-box;
  font-family: var(--font-main, "Montserrat", sans-serif);
  font-size: calc(1.15 * clamp(0.9rem, 0.3rem + 1.1vw, 1.05rem));
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #8fe5ff;
  text-align: left;
  word-break: normal;
  -webkit-hyphens: none;
  hyphens: none;
  overflow-wrap: break-word;
  text-wrap: pretty;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__textbox {
  width: 100%;
  max-width: 100%;
  align-self: stretch;
  box-sizing: border-box;
  border: 1px solid rgba(120, 210, 255, 0.88);
  border-radius: 0;
  padding: clamp(0.9rem, 1.5vw, 1.2rem) clamp(1rem, 1.8vw, 1.35rem);
  background: transparent;
  /* Блок абзацев по центру рамки; сами строки — по левому краю (см. .body-parts) */
  text-align: center;
}

/* Сегмент; inline-block + text-align: left — узкий столбик текста визуально по центру рамки */
body.airo-course-welcome-quickfit-page .airo-qf-mentor__body-parts {
  display: inline-block;
  max-width: 100%;
  min-width: 0;
  text-align: left;
  vertical-align: top;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__part {
  margin: 0 0 0.75em;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__part:last-child {
  margin-bottom: 0;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__textbox p.airo-qf-mentor__seg {
  margin: 0 0 0.15em;
  font-family: var(--font-main, "Montserrat", sans-serif);
  font-size: calc(1.15 * clamp(0.9rem, 0.3rem + 1.05vw, 1.02rem));
  line-height: 1.55;
  font-weight: 400;
  color: #fff;
  text-align: left;
  word-break: normal;
  -webkit-hyphens: none;
  hyphens: none;
  overflow-wrap: normal;
  text-wrap: wrap;
  padding: 0;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__textbox p.airo-qf-mentor__seg:last-child {
  margin-bottom: 0;
}

body.airo-course-welcome-quickfit-page
  .airo-qf-mentor__textbox
  p.airo-qf-mentor__seg.airo-qf-mentor__accent-line {
  color: #7dd3ff;
  font-weight: 500;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__accent-line {
  color: #7dd3ff;
  font-weight: 500;
}

/* Голубая строка-перечисление одной визуальной линией (на узком — перенос без гориз. скролла) */
body.airo-course-welcome-quickfit-page .airo-qf-mentor__accent--singleline {
  display: block;
  white-space: nowrap;
  overflow-x: auto;
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page .airo-qf-mentor__accent--singleline {
    white-space: normal;
    overflow-x: visible;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__textbox p.airo-qf-mentor__seg {
    overflow-wrap: break-word;
  }
}

/* Склейка «AI‑тренер», цифр+ед. измер. — без тире/переноса на одну букву */
body.airo-course-welcome-quickfit-page .airo-qf-mentor__nowrap {
  white-space: nowrap;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__frame {
  position: relative;
  flex: 0 0 auto;
  width: 100%;
  aspect-ratio: 2 / 3;
  min-height: 0;
  max-height: min(50vh, 300px);
  border: none;
  outline: none;
  border-radius: 0;
  overflow: hidden;
  background: #080808;
  display: flex;
  flex-direction: column;
  /* Без рамки — только мягкое неоновое свечение */
  box-shadow:
    0 0 10px 2px rgba(120, 210, 255, 0.24),
    0 0 24px 6px rgba(60, 180, 255, 0.14),
    0 0 42px 12px rgba(40, 150, 255, 0.09);
}

/* Исходник: зеркалим, чтобы в композиции смотрел в сторону текста (как на рефе) */
body.airo-course-welcome-quickfit-page .airo-qf-mentor__mirror {
  display: block;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  height: 100%;
  transform: scaleX(-1);
  transform-origin: center center;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: center 18%;
}

/* Третий экран QuickFit: «Твоё доверие…» — слой поверх двух анимированных icon-shar */
body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--shar-dual .airo-course-welcome-shar-dual {
  z-index: 0;
}

body.airo-course-welcome-quickfit-page .airo-qf-trust-section--over-shar {
  /* одна ось: середина h2 = середина зазора между колонками (та же max-width, что и у .airo-qf-trust-grid) */
  --airo-qf-trust-content-max: min(1240px, 100%);
  position: absolute;
  inset: 0;
  z-index: 5;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  background: transparent;
  padding: clamp(1.25rem, 3.5vh, 2rem) clamp(0.75rem, 2.2vw, 1.5rem) clamp(1.25rem, 3.5vh, 2.25rem);
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  display: flex;
  flex-direction: column;
  align-items: center;
  /* весь контент (h2 + сетка) — по вертикали по центру окна сцены; safe — при длинном тексте + scroll не обрезать сверху */
  justify-content: center;
  justify-content: safe center;
  min-height: 100%;
  pointer-events: auto;
}

/* Стили h2#airoQfTrustHeading — в airo-course-welcome-quickfit.html, <style id="airo-qf-trust-title-center"> после airo-course-shell (Grid + !important). */
body.airo-course-welcome-quickfit-page .airo-qf-trust-section--over-shar .airo-qf-trust-title-outer {
  display: block;
  flex: 0 0 auto;
  align-self: stretch;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/*
 * Десктоп: поднять заголовок третьего экрана.
 * — translateY(7%) даёт 7% от высоты самой обёртки (узкой) — почти не видно.
 * — секция с justify-content:center вертикально центрирует колонку «заголовок + сетка» целиком.
 * Делаем заметный сдвиг: rem + доля 7vh (≈ «7% высоты окна» по ощущению) + vh, без сдвига сетки в потоке.
 */
@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page .airo-qf-trust-section--over-shar .airo-qf-trust-title-outer {
    position: relative;
    z-index: 2;
    transform: translateY(calc(-0.6rem - 0.2 * 7vh - 1.4vh - 0.1vw));
  }
}

body.airo-course-welcome-quickfit-page .airo-qf-trust-section--over-shar .airo-qf-trust-grid {
  align-self: stretch;
  min-width: 0;
}

/* 1fr 1fr: середина — по gap. Один набор --airo-qf-trust-* для обеих карточек: укрупнение сразу и выравнивание вертикалей. */
body.airo-course-welcome-quickfit-page .airo-qf-trust-grid {
  /* +10% к прежнему (+10%): карточки; ещё +10% отступ h2 — см. airo-course-welcome-quickfit.html (margin h2) */
  --airo-qf-trust-pad-y: clamp(1.33rem, 2.25vh, 2rem);
  --airo-qf-trust-pad-tight: clamp(0.79rem, 1.28vw, 1.16rem);
  --airo-qf-trust-pad-outer: clamp(1.45rem, 2vw, 1.87rem);
  --airo-qf-trust-font: clamp(1.16rem, 0.6rem + 1.09vw, 1.4rem);
  --airo-qf-trust-lh: 1.82;
  --airo-qf-trust-p-gap: 0.85em;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: min-content;
  gap: clamp(1.54rem, 3.4vw, 3.02rem);
  width: 100%;
  max-width: var(--airo-qf-trust-content-max, min(1240px, 100%));
  margin: 0 auto;
  align-items: start;
  align-content: start;
  box-sizing: border-box;
}

/* Моб. варианты третьего блока (текст из *_m_html) — по умолчанию скрыты, см. @media max-width 828px */
body.airo-course-welcome-quickfit-page .airo-qf-trust-mobile-bundled {
  display: none;
}

/* Моб. текст блока 4 (body_m_html) — по умолчанию скрыт, см. @media max-width 828px */
body.airo-course-welcome-quickfit-page .airo-qf-mentor-mobile-bundled {
  display: none;
}

body.airo-course-welcome-quickfit-page .airo-qf-mentor__textbox--stack {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  min-width: 0;
}

body.airo-course-welcome-quickfit-page .airo-qf-trust-rama {
  position: relative;
  z-index: 0;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  /* ячейка 1fr: полная ширина колонки, та же величина, что и у .hairline */
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  min-height: min-content;
  height: max-content;
  align-self: stretch;
  justify-self: stretch;
  box-sizing: border-box;
  /* как у .hairline (1px), чтобы верхние кромки и начало текста выровнялись */
  border: 1px solid transparent;
  border-radius: 2px;
  overflow: hidden;
}

body.airo-course-welcome-quickfit-page .airo-qf-trust-rama__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url('../assets/images/icon-rama.png') center / cover no-repeat;
  pointer-events: none;
}

body.airo-course-welcome-quickfit-page .airo-qf-trust-rama__content {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  align-self: stretch;
  min-height: 0;
  height: auto;
  max-height: none;
  overflow-x: hidden;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
  /* T R B L: те же --airo-qf-trust-* что и у hairline; «внешний» и «тот что ближе к зазору» — одинаковые величины */
  padding: var(--airo-qf-trust-pad-y) var(--airo-qf-trust-pad-tight) var(--airo-qf-trust-pad-y)
    var(--airo-qf-trust-pad-outer);
  color: #0f1419;
  font-family: var(--font-main, 'Montserrat', sans-serif);
  font-size: var(--airo-qf-trust-font);
  line-height: var(--airo-qf-trust-lh);
  font-weight: 500;
  text-align: left;
  text-wrap: pretty;
  overflow-wrap: break-word;
  word-wrap: break-word;
  max-width: 100%;
  width: 100%;
  min-width: 0;
  margin: 0;
  letter-spacing: 0.01em;
}

body.airo-course-welcome-quickfit-page .airo-qf-trust-rama__content p {
  margin: 0 0 var(--airo-qf-trust-p-gap, 0.77em);
}

body.airo-course-welcome-quickfit-page .airo-qf-trust-rama__content p:last-child {
  margin-bottom: 0;
}

body.airo-course-welcome-quickfit-page .airo-qf-trust-hairline {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  box-sizing: border-box;
  min-height: min-content;
  min-width: 0;
  height: max-content;
  width: 100%;
  max-width: 100%;
  padding: var(--airo-qf-trust-pad-y) var(--airo-qf-trust-pad-tight) var(--airo-qf-trust-pad-y)
    var(--airo-qf-trust-pad-outer);
  background: #1f1f1f;
  color: #bbecff;
  border: 1px solid rgba(187, 236, 255, 0.4);
  border-radius: 2px;
  font-family: var(--font-main, 'Montserrat', sans-serif);
  font-size: var(--airo-qf-trust-font);
  line-height: var(--airo-qf-trust-lh);
  font-weight: 500;
  align-self: stretch;
  justify-self: stretch;
  text-align: left;
  text-wrap: pretty;
  overflow-wrap: break-word;
  word-wrap: break-word;
  letter-spacing: 0.01em;
}

body.airo-course-welcome-quickfit-page .airo-qf-trust-hairline p {
  margin: 0 0 var(--airo-qf-trust-p-gap, 0.77em);
  color: inherit;
  max-width: 100%;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

body.airo-course-welcome-quickfit-page .airo-qf-trust-hairline p:last-child {
  margin-bottom: 0;
}

/* Моб. третий экран (как QuickFit — 828px): h2+сетка; скролл — у .right_col, не у оверлея (см. override после .hero--shar-dual в базе) */
@media (max-width: 828px) {
  /* Контент чуть ниже от верхнего края; футер сцены — без min 100dvh, см. .hero--shar-dual */
  body.airo-course-welcome-quickfit-page .airo-qf-trust-section--over-shar {
    align-items: center;
    /* чуть ниже от верхнего края панели / safe-area */
    padding-top: max(env(safe-area-inset-top, 0px), clamp(1.3rem, 3.6vh, 2.1rem));
    /* низ: +4% окна (было +7%, −3 п.п.) */
    padding-bottom: max(
      env(safe-area-inset-bottom, 0px),
      calc(0.25rem + 4dvh)
    );
    padding-left: max(env(safe-area-inset-left, 0px), clamp(0.55rem, 3.5vw, 0.9rem));
    padding-right: max(env(safe-area-inset-right, 0px), clamp(0.55rem, 3.5vw, 0.9rem));
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: visible;
    position: relative;
    inset: auto;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    flex: 0 0 auto;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    justify-content: flex-start;
  }

  /* общая «полоса» контента: заголовок и обе карточки с совпадающими боковыми линиями */
  body.airo-course-welcome-quickfit-page .airo-qf-trust-section--over-shar,
  body.airo-course-welcome-quickfit-page .airo-qf-trust-section--over-shar .airo-qf-trust-title-outer {
    --airo-qf-trust-mob-band: min(30rem, 96vw);
  }

  body.airo-course-welcome-quickfit-page .airo-qf-trust-section--over-shar .airo-qf-trust-title-outer {
    width: 100%;
    max-width: var(--airo-qf-trust-mob-band, min(30rem, 96vw));
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    overflow: visible;
    box-sizing: border-box;
    padding-left: 0;
    padding-right: 0;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-trust-grid {
    grid-template-columns: 1fr;
    justify-items: stretch;
    width: 100%;
    max-width: var(--airo-qf-trust-mob-band, min(30rem, 96vw));
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    row-gap: clamp(0.55rem, 1.4vh, 0.75rem);
    /* симметрия L/R: одна цифра к полям текста, без T/R/B/L-перекоса */
    --airo-qf-trust-pad-y: clamp(0.8rem, 1.35vh, 1.05rem);
    --airo-qf-trust-pad-x: clamp(0.72rem, 2.6vw, 1rem);
    --airo-qf-trust-pad-tight: var(--airo-qf-trust-pad-x);
    --airo-qf-trust-pad-outer: var(--airo-qf-trust-pad-x);
    --airo-qf-trust-font: clamp(1rem, 0.32rem + 2.75vw, 1.12rem);
    --airo-qf-trust-lh: 1.5;
    --airo-qf-trust-p-gap: 0.6em;
    gap: clamp(0.5rem, 1.2vh, 0.7rem);
  }

  body.airo-course-welcome-quickfit-page .airo-qf-trust-section--over-shar .airo-qf-trust-title-outer,
  body.airo-course-welcome-quickfit-page .airo-qf-trust-section--over-shar .airo-qf-trust-grid {
    flex: 0 0 auto;
  }

  /* Две рамки — строго одна ширина = колонка сетки; кромки квадрата совпадают */
  body.airo-course-welcome-quickfit-page .airo-qf-trust-rama,
  body.airo-course-welcome-quickfit-page .airo-qf-trust-hairline {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-trust-rama {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }

  /* max-content (десктоп) сбрасываем: текст на полную ширину колонки, симм. T/R/B/L-pad — от --pad-tight/--pad-outer на сетке */
  body.airo-course-welcome-quickfit-page .airo-qf-trust-rama__content,
  body.airo-course-welcome-quickfit-page .airo-qf-trust-hairline {
    min-width: 0;
    display: block;
    width: 100%;
    max-width: 100%;
    align-self: stretch;
    box-sizing: border-box;
    text-align: left;
    overflow-x: hidden;
    overflow-wrap: break-word;
    word-wrap: break-word;
    padding-bottom: calc(var(--airo-qf-trust-pad-y) * 0.75);
  }

  body.airo-course-welcome-quickfit-page .airo-qf-trust-rama__content p,
  body.airo-course-welcome-quickfit-page .airo-qf-trust-hairline p {
    text-align: left;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0 0 var(--airo-qf-trust-p-gap, 0.6em) 0;
    box-sizing: border-box;
    overflow-wrap: break-word;
    word-wrap: break-word;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-trust-rama__content p:last-child,
  body.airo-course-welcome-quickfit-page .airo-qf-trust-hairline p:last-child {
    margin-bottom: 0;
  }

  /* Третий блок: на моб. — отдельная вёрстка строк (см. *_m_html), на десктопе — прежние <br> */
  body.airo-course-welcome-quickfit-page .airo-qf-trust-rama__copy--desktop,
  body.airo-course-welcome-quickfit-page .airo-qf-trust-hairline__copy--desktop {
    display: none !important;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-trust-mobile-bundled {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  /* Блок 4: на моб. — вёрстка с переносами (body_m_html), десктоп — прежняя */
  body.airo-course-welcome-quickfit-page .airo-qf-mentor__body-wrap--desktop {
    display: none !important;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor-mobile-bundled {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  /* Строки из *_m_html — без nowrap и без гориз. скролла; перенос внутри рамки */
  body.airo-course-welcome-quickfit-page .airo-qf-trust-mline {
    display: block;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: break-word;
    word-wrap: break-word;
  }

  /* icon-rama — гориз. полоса: cover на высоком блоке даёт визуальный «ковёр» внизу; якорь по верху + меньше нижн. паддинг у текста */
  body.airo-course-welcome-quickfit-page .airo-qf-trust-rama__bg {
    background-position: top center;
  }
}

/* Робот (829+ десктоп-сцена QuickFit): внизу слева, scale; обёртка не видна в раскладке */
body.airo-course-welcome-quickfit-page .airo-course-welcome-robo-sleva {
  position: absolute;
  left: calc(clamp(12px, 4vw, 40px) + 15%);
  bottom: calc(env(safe-area-inset-bottom, 0px) + clamp(6px, 1.5vh, 16px));
  z-index: 4;
  display: block;
  width: auto;
  height: auto;
  max-height: min(88vh, 88dvh, calc(100dvh - 56px));
  max-width: min(65vw, 520px);
  object-fit: contain;
  object-position: left bottom;
  transform: scale(1.21);
  transform-origin: left bottom;
  pointer-events: none;
  user-select: none;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sprava {
  /* Фикс. высота = колонка; flex — сетка текста + ноутбука; overflow:hidden — без вылетов в скролл */
  display: flex;
  flex-direction: column;
  background-image: url('../assets/images/icon-sprava-shar.png');
  isolation: isolate;
  height: var(--airo-course-quickfit-hero-minh);
  min-height: var(--airo-course-quickfit-hero-minh);
  max-height: var(--airo-course-quickfit-hero-minh);
  overflow: hidden;
}

@supports (height: 1cqh) {
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sprava,
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--shar-dual,
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--qf-block4 {
    height: 100cqh;
    min-height: 100cqh;
    max-height: 100cqh;
  }

  /* Моб.: сцены 2–4 — без 100cqh (на телефоне .right_col без container-type:size; см. max-width:828) */
  @media (max-width: 828px) {
    body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--shar-dual,
    body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--qf-block4 {
      height: auto;
      min-height: 0;
      max-height: none;
    }

    body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sprava {
      height: var(--airo-course-quickfit-hero-minh);
      min-height: var(--airo-course-quickfit-hero-minh);
      max-height: var(--airo-course-quickfit-hero-minh);
    }
  }
}

/* Третий экран QuickFit: #0e0e0e + два icon-shar слева/справа, floatBall по кругу */
body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--shar-dual {
  position: relative;
  background-color: #0e0e0e;
  background-image: none;
  isolation: isolate;
  height: var(--airo-course-quickfit-hero-minh);
  min-height: var(--airo-course-quickfit-hero-minh);
  max-height: var(--airo-course-quickfit-hero-minh);
  overflow: hidden;
}

/* ≤828: сцена 3 = высота контента, без пустоты «стеллажа» внизу; скролл у .right_col */
@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--shar-dual {
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    /* воздух до блока 4, иначе сцены сливаются */
    margin-bottom: clamp(0.65rem, 1.85vh, 1.1rem);
  }
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-shar-dual {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  min-height: inherit;
  pointer-events: none;
  user-select: none;
}

/* моб.: слой шаров = высота секции (контент), не фикс. 100dvh — иначе пусто снизу */
@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--shar-dual
    .airo-course-welcome-shar-dual {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    min-height: 100%;
  }
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-shar-dual__shell {
  position: absolute;
  bottom: clamp(-260px, -30vw, -190px);
  width: min(1120px, 220vw);
  max-width: none;
  z-index: 1;
  line-height: 0;
  pointer-events: none;
  user-select: none;
}

/* Чуть мельче, к краям — центр сцены остаётся «чистым» #0e0e0e */
body.airo-course-welcome-quickfit-page .airo-course-welcome-shar-dual__shell--left {
  left: clamp(-360px, -42vw, -240px);
  right: auto;
  transform: translateX(0);
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-shar-dual__shell--right {
  right: clamp(-360px, -42vw, -240px);
  left: auto;
  transform: translateX(0);
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-shar-dual__flip {
  line-height: 0;
  width: 100%;
  transform: scaleX(-1);
  transform-origin: center center;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-shar-dual__ball {
  display: block;
  width: 100%;
  height: auto;
  opacity: 0.6;
  animation: floatBall 3.5s linear infinite;
}

@keyframes airoCourseNoutFloat {
  0%,
  100% {
    transform: translate3d(0, 0, 0);
  }

  /* 2.5s цикл (то же 1.5:2): ~1.07s вверх, ~1.43s вниз — пик 1.5/3.5 = 42.86% */
  42.86% {
    transform: translate3d(0, -10px, 0);
  }
}

/* Второй экран QuickFit: текст в «волосовой» рамке + ноутбук (icon-nout), шар не используем */
body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sprava .airo-course-online-chat-ball-shell {
  display: none !important;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-layout {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.18fr);
  align-items: center;
  justify-items: stretch;
  column-gap: clamp(0.75rem, 2.4vw, 2.25rem);
  row-gap: 0;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: clamp(0.5rem, 1.4vh, 1.25rem) clamp(0.85rem, 2.4vw, 2.6rem) clamp(0.45rem, 1.2vh, 1.1rem);
}

/* Grid: иначе min-content ячеек раздувал колонку и текст наезжал на ноут */
body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-layout > * {
  min-width: 0;
}

/* Блок рамки по центру колонки; текст внутри — только влево, все строки с одного края */
body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-text-col {
  align-self: center;
  justify-self: center;
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-hairline-frame {
  border: 1px solid rgba(160, 225, 243, 0.5);
  box-shadow:
    0 0 1px rgba(160, 225, 243, 0.6),
    0 0 18px rgba(100, 195, 255, 0.14);
  padding: clamp(0.95rem, 1.9vh, 1.35rem) clamp(1.05rem, 2.2vw, 1.4rem);
  color: #f0f4f8;
  font-family: var(--font-main, 'Montserrat', sans-serif);
  font-size: clamp(0.88rem, 0.15rem + 1.05vw, 1.04rem);
  font-weight: 500;
  line-height: 1.52;
  text-align: start;
  box-sizing: border-box;
  width: fit-content;
  max-width: min(42em, 100%);
  background: rgba(8, 12, 18, 0.45);
  backdrop-filter: blur(4px);
  word-break: normal;
  overflow-wrap: break-word; /* на моб. с фикс. строками перебивается в @media max-width 991 */
}

@media (min-width: 829px) {
  /* Рамка сдвигается вверх (position + top); иначе overflow:hidden hero режет рамку / scaled-текст */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sprava {
    overflow: visible;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-sprava-hairline-frame
    br.airo-sprava-br--mobile-only {
    display: none;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-hairline-frame {
    padding: clamp(1.1rem, 2.2vh, 1.7rem) clamp(1.2rem, 2.6vw, 1.9rem);
    transform: scale(1.728); /* 1.2³: три шага +20% */
    transform-origin: left center;
  }

  /* Рамка с текстом: сдвиг без смены размеров (position: relative от ячейки сетки) */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-text-col {
    position: relative;
    left: calc(20% - 9% - 15% + 5%);
    top: calc(-15% - 12px);
  }

  /* icon-nout: ещё −10% влево (итого −30%); размер ×1.38×1.2; transform на img — не трогает float-анимацию */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-nout {
    transform: translateX(-30%) scale(1.656);
    transform-origin: right center;
  }
}

/* Моб. копия в обёртке: на десктопе скрыта целиком (для общей ширины колонок на моб.) */
body.airo-course-welcome-quickfit-page .airo-sprava-mobile-bundled {
  display: none;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-hairline-frame p.airo-sprava-copy {
  text-align: start;
  width: 100%;
  max-width: 100%;
  margin: 0 0 0.95em;
  box-sizing: border-box;
  hyphens: none;
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-sprava-hairline-frame
  p.airo-sprava-copy--desktop:nth-of-type(2) {
  margin-bottom: 0;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-laptop-col {
  align-self: center;
  justify-self: end;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  max-width: 100%;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-laptop-float {
  width: 100%;
  max-width: min(100%, 760px);
  line-height: 0;
  animation: airoCourseNoutFloat 2.5s ease-in-out infinite;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-nout {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 72vh;
  max-height: min(68cqh, 72vh);
  object-fit: contain;
  object-position: right center;
  pointer-events: none;
  user-select: none;
}

@media (prefers-reduced-motion: reduce) {
  body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-laptop-float {
    animation: none !important;
  }
}

@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page .airo-sprava-copy--desktop {
    display: none !important;
  }

  /* Оба моб. абзаца в одной «колонке» — одна левая граница для всех 10 строк; колонка по центру рамки */
  body.airo-course-welcome-quickfit-page
    .airo-sprava-mobile-bundled {
    display: block;
    width: max-content;
    max-width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  body.airo-course-welcome-quickfit-page
    .airo-sprava-mobile-bundled
    p.airo-sprava-copy--mobile {
    display: block;
    text-align: start;
    width: 100%;
    margin: 0 0 0.95em;
    box-sizing: border-box;
  }

  body.airo-course-welcome-quickfit-page
    .airo-sprava-mobile-bundled
    p.airo-sprava-copy--mobile:last-of-type {
    margin-bottom: 0;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-sprava-hairline-frame
    .airo-sprava-line {
    display: block;
    white-space: nowrap;
  }

  /* Колонка: текст → несжимаемый зазор (row-gap) → ноут на всю оставшуюся высоту; не перекрывает текст */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-layout {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    width: 100%;
    row-gap: clamp(0.9rem, 2.2dvh, 1.4rem);
    padding: max(0.35rem, env(safe-area-inset-top, 0px)) clamp(0.75rem, 3.5vw, 1.25rem)
      max(0.5rem, env(safe-area-inset-bottom, 0px));
  }

  /* Текст не растягивается, поверх низа сцены при стыковке (без залезания ноута) */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-text-col {
    position: relative;
    z-index: 2;
    justify-self: center;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    flex: 0 0 auto;
    flex-shrink: 0;
    box-sizing: border-box;
    margin-top: calc(5vh + 0.5rem);
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-hairline-frame {
    align-self: stretch;
    max-width: min(100%, 44rem);
    width: 100%;
    margin-inline: 0;
    font-size: clamp(1.02rem, 0.26rem + 2.85vw, 1.2rem);
    line-height: 1.62;
    padding-block: clamp(1.35rem, 3.4vh, 1.95rem);
    padding-inline: clamp(1rem, 3.8vw, 1.25rem);
    overflow-wrap: normal;
    word-wrap: normal;
    word-break: normal;
    hyphens: none;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
  }

  /* Резерва под float-анимацию (−10px), чтобы в пике не съедать визуальный зазор к тексту */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-laptop-col {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    width: 100%;
    margin-top: 0;
    padding-top: 10px;
    padding-bottom: max(0.25rem, env(safe-area-inset-bottom, 0px));
  }

  /* Заполняет оставшуюся высоту; без искусственного 22rem — крупнее при большом экране */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-laptop-float {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  /* 1200×800: вписывается в доступный flex-прямоугольник; object-fit: contain сохраняет пропорции */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-sprava-nout {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 100%;
    min-width: 0;
    min-height: 0;
    object-fit: contain;
    object-position: center center;
  }
}

/* Обёртка исчезает из вёрстки: картинка с absolute как раньше к позиции section */
@media (min-width: 829px) {
  body.airo-course-welcome-quickfit-page .airo-course-welcome-robo-sleva-wrap {
    display: contents;
  }
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-hero-inner {
  /* Выше робота (z-4/5), иначе весь блок с текстом рисуется *под* img — z внутри него не спасают */
  position: relative;
  z-index: 6;
  min-height: inherit;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: clamp(20px, 5vmin, 48px) clamp(14px, 4vw, 28px);
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
}

/* Первый экран: заголовок выше; рамка с текстом ниже и смещена вправо */
body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sleva .airo-course-welcome-hero-inner {
  justify-content: flex-start;
  align-items: stretch;
  padding-top: clamp(4px, 1.2vh, 14px);
  padding-bottom: clamp(20px, 5vmin, 48px);
}

/* Заголовок + рамка + текст под ней: +10% одним scale (с роботом не трогаем — он вне этой обёртки) */
body.airo-course-welcome-quickfit-page .airo-course-welcome-hero-title-frame {
  --welcome-title-frame-gap: clamp(40px, 4.5vh, 60px);
  --welcome-frame-pad-x: clamp(1.1rem, 2.4vw, 1.6rem);
  align-self: center;
  width: 100%;
  min-width: 0;
  max-width: min(38rem, 100%);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  box-sizing: border-box;
  padding: 0 clamp(10px, 2vw, 16px);
  position: relative;
  transform: scale(1.1);
  transform-origin: top center;
  z-index: 7;
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-hero-title-frame .airo-course-welcome-quickfit-title {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  font-size: calc(1.1 * clamp(1rem, 3.6vw, 34px));
}

/* Рамка + lede: правая колонка; scale от правого верха */
body.airo-course-welcome-quickfit-page .airo-course-welcome-hero-right-stack {
  align-self: flex-end;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  max-width: 100%;
  min-width: 0;
  width: min(100%, max-content);
  box-sizing: border-box;
  margin-top: calc(var(--welcome-title-frame-gap) + 7vh);
  position: relative;
  left: calc(85% + 10% - 37%);
  z-index: 6;
  transform: scale(1.354);
  transform-origin: top right;
}

/* Рамка: flex убирает круг max-content/100% и даёт p на всю ширину content-box — центрирование симметрично по бокам */
body.airo-course-welcome-quickfit-page .airo-course-welcome-frame {
  display: inline-flex;
  flex-direction: column;
  align-items: stretch;
  width: max-content;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  padding-top: clamp(1.2rem, 2.3vh, 1.8rem);
  padding-bottom: clamp(1.05rem, 1.9vh, 1.45rem);
  padding-inline: var(--welcome-frame-pad-x, 1.2rem);
  border: 1px solid rgba(160, 225, 243, 0.95);
  border-radius: 3px;
  box-sizing: border-box;
  position: relative;
  overflow: visible;
  background: rgba(0, 0, 0, 0.2);
  box-shadow:
    0 0 4px rgba(160, 225, 243, 0.45),
    0 0 16px rgba(100, 200, 255, 0.2),
    inset 0 0 0 1px rgba(160, 225, 243, 0.15);
  transform: translateY(-5vh);
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-frame-text {
  margin: 0;
  padding: 0.1em 0 0.12em;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  font-family: var(--font-main, 'Montserrat', sans-serif);
  font-weight: 600;
  /* Заголовок: до ~34px; подзаголовок в рамке — меньше */
  font-size: clamp(0.6rem, 1.9vw, 1.1rem);
  line-height: 1.4;
  /* letter-spacing даёт визуальный перекос; лёгкое сглаживание */
  letter-spacing: 0.02em;
  color: #a0e1f3;
  text-align: left;
  text-shadow:
    0 0 6px rgba(160, 225, 243, 0.95),
    0 0 12px rgba(100, 195, 255, 0.45);
  text-transform: none;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

/* Две строчки с одного левого уровня (как «общий» левый бардюр) */
body.airo-course-welcome-quickfit-page .airo-course-welcome-frame-line1,
body.airo-course-welcome-quickfit-page .airo-course-welcome-frame-line2 {
  display: block;
  width: 100%;
  min-width: 0;
  text-align: left;
  box-sizing: border-box;
}

/* Не сжимать длинные строки в overflow вправо: nowrap только на очень широком вью; иначе перенос */
@media (min-width: 1200px) {
  body.airo-course-welcome-quickfit-page .airo-course-welcome-frame-line1,
  body.airo-course-welcome-quickfit-page .airo-course-welcome-frame-line2 {
    white-space: nowrap;
  }
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-frame-line2 {
  margin-top: 0.3em;
}

/* Три строки: тот же зазор, что и заголовок → рамка; левый край текста = как у текста в рамке */
body.airo-course-welcome-quickfit-page .airo-course-welcome-lede-block {
  position: relative;
  z-index: 6;
  width: 100%;
  max-width: min(40rem, 100%);
  box-sizing: border-box;
  /* на 7% выше, ещё на 7%: ×0.93×0.93 (только margin, без искажения шрифтов) */
  margin: calc((var(--welcome-title-frame-gap) + 7vh) * 0.93 * 0.93) 0 0;
  padding: 0 0.25rem 0 var(--welcome-frame-pad-x, 1.2rem);
  font-family: var(--font-main, 'Montserrat', sans-serif);
  transform: translateY(-10vh);
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-lede-line {
  margin: 0;
  padding: 0;
  font-weight: 400;
  /* Крупнее, чем был — читабельный подрамочный абзац */
  font-size: clamp(0.95rem, 1.75vw, 1.12rem);
  line-height: 1.5;
  letter-spacing: 0.01em;
  color: #ffffff;
  text-align: left;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
}

body.airo-course-welcome-quickfit-page .airo-course-welcome-lede-line + .airo-course-welcome-lede-line {
  margin-top: 0.35em;
}

body.airo-course-welcome-quickfit-page
  .airo-course-welcome-lede-block
  .airo-course-welcome-lede-line:nth-of-type(2) {
  margin-top: 0.55em;
}

/* Моб. раскладка в рамке / lede — только в @media; на десктопе не показывать */
body.airo-course-welcome-quickfit-page .airo-course-welcome-frame-text--mobile,
body.airo-course-welcome-quickfit-page .airo-course-welcome-lede-mobile {
  display: none;
}

/* QuickFit: узкая колонка / мобилка — с 828px (829+ — десктопная композиция + --airo-qf-zoom) */
@media (max-width: 828px) {
  body.airo-course-welcome-quickfit-page .main_container > .right_col .airo-qf-scale-outer {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-scale-outer,
  body.airo-course-welcome-quickfit-page .airo-qf-scale-root#airoQfScaleRoot {
    zoom: 1 !important;
  }

  /*
   * Первый слайд (sleva): на границе со 2-м iOS залипал скролл.
   * — isolation: убираем отдельный слой (база isolate иначе даёт скачок на стыке).
   * — min-height: 100dvh в URL-bar iOS двигается при скролле → пересчёт высоты 1-го блока; 100svh + fallback 100dvh.
   * — touch-action: жест явно в вертикаль (не перехватывать как гориз. у декора).
   */
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--sleva {
    background-position: left top;
    isolation: auto;
    touch-action: pan-y pinch-zoom;
    min-height: max(
      12rem,
      calc(
        100dvh - var(--airo-course-header-offset) - var(--airo-course-burger-bar-height) -
          env(safe-area-inset-bottom, 0px)
      )
    );
    min-height: max(
      12rem,
      calc(
        100svh - var(--airo-course-header-offset) - var(--airo-course-burger-bar-height) -
          env(safe-area-inset-bottom, 0px)
      )
    );
  }

  /* Сцена 4: по высоте контента; прокрутка страницы у .right_col (без отдельного скролла внутри) */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--qf-block4 {
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    background-size: cover;
    background-position: left bottom;
    margin-bottom: clamp(0.5rem, 1.4vh, 0.85rem);
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--qf-block4 .airo-course-welcome-hero-inner {
    justify-content: flex-start;
    align-items: stretch;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
    padding-left: max(0.75rem, env(safe-area-inset-left, 0px), 3.2vw);
    padding-right: max(0.75rem, env(safe-area-inset-right, 0px), 3.2vw);
    padding-top: max(env(safe-area-inset-top, 0px), clamp(0.85rem, 3.2vh, 1.65rem));
    /* +3% динам. высоты к низу (воздух снизу) */
    padding-bottom: calc(
      max(0.75rem, env(safe-area-inset-bottom, 0px), 0.5rem) + 3dvh
    );
  }

  /* Заголовок ↔ нижний блок: заметный отступ, не «щель» */
  body.airo-course-welcome-quickfit-page .airo-qf-block4-inner {
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    gap: clamp(1rem, 2.8vh, 1.45rem) 0;
    row-gap: clamp(1rem, 2.8vh, 1.45rem);
    zoom: 1 !important;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block4-inner > .airo-qf-mentor__title {
    flex: 0 0 auto;
  }

  /* Рамка и фото — одна ширина; отступы между блоками сдержанные */
  body.airo-course-welcome-quickfit-page .airo-qf-mentor__row {
    --airo-qf-mentor-mob-w: min(100%, min(240px, 80vw));
    flex: 0 0 auto;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    width: 100%;
    max-width: min(32rem, 100%);
    margin-left: auto;
    margin-right: auto;
    gap: 0.85rem 0;
    row-gap: 0.85rem;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__col--text {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 0.7rem 0;
    row-gap: 0.7rem;
    max-width: 100%;
    width: 100%;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__col--photo {
    flex: 0 0 auto;
    align-self: center;
    width: var(--airo-qf-mentor-mob-w);
    max-width: min(240px, 80vw);
    padding: 4px 6px max(8px, env(safe-area-inset-bottom, 0px));
  }

  /* Заголовок крупнее, в верхней зоне; отделён от лида/рамки зазором в .airo-qf-block4-inner */
  body.airo-course-welcome-quickfit-page .airo-qf-mentor__title {
    font-size: clamp(1.34rem, 5.8vw, 2.05rem) !important;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: max(0.2rem, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(0.2rem, env(safe-area-inset-right, 0px)) !important;
    line-height: 1.18;
    letter-spacing: 0.06em;
    text-shadow:
      0 1px 3px rgba(0, 0, 0, 0.9),
      0 0 28px rgba(0, 0, 0, 0.45);
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__col--text > .airo-qf-mentor__lead {
    flex: 0 0 auto;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__lead {
    text-align: center !important;
    font-size: clamp(0.98rem, 3.5vw, 1.16rem) !important;
    line-height: 1.45;
    margin-top: 0;
    margin-bottom: 0;
  }

  /* Рамка по содержимому, не flex-1 на весь экран */
  body.airo-course-welcome-quickfit-page .airo-qf-mentor__textbox.airo-qf-mentor__textbox--stack {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    width: var(--airo-qf-mentor-mob-w);
    max-width: min(240px, 80vw);
    align-self: center;
    box-sizing: border-box;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__textbox {
    align-self: center !important;
    flex: 0 0 auto;
    min-width: 0;
    min-height: 0;
    padding: clamp(0.9rem, 2.2vh, 1.2rem) clamp(0.9rem, 2.6vw, 1.1rem) !important;
    box-sizing: border-box;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__textbox .airo-qf-mentor__body-parts {
    display: block;
    width: 100%;
    max-width: 100%;
    text-align: left;
    box-sizing: border-box;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__textbox .airo-qf-mentor__part {
    margin-bottom: 0.55em;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__textbox .airo-qf-mentor__part:last-child {
    margin-bottom: 0;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__textbox p.airo-qf-mentor__seg {
    font-size: clamp(1.04rem, 3.5vw, 1.2rem) !important;
    line-height: 1.55;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__frame {
    max-height: min(52vh, 320px);
    width: 100%;
    min-height: 0;
    outline: 1px solid rgba(120, 210, 255, 0.88);
    outline-offset: 0;
    box-shadow:
      0 0 0 0.5px rgba(100, 200, 255, 0.45),
      0 0 10px 2px rgba(120, 210, 255, 0.24),
      0 0 24px 6px rgba(60, 180, 255, 0.14),
      0 0 42px 12px rgba(40, 150, 255, 0.09);
  }

  body.airo-course-welcome-quickfit-page .airo-qf-mentor__img {
    min-height: 0;
  }

  /* Блок 5: на iPhone не тянуть секцию на full dvh+22vh — только по контенту (F12 часто другой dvh) */
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block5 {
    min-height: 0;
    height: auto;
  }

  /* Блок 5: полноценная сцена + сетка в одну колонку; отступы — тот же +30% к базе */
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero.airo-course-welcome-hero--qf-block5
    .airo-course-welcome-hero-inner {
    min-height: 0;
    justify-content: flex-start;
    padding-left: max(
      calc(0.75rem * var(--airo-qf-block5-scale, 1.3)),
      env(safe-area-inset-left, 0px),
      calc(3.2vw * var(--airo-qf-block5-scale, 1.3))
    );
    padding-right: max(
      calc(0.75rem * var(--airo-qf-block5-scale, 1.3)),
      env(safe-area-inset-right, 0px),
      calc(3.2vw * var(--airo-qf-block5-scale, 1.3))
    );
    padding-top: max(
      env(safe-area-inset-top, 0px),
      calc(var(--airo-qf-block5-scale, 1.3) * clamp(0.85rem, 2.6vh, 1.35rem))
    );
    padding-bottom: max(
      env(safe-area-inset-bottom, 0px),
      calc(var(--airo-qf-block5-scale, 1.3) * clamp(0.85rem, 2.6vh, 1.35rem))
    );
  }

  /* Блок 5, мобилка: одна ширина у всех трёх рамок (как 2-я/3-я), не «узкая» первая из max-content */
  body.airo-course-welcome-quickfit-page .airo-qf-block5-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    min-width: 0;
    justify-items: stretch;
    align-items: start;
    gap: clamp(0.5rem, 2.2vh, 0.9rem) clamp(0.45rem, 1.2vw, 0.7rem);
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-inner {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    /* Лёгкое сжатие тройки на телефонах, десктопные переменные не трогаем */
    zoom: calc(var(--airo-qf-block5-zoom, 1.1) * 0.96) !important;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-card {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding-top: calc(0.48rem * var(--airo-qf-block5-scale, 1.3));
    padding-bottom: calc(0.48rem * var(--airo-qf-block5-scale, 1.3));
    padding-left: clamp(0.38rem, 2.4vw, 0.7rem);
    padding-right: clamp(0.38rem, 2.4vw, 0.7rem);
  }

  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-card.airo-qf-block5-card--span {
    left: 0;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    justify-self: stretch;
    align-items: stretch;
    padding: clamp(0.5rem, 1.1vh + 0.4rem, 0.95rem) clamp(0.42rem, 2.2vw, 0.9rem);
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-card--what {
    width: 100%;
    max-width: 100%;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-card--why {
    transform: none;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-what-anim,
  body.airo-course-welcome-quickfit-page .airo-qf-block5-card--why .airo-qf-block5-hug {
    max-width: 100%;
    min-width: 0;
  }

  /* Первая рамка: заголовок по центру; блок текста — визуально по центру рамки, строки внутри — с левого края */
  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-card--why
    .airo-qf-block5-hug {
    text-align: center;
  }

  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-card--why
    .airo-qf-block5-hug
    .airo-qf-block5-card__title {
    text-align: center;
  }

  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-card--why
    .airo-qf-block5-hug
    .airo-qf-block5-card__body {
    display: inline-block;
    max-width: 100%;
    text-align: left;
    vertical-align: top;
  }

  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-card--why
    .airo-qf-block5-linegroup {
    text-align: left;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-what-lines__line {
    white-space: normal;
  }

  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-card.airo-qf-block5-card--span
    .airo-qf-block5-card__title {
    text-align: center;
  }

  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-card.airo-qf-block5-card--span
    .airo-qf-block5-cta-block {
    align-self: stretch;
    width: 100%;
    max-width: 100%;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-cta-block {
    text-align: left;
    font-size: 1;
  }

  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-cta-block
    .airo-qf-block5-card__sub {
    text-align: center;
    /* nowrap на моб. одна длинная строка (RU/EN) шире рамки — вылет вправо; трекинг тоже раздувает ширину */
    letter-spacing: 0.02em;
    font-size: calc(
      var(--airo-qf-block5-scale, 1.3) * clamp(0.55rem, 0.2rem + 2.1vw, 0.95rem)
    );
  }

  /* Две смысловых строки в разметке, внутри каждой — перенос по словам (иначе вся строка = один ряд, overflow) */
  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-cta-block
    .airo-qf-block5-card__sub
    .airo-qf-block5-cta-sub--mob
    .airo-qf-block5-cta-sub__l1,
  body.airo-course-welcome-quickfit-page
    .airo-qf-block5-cta-block
    .airo-qf-block5-card__sub
    .airo-qf-block5-cta-sub--mob
    .airo-qf-block5-cta-sub__l2 {
    white-space: normal;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: normal;
    hyphens: none;
    line-height: 1.2;
  }

  body.airo-course-welcome-quickfit-page .airo-qf-block5-card__body,
  body.airo-course-welcome-quickfit-page .airo-qf-block5-what-lines,
  body.airo-course-welcome-quickfit-page .airo-qf-block5-cta-block,
  body.airo-course-welcome-quickfit-page .airo-qf-block5-steps,
  body.airo-course-welcome-quickfit-page .airo-qf-block5-step {
    max-width: 100%;
    min-width: 0;
    overflow-wrap: break-word;
    word-wrap: break-word;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sprava {
    background-position: right bottom;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-frame-text--desktop {
    display: none;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-frame-text--mobile {
    display: block;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-lede-desktop {
    display: none;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-lede-mobile {
    display: block;
  }

  /* Заголовок — на всю ширину колонки, читабельный кегль, без сжатия transform */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-quickfit-title-line1,
  body.airo-course-welcome-quickfit-page .airo-course-welcome-quickfit-title-line2 {
    white-space: normal;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero-title-frame {
    --welcome-mob-inset-x: max(2px, env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
    --welcome-title-frame-gap: clamp(16px, 2.2vh, 32px);
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0;
    padding-left: var(--welcome-mob-inset-x);
    padding-right: var(--welcome-mob-inset-x);
    transform: none;
    /* колонка на всю ширину экрана; рамка/lede внутри центрируем отдельно */
    align-items: stretch;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero-title-frame
    .airo-course-welcome-quickfit-title {
    align-self: stretch;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0;
    font-size: clamp(1.28rem, 6.4vw, 2.35rem);
    line-height: 1.08;
    transform: translateY(6%);
  }

  /*
   * Робот в потоке: секция = flex-колонка; текст flex:0; зона .robo-sleva-wrap flex:1 — занимает остаток экрана.
   * Отступ текста → робот: clamp(5–7% высоты). Картинка object-fit:contain, max 100% зоны, не наезжает (ниже по DOM, z 4 < 6).
   */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sleva {
    display: flex;
    flex-direction: column;
    /* min-height задаётся --airo-course-quickfit-hero-minh у .airo-course-welcome-hero */
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-hero--sleva
    .airo-course-welcome-hero-inner {
    flex: 0 0 auto;
    min-height: auto;
    padding-top: max(4px, env(safe-area-inset-top, 0px));
    padding-left: max(0.75rem, env(safe-area-inset-left, 0px));
    padding-right: max(0.75rem, env(safe-area-inset-right, 0px));
    padding-bottom: 0;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-robo-sleva-wrap {
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    z-index: 4;
    position: relative;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    margin-top: clamp(5dvh, 5.5svh, 7dvh);
    padding-bottom: max(env(safe-area-inset-bottom, 0px), 0px);
    box-sizing: border-box;
    pointer-events: none;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-robo-sleva {
    position: static;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    display: block;
    max-width: min(90vw, 100%);
    max-height: 100%;
    width: auto;
    height: 100%;
    object-fit: contain;
    object-position: center bottom;
    transform: none;
    transform-origin: center bottom;
  }

  /* overflow-x: hidden на .wrap убран — кроме WebKit, не резать сцены по Y; X режет .right_col (правило выше) */

  /*
   * Рамка + lede: одна визуальная строка = один узел, без «ломающихся» переносов.
   * Кегль «резиновый» (vw/cqi), с потолком — при nowrap длинные строки всё ещё влезают.
   * cqi: % ширины контейнера (лучше, чем vw, если внутри колонки не на весь экран).
   */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero-right-stack {
    --welcome-mob-lateral: max(4px, env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px));
    /* кегль: рамка +5% (--wm-mob-inframe), lede без изменений */
    --wm-mob-inframe: clamp(0.97rem, 0.635rem + 2.77vw, 1.43rem);
    --wm-mob-lede: clamp(0.968rem, 0.638rem + 2.805vw, 1.364rem);
    container-type: inline-size;
    container-name: welcome-mob;
    align-self: stretch;
    left: auto;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-top: calc(var(--welcome-title-frame-gap) + 1.25vh);
    transform: none;
    display: flex;
    flex-direction: column;
    /* center = только сами рамка/lede по горизонтали; text-align:left у потомков — строки НЕ по центру */
    align-items: center;
    text-align: left;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-frame {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: max-content;
    max-width: calc(100% - 2 * var(--welcome-mob-lateral));
    min-width: 0;
    margin: 0 auto;
    box-sizing: border-box;
    /* внутренние поля рамки +5% (только рамка) */
    padding: clamp(1.1rem, 2.55vh, 1.62rem) clamp(0.58rem, 1.39vw, 1.04rem);
    transform: none;
    text-align: left;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-frame-text--mobile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    gap: 0.5em;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-frame-m-line {
    display: block;
    text-align: left;
    width: 100%;
    font-family: var(--font-main, 'Montserrat', sans-serif);
    font-weight: 600;
    font-size: var(--wm-mob-inframe);
    line-height: 1.3;
    letter-spacing: 0.01em;
    color: #a0e1f3;
    text-shadow:
      0 0 4px rgba(160, 225, 243, 0.55),
      0 0 10px rgba(100, 195, 255, 0.3);
    /* строки как в макете: 4 фикс. строки, без дословного «крошения»; кегль поджимаем clamp выше */
    white-space: nowrap;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  /* Lede: ниже с большим зазором; чуть мельче рамки, в том же духе (Montserrat 600) */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-lede-block {
    width: max-content;
    min-width: 0;
    max-width: calc(100% - 2 * var(--welcome-mob-lateral));
    margin: clamp(1.8rem, 5.6vh, 3.2rem) auto 0;
    padding: 0;
    box-sizing: border-box;
    transform: none;
    text-align: left;
  }

  /* Lede: чуть крупнее кегля рамки; строки с одного левого края (как в рамке) */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-lede-m-line {
    margin: 0;
    padding: 0;
    text-align: left;
    display: block;
    width: 100%;
    max-width: 100%;
    font-family: var(--font-main, 'Montserrat', sans-serif);
    font-weight: 600;
    font-size: var(--wm-mob-lede, var(--wm-mob-inframe));
    line-height: 1.3;
    letter-spacing: 0.02em;
    color: #ffffff;
    text-shadow:
      0 0 2px rgba(255, 255, 255, 0.12),
      0 1px 2px rgba(0, 0, 0, 0.5);
    /* каждая p — готовая строка макета, без внутристрочного переноса */
    white-space: nowrap;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  /* «Наш курс…» + «тренировка.» плотно, затем зазор до «Это — опыт…» */
  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-lede-m-line.airo-course-welcome-lede-m-line--tight-below {
    margin-bottom: 0.22em;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-lede-m-line.airo-course-welcome-lede-m-line--after-paragraph {
    margin-top: 0.12em;
    margin-bottom: clamp(0.8rem, 1.9vh, 1.2rem);
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-lede-m-line
    + .airo-course-welcome-lede-m-line {
    margin-top: 0.32em;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-lede-m-line.airo-course-welcome-lede-m-line--tight-below
    + .airo-course-welcome-lede-m-line--after-paragraph {
    margin-top: 0.1em;
  }

  body.airo-course-welcome-quickfit-page
    .airo-course-welcome-lede-m-line.airo-course-welcome-lede-m-line--after-paragraph
    + .airo-course-welcome-lede-m-line {
    margin-top: 0;
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-lede-mobile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
  }

}

/* Тот же кегль, но от ширины колонки (cqi) — iOS/Chrome, когда вьюпорт ≠ ширина контента */
@supports (width: 1cqi) {
  @media (max-width: 828px) {
    body.airo-course-welcome-quickfit-page .airo-course-welcome-hero-right-stack {
      --wm-mob-inframe: clamp(0.97rem, 0.6rem + 2.43cqi, 1.43rem);
      --wm-mob-lede: clamp(0.968rem, 0.605rem + 2.42cqi, 1.364rem);
    }
  }
}

/* Узкие: плавно ниже потолок, lede соразмерно */
@media (max-width: 400px) {
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero-right-stack {
    --wm-mob-inframe: clamp(0.9rem, 0.58rem + 2.02vw, 1.27rem);
    --wm-mob-lede: clamp(0.902rem, 0.572rem + 2.035vw, 1.232rem);
  }
}

@media (max-width: 360px) {
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero-right-stack {
    --wm-mob-inframe: clamp(0.855rem, 0.54rem + 1.73vw, 1.21rem);
    --wm-mob-lede: clamp(0.858rem, 0.539rem + 1.76vw, 1.188rem);
  }
}

/* Узкие: чуть плотнее зазор до робота, ширина картинки */
@media (max-width: 480px) {
  body.airo-course-welcome-quickfit-page .airo-course-welcome-robo-sleva-wrap {
    margin-top: clamp(4dvh, 5svh, 6dvh);
  }

  body.airo-course-welcome-quickfit-page .airo-course-welcome-robo-sleva {
    max-width: min(86vw, 100%);
  }
}

/* Очень узкие: остаётся читабельно, без прежнего 0.75rem cap */
@media (max-width: 320px) {
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero-right-stack {
    --wm-mob-inframe: clamp(0.785rem, 0.51rem + 1.21vw, 1.13rem);
    --wm-mob-lede: clamp(0.77rem, 0.495rem + 1.21vw, 1.1rem);
  }
}

/* Подменю с линией/кружками — только широкая панель на десктопе: см. @media (min-width: 992px) */

/*
 * QuickFit, мобилка: нативный scroll window/body вместо overflow-y на .right_col.
 * Класс html.airo-qf-native-body-scroll ставит js/airo-qf-native-body-scroll.js (Moto / ?nativeScroll=1 / localStorage).
 * Десктоп (min-width: 992px) не затрагивается.
 */
@media (max-width: 991px) {
  /*
   * QuickFit mobile (основной режим, НЕ native-body-scroll):
   * единый скролл-контейнер — .right_col, без конкурирующих overflow у оберток.
   */
  html:not(.airo-qf-native-body-scroll) body.airo-course-panel-page.airo-course-welcome-quickfit-page .airo-course-panel-main,
  html:not(.airo-qf-native-body-scroll) body.airo-course-panel-page.airo-course-welcome-quickfit-page .airo-course-panel-main > .container.body,
  html:not(.airo-qf-native-body-scroll) body.airo-course-panel-page.airo-course-welcome-quickfit-page .main_container {
    overflow: hidden !important;
  }

  html:not(.airo-qf-native-body-scroll) body.airo-course-panel-page.airo-course-welcome-quickfit-page .main_container > .right_col {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    height: calc(
      100svh - var(--airo-course-header-offset) - var(--airo-course-burger-bar-height) - var(--airo-lesson-footer-bar-height)
    ) !important;
    min-height: 0;
    max-height: calc(
      100svh - var(--airo-course-header-offset) - var(--airo-course-burger-bar-height) - var(--airo-lesson-footer-bar-height)
    ) !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain !important;
    touch-action: pan-y !important;
    scrollbar-gutter: stable !important;
  }

  /*
   * QuickFit mobile: декоративные слои не должны раздувать scrollHeight.
   * Визуал сохраняем, но ограничиваем их в пределах секции.
   */
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sleva,
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--sprava,
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--shar-dual,
  body.airo-course-welcome-quickfit-page .airo-course-welcome-hero--qf-block6 {
    overflow: clip !important;
  }

  body.airo-course-welcome-quickfit-page .airo-course-online-chat-ball-shell,
  body.airo-course-welcome-quickfit-page .airo-course-welcome-shar-dual,
  body.airo-course-welcome-quickfit-page .airo-course-welcome-shar-dual__shell,
  body.airo-course-welcome-quickfit-page .airo-qf-block6-shar,
  body.airo-course-welcome-quickfit-page .airo-qf-block6-welcome,
  body.airo-course-welcome-quickfit-page .airo-qf-block6-molniya,
  body.airo-course-welcome-quickfit-page .airo-qf-block6-luchi {
    position: absolute !important;
    pointer-events: none !important;
    max-width: none !important;
  }

  body.airo-course-welcome-quickfit-page .airo-course-online-chat-ball-shell,
  body.airo-course-welcome-quickfit-page .airo-course-welcome-shar-dual,
  body.airo-course-welcome-quickfit-page .airo-course-welcome-shar-dual__shell {
    will-change: auto !important;
  }

  /* Внешние обертки QuickFit mobile не должны создавать второй вертикальный скролл */
  html:not(.airo-qf-native-body-scroll)
    body.airo-course-panel-page.airo-course-welcome-quickfit-page
    .main_container
    > .right_col
    > .airo-course-right-inner,
  html:not(.airo-qf-native-body-scroll)
    body.airo-course-panel-page.airo-course-welcome-quickfit-page
    .main_container
    > .right_col
    > .airo-course-right-inner.airo-course-welcome-quickfit-wrap,
  html:not(.airo-qf-native-body-scroll)
    body.airo-course-panel-page.airo-course-welcome-quickfit-page
    .airo-course-welcome-quickfit-wrap,
  html:not(.airo-qf-native-body-scroll)
    body.airo-course-panel-page.airo-course-welcome-quickfit-page
    .airo-qf-scale-outer,
  html:not(.airo-qf-native-body-scroll)
    body.airo-course-panel-page.airo-course-welcome-quickfit-page
    .airo-qf-scale-root {
    overflow-y: visible !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
  }

  html.airo-qf-native-body-scroll:has(body.airo-course-welcome-quickfit-page) {
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: auto !important;
    scrollbar-gutter: auto !important;
    scroll-behavior: auto;
    height: auto;
    min-height: 100%;
  }

  html.airo-qf-native-body-scroll body.airo-course-panel-page.airo-course-welcome-quickfit-page {
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: auto;
    min-height: 0;
    height: auto;
    max-height: none;
  }

  /*
   * Высота сцен: без 100dvh (пересчёт на жёстких WebView) — только svh + фиксированные отступы.
   */
  html.airo-qf-native-body-scroll body.airo-course-welcome-quickfit-page {
    --airo-course-quickfit-hero-minh: max(
      12rem,
      calc(
        100svh - var(--airo-course-header-offset) - var(--airo-course-burger-bar-height) -
          env(safe-area-inset-bottom, 0px)
      )
    );
    --airo-qf-block5-hero-minh: max(
      calc(var(--airo-course-quickfit-hero-minh) + min(22vh, 280px)),
      16rem
    );
  }

  html.airo-qf-native-body-scroll body.airo-course-welcome-quickfit-page .airo-course-panel-main {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    min-height: 0;
    height: auto;
    max-height: none;
    overflow: visible;
    padding-top: var(--airo-course-header-offset);
    padding-bottom: 0;
    z-index: 10;
    background-color: #121212;
  }

  html.airo-qf-native-body-scroll body.airo-course-welcome-quickfit-page .airo-course-panel-main > .container.body {
    display: flex;
    flex-direction: column;
    flex: 0 1 auto;
    height: auto;
    max-height: none;
    min-height: 0;
    overflow: visible;
  }

  html.airo-qf-native-body-scroll body.airo-course-welcome-quickfit-page .main_container {
    display: flex;
    flex-direction: column;
    flex: 0 1 auto;
    min-height: 0;
    height: auto;
    max-height: none;
    overflow: visible;
    position: relative;
  }

  html.airo-qf-native-body-scroll body.airo-course-welcome-quickfit-page .main_container > .right_col {
    flex: 0 0 auto;
    min-height: 0;
    height: auto;
    max-height: none;
    overflow: visible !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: auto;
    overscroll-behavior: auto;
    touch-action: auto;
    container-type: normal;
    container-name: none;
    scrollbar-gutter: auto;
    overflow-anchor: auto;
  }

  html.airo-qf-native-body-scroll body.airo-course-welcome-quickfit-page .main_container > .top_nav {
    position: -webkit-sticky;
    position: sticky;
    top: var(--airo-course-header-offset);
    z-index: 20;
    flex-shrink: 0;
    align-self: stretch;
    width: 100% !important;
  }

  html.airo-qf-native-body-scroll body.airo-course-welcome-quickfit-page .airo-course-welcome-hero [aria-hidden='true'] {
    pointer-events: none;
  }

  html.airo-qf-native-body-scroll body.airo-course-welcome-quickfit-page .airo-course-welcome-hero.airo-course-welcome-hero--qf-block6 {
    isolation: auto;
  }
}

/* =============================================================
 * Все онлайн-курс-страницы (body.airo-course-panel-page) — top_nav.
 *
 * 1) Убрать выпадающий список «Профиль / Настройки / Помощь / Выйти»,
 *    который Gentelella по умолчанию открывает по клику на имени
 *    пользователя в шапке. Сейчас он не нужен ни на одной странице
 *    курса (навигатор, упражнения, разминка, online-chat и т.п.).
 *    Делаем CSS-only:
 *      • прячем сам dropdown-menu (display: none) — сразу для RU и EN;
 *      • прячем chevron «v» рядом с именем;
 *      • блокируем клик по «user-profile» (pointer-events: none),
 *        чтобы Bootstrap dropdown даже не пытался открыться;
 *      • убираем cursor: pointer — имя выглядит обычным элементом.
 *
 * 2) Иконка сообщений (конверт) прижималась к правому краю —
 *    даём отступ ~2vw через padding-right на .navbar-right.
 *    clamp() держит зазор адекватным и на мобилке, и на десктопе.
 *
 * Scope body.airo-course-panel-page — это общий класс всех 19 курсовых
 * страниц. Никакие другие части сайта (профиль, кадет, чат, дашборд)
 * не задеты — у них этот класс не стоит.
 * ============================================================= */
body.airo-course-panel-page .top_nav .navbar-right .user-profile .fa-angle-down,
body.airo-course-panel-page .top_nav .navbar-right > li > a.dropdown-toggle.user-profile + .dropdown-menu,
body.airo-course-panel-page .top_nav .navbar-right > li.dropdown > .dropdown-menu.dropdown-usermenu {
  display: none !important;
}

body.airo-course-panel-page .top_nav .navbar-right a.user-profile {
  pointer-events: none !important;
  cursor: default !important;
}

/* Отступ конверта от правого края: ~2vw, но не меньше 12px (мобилка)
 * и не больше 32px (широкий десктоп). Override прежнего padding-left
 * не делаем — он остаётся как был. */
body.airo-course-panel-page .top_nav .navbar-right {
  padding-right: clamp(12px, 2vw, 32px) !important;
}