/* Слайды урока. Один шаблон обслуживает и веб-плеер, и рендер кадров для MP4 —
   поэтому расхождений «в вебе одно, в скачанном файле другое» не бывает.

   Геометрия: слайд 16:9, 1em = 1% ширины. Любой размер задаётся в em и
   масштабируется вместе со слайдом — от превью в списке до 1920×1080. */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(fonts/inter-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(fonts/inter-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(fonts/inter-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2122, U+2191, U+2193, U+2212, U+2215;
}

.deck {
  --brand: #174ABC;
  --brand-ink: #0B1B3A;
  --accent: #EF11B6;
  --surface: #ffffff;
  --surface-2: #F5F7FC;
  --line: rgba(11, 27, 58, .10);
  --muted: rgba(11, 27, 58, .55);
  --warn: #C8500A;
}

/* ── Каркас слайда ────────────────────────────────────────────────── */
.slide {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  container-type: inline-size;
  background: var(--surface);
  color: var(--brand-ink);
  font-family: 'Inter', -apple-system, 'Segoe UI', system-ui, sans-serif;
  letter-spacing: -.014em;
  overflow: hidden;
  border-radius: 1.4cqw;
  box-shadow: 0 1px 2px rgba(11, 27, 58, .06), 0 12px 40px rgba(11, 27, 58, .08);
}

.slide__body {
  position: absolute;
  inset: 0;
  /* Нижний отступ держит колонтитул: текст на него не наезжает никогда. */
  padding: 6cqw 7cqw 10cqw;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Слайд со слотом под ведущего не пускает текст в правый нижний угол. */
.slide[data-avatar="1"] .bullets li:nth-last-child(-n+3),
.slide[data-avatar="1"] .callout__caption { padding-right: 19cqw; }
.slide--split[data-avatar="1"] .bullets li,
.slide--media[data-avatar="1"] .bullets li { padding-right: 0; }

/* Колонтитул: шифр документа и пункт регламента в каждом кадре.
   Это и есть визуальная прослеживаемость — для авиации выглядит как документ,
   а не как презентация из интернета. */
.slide__footer {
  position: absolute;
  left: 7cqw;
  right: 7cqw;
  bottom: 3.6cqw;
  display: flex;
  justify-content: space-between;
  gap: 2cqw;
  font-size: 1.35cqw;
  color: var(--muted);
  border-top: 1px solid var(--line);
  padding-top: 1.5cqw;
  font-variant-numeric: tabular-nums;
}
.slide__footer b { font-weight: 600; color: rgba(11, 27, 58, .72); }

.slide__eyebrow {
  font-size: 1.5cqw;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--brand);
  margin-bottom: 2.2cqw;
}

.slide__heading {
  font-size: calc(4.4cqw * var(--fit, 1));
  font-weight: 700;
  line-height: 1.1;
  text-wrap: balance;
  margin: 0;
}
.slide__sub {
  margin-top: calc(1.6cqw * var(--fit, 1));
  font-size: calc(2cqw * var(--fit, 1));
  font-weight: 400;
  line-height: 1.4;
  color: var(--muted);
  max-width: 78%;
}

/* ── Тезисы ───────────────────────────────────────────────────────── */
.bullets { list-style: none; margin: calc(3.6cqw * var(--fit, 1)) 0 0; padding: 0; display: grid; gap: calc(2.2cqw * var(--fit, 1)); }
.bullets li {
  position: relative;
  padding-left: 3.4cqw;
  font-size: calc(2.3cqw * var(--fit, 1));
  line-height: 1.4;
  font-weight: 450;
  opacity: 1;
  transition: opacity .35s cubic-bezier(.22, 1, .36, 1);
}

/* Плотность считает deck.js. Кегль ужимается ступенями — так текст всегда
   помещается, а слайд не превращается в стену мелких букв. */
.slide[data-density="dense"] .slide__heading { font-size: calc(3.9cqw * var(--fit, 1)); }
.slide[data-density="dense"] .bullets { gap: 1.7cqw; margin-top: 3cqw; }
.slide[data-density="dense"] .bullets li { font-size: calc(2.02cqw * var(--fit, 1)); }

.slide[data-density="tight"] .slide__heading { font-size: calc(3.4cqw * var(--fit, 1)); }
.slide[data-density="tight"] .slide__sub { font-size: 1.7cqw; }
.slide[data-density="tight"] .bullets { gap: 1.35cqw; margin-top: 2.4cqw; }
.slide[data-density="tight"] .bullets li { font-size: calc(1.78cqw * var(--fit, 1)); line-height: 1.36; }
.slide[data-density="tight"] .checklist li::before { width: 2.6cqw; height: 2.6cqw; font-size: 1.3cqw; }
/* Пошаговое раскрытие синхронно с диктором: зритель слушает, а не убегает вперёд */
.deck[data-progressive="1"] .bullets li[data-step]:not(.is-shown) { opacity: .22; }

/* Маркер — тонкая линия, а не иконка и не эмодзи */
.bullets li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 1.2cqw;
  width: 2cqw;
  height: 2px;
  background: var(--brand);
  border-radius: 2px;
}
.bullets li.is-warning::before { background: var(--warn); }

/* Акцент — только на числах и ключевых значениях. Больше нигде,
   поэтому маджента остаётся дорогой. */
.em {
  color: var(--accent);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* ── Чек-лист ─────────────────────────────────────────────────────── */
.checklist { counter-reset: step; }
.checklist li { padding-left: 4.6cqw; }
.checklist li::before {
  counter-increment: step;
  content: counter(step);
  top: 0;
  width: 3.2cqw;
  height: 3.2cqw;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--brand);
  font-size: 1.55cqw;
  font-weight: 700;
  display: grid;
  place-items: center;
}

/* ── Крупное число ────────────────────────────────────────────────── */
.callout { margin-top: auto; margin-bottom: auto; }

/* Число слева, тезисы справа: норматив виден издалека, но объяснение при нём. */
.callout-row {
  display: grid;
  grid-template-columns: minmax(26cqw, 34cqw) 1fr;
  gap: 5cqw;
  align-items: center;
  margin-top: 3cqw;
  flex: 1;
  min-height: 0;
}
.callout-row .callout { margin: 0; }
.callout-row .callout__value { font-size: calc(13cqw * var(--fit, 1)); }
.callout-row .callout__caption { max-width: 100%; }
.callout-side .bullets { margin-top: 0; }
.callout-side .bullets li { font-size: calc(1.95cqw * var(--fit, 1)); }
.callout__value {
  font-size: 17cqw;
  font-weight: 800;
  line-height: .92;
  letter-spacing: -.04em;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
}
.callout__unit {
  font-size: 3cqw;
  font-weight: 600;
  color: var(--brand-ink);
  margin-top: .6cqw;
}
.callout__caption {
  margin-top: 2.2cqw;
  font-size: calc(2.2cqw * var(--fit, 1));
  line-height: 1.4;
  color: var(--muted);
  max-width: 74%;
}

/* ── Предупреждение ───────────────────────────────────────────────── */
.slide--warning .slide__body { background: linear-gradient(180deg, #fff 0%, #FFF5FC 100%); }
.slide--warning .slide__heading { color: var(--warn); }
.slide--warning::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 1cqw;
  background: var(--accent);
}

/* ── Титул и финал ────────────────────────────────────────────────── */
.slide--title .slide__body,
.slide--outro .slide__body { justify-content: center; }
.slide--title { background: var(--brand); color: #fff; }
.slide--title .slide__heading { font-size: 5.4cqw; max-width: 86%; }
.slide--title .slide__eyebrow { color: rgba(255, 255, 255, .72); }
.slide--title .slide__sub { color: rgba(255, 255, 255, .8); }
.slide--title .slide__footer { color: rgba(255, 255, 255, .6); border-color: rgba(255, 255, 255, .22); }
.slide--title .slide__footer b { color: rgba(255, 255, 255, .85); }

.slide--outro { background: var(--surface-2); }

/* ── Картинки из документа ────────────────────────────────────────── */
.slide--split .slide__cols {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 4cqw;
  align-items: center;
  margin-top: 3.4cqw;
  min-height: 0;
  flex: 1;
}
.slide__figure {
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 1cqw;
  padding: 2cqw;
  display: grid;
  place-items: center;
  max-height: 100%;
}
.slide__figure img { max-width: 100%; max-height: 38cqw; object-fit: contain; display: block; }
.slide--media .slide__figure img { max-height: 34cqw; }
.slide__caption {
  margin-top: 1.4cqw;
  font-size: 1.5cqw;
  color: var(--muted);
  text-align: center;
  line-height: 1.35;
}

/* ── Таблица ──────────────────────────────────────────────────────── */
.slide table {
  width: 100%;
  margin-top: calc(3cqw * var(--fit, 1));
  border-collapse: collapse;
  font-size: calc(1.8cqw * var(--fit, 1));
}
.slide th, .slide td {
  text-align: left;
  padding: 1.4cqw 1.2cqw;
  border-bottom: 1px solid var(--line);
}
.slide th { font-weight: 600; color: var(--brand); font-size: 1.5cqw; text-transform: uppercase; letter-spacing: .06em; }

/* ── Слот под ИИ-ведущего ─────────────────────────────────────────────
   Пустой круг с деликатной подписью. Показывает, что архитектура готова,
   а мы не жжём деньги на аватар ради демонстрации. */
.avatar-slot {
  position: absolute;
  right: 4.5cqw;
  bottom: 8cqw;
  width: 12.5cqw;
  height: 12.5cqw;
  border-radius: 50%;
  border: 1px dashed rgba(23, 74, 188, .32);
  background: rgba(23, 74, 188, .04);
  display: grid;
  place-items: center;
  text-align: center;
  padding: 1.6cqw;
  backdrop-filter: blur(2px);
}
.avatar-slot span {
  font-size: 1.15cqw;
  line-height: 1.3;
  color: rgba(23, 74, 188, .62);
  font-weight: 500;
}
.slide--title .avatar-slot { border-color: rgba(255, 255, 255, .35); background: rgba(255, 255, 255, .08); }
.slide--title .avatar-slot span { color: rgba(255, 255, 255, .8); }
