/* Лекция по теме 1: тот же материал, что в колоде, но текстом и по частям.
   Компоненты (код, схемы, кадры, цитаты) берутся из стилей колоды,
   здесь меняется только раскладка: страница прокручивается, а не листается. */
@import url("../styles.css");

/* Стили колоды не задают шрифт страницы: в колоде он приходит из общих стилей дисциплины. */
body.lec{height:auto;display:block;background:var(--paper);color:var(--ink);font-family:var(--display);margin:0}
body.lec h1,body.lec h2,body.lec h3{font-family:var(--display)}
body.lec p,body.lec li,body.lec td,body.lec th{font-family:var(--display)}
body.lec .quote blockquote{font-family:Georgia,"Times New Roman",serif}
body.lec code,body.lec pre{font-family:var(--mono)}
.lec-wrap{max-width:1080px;margin:0 auto;padding:0 24px}

/* Шапка: шкала частей, как в лекции ОП.05, и переключатель на колоду */
.lec-top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:16px;padding:10px 24px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.94);backdrop-filter:blur(6px)}
.lec-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font:700 10px/1.35 var(--display);letter-spacing:1.2px;text-transform:uppercase}
.lec-brand b{display:grid;place-items:center;padding:7px 9px;border-radius:9px;background:var(--ink);color:#fff;font:700 15px var(--mono);letter-spacing:0}
.lec-gauge{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap}
.lec-gauge a{display:grid;place-items:center;width:30px;height:28px;border-radius:7px 7px 0 0;border-bottom:4px solid var(--c);color:var(--muted);text-decoration:none;font:700 12px var(--mono)}
.lec-gauge a:hover{background:#eef2f7;color:var(--ink)}
.lec-gauge a[aria-current]{background:var(--c);color:#fff}
.lec-mode{padding:9px 14px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);text-decoration:none;font-weight:600;font-size:14px;white-space:nowrap}
.lec-mode:hover{background:#eaf0fc;border-color:#a9bfdf}

/* Обложка части */
.lec-hero{border-bottom:8px solid var(--c);background:linear-gradient(180deg,#fff, var(--paper))}
.lec-hero .lec-wrap{padding-block:38px 30px}
.lec-kicker{font:750 12px var(--display);letter-spacing:1.5px;text-transform:uppercase;color:var(--c)}
.lec-hero h1{margin:10px 0 0;font-size:clamp(30px,3.6vw,50px);line-height:1.08;letter-spacing:-1.4px}
.lec-bridge{margin-top:12px;max-width:820px;font-size:clamp(17px,1.5vw,21px);line-height:1.5;color:var(--muted)}
.lec-cover{background:linear-gradient(180deg,#fff,#eef2f8)}
.lec-start{display:inline-block;margin-top:22px;padding:13px 22px;border-radius:11px;background:var(--c);color:#fff;text-decoration:none;font-weight:700}
.lec-start:hover{filter:brightness(1.08)}

/* Оглавление части */
.lec-toc{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:6px 18px;margin:22px 0 0;padding:0;list-style:none}
.lec-toc a{display:flex;gap:10px;padding:6px 0;color:var(--ink);text-decoration:none;font-size:16px;line-height:1.35;border-bottom:1px solid transparent}
.lec-toc a:hover{border-bottom-color:var(--c)}
.lec-toc span{min-width:28px;font:700 13px var(--mono);color:var(--c)}

/* Текст части: каждый разворот колоды — раздел лекции */
.lec-page{padding-block:34px 44px;display:grid;gap:34px}
.lec-stage{scroll-margin-top:72px}
.lec-stage>h2{display:flex;gap:14px;align-items:baseline;margin:0 0 10px;padding-bottom:10px;border-bottom:3px solid var(--c);font-size:clamp(23px,2.4vw,34px);line-height:1.15;letter-spacing:-.8px}
.lec-num{font:700 15px var(--mono);color:var(--c)}
.lec-stage .lead{margin:0 0 16px;max-width:900px;font-size:clamp(17px,1.35vw,20px)}
.lec-stage .slide-body{display:grid;gap:16px}
.lec-page section>h2{font-size:clamp(23px,2.4vw,32px);border-bottom:3px solid var(--c);padding-bottom:10px;margin-bottom:14px}

/* План темы на титульной странице */
.lec-parts{margin:18px 0 0;padding:0;list-style:none;border-top:2px solid var(--line)}
.lec-parts a{display:grid;grid-template-columns:44px 1fr;column-gap:16px;padding:14px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.lec-parts a:hover b{text-decoration:underline}
.lec-st{grid-row:span 3;display:grid;place-items:center;width:36px;height:36px;border-radius:9px;background:var(--c);color:#fff;font:700 15px var(--mono)}
.lec-parts b{font:700 19px var(--display)}
.lec-parts p{margin:4px 0 0;font-size:16px;line-height:1.45;color:var(--muted)}
.lec-parts small{margin-top:4px;font:600 13px var(--mono);color:var(--c)}
.lec-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.lec-links a{display:grid;gap:4px;padding:15px 18px;border:1px solid var(--line);border-radius:12px;background:#fff;text-decoration:none;color:var(--ink)}
.lec-links a:hover{border-color:var(--c);transform:translateY(-2px)}
.lec-links span{font-size:14px;color:var(--muted)}

/* Переход к соседним частям */
.lec-nav{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:22px;border-top:2px solid var(--line)}
.lec-nav a{max-width:46%;padding:13px 18px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--ink);text-decoration:none;font-weight:600}
.lec-nav a:hover{border-color:var(--c);background:#f7f9fc}
.lec-next{margin-left:auto;text-align:right}

.lec-foot{border-top:1px solid var(--line);background:#fff;padding-block:22px 30px}
.lec-foot p{font-size:15px;line-height:1.5;color:var(--muted)}
.lec-credits{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:10px;font-size:13px}

/* В лекции кадры и блоки не ограничены высотой экрана */
.lec .shot img,.lec .shot.compact img{max-height:none}
.lec .split{gap:26px}
.lec .lint textarea{min-height:190px}
.lec #toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:50;padding:14px 20px;border-radius:10px;background:var(--ink);color:#fff;font-size:15px}

/* Появление разделов при прокрутке */
.lec-stage>*{opacity:0;transform:translateY(12px)}
.lec-stage.enter>*{opacity:1;transform:none;transition:opacity .45s ease-out,transform .45s ease-out}
.lec-stage.enter>*:nth-child(2){transition-delay:.06s}
.lec-stage.enter>*:nth-child(3){transition-delay:.12s}

@media(max-width:900px){
  .lec-top{flex-wrap:wrap;gap:10px;padding:10px 16px}
  .lec-gauge{order:3;width:100%;margin-left:0}
  .lec-wrap{padding:0 16px}
  .lec-toc{grid-template-columns:1fr}
  .lec-nav a{max-width:100%}
}
@media(prefers-reduced-motion:reduce){.lec-stage>*{opacity:1;transform:none}}
@media print{
  .lec-top,.lec-nav,.lec-foot,.lec-mode{display:none!important}
  .lec-stage>*{opacity:1!important;transform:none!important}
  .lec-page{gap:20px}
  .lec-stage{break-inside:avoid}
}