/* academy.css — страница AI-курса /academy. Поверх общих токенов (../css/styles.css).
   Только точечные оверрайды под эту страницу — базовые компоненты берём из styles.css. */

/* Якорная навигация под липкой шапкой — чтобы заголовок секции не прятался под ней */
section[id] {
  scroll-margin-top: 90px;
}

/* Hero-заголовок здесь длиннее, чем на главной — не даём .display раздуться до 7.2rem */
.hero h1.display {
  font-size: clamp(2.3rem, 4.8vw, 4.4rem);
  line-height: 0.98;
}

/* Программа: 9 карточек .step ровной сеткой 3×3 (по умолчанию .steps = 4 колонки) */
.steps--9 {
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 760px) {
  .steps--9 {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 460px) {
  .steps--9 {
    grid-template-columns: 1fr;
  }
}

/* Плашка «Занятие 0» перед сеткой занятий — компактная, во всю ширину */
.lesson0 {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px 20px;
  margin-bottom: var(--gap);
  padding: 22px clamp(22px, 3vw, 32px);
  background: var(--white);
  border: 1.5px solid var(--line);
  border-radius: var(--radius-sm);
}
.lesson0 b {
  font-weight: 800;
  letter-spacing: -0.02em;
  white-space: nowrap;
}
.lesson0 span {
  flex: 1;
  min-width: 260px;
  color: var(--muted);
  font-size: 0.98rem;
  line-height: 1.45;
}

/* Блок «Волга» без скриншота — одна колонка вместо двух */
.case--stat.case--nosplit {
  grid-template-columns: 1fr;
}

/* Ссылки «потрогать вживую» в блоке «Волга» (на тёмном фоне) */
.touch-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  margin-top: 24px;
  font-size: 0.95rem;
  color: rgba(251, 250, 244, 0.72);
}
.touch-links a {
  color: #fff;
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--lime);
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
  transition: color 0.25s;
}
.touch-links a:hover {
  color: var(--lime);
}
.touch-links .sep {
  opacity: 0.4;
}

/* Оффер: лаймовая «галочка» перед строками «что входит» */
.pricing .price-name .inc {
  color: var(--lime);
  font-weight: 800;
  margin-right: 0.5em;
}

/* Скип-ссылка «к содержимому»: скрыта, показывается только при фокусе с клавиатуры (WCAG 2.4.1) */
.skip-link {
  position: fixed;
  left: 12px;
  top: -80px;
  z-index: 1000;
  padding: 10px 18px;
  background: var(--ink);
  color: var(--white);
  font-weight: 700;
  border-radius: var(--radius-sm);
  transition: top 0.2s ease;
}
.skip-link:focus {
  top: 12px;
  outline: 2px solid var(--lime);
  outline-offset: 2px;
}

/* Статичные карточки FAQ и «Для кого» не кликабельны — гасим hover-лифт,
   наследуемый от .post-card/.svc, чтобы карточка не притворялась интерактивной */
#faq .post-card:hover,
#for-whom .svc:hover {
  transform: none;
  box-shadow: none;
}

/* «Формат»: заголовок (.why-copy) идёт в DOM первым — правильный порядок чтения
   для скринридера; на десктопе визуально возвращаем плитки влево через order */
@media (min-width: 981px) {
  #format .why-stats {
    order: -1;
  }
}

/* Плашка «Занятие 0»: на очень узких экранах (Galaxy Fold и уже) разрешаем перенос,
   чтобы неразрывный заголовок не обрезался краем экрана */
@media (max-width: 360px) {
  .lesson0 b {
    white-space: normal;
  }
}
