/* Витрина лекций: поп-ап на самом сайте, а не на чужом ресурсе.

   Открывается по кнопке «Лекции» в слое 7. Сетка обложек сгруппирована по
   площадкам, клик по обложке разворачивает лекцию. Обложки — настоящие превью
   первых слайдов, вытянутые из Figma по /v1/files/{key}/meta.

   🚨 Лекции под NDA показываются размытой обложкой, и блюр ЗАПЕЧЁН в пиксели:
   css-фильтр снимается инспектором за два клика, а тут восстанавливать нечего —
   картинка пересобрана с сетки 46 px. Ссылки на такие файлы в витрине нет.

   Язык — язык сайта: бумага, чернила, жёлтая черта, рубрики капсом в разрядку,
   моноширинные технические подписи. */

/* ── подложка ──────────────────────────────────────────────────────────── */
.лк-фон{
  position:fixed; inset:0; z-index:80;
  background:rgba(26,25,22,.66);
  opacity:0; pointer-events:none;
  transition:opacity .28s ease;
}
.лк-фон[data-открыт]{opacity:1; pointer-events:auto}

.лк-лист{
  position:absolute; inset:clamp(14px,3vh,40px) clamp(14px,3.4vw,56px);
  background:var(--paper,#f8f4ec);
  display:flex; flex-direction:column; overflow:hidden;
  box-shadow:0 -1px 0 rgba(255,255,255,.5), 0 44px 96px -32px rgba(26,25,22,.72);
  transform:translateY(16px); opacity:0;
  transition:transform .36s cubic-bezier(.2,.7,.2,1), opacity .28s ease;
}
.лк-фон[data-открыт] .лк-лист{transform:none; opacity:1}

/* ── шапка ─────────────────────────────────────────────────────────────── */
.лк-шапка{flex:none; display:flex; align-items:flex-start; gap:24px;
  padding:clamp(24px,3.2vh,40px) clamp(22px,3.2vw,52px) 0}
.лк-титул{flex:1; min-width:0}
.лк-рубрика{margin:0 0 10px; font:500 10.5px/1.5 'Inter',sans-serif; letter-spacing:.18em;
  color:var(--ink-mute,#a29b8e); text-transform:uppercase}
.лк-имя{margin:0; font:300 clamp(26px,3.2vw,44px)/1.06 'Inter Tight',sans-serif;
  letter-spacing:-.012em; color:var(--ink,#1a1916)}
.лк-закрыть{flex:none; width:42px; height:42px; margin-top:-4px;
  border:1px solid rgba(26,25,22,.18); background:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  font:300 20px/1 'Inter Tight',sans-serif; color:var(--ink,#1a1916);
  transition:background .2s ease, border-color .2s ease}
.лк-закрыть:hover{background:var(--ink,#1a1916); color:var(--paper,#f8f4ec); border-color:var(--ink,#1a1916)}
.лк-черта{flex:none; height:2px; background:var(--gold,#e0ad31);
  margin:clamp(18px,2.4vh,28px) clamp(22px,3.2vw,52px) 0}

/* ── тело ──────────────────────────────────────────────────────────────── */
.лк-тело{flex:1; overflow-y:auto; overscroll-behavior:contain;
  padding:clamp(22px,3vh,36px) clamp(22px,3.2vw,52px) clamp(28px,4vh,52px)}

/* ── группа площадки ───────────────────────────────────────────────────── */
.лк-группа{margin-bottom:clamp(28px,3.6vh,48px)}
.лк-группа:last-child{margin-bottom:0}
.лк-группа-шапка{display:flex; align-items:baseline; gap:14px; margin:0 0 16px;
  padding-bottom:9px; border-bottom:1px solid rgba(26,25,22,.14)}
.лк-группа-имя{font:500 10.5px/1.4 'Inter',sans-serif; letter-spacing:.18em;
  text-transform:uppercase; color:var(--ink,#1a1916)}
.лк-группа-счёт{margin-left:auto; font:400 10px/1 'IBM Plex Mono',monospace;
  color:var(--ink-mute,#a29b8e)}

.лк-сетка{display:grid; gap:clamp(14px,1.4vw,22px);
  grid-template-columns:repeat(auto-fill,minmax(268px,1fr))}

/* ── карточка лекции ───────────────────────────────────────────────────── */
.лк-карта{display:flex; flex-direction:column; gap:12px; padding:0; border:0;
  background:none; text-align:left; cursor:pointer; color:inherit}
.лк-обложка{position:relative; aspect-ratio:16/9; overflow:hidden; background:#26241f}
.лк-обложка img{width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.лк-карта:hover .лк-обложка img{transform:scale(1.035)}
.лк-обложка::after{content:""; position:absolute; inset:0; pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(26,25,22,.16)}
.лк-нда{position:absolute; left:0; bottom:0; z-index:1;
  padding:6px 10px; background:var(--ink,#1a1916); color:var(--paper,#f8f4ec);
  font:500 9px/1 'Inter',sans-serif; letter-spacing:.2em; text-transform:uppercase}
.лк-карта-текст{display:block}
.лк-карта-имя{margin:0; font:400 clamp(15px,1.15vw,17px)/1.3 'Inter Tight',sans-serif;
  color:var(--ink,#1a1916); transition:color .2s ease}
.лк-карта:hover .лк-карта-имя{color:var(--gold-deep,#c9971f)}
.лк-карта-низ{font:400 10px/1 'IBM Plex Mono',monospace; color:var(--ink-mute,#a29b8e)}

/* ── разворот одной лекции ─────────────────────────────────────────────── */
.лк-разворот{display:none; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  gap:clamp(22px,2.8vw,44px)}
.лк-фон[data-вид="лекция"] .лк-группы{display:none}
.лк-фон[data-вид="лекция"] .лк-разворот{display:grid}
.лк-холст{position:relative; aspect-ratio:16/9; overflow:hidden; background:#26241f}
.лк-холст img{width:100%; height:100%; object-fit:cover; display:block}
.лк-холст::after{content:""; position:absolute; inset:0; box-shadow:inset 0 0 0 1px rgba(26,25,22,.16)}
.лк-поля{display:flex; flex-direction:column; gap:clamp(14px,1.8vh,22px)}
.лк-поле .лк-метка{display:block; margin:0 0 5px; font:500 9.5px/1.4 'Inter',sans-serif;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute,#a29b8e)}
.лк-поле p{margin:0; font:400 15px/1.55 'Inter',sans-serif; color:var(--ink-soft,#4f4b43)}
.лк-кнопки{display:flex; flex-wrap:wrap; gap:10px; margin-top:2px}
.лк-кн{display:inline-flex; align-items:center; gap:11px; padding:12px 19px;
  border:1px solid var(--ink,#1a1916); background:none; cursor:pointer; text-decoration:none;
  font:500 10.5px/1 'Inter',sans-serif; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink,#1a1916); transition:background .2s ease, color .2s ease}
.лк-кн:hover{background:var(--ink,#1a1916); color:var(--paper,#f8f4ec)}
.лк-кн-жёлтая{background:var(--gold,#e0ad31); border-color:var(--gold,#e0ad31)}
.лк-кн-жёлтая:hover{background:var(--ink,#1a1916); border-color:var(--ink,#1a1916)}
.лк-кн u{text-decoration:none; font-family:'IBM Plex Mono',monospace; font-size:9px; opacity:.6}
/* .лк-закрыто удалён 10.09.2026 вместе с плашкой «Материал под NDA»: у закрытой
   лекции внизу разворота теперь пусто, объяснять посетителю нечего. */
.лк-назад{align-self:flex-start; padding:0; border:0; background:none; cursor:pointer;
  font:500 10px/1 'Inter',sans-serif; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink-mute,#a29b8e); transition:color .2s ease}
.лк-назад:hover{color:var(--ink,#1a1916)}

@media (max-width:860px){
  .лк-разворот{grid-template-columns:1fr}
  .лк-сетка{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
}

/* ── бережное движение ───────────────────────────────────────────────────
   🚨 Закон сайта: под prefers-reduced-motion движение ЗАМЕДЛЯЕТСЯ ВТРОЕ, а не
   гасится. У Павла настройка включена всегда, и transition:none он прочитает
   как пустое место вместо эффекта. Заведено 10.09.2026 вместе с адресом
   витрины: окно, открытое прямо с загрузки страницы, въезжает поверх входа
   героя, и на полной скорости два движения наезжают друг на друга. */
@media (prefers-reduced-motion: reduce){
  .лк-фон{transition-duration:.84s}
  .лк-лист{transition-duration:1.08s, .84s}
  .лк-обложка img{transition-duration:1.5s}
}
