/* ——— SITE-MVC 05.11.2026 (Claude, D-111): компоненты MVC на всём сайте — этапы 3 и 4 перевода (BRAND_KIT §4–§6, §10).
   Этап 3 — «островки» старых систем внутри уроков мини-курса (#1438, #1724–1726): карточки критериев, позы, перевёртыши, чек-лист,
            шкала Кельвинов, меню, карточки тренажёров, итоги и пары скриншотов урока 4 — в виде компонентов MVC.
   Этап 4 — страницы сайта на `mlc` / `mart` / `mwk` / `mbw` / `mhm` / `mab`: обложка, шапки разделов с контурным номером,
            карточки-шаги, кнопки (оранжевый только на тёмном), финал → терракотовая карточка `mvc-next`, «Коротко» → `mvc-thesis`,
            выноски → `mvc-note`, таблицы → `mvc-table`, ширина 880 / 1200 / весь экран.
   Скрипты и разметка страниц не меняются: слой только перерисовывает старые классы по правилам MVC. Подключает mu-plugin
   matis-site-etalon.php (после site-etalon.css). Откат — удалить site-mvc.css. Исходник — Assets/Design/Site-MVC-2026-11-05/. */

/* ════════ 0. Токены и ширина (§2, §4.1) ════════ */
html{--ms-w:1200px;--ms-line:820px}
html[data-mvc-w="narrow"]{--ms-w:880px;--ms-line:680px}
html[data-mvc-w="full"]{--ms-w:calc(100vw - 64px);--ms-line:960px}
@media (max-width:980px){html,html[data-mvc-w]{--ms-w:100%;--ms-line:100%}}
body :is(.mlc,.mart,.mwk){--paper:#f2efe8;--band:#e8e3d7;--card:#fbfaf6;--ink:#0e0e0c;--text:#2a2723;--muted:#686056;--line:#d8d0c0;--acc:#894a1f;--acc-h:#6b3816;--brown:#894a1f;--clay:#94531f;--night:#151311;--night2:#1d1a17;--terra:#8f4a22;--good:#2a7247}

/* ════════ ЭТАП 3. Уроки мини-курса: островки старых систем → компоненты MVC ════════ */
/* в плеере стили урока идут с префиксом #masteriyo-interactive-course, поэтому правила островков — с тем же весом */
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl{--card:#fbfaf6;--line:#d8d0c0;--brown:#894a1f;--acc:#894a1f;--muted:#686056;--night:#151311;--bad:#a33a2a}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .wrap :is(h3,h4){text-wrap:balance}

/* критерии с фото (урок 2 «4 критерия локации», «Как спасти съёмку в полдень», урок 3 «Хват») → mvc-card + mvc-card-img */
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .wrap > .crit{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch;margin-top:20px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .wrap > .crit.three{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-card{height:100%;gap:0;background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:translate .3s cubic-bezier(.16,1,.3,1),box-shadow .3s}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-card > *:not(.crit-ph){padding-left:20px;padding-right:20px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-card > :last-child{padding-bottom:20px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-card .crit-ph{margin:0;border-radius:0;aspect-ratio:3/2}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-card > .crit-head:first-child{padding-top:20px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-head{display:flex;align-items:baseline;gap:8px;padding-top:16px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-no{font-family:"Russo One",sans-serif;font-size:17px!important;line-height:1.15;color:var(--acc);-webkit-text-stroke:0}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-head h3{font-size:17px;line-height:1.15;text-transform:uppercase;padding-left:0;border-left:0;color:var(--ink,#0e0e0c)}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-card p:not(.crit-no){font-size:13.5px;line-height:1.5}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-card .crit-head + *{padding-top:8px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .wrap > .crit-ph{border-radius:16px;background:var(--band,#e8e3d7)}
@media (hover:hover) and (pointer:fine){html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-card:hover{translate:0 -3px;box-shadow:0 14px 28px -18px rgba(14,14,12,.45)}}

/* позы (урок 3) → карточки с фото, текст 13.5 px, ряд одной высоты */
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .wrap > .poses{gap:12px;align-items:stretch}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .pose-card{height:100%;gap:6px;padding-bottom:16px;background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .pose-card > *:not(.pose-ph){padding-left:14px;padding-right:14px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .pose-ph{margin:0 0 6px;border-radius:0}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .pose-card.bad .pose-ph::after,html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .pose-card.caution .pose-ph::after{border-radius:0}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .pose-card h3{font-size:14px;line-height:1.2}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .pose-card p:not(.pose-tag){font-size:13.5px;line-height:1.5}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .pose-tag{padding:5px 9px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.04em;background:rgba(21,19,17,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .pose-card.bad .pose-tag{background:var(--bad)}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .pose-card.caution .pose-tag{background:#151311;color:#fd7e2f}

/* перевёртыши «абстрактно → конкретно» (урок 3) → mvc-flip: лицо светлое, оборот тёмный, без зачёркивания (§6.11a) */
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .wrap > .flips{gap:12px;align-items:stretch}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .flip-face{border-radius:16px;padding:20px 22px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .flip-front{background:var(--card);border:1px solid var(--line)}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .flip-back{background:#151311;color:#f1ece2}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .flip-front .fl-k{color:#94531f}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .flip-back .fl-k{color:#fd7e2f}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .fl-k{font-size:12px;letter-spacing:.12em}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .flip-front .fl-t{text-decoration:none;color:var(--ink,#0e0e0c);font-size:20px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .flip-back .fl-t{color:#f1ece2;font-size:15px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .fl-h{font-size:12px}

/* чек-лист со счётчиком (уроки 1–4): без липкого счётчика (§10.13), пункты — плитки MVC */
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .cl-meter{position:static}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .cl-list li{border-radius:14px;background:var(--card);border-color:var(--line);font-size:15px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .cl-list li::before{border-radius:6px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .cl-list li.on{border-color:var(--acc)}

/* шкала Кельвинов (урок 1) — плитки одной высоты, радиус 12 */
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .kel-row{gap:10px;align-items:stretch}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .kel-m{height:100%;border-radius:12px;background:var(--card)}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .kel-t{font-size:12.5px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .kel-cap{font-size:13px}

/* меню телефона/камеры (урок 1) — тёмные карточки MVC */
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .menus{gap:12px;align-items:stretch}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .menu{height:100%;border-radius:16px;background:#151311;color:#cfc6b8;padding:22px 24px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .menu strong{color:#fff}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .menu-k{font-size:12px;color:#9d9488}

/* ролик-повторение и карточка тренажёра — тёмные блоки 20 px, кнопка — оранжевая с тёмным текстом */
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .reel,html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .wrap > .tr-card{border-radius:20px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .tr-card h3{font-size:22px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .tr-card .tr-d{color:#cfc6b8;font-size:14.5px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .tr-card a.tr-go{background:#fd7e2f;color:#151311}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .tr-card a.tr-alt{border-color:rgba(241,236,226,.3);color:#f1ece2}

/* урок 4: итог, части, дерево папок, пары скриншотов */
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .wrap > .l4-result{border-radius:20px;background:#151311}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .l4-result h3{text-transform:uppercase;font-size:22px;line-height:1.15;color:#fff}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .l4-result .l4-res-d{color:#cfc6b8}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .l4-result .l4-res-s{color:#9d9488;font-size:13px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .l4-parts{gap:12px;align-items:stretch}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .l4-parts > *{height:100%;border-radius:14px}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .l4-tree{border-radius:14px;background:#151311}
html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .l4-fig img{border-radius:14px}

@media (max-width:900px){
  html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .wrap > .crit.three{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .wrap > .crit,html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .wrap > .crit.three{grid-template-columns:1fr;max-width:none}
  html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-card .crit-ph{aspect-ratio:16/9}
  html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .flip-front .fl-t{font-size:18px}
}
@media (prefers-reduced-motion:reduce){html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-card{transition:none}html body :is(#masteriyo-interactive-course,#brx-content) .mvc .mvc-isl .crit-card:hover{translate:none}}

/* ════════ ЭТАП 4. Страницы сайта ════════ */

/* — 4.1 Колонка и контейнер (§4.1, §4.2) — */
html body .mlc .mlc-wrap{max-width:var(--ms-w)}
html body .mlc .mlc-lead{max-width:min(640px,var(--ms-line))}

/* — 4.2 Обложка (§6.1): тёмная карточка стыкуется с шапкой, скругление только снизу; H1 42 / 27 px; лид 16 px — */
html body .mlc.mlc-hero{background:var(--paper);padding:0}
html body .mlc.mlc-hero > .mlc-card{border:0;border-radius:0 0 20px 20px;background:#151311;margin-left:0;margin-right:0;width:auto}
/* главная: под обложкой — тёмная бегущая строка, поэтому фон под скруглением тоже тёмный */
html body .mlc.mlc-hero:has(+ .mlc.mhm-run){background:#151311}
html body .mlc.mlc-hero > .mlc-card::before{background:radial-gradient(55% 70% at 92% 0%,rgba(253,126,47,.22),transparent 70%),radial-gradient(45% 60% at 0% 100%,rgba(137,74,31,.42),transparent 70%)}
html body .mlc.mlc-hero .mlc-hero-grid{max-width:var(--ms-w)}
html body .mlc.mlc-hero h1,html body .mlc.mlc-hero h1.mhd-h1s{font-size:42px!important;line-height:1.06!important;text-wrap:balance}
html body .mlc.mlc-hero :is(.mlc-hero-lead,.mhm-hero .mlc-hero-lead){font-size:16px;line-height:1.6;color:#cfc6b8;max-width:600px}

/* — 4.3 Шапка раздела (§6.2): контурный номер 01, 02… слева, H2 34 px, подзаголовок `--muted` — */
html body #brx-content{counter-reset:ms-sec}
html body .mlc:not(.mlc-hero):not(.mlc-fin) .mlc-head{counter-increment:ms-sec;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:22px;row-gap:0;align-items:end;text-align:left;max-width:var(--ms-line);margin-bottom:32px}
html body .mlc:not(.mlc-hero):not(.mlc-fin) .mlc-head::before{content:counter(ms-sec,decimal-leading-zero);grid-column:1;grid-row:1 / span 12;align-self:start;margin-top:2px;font-family:"Russo One",sans-serif;font-size:88px;line-height:.78;color:transparent;-webkit-text-stroke:1.5px var(--acc)}
html body .mlc:not(.mlc-hero):not(.mlc-fin) .mlc-head > *{grid-column:2;margin:0;max-width:620px}
html body .mlc:not(.mlc-hero):not(.mlc-fin) .mlc-head > * + *{margin-top:10px}
html body .mlc:not(.mlc-hero):not(.mlc-fin) .mlc-head h2{font-size:34px;line-height:1.08}
html body .mlc:not(.mlc-hero):not(.mlc-fin) .mlc-head .mlc-lead{font-size:15px;line-height:1.5;color:var(--muted)}
html body .mlc .mlc-head.mlc-head-c{align-items:end;margin-left:auto;margin-right:auto}
html body .mlc .mhm-row > .mlc-head{max-width:none}
/* тёмные разделы: номер оранжевый, подзаголовок светлый */
html body :is(.mlc#program,.mlc.mhm-dark,.mlc.mab-mission,.mlc.mab-films) .mlc-head::before{-webkit-text-stroke-color:#fd7e2f}
html body :is(.mlc#program,.mlc.mhm-dark,.mlc.mab-mission,.mlc.mab-films) .mlc-head .mlc-lead{color:#9d9488}

/* — 4.4 Карточки-шаги `mlc-cols` → `mvc-step` (§6.5): рамка, контурная цифра 44 px, ряд одной высоты — */
html body .mlc .mlc-cols{gap:12px;align-items:stretch}
html body .mlc .mlc-col{height:100%;border:1px solid var(--line);border-radius:16px;background:var(--card);padding:22px 22px 24px;gap:10px}
html body .mlc .mlc-col-n{font-size:44px;-webkit-text-stroke:1.5px var(--acc)}
html body .mlc .mlc-col h3{font-size:18px;line-height:1.15;text-transform:uppercase}
html body .mlc .mlc-col :is(p,li):not(.mlc-col-n){font-size:14.5px;line-height:1.55}
html body :is(.mlc#program,.mlc.mhm-dark,.mlc.mab-mission,.mlc.mab-films) .mlc-col{background:#1d1a17;border-color:rgba(241,236,226,.14);color:#cfc6b8}
html body :is(.mlc#program,.mlc.mhm-dark,.mlc.mab-mission,.mlc.mab-films) .mlc-col-n{-webkit-text-stroke-color:#fd7e2f}
html body :is(.mlc#program,.mlc.mhm-dark,.mlc.mab-mission,.mlc.mab-films) .mlc-col h3{color:#fff}

/* — 4.5 Строки-карточки `mlc-lsn` (курсы, уроки, разделы Wiki): номер коричневый на светлом, наведение — подъём 3 px — */
html body .mlc .mlc-lsn{border-radius:16px;transition:translate .3s cubic-bezier(.16,1,.3,1),box-shadow .3s,border-color .3s}
html body .mlc .mlc-lsn:hover{transform:none;translate:0 -3px;border-color:rgba(137,74,31,.45);box-shadow:0 14px 28px -18px rgba(14,14,12,.45)}
html body .mlc:not(#program) .mlc-lsn-no{font-size:88px;-webkit-text-stroke-color:var(--acc)}
html body .mlc:not(#program) .mlc-lsn:hover .mlc-lsn-no{color:transparent}
html body .mlc .mlc-lsn h3{font-size:22px;line-height:1.12}
html body .mlc .mlc-lsn.mlc-soon:hover{translate:none;box-shadow:none}
html body .mlc#program .mlc-lsn:hover{border-color:rgba(253,126,47,.45);box-shadow:0 14px 28px -18px rgba(0,0,0,.7)}

/* — 4.6 Кнопки (§6.9): на светлом — коричневые; на тёмном — оранжевая заливка с тёмным текстом (контраст ≥ 4.5:1) — */
html body .mlc .mlc-btn{border-radius:999px;font-size:14px;padding:13px 22px}
html body .mlc .mlc-btn:hover{transform:none;box-shadow:none}
html body .mlc:not(.mlc-hero):not(.mlc-fin):not(#program):not(.mhm-dark):not(.mab-mission):not(.mab-films):not(.mhm-run) .mlc-btn:not(.mlc-white):not(.mlc-off):not(.mlc-ghost):not(:is(.mhm-path--dark,.mbw-dark,.mart-cta,.mart-tip,.gp,.mpc) *){background:var(--acc);border-color:var(--acc);color:#fff!important}
html body .mlc:not(.mlc-hero):not(.mlc-fin):not(#program):not(.mhm-dark):not(.mab-mission):not(.mab-films):not(.mhm-run) .mlc-btn:not(.mlc-white):not(.mlc-off):not(.mlc-ghost):not(:is(.mhm-path--dark,.mbw-dark,.mart-cta,.mart-tip,.gp,.mpc) *):hover{background:var(--acc-h);border-color:var(--acc-h)}
html body .mlc:not(.mlc-hero):not(.mlc-fin):not(#program):not(.mhm-dark):not(.mab-mission):not(.mab-films):not(.mhm-run) .mlc-btn.mlc-ghost:not(:is(.mhm-path--dark,.mbw-dark,.mart-cta,.mart-tip,.gp,.mpc) *){background:transparent;border-color:var(--acc);color:var(--acc)!important}
html body .mlc:not(.mlc-hero):not(.mlc-fin):not(#program):not(.mhm-dark):not(.mab-mission):not(.mab-films):not(.mhm-run) .mlc-btn.mlc-ghost:not(:is(.mhm-path--dark,.mbw-dark,.mart-cta,.mart-tip,.gp,.mpc) *):hover{background:var(--acc);color:#fff!important}
html body :is(.mlc.mlc-hero,.mlc#program,.mlc.mhm-dark,.mlc.mab-mission,.mlc.mab-films,.mhm-path--dark,.mbw-dark,.mart-cta,.mart-tip) .mlc-btn:not(.mlc-ghost):not(.mlc-white):not(.mlc-off){background:#fd7e2f;border-color:#fd7e2f;color:#151311!important}
html body :is(.mlc.mlc-hero,.mlc#program,.mlc.mhm-dark,.mlc.mab-mission,.mlc.mab-films,.mhm-path--dark,.mbw-dark,.mart-cta,.mart-tip) .mlc-btn:not(.mlc-ghost):not(.mlc-white):not(.mlc-off):hover{background:#ff9450;border-color:#ff9450}
html body :is(.mlc.mlc-hero,.mlc#program,.mlc.mhm-dark,.mlc.mab-mission,.mlc.mab-films,.mhm-path--dark,.mbw-dark) .mlc-btn.mlc-ghost{border-color:rgba(241,236,226,.35);color:#f1ece2!important}
html body :is(.mlc.mlc-hero,.mlc#program,.mlc.mhm-dark,.mlc.mab-mission,.mlc.mab-films,.mhm-path--dark,.mbw-dark) .mlc-btn.mlc-ghost:hover{background:rgba(241,236,226,.1);border-color:#f1ece2;color:#fff!important}
html body .mlc .mlc-link{color:var(--acc)!important}
html body .mlc .mlc-link:hover{color:var(--acc-h)!important}

/* — 4.7 Финал `mlc-fin` → терракотовая карточка `mvc-next` (§6.14): текст слева, белая кнопка справа — */
html body .mlc.mlc-fin{background:var(--paper);color:var(--text);padding:72px 28px}
html body .mlc.mlc-fin > .mlc-wrap{display:grid!important;grid-template-columns:minmax(0,1fr) auto;column-gap:40px;row-gap:10px;align-items:center;text-align:left;max-width:var(--ms-w);margin:0 auto;padding:40px 44px;border-radius:20px;background:#8f4a22;color:#fbe9dc}
html body .mlc.mlc-fin > .mlc-wrap > *{grid-column:1;width:auto;max-width:620px;margin:0}
html body .mlc.mlc-fin > .mlc-wrap > .mlc-actions{grid-column:2;grid-row:1 / span 6;align-self:center;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:14px;max-width:none}
html body .mlc.mlc-fin .mlc-kicker{color:#ffd9bf}
html body .mlc.mlc-fin h2{font-size:28px;line-height:1.1;color:#fff}
html body .mlc.mlc-fin .mlc-lead{font-size:15px;line-height:1.6;color:#fbe9dc;max-width:560px}
html body .mlc.mlc-fin .mlc-btn.mlc-white{background:#fff;border-color:#fff;color:#6b3816!important;text-align:center;transition:translate .2s cubic-bezier(.2,.8,.2,1)}
html body .mlc.mlc-fin .mlc-btn.mlc-white:hover{background:#fff;border-color:#fff;color:#6b3816!important;translate:3px 0}
html body .mlc.mlc-fin .mlc-link.mlc-link-light{align-self:center;color:#fff!important}
html body .mlc.mlc-fin .mlc-link.mlc-link-light:hover{color:#ffd9bf!important}

/* — 4.8 Цитата, чипы — */
/* плашка-объявление ProRaw: без цветной полосы слева на скруглённой карточке (§6.11a) */
html body .mlc .mpr-notice{border:1px solid rgba(137,74,31,.32);border-radius:16px}
html body .mlc .mlc-quote{border-left-color:var(--acc)}
html body .mlc:not(.mlc-hero):not(#program):not(.mhm-dark) .mlc-chip:not(:is(.mhm-path--dark,.mbw-dark) *){background:var(--band);border-color:transparent;color:var(--acc-h)}

/* — 4.9 Блог: статья `mart` (§9) — */
/* без надписей-кикеров над заголовками разделов статьи (§5.1) */
html body .mart .mart-k:has(+ :is(h2,h3)):not(:is(.mart-key,.mart-tip,.mart-cta,.mart-nc,.mart-pc,.mart-term,.mart-author-tx) *){display:none}
html body .mart .mart-k:has(+ :is(h2,h3)):not(:is(.mart-key,.mart-tip,.mart-cta,.mart-nc,.mart-pc,.mart-term,.mart-author-tx) *) + :is(h2,h3){margin-top:64px}
/* «Коротко» — карточка без цветной полосы слева, маркеры — коричневая черта (§6.3, §6.11a) */
html body .mart .mart-key{border:1px solid var(--line);border-radius:16px;padding:28px 30px}
html body .mart .mart-key li{padding-left:24px}
html body .mart .mart-key li::before{left:0;top:.72em;width:12px;height:2px;border-radius:1px;background:var(--acc);box-shadow:none}
/* списки текста: маркер — черта 12×2, нумерация — коричневая */
html body .mart .mart-txt ul:not([class]){list-style:none;padding-left:0}
html body .mart .mart-txt ul:not([class]) > li{position:relative;padding-left:24px}
html body .mart .mart-txt ul:not([class]) > li::before{content:"";position:absolute;left:0;top:.78em;width:12px;height:2px;border-radius:1px;background:var(--acc)}
html body .mart .mart-tip .mart-txt ul:not([class]) > li::before{background:#fd7e2f}
/* выделенная цитата — коричневая черта, тёмные блоки — радиус 20 */
html body .mart .mart-quote{border-left-color:var(--acc)}
html body .mart :is(.mart-tip,.mart-cta){border-radius:20px}
html body .mart .mart-cta.mart-cta--course{border-color:rgba(253,126,47,.28)}
/* таблица → mvc-table: шапка #151311 заглавными 12.5 px, рамка 1 px, радиус 14 */
html body .mart .mart-txt table{border:1px solid var(--line);border-radius:14px;border-collapse:separate;border-spacing:0;overflow:hidden;background:var(--card)}
html body .mart .mart-txt th{background:#151311;color:#f1ece2;font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
html body .mart .mart-txt tr:last-child td{border-bottom:0}
html body .mart .mart-txt td:first-child{font-weight:600;color:var(--ink)}
/* карточки «Читать дальше» */
html body .mart .mart-nc{border-radius:16px}
html body .mart .mart-nc:hover{transform:none;translate:0 -3px;border-color:rgba(137,74,31,.45);box-shadow:0 14px 28px -18px rgba(14,14,12,.45)}
html body .mart .mart-nc.mart-nc-dark:hover{border-color:#151311}

/* — 4.10 Wiki: статья-термин `mwk` (§9) — */
/* «Простыми словами» → mvc-thesis: Russo One 22 px, коричневая черта 4 px внутри карточки */
html body .mwk .mwk-def{border-radius:16px}
html body .mwk .mwk-def::before{background:var(--acc)}
html body .mwk .mwk-def p.mwk-def-t{font-size:22px;line-height:1.3}
html body .mwk .mwk-def-k{font-size:12px;color:var(--clay)}
/* выноска → mvc-note: пунктирная рамка, без заливки, значок коричневый */
html body .mwk .mwk-note{background:transparent;border:1px dashed var(--line);border-radius:14px;padding:18px 22px}
html body .mwk .mwk-note::before{background:var(--acc)}
html body .mwk .mwk-note p{font-size:15px!important}
/* нумерованные пункты → mvc-step: контурная цифра коричневая */
html body .mwk .mwk-li{border-radius:14px}
html body .mwk .mwk-li-n,html body .mwk .mwk-li p.mwk-li-n{-webkit-text-stroke:1.5px var(--acc)}
html body .mwk .mwk-li h3{font-family:"Russo One",sans-serif;font-weight:400;font-size:16px;text-transform:uppercase;line-height:1.2}
/* таблица → mvc-table */
html body .mwk .mwk-table th{background:#151311;color:#f1ece2;font-size:12.5px;letter-spacing:.06em}
html body .mwk .mwk-table tr.is-hl td{background:rgba(137,74,31,.07)}
/* тест «Проверь себя»: наведение коричневое, «верно/неверно» — цвета бренда */
html body .mwk .mwk-opt{border-radius:10px}
html body .mwk .mwk-opt:hover{border-color:var(--acc)}
html body .mwk .mwk-opt:focus-visible{outline-color:var(--acc)}
html body .mwk .mwk-opt.is-right{border-color:var(--good);background:#e6f1e9}
html body .mwk .mwk-opt.is-wrong{border-color:#a33a2a;background:#fbefec}
html body .mwk :is(.mwk-formula,.mwk-q){border-radius:16px}

/* — 4.11 Блог и Wiki: списки, карточки терминов — */
html body .mlc .mbw-card{border-radius:16px}
html body .mlc .mbw-term{border-radius:12px}
html body .mlc .mbw-term:hover{border-color:rgba(137,74,31,.45)}

/* — 4.12 Переключатель ширины на страницах (§4.1): ставит site-mvc.js в правый верхний угол первой светлой секции — */
.ms-wsw{position:absolute;top:18px;right:18px;z-index:3;display:inline-flex;align-items:center;gap:2px;padding:4px;border-radius:999px;background:#fbfaf6;border:1px solid #d8d0c0;font:600 12px/1 Montserrat,system-ui,sans-serif}
.ms-wsw span{padding:0 6px 0 8px;color:#686056;font-size:13px}
.ms-wsw button{appearance:none;border:0;background:transparent;color:#2a2723;font:inherit;padding:7px 11px;border-radius:999px;cursor:pointer;transition:background-color .2s cubic-bezier(.65,0,.35,1),color .2s}
.ms-wsw button[aria-pressed="true"]{background:#894a1f;color:#fff}
.ms-wsw button:focus-visible{outline:2px solid #894a1f;outline-offset:2px}
@media (max-width:980px){.ms-wsw{display:none}}

/* — 4.13 Телефон (≤ 640) — */
@media (max-width:900px){
  html body .mlc .mlc-cols:not(.mhm-cols4){grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:780px){
  html body .mlc.mlc-fin > .mlc-wrap{grid-template-columns:1fr;padding:28px 22px}
  html body .mlc.mlc-fin > .mlc-wrap > .mlc-actions{grid-column:1;grid-row:auto;align-items:flex-start;margin-top:10px}
}
@media (max-width:640px){
  html body .mlc.mlc-hero h1,html body .mlc.mlc-hero h1.mhd-h1s{font-size:27px!important}
  html body .mlc.mlc-hero :is(.mlc-hero-lead,.mhm-hero .mlc-hero-lead){font-size:15px}
  html body .mlc.mlc-hero > .mlc-card{border-radius:0 0 16px 16px}
  html body .mlc:not(.mlc-hero):not(.mlc-fin) .mlc-head{column-gap:14px;margin-bottom:24px}
  html body .mlc:not(.mlc-hero):not(.mlc-fin) .mlc-head::before{font-size:60px}
  html body .mlc:not(.mlc-hero):not(.mlc-fin) .mlc-head h2{font-size:24px}
  html body .mlc .mlc-cols:not(.mhm-cols4),html body .mlc .mlc-cols.mhm-cols4{grid-template-columns:1fr}
  html body .mlc:not(#program) .mlc-lsn-no{font-size:60px}
  html body .mlc .mlc-lsn h3{font-size:20px}
  html body .mlc.mlc-fin{padding:52px 16px}
  html body .mlc.mlc-fin > .mlc-wrap{border-radius:16px}
  html body .mlc.mlc-fin h2{font-size:22px}
  html body .mlc.mlc-fin > .mlc-wrap > .mlc-actions{align-items:stretch;width:100%}
  html body .mwk .mwk-def p.mwk-def-t{font-size:18px}
}
@media (prefers-reduced-motion:reduce){
  html body .mlc .mlc-lsn,html body .mart .mart-nc{transition:none}
  html body .mlc .mlc-lsn:hover,html body .mart .mart-nc:hover,html body .mlc.mlc-fin .mlc-btn.mlc-white:hover{translate:none}
}
/* ——— SITE-MVC END ——— */
