/* orkestrai — компоненты страниц нового вида (редизайн 11.11.2026): главная, страницы отраслей и услуг.
   Рама 1320 и 12 колонок с промежутком 24; отступ секций 44 (на телефоне 36); текст 15; заголовки разделов 30;
   кнопки 46. Цвета, шрифты, шапка, кнопки и подвал — в shell.v2.css. Движения нет: только наведение и фокус. */

:where(.page) p{margin:0}
:where(.page) a{color:inherit; text-decoration:none}
:where(.page) :is(h1,h2,h3,h4){margin:0; letter-spacing:-.02em}
:where(.page) :is(ul,ol){margin:0; padding:0; list-style:none}
.frame{width:min(var(--frame), calc(100% - 2 * var(--gutter))); margin-inline:auto}
.g12{display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:var(--gap)}
.g12 > *{min-width:0}
.lnk{font-weight:600; color:var(--text); border-bottom:1px solid var(--line-2); padding-bottom:1px; white-space:nowrap}
.lnk:hover{border-bottom-color:var(--accent)}
.sx{padding:44px 0}
.sx + .sx{border-top:1px solid var(--line)}
.sx-head{grid-column:1 / -1; display:flex; align-items:flex-end; justify-content:space-between; gap:12px 24px; margin-bottom:24px}
.sx-head h2{font-size:30px; line-height:1.2; font-weight:650}
.sx-head .sub{color:var(--muted); margin-top:8px; max-width:80ch}
.card{background:var(--card); border:1px solid var(--line); border-radius:8px}
.cap{font-size:12px; line-height:1.4; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--accent)}
.sx-cta{grid-column:1 / -1; display:flex; align-items:center; gap:12px 20px; flex-wrap:wrap; margin-top:28px}
.sx-cta p{flex:1 1 260px; max-width:60ch; font-size:13px; line-height:1.45; color:var(--muted)}
.groups{grid-column:1 / -1; display:flex; flex-direction:column; gap:var(--gap)}
.grp{min-width:0; background:var(--card); border:1px solid var(--line); border-radius:8px; overflow:hidden}
.grp-h{padding:18px 20px 14px}
.grp-h h3{font-size:18px; line-height:1.3; font-weight:650}
.grp-h p{margin-top:4px; font-size:14px; line-height:1.45; color:var(--muted)}
.grp-h .cnt{margin-left:4px; font-family:var(--mono); font-size:12px; color:var(--accent); white-space:nowrap}
.svc li{display:flex; border-top:1px solid var(--line)}
.svc a{position:relative; display:flex; flex-direction:column; gap:3px; width:100%; padding:13px 46px 14px 20px; color:var(--text)}
.svc a::after{content:"→"; position:absolute; right:20px; top:13px; font-weight:600; color:var(--accent)}
.svc a:hover{background:var(--card-2)}
.svc a:hover h4{color:var(--accent)}
.svc h4{font-size:15px; line-height:1.35; font-weight:650}
.svc p{font-size:14px; line-height:1.45; color:var(--muted)}
.grp-wide .svc{display:grid; grid-template-columns:repeat(2,minmax(0,1fr))}
.grp-wide .svc li:nth-child(even){border-left:1px solid var(--line)}
.pair{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:var(--gap); row-gap:0}
.pair .grp{display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:subgrid; grid-row:span 6; row-gap:0}
.pair .grp.r4{grid-row:span 4}
.pair .grp .svc{display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:subgrid; grid-row:span 5; row-gap:0}
.pair .grp.r4 .svc{grid-row:span 3}
.ladder{grid-column:1 / -1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--gap)}
.ladder > li{display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:subgrid; grid-row:span 4; row-gap:8px; padding:20px; background:var(--card); border:1px solid var(--line); border-radius:8px}
.ladder > li#pilot{border-color:var(--accent); box-shadow:inset 0 3px 0 var(--accent)}
.ladder .n{font-family:var(--mono); font-size:12px; line-height:1.4; font-weight:600; color:var(--accent)}
.ladder h3{font-size:18px; line-height:1.3; font-weight:650}
.pr{font-size:20px; line-height:1.2; font-weight:700; letter-spacing:-.01em; color:var(--text)}
.pr small{display:block; margin-top:2px; font-size:13px; font-weight:400; letter-spacing:0; color:var(--muted)}
.ladder p:not(.pr){font-size:14px; line-height:1.5; color:var(--muted)}
.extra{grid-column:1 / -1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--gap); margin-top:var(--gap)}
.extra li{display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:subgrid; grid-row:span 3; row-gap:6px; padding:18px 20px; background:var(--card-2); border:1px solid var(--line); border-radius:8px}
.extra h3{font-size:16px; line-height:1.35; font-weight:650}
.extra .pr{font-size:16px}
.extra p:not(.pr){font-size:14px; line-height:1.5; color:var(--muted)}
.extra a{color:var(--text); border-bottom:1px solid var(--line-2); white-space:nowrap}
.extra a:hover{border-bottom-color:var(--accent)}
.tiles{grid-column:1 / -1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap)}
.tiles a{display:flex; flex-direction:column; gap:8px; height:100%; padding:20px; background:var(--card); border:1px solid var(--line); border-radius:8px; color:var(--text)}
.tiles a:hover{border-color:var(--text)}
.tiles h3{font-size:18px; line-height:1.3; font-weight:650}
.tiles p{font-size:14px; line-height:1.5; color:var(--muted); flex:1}
.tiles .more{font-size:14px; font-weight:600; color:var(--accent)}
.faq{grid-column:1 / -1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap)}
.faq-i{padding:20px; background:var(--card); border:1px solid var(--line); border-radius:8px}
.faq-i h3{font-size:16px; line-height:1.35; font-weight:650; margin-bottom:8px}
.faq-i p{font-size:14px; line-height:1.55; color:var(--muted)}
.contacts{grid-column:1 / -1; display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:var(--gap)}
.c-info{grid-column:1 / span 5; display:flex; flex-direction:column; gap:18px}
.c-info h2{font-size:30px; line-height:1.2; font-weight:650}
.c-info .txt{color:var(--muted)}
.c-info .big{font-size:22px; font-weight:700; letter-spacing:-.01em; color:var(--text); font-family:var(--mono)}
.c-info .ci-h{font-size:12px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--muted)}
.mrow{display:flex; flex-wrap:wrap; gap:8px}
.mrow a{display:inline-flex; align-items:center; justify-content:center; gap:6px; height:44px; padding:0 14px; border:1px solid var(--line-2); border-radius:8px; background:var(--card); font-size:14px; font-weight:600; color:var(--text)}
.mrow a:hover{border-color:var(--accent); color:var(--accent)}
.ent{margin-top:auto; font-size:13px; line-height:1.5; color:var(--muted); border-top:1px solid var(--line); padding-top:14px}
.c-form{grid-column:6 / span 7; padding:24px; background:var(--card-2); border:1px solid var(--line); border-radius:8px}
.c-form h3{font-size:18px; font-weight:650; margin-bottom:14px}
.c-form .form-inputs{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px var(--gap)}
.c-form .form-inputs h3,.c-form .form-inputs label.wide{grid-column:1 / -1}
.c-form label{display:flex; flex-direction:column; gap:6px; margin:0}
.c-form .lab{font-size:13px; font-weight:600}
.c-form .opt-mark{font-weight:400; color:var(--muted)}
.c-form input,.c-form textarea,.c-form select{width:100%; min-height:46px; padding:10px 14px; border:1px solid var(--line-2); border-radius:8px; background:#FFFFFF; color:var(--text); font:500 16px/1.4 var(--sans)}
.c-form textarea{min-height:84px; resize:vertical}
/* соседняя колонка выше формы — лишнюю высоту берёт поле задачи, а не пустота под кнопкой */
.contacts .c-form{display:flex; flex-direction:column}
.contacts .c-form .fields{flex:1 1 auto; display:flex; flex-direction:column}
.contacts .c-form .form-inputs{flex:1 1 auto; grid-template-rows:auto 1fr}
.contacts .c-form label.wide{min-height:0}
.contacts .c-form label.wide textarea{flex:1 1 auto}
.c-form input:focus,.c-form textarea:focus,.c-form select:focus{border-color:var(--text)}
.c-form .hint{font-size:12px; color:var(--muted)}
.c-form .submit{margin-top:18px}
.c-form .form-tail{display:flex; flex-direction:column; gap:8px; margin-top:12px; font-size:12px; line-height:1.5; color:var(--muted)}
.c-form .form-tail a{border-bottom:1px solid var(--line-2); white-space:nowrap}
.c-form .form-error{display:none; padding:11px 12px; border:1px solid rgba(185,58,58,.22); border-radius:8px; background:rgba(185,58,58,.06); color:#7E2929; font-size:13px; line-height:1.5}
.c-form .form-error a{color:var(--accent); font-weight:600; text-decoration:underline; text-underline-offset:2px; border:0}
.c-form.has-error .form-error{display:block}
.c-form .ok{display:none; text-align:center; padding:30px 10px}
.c-form .ok .chk{width:46px; height:46px; border-radius:50%; background:var(--accent-soft); color:var(--accent); display:grid; place-items:center; margin:0 auto 14px; font-size:1.4rem}
.c-form .ok h3{margin-bottom:6px}
.c-form .ok p{color:var(--muted); font-size:14px}
.c-form.done .fields{display:none}
.c-form.done .ok{display:block}
.mcta{display:none}
@media (max-width:1023px){
  .ladder{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tiles,.faq{grid-template-columns:repeat(2,minmax(0,1fr))}
  .c-info,.c-form{grid-column:1 / -1}
  .c-form{margin-top:24px}
}
@media (max-width:720px){
  .sx{padding:36px 0}
  .sx-head{flex-direction:column; align-items:flex-start; margin-bottom:18px}
  .sx-head h2,.c-info h2{font-size:24px}
  .grp-wide .svc{grid-template-columns:minmax(0,1fr)}
  .grp-wide .svc li:nth-child(even){border-left:0}
  .pair{display:flex; flex-direction:column; gap:var(--gap)}
  .pair .grp,.pair .grp .svc{display:block}
  .grp-h{padding:16px 16px 12px}
  .svc a{padding:12px 40px 13px 16px}
  .svc a::after{right:16px; top:12px}
  .ladder,.extra{grid-template-columns:minmax(0,1fr)}
  .ladder > li{padding:16px}
  .tiles,.faq{grid-template-columns:minmax(0,1fr); gap:12px}
  .c-form{margin-inline:calc(-1 * var(--gutter)); padding:24px var(--gutter); border-radius:0; border-left:0; border-right:0}
  .c-form .form-inputs{grid-template-columns:minmax(0,1fr)}
  .c-form .submit{width:100%}
  .mcta{position:fixed; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom)); z-index:90; display:flex; gap:8px; visibility:hidden}
  .mcta.show{visibility:visible}
  .mcta-call{flex:none; width:46px; display:grid; place-items:center; background:var(--card); border:1px solid var(--line-2); border-radius:8px; color:var(--accent); box-shadow:0 10px 30px -12px rgba(14,20,27,.35)}
  .mcta-btn{flex:1; min-width:0; padding:6px 8px; font-size:13px; box-shadow:0 10px 30px -12px rgba(14,20,27,.5)}
}
@media (max-width:420px){
  .mrow{gap:6px}
  .mrow a{gap:4px; padding:0 8px; font-size:13px}
}

/* ---------- страницы отраслей и услуг (этап 2, 11.11.2026) ---------- */
/* первый экран — как на главной: польза слева, фото основателя справа уходит в белое; высоту задаёт текст */
.phero{position:relative; overflow:hidden; background:var(--bg); border-bottom:1px solid var(--line)}
.phero-photo{position:absolute; top:0; right:0; bottom:0; left:calc(50% + var(--gap) / 2); margin:0; display:block}
.phero-photo img{display:block; width:100%; height:100%; object-fit:cover; object-position:85% 50%;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 38%); mask-image:linear-gradient(90deg,transparent 0,#000 38%)}
.phero-grid{position:relative; z-index:1}
.phero-copy{grid-column:1 / span 6; display:flex; flex-direction:column; align-items:flex-start; padding:28px 0 44px}
.crumb{display:flex; flex-wrap:wrap; gap:4px 8px; margin-bottom:28px; font-size:13px; line-height:1.4; color:var(--muted)}
.crumb a{color:var(--muted); border-bottom:1px solid var(--line-2)}
.crumb a:hover{color:var(--text); border-bottom-color:var(--accent)}
.crumb .sep{color:var(--faint)}
.phero .kicker{display:flex; align-items:center; gap:10px; margin-bottom:16px; font-size:12px; line-height:1.4; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.phero .kicker::before{content:""; width:28px; height:1px; background:var(--accent); flex:none}
.phero h1{font-size:clamp(28px,3vw,48px); line-height:1.08; font-weight:700; letter-spacing:-.03em; margin-bottom:18px; text-wrap:balance}
.phero .lead{font-size:17px; line-height:1.55; max-width:36em; margin-bottom:24px}
.acts{display:flex; flex-wrap:wrap; align-items:center; gap:12px}
.phero .note{margin-top:14px; max-width:36em; font-size:13px; line-height:1.45; color:var(--muted)}
/* где теряются деньги: число, что произошло, что делает система; ряды без остатка */
.loss{grid-column:1 / -1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap)}
.loss.n4{grid-template-columns:repeat(4,minmax(0,1fr))}
.loss > li{display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:subgrid; grid-row:span 3; row-gap:8px; padding:20px; background:var(--card); border:1px solid var(--line); border-radius:8px}
.loss .num{font-size:30px; line-height:1.1; font-weight:700; letter-spacing:-.02em; color:var(--text); font-variant-numeric:tabular-nums; white-space:nowrap}
.loss .num small{margin-left:6px; font-size:14px; font-weight:500; letter-spacing:0; color:var(--muted)}
.loss h3{font-size:16px; line-height:1.35; font-weight:650}
.loss p{font-size:14px; line-height:1.5; color:var(--muted)}
.note-src{grid-column:1 / -1; margin-top:16px; max-width:100ch; font-size:13px; line-height:1.45; color:var(--muted)}
/* экраны системы парами: у пары одна высота кадра (--ar), подписи на одном уровне */
.shots{grid-column:1 / -1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px var(--gap)}
.shots figure{display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:subgrid; grid-row:span 2; row-gap:14px; margin:0}
.shots img{display:block; width:100%; height:auto; aspect-ratio:var(--ar,16 / 9); object-fit:contain; background:#0B121C; border:1px solid var(--line); border-radius:8px}
.shots figcaption{display:flex; flex-direction:column; gap:6px}
.shots figcaption h3{font-size:16px; line-height:1.35; font-weight:650}
.shots figcaption p{font-size:14px; line-height:1.5; color:var(--muted)}
/* ролик рядом с текстом: секция скрыта, пока файла ролика нет на сервере; ширина ролика в колонках подобрана так,
   чтобы его высота совпала с текстом; заголовок — по верху ролика, кнопка — по низу */
.vslot-box{grid-column:1 / span 2; margin:0; align-self:start}
.vslot-box video{display:block; width:100%; height:auto; aspect-ratio:9 / 16; background:#0B121C; border-radius:8px}
.vslot-txt{grid-column:3 / -1; display:flex; flex-direction:column; justify-content:space-between; gap:16px}
.vslot-txt h2{font-size:30px; line-height:1.2; font-weight:650}
.vslot-txt .vq{margin:0; padding:0 0 0 20px; border-left:2px solid var(--accent); display:flex; flex-direction:column; gap:12px}
.vslot-txt .vq p{font-size:18px; line-height:1.6}
.vslot-txt .sx-cta{margin-top:8px}
@media (max-width:1179px){.vslot-box{grid-column:1 / span 3} .vslot-txt{grid-column:4 / -1} .vslot-txt .vq{max-width:38em} .vslot-txt .vq p{font-size:17px}}
@media (max-width:1023px){.vslot-txt .vq{max-width:none} .vslot-txt .vq p{font-size:16px}}
@media (max-width:899px){.vslot-box{grid-column:1 / span 5} .vslot-txt{grid-column:6 / -1}}
/* ссылка на обзор в «Работах» — одна карточка во всю раму */
.revlink{grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:16px 32px; padding:24px; background:var(--card-2); border:1px solid var(--line); border-radius:8px}
.revlink > div{display:flex; flex-direction:column; gap:8px; max-width:80ch}
.revlink h2{font-size:22px; line-height:1.25; font-weight:650}
.revlink p{font-size:14px; line-height:1.5; color:var(--muted)}
@media (max-width:1279px){
  .phero-copy{grid-column:1 / span 7}
  .phero-photo{left:calc(50% + (100% - 2 * var(--gutter)) / 12 + var(--gap) * 7 / 12)}
  .phero-photo img{object-position:50% 50%; -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 34%); mask-image:linear-gradient(90deg,transparent 0,#000 34%)}
}
@media (max-width:1023px){
  .phero-photo{position:relative; left:auto; right:auto; top:auto; bottom:auto; height:clamp(196px,44vw,340px)}
  .phero-photo img{object-position:50% 22%; -webkit-mask-image:linear-gradient(180deg,#000 62%,transparent 100%); mask-image:linear-gradient(180deg,#000 62%,transparent 100%)}
  .phero-copy{grid-column:1 / -1; padding:16px 0 36px}
  .loss,.loss.n4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .crumb{margin-bottom:16px}
  .phero .lead{font-size:16px}
  .acts{align-self:stretch}
  .acts .btn,.acts .btn-secondary{width:100%; justify-content:center}
  .loss,.loss.n4,.shots{grid-template-columns:minmax(0,1fr); gap:12px}
  .shots{row-gap:28px}
  .loss .num{font-size:26px}
  .vslot-box{grid-column:2 / span 10}
  .vslot-txt{grid-column:1 / -1; margin-top:24px; justify-content:flex-start}
  .vslot-txt h2{font-size:24px}
  .revlink{flex-direction:column; align-items:flex-start; padding:20px 16px}
  .revlink .btn-secondary{width:100%; justify-content:center}
}
/* ---------- страницы услуг (этап 2В, 11.11.2026): для кого → что получите → как работаем → цена и срок → пример → вопросы → заявка ---------- */
/* первый экран услуги: польза слева, справа — для кого; без фото, высоту задаёт текст */
.ph-who .phero-copy{grid-column:1 / span 7}
.who{grid-column:8 / -1; align-self:stretch; display:flex; flex-direction:column; margin:28px 0 44px; padding:20px 24px 6px; background:var(--card); border:1px solid var(--line); border-radius:8px}
.who h2{margin-bottom:4px}
.who ul{display:flex; flex-direction:column; flex:1}
.who li{flex:1; display:flex; flex-direction:column; justify-content:center; gap:4px; padding:14px 0; border-top:1px solid var(--line)}
.who li:first-child{border-top:0}
.who h3{font-size:16px; line-height:1.35; font-weight:650}
.who p{font-size:14px; line-height:1.5; color:var(--muted)}
.who a{display:flex; flex-direction:column; gap:4px; color:var(--text)}
.who a:hover h3{color:var(--accent)}
.who.compact li{padding:10px 0}
.who-foot{display:flex; flex-direction:column; gap:4px; padding:14px 0 16px; border-top:1px solid var(--line); font-size:14px; line-height:1.5; color:var(--muted)}
.who-foot b{font-size:18px; line-height:1.3; font-weight:700; letter-spacing:-.01em; color:var(--text); font-variant-numeric:tabular-nums}
/* карточки: шесть — 3×2; четыре — одним рядом; пять — 3 + 2 на 12 колонках; без остатка в ряду */
.dcards,.cards{grid-column:1 / -1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap)}
.cards.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cards.n4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cards.n5{grid-template-columns:repeat(12,minmax(0,1fr))}
.cards.n5 > li{grid-column:span 4}
.cards.n5 > li:nth-child(n+4){grid-column:span 6}
.dcards > li,.cards > li{display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:subgrid; grid-row:span 3; row-gap:8px; padding:20px; background:var(--card); border:1px solid var(--line); border-radius:8px}
.dcards .k,.cards .k{font-family:var(--mono); font-size:12px; line-height:1.4; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--accent)}
.dcards h3,.cards h3{font-size:16px; line-height:1.35; font-weight:650}
.dcards p:not(.k),.cards p:not(.k){font-size:14px; line-height:1.5; color:var(--muted)}
.extra.solo{margin-top:0}
/* вопросы в две колонки; нечётный последний — во всю ширину */
.faq.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.faq.c2 > .faq-i:last-child:nth-child(odd){grid-column:1 / -1}
/* пример из «Работ» и «ещё по теме» */
.ex-rev{margin-top:32px}
.revlink h3{font-size:18px; line-height:1.3; font-weight:650}
nav.more{grid-column:1 / -1; display:flex; flex-direction:column; gap:2px; margin-top:28px; padding-top:20px; border-top:1px solid var(--line)}
nav.more ul{display:flex; flex-wrap:wrap; gap:0 24px}
/* ссылка — цель нажатия 44 px, подчёркивание у текста */
nav.more a{display:inline-flex; align-items:center; gap:5px; min-height:44px; font-size:15px; line-height:1.4; color:var(--text); text-decoration:underline; text-decoration-color:var(--line-2); text-decoration-thickness:1px; text-underline-offset:5px}
nav.more a:hover{text-decoration-color:var(--accent)}
@media (max-width:1279px){
  .who li{padding:10px 0}
  .who-foot{padding:10px 0 12px}
}
@media (max-width:1023px){
  .ph-who .phero-copy{grid-column:1 / -1; padding:16px 0 24px}
  .who{grid-column:1 / -1; margin:0 0 36px}
  .dcards,.cards,.cards.n4,.cards.n5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cards.n5 > li,.cards.n5 > li:nth-child(n+4){grid-column:auto}
  .cards.n3 > li:last-child,.cards.n5 > li:last-child{grid-column:1 / -1}
}
@media (max-width:720px){
  .who{padding:16px 16px 4px}
  .dcards,.cards,.cards.n2,.cards.n4,.cards.n5{grid-template-columns:minmax(0,1fr); gap:12px}
  .cards.n3 > li:last-child,.cards.n5 > li:last-child{grid-column:auto}
  .faq.c2{grid-template-columns:minmax(0,1fr)}
  .faq.c2 > .faq-i:last-child:nth-child(odd){grid-column:auto}
  .ex-rev{margin-top:28px}
  nav.more ul{flex-direction:column; align-items:flex-start}
}
/* ---------- /presentation/ (v5.1, 11.11.2026): три PDF, все слайды, фильм, практикум ---------- */
/* первый экран: польза слева, справа — четыре числа первого шага 2×2 во всю высоту текста; без фото */
.pres-hero .phero-copy{grid-column:1 / span 7}
.pfacts{grid-column:8 / -1; align-self:stretch; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:1fr; gap:12px; margin:28px 0 44px}
.pfacts li{display:flex; flex-direction:column; justify-content:center; gap:6px; padding:16px 20px; background:var(--card-2); border:1px solid var(--line); border-radius:8px}
.pfacts b{font-size:26px; line-height:1.15; font-weight:700; letter-spacing:-.02em; color:var(--text); font-variant-numeric:tabular-nums; white-space:nowrap}
.pfacts span{min-height:2.9em; font-size:14px; line-height:1.45; color:var(--muted)}
/* три презентации по 4 колонки: описание растягивается, подпись и кнопки — на одном уровне */
.pdecks{grid-column:1 / -1; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap)}
.pdeck{display:flex; flex-direction:column; min-width:0; background:var(--card); border:1px solid var(--line); border-radius:8px; overflow:hidden}
.pdeck-cov{display:block; border-bottom:1px solid var(--line)}
.pdeck-cov img{display:block; width:100%; height:auto; aspect-ratio:16 / 9; object-fit:cover}
.pdeck-b{flex:1; display:flex; flex-direction:column; gap:8px; padding:18px 20px 20px}
.pdeck-b h3{font-size:18px; line-height:1.3; font-weight:650}
.pdeck-b p{flex:1; font-size:14px; line-height:1.5; color:var(--muted)}
:is(.pdeck-b,.pfilm-cap,.pprac-t) .meta{display:block; font-family:var(--mono); font-size:12px; line-height:1.4; color:var(--faint)}
.pacts{display:flex; flex-wrap:wrap; gap:8px 12px; margin-top:8px}
/* слайды: по 4 в ряд (16 и 8 — без остатка), у каждой презентации своя подпись */
.pslides{grid-column:1 / -1}
.pslides + .pslides{margin-top:28px}
.pslides h3{display:flex; align-items:baseline; gap:10px; margin-bottom:12px; font-size:18px; line-height:1.3; font-weight:650}
.pslides h3 span{font-family:var(--mono); font-size:12px; font-weight:600; color:var(--accent)}
.pthumbs{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
.pthumbs a{display:block; border:1px solid var(--line); border-radius:6px; overflow:hidden}
.pthumbs a:hover{border-color:var(--text)}
.pthumbs img{display:block; width:100%; height:auto; aspect-ratio:16 / 9; object-fit:cover}
/* фильм: кадр на 7 колонок, текст — 5; заголовок по верху кадра, ссылка по низу */
.pfilm-box{grid-column:1 / span 7; margin:0}
.pfilm-box video{display:block; width:100%; height:auto; aspect-ratio:16 / 9; background:#0B121C; border-radius:8px}
.pfilm-txt{grid-column:8 / -1; display:flex; flex-direction:column; justify-content:space-between; gap:16px}
.pfilm-txt h2{font-size:30px; line-height:1.2; font-weight:650; text-wrap:balance}
.pfilm-txt .sub{margin-top:8px; color:var(--muted)}
.pfilm-cap{display:flex; flex-direction:column; gap:6px; padding-left:20px; border-left:2px solid var(--accent); font-size:14px; line-height:1.5; color:var(--muted)}
/* практикум: одна карточка во всю раму; рабочие листы — по нажатию, 4 колонки по 5 */
.pprac{grid-column:1 / -1; display:flex; flex-wrap:wrap; align-items:center; gap:16px 32px; padding:20px 24px; background:var(--card-2); border:1px solid var(--line); border-radius:8px}
.pprac-n{display:flex; align-items:baseline; gap:10px; flex:none}
.pprac-n b{font-size:30px; line-height:1.1; font-weight:700; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.pprac-n span{font-size:14px; line-height:1.4; color:var(--muted)}
.pprac-t{flex:1 1 320px; display:flex; flex-direction:column; gap:6px; font-size:14px; line-height:1.5; color:var(--muted)}
.pprac .pacts{flex:none; margin-top:0}
.pwork{grid-column:1 / -1; margin-top:12px}
.pwork summary{display:inline-flex; align-items:center; gap:6px; min-height:44px; cursor:pointer; list-style:none; font-size:15px; font-weight:600; color:var(--text); text-decoration:underline; text-decoration-color:var(--line-2); text-decoration-thickness:1px; text-underline-offset:5px}
.pwork summary::-webkit-details-marker{display:none}
.pwork summary::after{content:"↓"; color:var(--accent)}
.pwork[open] summary::after{content:"↑"}
.pwork summary:hover{text-decoration-color:var(--accent)}
.pwork ul{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0 var(--gap); margin-top:4px; padding-top:4px; border-top:1px solid var(--line)}
.pwork a{display:flex; align-items:center; min-height:44px; font-size:14px; line-height:1.4; color:var(--text); text-decoration:underline; text-decoration-color:var(--line-2); text-underline-offset:4px}
.pwork a:hover{text-decoration-color:var(--accent)}
@media (max-width:1279px){
  .pfacts li{padding:14px 16px}
  .pfacts b{font-size:22px}
}
/* уже 1180 три карточки не вмещают две кнопки в ряд — презентации одна под другой: обложка слева, текст справа */
@media (max-width:1179px){
  .pdecks{grid-template-columns:minmax(0,1fr)}
  .pdeck{display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:var(--gap)}
  .pdeck-cov{grid-column:1 / span 5; border-bottom:0; border-right:1px solid var(--line)}
  .pdeck-cov img{height:100%}
  .pdeck-b{grid-column:6 / -1; padding:18px 20px 20px 0}
  .pprac .pacts{flex-basis:100%}
}
@media (max-width:1023px){
  .pres-hero .phero-copy{grid-column:1 / -1; padding:16px 0 24px}
  .pfacts{grid-column:1 / -1; grid-template-columns:repeat(4,minmax(0,1fr)); margin:0 0 36px}
  .pfilm-box,.pfilm-txt{grid-column:1 / -1}
  .pfilm-txt{margin-top:20px; justify-content:flex-start}
  .pwork ul{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:820px){
  .pfacts{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .pdeck{display:flex}
  .pdeck-cov{border-right:0; border-bottom:1px solid var(--line)}
  .pdeck-cov img{height:auto}
  .pdeck-b{padding:16px}
  .pthumbs{grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px}
  .pslides h3{font-size:16px}
  .pfilm-txt h2{font-size:24px}
  .pprac{flex-direction:column; flex-wrap:nowrap; align-items:stretch; padding:16px}
  .pprac .pacts{flex-basis:auto}
  .pprac-t{flex:none}
  .pprac .pacts,.pfilm-txt .pacts{flex-direction:column; align-items:stretch}
  .pprac .pacts > a,.pfilm-txt .pacts > a{justify-content:center}
  .pwork ul{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:480px){
  .pfacts b{font-size:20px}
}
@media (max-width:360px){
  .pfacts{grid-template-columns:minmax(0,1fr)}
  .pdeck .pacts{flex-direction:column; align-items:stretch}
  .pdeck .pacts > a{justify-content:center}
}