/* Дополнения к эталону: крошки, SEO-текст, каталог, страницы преподавателей, аватары-инициалы */
.ha-crumbs { max-width: var(--ha-max, 1200px); margin: 0 auto; padding: 14px var(--ha-gutter, 20px) 0; font-size: 13.5px; color: var(--ha-ink-3); display: flex; flex-wrap: wrap; gap: 6px; }
.ha-crumbs a { color: var(--ha-ink-2); text-decoration: none; } .ha-crumbs a:hover { color: var(--ha-terra); }
.ha-crumbs span[aria-current] { color: var(--ha-ink); font-weight: 600; }
.ha-crumbs i { font-style: normal; opacity: .5; }
.mz-ldesc { display: none; }
.ha-seo { max-width: 820px; } .ha-seo p { font-size: 16px; line-height: 1.7; color: var(--ha-ink-2); margin: 0 0 14px; }
.ha-ini { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--ha-dir-pill, var(--ha-terra-soft)); color: var(--ha-dir-deep, var(--ha-ink)); font-weight: 800; font-size: 15px; flex: none; }
.mz-msg .ha-ini { width: 34px; height: 34px; font-size: 12px; }
.ha-video { position: relative; aspect-ratio: 16/9; border-radius: 18px; overflow: hidden; background: #000; max-width: 100%; }
.ha-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ha-trial { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 28px; align-items: center; }
.ha-trial img { width: 100%; height: auto; border-radius: 18px; display: block; }
@media (max-width: 820px) { .ha-trial { grid-template-columns: 1fr; } }
.ha-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; }
.ha-filter button { border: 1px solid var(--ha-line); background: var(--ha-canvas); color: var(--ha-ink); border-radius: 999px; padding: 9px 16px; font: 700 14px/1 var(--ha-font); cursor: pointer; }
.ha-filter button.on { background: var(--ha-ink); color: #fff; border-color: var(--ha-ink); }
.ha-course-tile__grid div { background: var(--ha-paper); }
.ha-course-tile__price { display: flex; gap: 8px; align-items: baseline; } .ha-course-tile__price s { color: var(--ha-ink-3); font-size: 13px; }
.ha-teach-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 18px; }
.ha-teach-grid a { text-decoration: none; color: inherit; }
.ha-tcard__photo--empty { aspect-ratio: 4/5; display: grid; place-items: center; background: var(--ha-dir-tint, var(--ha-terra-soft)); border-radius: 18px; font: 800 44px/1 var(--ha-font); color: var(--ha-ink-2); }
.ha-person { display: grid; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); gap: 36px; align-items: start; }
.ha-person img { width: 100%; height: auto; border-radius: 22px; display: block; }
@media (max-width: 820px) { .ha-person { grid-template-columns: 1fr; } }
.ha-links { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 0; }
.ha-links a { display: inline-flex; padding: 10px 16px; border-radius: 999px; background: var(--ha-canvas); border: 1px solid var(--ha-line); color: var(--ha-ink); font-weight: 700; text-decoration: none; font-size: 14px; }
.ha-links a:hover { border-color: var(--ha-terra); color: var(--ha-terra); }
.ha-revlist { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; }
.ha-revlist .ha-rev { height: 100%; }
.ha-route { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; counter-reset: r; }
.ha-route > div { background: var(--ha-canvas); border-radius: 20px; padding: 20px; position: relative; }
.ha-route b { display: block; font-size: 17px; margin: 6px 0; } .ha-route span { color: var(--ha-ink-2); font-size: 14.5px; line-height: 1.5; }
.ha-route > div::before { counter-increment: r; content: counter(r); width: 30px; height: 30px; border-radius: 50%; background: var(--ha-terra); color: #fff; display: grid; place-items: center; font-weight: 800; }
.ha-table { width: 100%; border-collapse: collapse; font-size: 15px; } .ha-table td { padding: 10px 12px; border-bottom: 1px solid var(--ha-line); vertical-align: top; } .ha-table td:first-child { color: var(--ha-ink-3); width: 40%; }
.ha-404 { text-align: center; padding: 60px 20px; } .ha-404 img { width: 220px; height: auto; }
.mz-gifts-note b { color: var(--ha-ink); }
a.ha-tcard, a.ha-tcard:hover { text-decoration: none; color: inherit; }
a.ha-tcard b { color: var(--ha-ink); } a.ha-tcard:hover b { color: var(--ha-terra); }
.mz-ph { aspect-ratio: 4/5; display: grid; place-items: center; background: var(--ha-dir-tint, var(--ha-paper)); border-radius: 14px; }
.mz-ph img { width: 96px !important; height: auto; box-shadow: none !important; }
.ha-trial img { max-height: 560px; width: auto; max-width: 100%; margin: 0 auto; }
/* Телефон: правки по проверке 05.10 */
.ha-rev__who .ha-ini { display: grid !important; place-items: center; width: 44px; height: 44px; font-size: 14px !important; color: var(--ha-dir-deep, var(--ha-ink)) !important; line-height: 1 !important; }
.mz-hero .ha-pill { white-space: normal; max-width: 100%; }
@media (max-width: 640px) {
  .mz-chatbox .pic { max-height: 160px; width: auto; }
  .mz-chatbox .mz-msg:last-child { display: none; }
}
@media (max-width: 860px) {
  .op-card { order: 1 !important; } .op-trust, .op-help { order: 2 !important; }
}
.ha-course-tile .ha-pill { white-space: normal; max-width: 100%; line-height: 1.25; }
.ha-course-tile .ha-pill { font-size: 12px; }
/* Блоки для холодного трафика */
.ha-steps4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.ha-steps4 > div { background: var(--ha-paper); border-radius: 22px; padding: 22px; display: grid; gap: 8px; align-content: start; position: relative; }
.ha-steps4 img { width: 64px; height: 64px; } .ha-steps4 b { font-size: 18px; line-height: 1.25; } .ha-steps4 > div > span:last-child { color: var(--ha-ink-2); font-size: 15px; line-height: 1.5; }
.ha-step-n { position: absolute; top: 18px; right: 20px; width: 30px; height: 30px; border-radius: 50%; background: var(--ha-terra); color: #fff; display: grid; place-items: center; font-weight: 800; }
.ha-fears { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ha-fear { background: var(--ha-paper); border-radius: 22px; padding: 22px; } .ha-fear b { display: block; font-size: 17px; margin-bottom: 8px; color: var(--ha-terra-d, var(--ha-terra)); } .ha-fear p { margin: 0; color: var(--ha-ink-2); font-size: 15px; line-height: 1.55; }
.ha-podbor { display: grid; gap: 18px; } .ha-podbor__q { border: 0; padding: 0; margin: 0; } .ha-podbor__q legend { font-weight: 800; font-size: 18px; margin-bottom: 10px; }
.ha-podbor__q > div { display: flex; flex-wrap: wrap; gap: 8px; }
.ha-podbor__q label { cursor: pointer; } .ha-podbor__q input { position: absolute; opacity: 0; pointer-events: none; }
.ha-podbor__q span { display: inline-flex; padding: 11px 18px; border-radius: 999px; background: var(--ha-canvas); border: 1.5px solid var(--ha-line); font-weight: 700; font-size: 15px; }
.ha-podbor__q input:checked + span { background: var(--ha-ink); color: #fff; border-color: var(--ha-ink); }
.ha-podbor__q input:focus-visible + span { outline: 2px solid var(--ha-terra); outline-offset: 2px; }
.ha-podbor__res { margin-top: 24px; }
@media (max-width: 960px) { .ha-steps4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ha-fears { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .ha-steps4, .ha-fears { grid-template-columns: 1fr; } .ha-podbor__q span { padding: 10px 14px; font-size: 14.5px; } }
@media (max-width: 640px) { .mz-similar .ha-course-tile .ha-pill { font-size: 12px; } .mz-similar .ha-course-tile h3 { font-size: 15px; } }
.ha-table--wide td:first-child { width: auto; color: inherit; }
.ha-table--wide tr.th td { color: var(--ha-ink-3); font-size: 13px; }
@media (max-width: 700px) {
  .ha-table--wide tr.th { display: none; }
  .ha-table--wide, .ha-table--wide tbody, .ha-table--wide tr, .ha-table--wide td { display: block; width: 100%; }
  .ha-table--wide tr { background: var(--ha-paper); border-radius: 16px; padding: 12px 14px; margin-bottom: 10px; }
  .ha-table--wide td { border: 0; padding: 4px 0; font-size: 15px; }
  .ha-table--wide td[data-l]::before { content: attr(data-l); display: block; font-size: 12px; color: var(--ha-ink-3); }
}
/* Виджеты: Валерия, бесплатный урок, окна */
.ha-float-left { right: auto !important; left: 24px; }
.ha-val { position: fixed; right: 24px; bottom: 24px; z-index: 62; width: 64px; height: 64px; border-radius: 50%; border: 3px solid #fff; padding: 0; background: var(--ha-canvas); box-shadow: 0 12px 30px rgba(61,36,27,.28); cursor: pointer; }
.ha-val img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
.ha-val__dot { position: absolute; right: 2px; bottom: 2px; width: 14px; height: 14px; border-radius: 50%; background: #3BB273; border: 2px solid #fff; }
.ha-val__badge { position: absolute; top: -4px; right: -4px; min-width: 22px; height: 22px; border-radius: 11px; background: var(--ha-terra); color: #fff; font: 800 12px/22px var(--ha-font); text-align: center; }
.ha-val-tease { position: fixed; right: 24px; bottom: 100px; z-index: 62; width: 300px; max-width: calc(100vw - 24px); display: flex; gap: 10px; align-items: flex-start; background: var(--ha-canvas); border-radius: 20px 20px 6px 20px; padding: 14px 32px 14px 14px; box-shadow: 0 16px 40px rgba(61,36,27,.22); cursor: pointer; animation: haUp .35s ease; }
.ha-val-tease img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex: none; }
.ha-val-tease small { display: block; font-size: 12.5px; color: var(--ha-ink-3); margin-bottom: 4px; } .ha-val-tease p { margin: 0; font-size: 15px; line-height: 1.4; color: var(--ha-ink); }
.ha-val-tease__x { position: absolute; top: 6px; right: 8px; border: 0; background: none; font-size: 20px; color: var(--ha-ink-3); cursor: pointer; }
.ha-val-typing { display: inline-flex; gap: 4px; padding: 6px 0; } .ha-val-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--ha-ink-3); animation: haDot 1s infinite; } .ha-val-typing i:nth-child(2) { animation-delay: .15s; } .ha-val-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes haDot { 0%, 60%, 100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
@keyframes haUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.ha-chat { position: fixed; right: 24px; bottom: 100px; z-index: 63; width: 370px; max-width: calc(100vw - 24px); max-height: min(620px, calc(100vh - 130px)); display: flex; flex-direction: column; background: var(--ha-canvas); border-radius: 24px; box-shadow: 0 24px 60px rgba(61,36,27,.3); overflow: hidden; animation: haUp .3s ease; }
.ha-chat[hidden], .ha-val-tease[hidden], .ha-val__badge[hidden], .ha-val-typing[hidden], [hidden] { display: none !important; }
.ha-chat__top { display: flex; gap: 10px; align-items: center; padding: 14px 16px; background: var(--ha-ink); color: #fff; } .ha-chat__top img { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; }
.ha-chat__top b { display: block; font-size: 16px; } .ha-chat__top span { font-size: 12.5px; opacity: .8; }
.ha-chat__x { margin-left: auto; border: 0; background: rgba(255,255,255,.12); color: #fff; width: 34px; height: 34px; border-radius: 50%; font-size: 20px; cursor: pointer; }
.ha-chat__body { padding: 16px; display: grid; gap: 10px; overflow-y: auto; background: var(--ha-paper); }
.ha-chat__m { background: var(--ha-canvas); border-radius: 18px 18px 18px 6px; padding: 11px 14px; font-size: 15px; line-height: 1.45; max-width: 92%; box-shadow: 0 2px 6px rgba(61,36,27,.06); }
.ha-chat__me { justify-self: end; background: var(--ha-ink); color: #fff; border-radius: 18px 18px 6px 18px; padding: 10px 14px; font-size: 15px; max-width: 85%; }
.ha-chat__opts { display: flex; flex-wrap: wrap; gap: 6px; } .ha-chat__opts button { border: 1.5px solid var(--ha-terra); background: var(--ha-canvas); color: var(--ha-terra-d, var(--ha-terra)); border-radius: 999px; padding: 8px 12px; font: 700 14px var(--ha-font); cursor: pointer; text-align: left; }
.ha-chat__opts button:hover { background: var(--ha-terra); color: #fff; }
.ha-chat__mess .mz-mess__b { padding: 10px 12px; } .ha-chat__body > .ha-btn { justify-self: start; }
.ha-chat__form { display: grid; gap: 8px; } .ha-chat__form input:not([type=checkbox]) { font: 500 16px var(--ha-font); border: 1px solid var(--ha-line); background: var(--ha-canvas); border-radius: 999px; padding: 12px 16px; } .ha-chat__form .ha-check { font-size: 12px; }
.mz-sticky .ha-val-btn { flex: none; width: 50px; height: 50px; border-radius: 50%; border: 2px solid #fff; padding: 0; position: relative; background: var(--ha-canvas); box-shadow: 0 4px 12px rgba(61,36,27,.18); cursor: pointer; }
.mz-sticky .ha-val-btn img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; } .mz-sticky .ha-val-btn i { position: absolute; right: 0; bottom: 0; width: 12px; height: 12px; border-radius: 50%; background: #3BB273; border: 2px solid #fff; }
@media (max-width: 960px) {
  .ha-val, .ha-float-left { display: none !important; }
  .mz-sticky { display: flex; gap: 8px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px)); background: rgba(248,243,234,.96); backdrop-filter: blur(8px); border-top: 1px solid var(--ha-line); }
  .mz-sticky .ha-btn--primary { flex: 1; min-height: 50px; padding: 0 12px; font-size: 15.5px; }
  .ha-val-tease { right: 12px; bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
  .ha-chat { right: 0; left: 0; bottom: 0; width: 100%; max-width: 100%; max-height: 88vh; border-radius: 24px 24px 0 0; }
  body { padding-bottom: 76px; }
}
@media (prefers-reduced-motion: reduce) { .ha-val-tease, .ha-chat { animation: none; } .ha-val-typing i { animation: none; } }

/* окна и чат узкие: мессенджеры в один столбец */
.mz-pop .mz-mess__btns, .ha-chat__mess { grid-template-columns: minmax(0, 1fr); }
.mz-pop .mz-mess__b { text-align: left; }

/* Оплата: доплата за курс и свободная сумма (общие страницы /oplata/) */
.ha-dir-shkola { --ha-dir-tint: var(--ha-paper-2); --ha-dir-pill: var(--ha-terra-soft); --ha-dir-deep: var(--ha-ink); }
.op-fields textarea { font: 500 16px var(--ha-font); border: 1px solid var(--ha-line); background: var(--ha-paper); border-radius: 16px; padding: 14px 18px; color: var(--ha-ink); min-width: 0; width: 100%; box-sizing: border-box; resize: vertical; }
.op-fields textarea:focus { outline: 2px solid var(--ha-dir-deep); outline-offset: 1px; }
.op-other input, .op-sum input { font: 800 22px var(--ha-font); border: 1px solid var(--ha-line); background: var(--ha-paper); border-radius: 16px; padding: 14px 18px; color: var(--ha-ink); width: 100%; box-sizing: border-box; font-variant-numeric: tabular-nums; }
.op-other input:focus, .op-sum input:focus { outline: 2px solid var(--ha-dir-deep); outline-offset: 1px; }
.op-sum { position: relative; max-width: 320px; } .op-sum input { font-size: 30px; padding: 14px 52px 14px 20px; } .op-sum span { position: absolute; right: 20px; top: 50%; transform: translateY(-50%); font-weight: 800; font-size: 26px; color: var(--ha-ink-3); }
.op-chips { display: flex; flex-wrap: wrap; gap: 8px; } .op-chips button { font: 700 15px var(--ha-font); border: 1px solid var(--ha-line); background: var(--ha-paper); color: var(--ha-ink); border-radius: 999px; padding: 9px 16px; cursor: pointer; }
.op-chips button:hover, .op-chips button.on { border-color: var(--ha-ink); background: var(--ha-canvas); }
.op-opt:has(input:disabled) { opacity: .6; cursor: default; }
.op-err.show { display: block; }
.ha-paybtns { display: flex; flex-wrap: wrap; gap: 6px 14px; font-weight: 700; font-size: 15px; }
.ha-fears--btn .ha-fear { display: flex; flex-direction: column; } .ha-fears--btn .ha-fear p { flex: 1; }
/* Первый экран курса: кому подойдёт */
.mz-who { display: flex; gap: 8px; align-items: flex-start; margin: -6px 0 20px; font-size: 16px; line-height: 1.45; color: var(--ha-ink-2); max-width: 560px; }
.mz-who svg { flex: none; margin-top: 2px; color: var(--ha-dir-deep, var(--ha-terra)); } .mz-who b { color: var(--ha-ink); }
@media (max-width: 640px) { .mz-who { font-size: 15px; margin: -4px 0 16px; } }
/* Переписка с куратором — пример, а не скрин */
.mz-chatbox__tag { align-self: flex-start; justify-self: start; font-size: 12.5px; font-weight: 700; color: var(--ha-ink-2); background: var(--ha-canvas); border: 1px dashed var(--ha-line); border-radius: 999px; padding: 4px 12px; margin-bottom: 4px; }
/* Юридические документы: оферта, политика */
.ha-doc__who { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 14.5px; color: var(--ha-ink-2); background: var(--ha-paper); border-radius: 16px; padding: 12px 16px; max-width: 760px; } .ha-doc__who b { color: var(--ha-ink); flex-basis: 100%; }
.ha-doc { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 36px; align-items: start; }
.ha-doc__toc { position: sticky; top: 90px; font-size: 14px; background: var(--ha-paper); border-radius: 18px; padding: 16px 18px; max-height: calc(100vh - 120px); overflow: auto; }
.ha-doc__toc b { display: block; margin-bottom: 8px; } .ha-doc__toc ol { margin: 0; padding-left: 20px; display: grid; gap: 6px; } .ha-doc__toc a { color: var(--ha-ink-2); text-decoration: none; } .ha-doc__toc a:hover { color: var(--ha-terra); }
.ha-doc__text { max-width: 760px; font-size: 16px; line-height: 1.62; color: var(--ha-ink); overflow-wrap: anywhere; }
.ha-doc__text h2 { font-size: 22px; line-height: 1.25; margin: 34px 0 12px; scroll-margin-top: 90px; } .ha-doc__text h2:first-child { margin-top: 0; }
.ha-doc__text h2.ha-doc__big { font-size: 24px; margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--ha-line); }
.ha-doc__text h3 { font-size: 17px; margin: 22px 0 8px; } .ha-doc__text p { margin: 0 0 10px; } .ha-doc__text ul { margin: 0 0 12px; padding-left: 22px; } .ha-doc__text li { margin-bottom: 6px; }
.ha-doc__text .ha-doc__li { padding-left: 14px; } .ha-doc__rekv { background: var(--ha-paper); border-radius: 14px; padding: 14px 16px; }
.ha-doc__other { margin-top: 28px; font-size: 15px; grid-column: 2; }
@media (max-width: 900px) { .ha-doc { grid-template-columns: minmax(0, 1fr); gap: 20px; } .ha-doc__toc { position: static; max-height: none; } .ha-doc__other { grid-column: auto; } .ha-doc__text { font-size: 15.5px; } .ha-doc__text h2 { font-size: 20px; } }
.ha-doc__h1 { font-size: clamp(28px, 7vw, 64px); overflow-wrap: normal; word-break: normal; hyphens: manual; }

/* Главная: первый экран — несколько преподавателей с подписями, картины без мольберта (06.10.2026) */
.hh { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; padding-bottom: 40px; }
.hh__text { align-self: center; } .hh__text .ha-h1 { text-wrap: balance; }
.hh__btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.hh-team { position: relative; display: grid; grid-template-columns: 1.2fr 1fr; gap: 30px 16px; align-items: start; padding: 6px 4px 30px; }
.hh-t { position: relative; margin: 0; border-radius: 24px; box-shadow: 0 16px 36px rgba(61,36,27,.16); background: var(--ha-canvas); }
.hh-t img { display: block; width: 100%; height: auto; border-radius: 24px; }
.hh-t figcaption { position: absolute; left: 12px; right: 12px; bottom: -16px; background: var(--ha-canvas); border-radius: 14px; padding: 7px 10px; box-shadow: 0 8px 22px rgba(61,36,27,.16); display: grid; gap: 1px; text-align: center; }
.hh-t figcaption b { font-size: 15px; line-height: 1.2; } .hh-t figcaption span { font-size: 12.5px; color: var(--ha-ink-2); line-height: 1.3; }
.hh-t--main { grid-row: span 2; margin-top: 34px; }
.hh-art { position: absolute; height: auto; border: 6px solid #fff; border-radius: 3px; box-shadow: 0 12px 26px rgba(61,36,27,.22); z-index: 3; }
.hh-art--1 { width: 22%; left: -7%; top: 0; transform: rotate(-7deg); }
.hh-art--2 { width: 21%; left: 16%; bottom: 26px; transform: rotate(5deg); }
.hh-more { grid-column: 1 / -1; justify-self: end; font-size: 14px; font-weight: 700; color: var(--ha-ink-2); text-decoration: none; margin-top: 2px; }
.hh-more:hover { color: var(--ha-terra); }
.hh .ha-h1 { font-size: clamp(34px, 4.2vw, 56px); }
.hh-facts { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.hh-facts .mz-fact { padding: 16px 16px 14px; } .hh-facts .mz-fact img { width: 52px; height: 52px; } .hh-facts .mz-fact b { font-size: 20px; line-height: 1.15; } .hh-facts .mz-fact span { font-size: 14px; line-height: 1.35; }
@media (max-width: 1100px) { .hh-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 860px) {
  .hh { grid-template-columns: minmax(0, 1fr); padding-bottom: 24px; }
  .hh-team { gap: 26px 12px; padding: 4px 0 8px; } .hh-t--main { margin-top: 0; }
  .hh-t figcaption { left: 8px; right: 8px; bottom: -14px; padding: 6px 8px; } .hh-t figcaption b { font-size: 13.5px; } .hh-t figcaption span { font-size: 12px; }
  .hh-art { display: none !important; }
  .hh-more { justify-self: center; }
}
@media (max-width: 640px) {
  .hh__btns { flex-wrap: nowrap; gap: 10px; } .hh__btns .ha-btn { flex: 1 1 0; min-width: 0; padding-left: 8px; padding-right: 8px; font-size: 15px; white-space: nowrap; }
  .hh-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } .hh-facts .mz-fact b { font-size: 17px; } .hh-facts .mz-fact span { font-size: 13px; }
}
/* шапка на планшете: пункты меню не переносятся по буквам */
.mz-top__nav a { white-space: nowrap; }
@media (max-width: 1180px) and (min-width: 961px) { .mz-top__nav { gap: 12px; margin-left: 4px; } .mz-top__nav a { font-size: 13.5px; } .mz-top .mz-cta { padding-left: 14px; padding-right: 14px; font-size: 14px; } }
@media (min-width: 641px) { .hh__btns { flex-wrap: nowrap; } .hh__btns .ha-btn { white-space: nowrap; padding-left: 22px; padding-right: 22px; } }
/* Скрины отзывов: лента, по нажатию — крупно */
.ha-skriny { --ha-scroll-w: 320px; align-items: start; }
.ha-skrin { display: grid; gap: 8px; text-decoration: none; color: var(--ha-ink-2); font-size: 13.5px; font-weight: 700; }
.ha-skrin img { width: 100%; height: auto; max-height: 460px; object-fit: contain; object-position: top; background: #fff; border-radius: 16px; box-shadow: 0 10px 26px rgba(61,36,27,.12); border: 1px solid var(--ha-line); }
.ha-skrin:hover img { box-shadow: 0 14px 32px rgba(61,36,27,.2); }
.ha-zoom { position: fixed; inset: 0; z-index: 90; background: rgba(28,20,16,.82); display: grid; place-items: center; padding: 20px; cursor: zoom-out; }
.ha-zoom img { max-width: min(1100px, 100%); max-height: calc(100vh - 40px); width: auto; height: auto; border-radius: 12px; background: #fff; }
.ha-zoom button { position: absolute; top: 14px; right: 14px; width: 44px; height: 44px; border-radius: 50%; border: 0; background: #fff; font-size: 24px; cursor: pointer; }
@media (max-width: 640px) { .ha-skriny { --ha-scroll-w: 80vw; } }
/* Курсы на главной по направлениям; на телефоне карточки курсов по две в ряд (весь сайт) */
.hk-group { margin-top: 26px; } .hk-group h3 { margin: 0 0 4px; display: flex; align-items: center; gap: 8px; } .hk-group h3 span { font-size: 13px; font-weight: 800; background: var(--ha-paper-2); color: var(--ha-ink-2); border-radius: 999px; padding: 2px 9px; }
.hk-group > p { margin: 0 0 14px; color: var(--ha-ink-2); font-size: 15px; } .hk-group .ha-courses { margin-top: 0; }
@media (max-width: 640px) {
  .ha-courses { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ha-courses .ha-course-tile { padding: 10px 10px 12px; border-radius: 18px; gap: 6px; }
  .ha-courses .ha-course-tile__grid { gap: 4px; } .ha-courses .ha-course-tile__grid > div { border-radius: 8px; }
  .ha-courses .ha-course-tile h3, .ha-courses .ha-course-tile h4 { font-size: 15px; line-height: 1.2; }
  .ha-courses .ha-course-tile p { display: none; } .ha-courses .ha-course-tile .ha-pill { font-size: 12px; padding: 3px 8px; margin-top: 2px; }
  .ha-courses .ha-course-tile__foot { flex-direction: column; align-items: stretch; gap: 6px; } .ha-courses .ha-course-tile__foot .ha-btn { width: 100%; padding-left: 6px; padding-right: 6px; }
  .ha-courses .ha-course-tile__price { flex-wrap: wrap; gap: 2px 6px; font-size: 14px; }
}
/* «Впервые онлайн»: номер шага рядом с заголовком, сравнение с мастер-классом в студии */
.ha-steps4 b { display: flex; align-items: flex-start; gap: 10px; } .ha-steps4 b .ha-step-n { position: static; flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--ha-terra); color: #fff; display: grid; place-items: center; font-size: 14px; font-weight: 800; margin-top: -2px; }
.ha-cmp { display: grid; gap: 0; border-radius: 22px; overflow: hidden; background: var(--ha-paper); }
.ha-cmp__head, .ha-cmp__row { display: grid; grid-template-columns: 1.1fr 1.5fr 1.5fr; gap: 0 20px; padding: 14px 20px; align-items: start; }
.ha-cmp__head { font-weight: 800; font-size: 15px; background: var(--ha-paper-2); } .ha-cmp__head .ha-cmp__on { color: var(--ha-terra-d, var(--ha-terra)); } .ha-cmp__head .ha-cmp__off { color: var(--ha-ink-3); }
.ha-cmp__row { border-top: 1px solid var(--ha-line); } .ha-cmp__row b { font-size: 16px; line-height: 1.3; } .ha-cmp__row p { margin: 0; font-size: 15px; line-height: 1.45; }
.ha-cmp__row .ha-cmp__on { color: var(--ha-ink); padding-left: 26px; position: relative; } .ha-cmp__row .ha-cmp__on::before { content: '✓'; position: absolute; left: 0; top: 0; color: var(--ha-ok); font-weight: 800; }
.ha-cmp__row .ha-cmp__off { color: var(--ha-ink-3); padding-left: 26px; position: relative; } .ha-cmp__row .ha-cmp__off::before { content: '—'; position: absolute; left: 0; top: 0; }
@media (max-width: 760px) {
  .ha-cmp__head { display: none; } .ha-cmp__row { grid-template-columns: 1fr; gap: 6px; padding: 14px 16px; }
  .ha-cmp__row .ha-cmp__on::after { content: ' — онлайн'; display: none; }
  .ha-cmp__row .ha-cmp__off { font-size: 14px; } .ha-cmp__row .ha-cmp__off::before { content: 'В студии:'; position: static; font-weight: 700; margin-right: 4px; }
  .ha-cmp__row .ha-cmp__off { padding-left: 0; }
}
/* Квиз «Подберём курс»: всплывающее окно и плавающая кнопка */
.ha-kv-float { position: fixed; left: 24px; bottom: 96px; z-index: 55; display: inline-flex; align-items: center; gap: 8px; border: 0; cursor: pointer; background: var(--ha-canvas); color: var(--ha-ink); font: 800 15px var(--ha-font); padding: 10px 18px 10px 10px; border-radius: 999px; box-shadow: 0 10px 26px rgba(61,36,27,.2); }
.ha-kv-float img { width: 34px; height: 34px; } .ha-kv-float:hover { transform: translateY(-1px); }
.kv__box { max-width: 560px; padding: 22px 22px 20px; gap: 14px; }
.kv__head { display: flex; gap: 12px; align-items: center; padding-right: 40px; } .kv__head img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.kv__head b { display: block; font-size: 19px; line-height: 1.2; } .kv__head span { font-size: 14px; color: var(--ha-terra-d, var(--ha-terra)); font-weight: 700; }
.kv__bar { height: 6px; border-radius: 6px; background: var(--ha-paper-2); overflow: hidden; } .kv__bar i { display: block; height: 100%; background: var(--ha-terra); border-radius: 6px; transition: width .3s ease; }
.kv-q { font-size: 18px; font-weight: 800; margin: 2px 0 12px; } .kv-sub { font-size: 14.5px; color: var(--ha-ink-2); margin: 12px 0 8px; }
.kv-opts { display: grid; gap: 8px; } .kv-opts label, .kv-mess label { cursor: pointer; } .kv-opts input, .kv-mess input { position: absolute; opacity: 0; pointer-events: none; }
.kv-opts span { display: block; padding: 13px 16px; border-radius: 14px; background: var(--ha-paper); border: 2px solid transparent; font-size: 15.5px; font-weight: 600; }
.kv-opts input:checked + span, .kv-opts span:hover { border-color: var(--ha-terra); background: var(--ha-canvas); }
.kv-fields { display: grid; gap: 8px; } .kv-fields input { font: 500 16px var(--ha-font); border: 1px solid var(--ha-line); background: var(--ha-paper); border-radius: 14px; padding: 14px 16px; width: 100%; box-sizing: border-box; }
.kv-mess { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.kv-mess span { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 12px; background: var(--ha-paper); border: 2px solid transparent; font-weight: 700; font-size: 14.5px; } .kv-mess img { width: 24px; height: 24px; }
.kv-mess input:checked + span { border-color: var(--ha-terra); background: var(--ha-canvas); }
.kv-err { display: block; color: var(--ha-terra-d, var(--ha-terra)); font-size: 14px; min-height: 18px; margin-top: 6px; }
.kv-res { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px; margin-top: 4px; } .kv-res .ha-course-tile p { display: none; }
.kv__nav { display: flex; gap: 10px; justify-content: flex-end; margin-top: 14px; } .kv__nav .ha-btn { min-width: 120px; }
@media (max-width: 960px) {
  .ha-kv-float { display: none; }
  .mz-sticky .ha-kv-sticky { flex: 1; min-height: 50px; padding: 0 8px; font-size: 15px; white-space: nowrap; } .mz-sticky .ha-btn--primary { white-space: nowrap; font-size: 15px; }
}
@media (max-width: 640px) { .kv__box { padding: 18px 14px 16px; } .kv-q { font-size: 17px; } .kv__nav .ha-btn { flex: 1; min-width: 0; } }
/* Работы учеников на главной: 2 ряда на компьютере, 3 на телефоне; следующий столбец виден наполовину — понятно, что листается */
.hw-lenta { display: grid; grid-template-rows: repeat(2, auto); grid-auto-flow: column; grid-auto-columns: 220px; gap: 14px; overflow-x: auto; scrollbar-width: none; margin: 0 calc(-1 * var(--ha-s6)); padding: 0 var(--ha-s6) 4px; scroll-snap-type: x proximity; }
.hw-lenta::-webkit-scrollbar { display: none; }
.hw-lenta figure { margin: 0; scroll-snap-align: start; }
.hw-lenta__im { aspect-ratio: 3 / 4; background: var(--ha-paper); border-radius: 14px; display: grid; place-items: center; padding: 6px; }
.hw-lenta__im img { max-width: 100%; max-height: 100%; width: auto; height: auto; border-radius: 6px; display: block; }   /* картину не обрезаем */
.hw-lenta figcaption { font-size: 12.5px; line-height: 1.3; margin-top: 6px; color: var(--ha-ink-2); }
@media (max-width: 640px) { .hw-lenta { grid-template-rows: repeat(3, auto); grid-auto-columns: 33vw; gap: 10px; margin: 0 -20px; padding: 0 20px 4px; } .hw-lenta figcaption { font-size: 12px; } }
.kv .kv-q { text-align: left; font-size: 18px; font-weight: 800; color: var(--ha-ink); margin: 2px 0 12px; } .kv .kv-sub { text-align: left; }
@media (max-width: 640px) { .kv .kv-q { font-size: 17px; } }
/* Первый экран главной (06.10, вариант 2): как раньше — веер картин и вырезанные фигуры; трое преподавателей рядом */
.hh--fan { align-items: end; padding-bottom: 0; }
.hh--fan .hh__text { align-self: center; padding-bottom: 32px; }
.hf { position: relative; width: 100%; aspect-ratio: 1 / 1; max-height: 620px; }
.hf-p { position: absolute; height: auto; border: 6px solid #fff; border-radius: 3px; box-shadow: 0 18px 36px rgba(61,36,27,.22); }   /* картина целиком, без мольберта */
.hf-p--l { left: 1%; top: 7%; width: 25%; transform: rotate(-8deg); z-index: 1; }
.hf-p--c { left: 37%; top: 0; width: 25%; transform: rotate(-2deg); z-index: 1; }
.hf-p--r { right: 1%; top: 6%; width: 24%; transform: rotate(8deg); z-index: 1; }
.hf-who { position: absolute; bottom: 12%; width: auto; filter: drop-shadow(0 14px 22px rgba(61,36,27,.18)); }
.hf-who.hf--l { left: 0; height: 54%; z-index: 2; }
.hf-who.hf--r { right: 0; height: 54%; z-index: 2; }
.hf-who.hf--c { left: 29.5%; height: 57%; z-index: 3; }
.hf-cap { position: absolute; bottom: 0; z-index: 5; width: 31%; background: var(--ha-canvas); border-radius: 14px; padding: 7px 8px; box-shadow: 0 8px 20px rgba(61,36,27,.14); display: grid; text-align: center; }
.hf-cap b { font-size: 14px; line-height: 1.2; } .hf-cap span { font-size: 12.5px; color: var(--ha-ink-2); line-height: 1.25; }
.hf-cap.hf--l { left: 0; } .hf-cap.hf--c { left: 34.5%; } .hf-cap.hf--r { right: 0; }
.hf-more { position: absolute; right: 0; top: -8px; z-index: 6; font-size: 13.5px; font-weight: 700; color: var(--ha-ink-2); text-decoration: none; background: rgba(255,255,255,.92); padding: 5px 10px; border-radius: 999px; }
.hf-more:hover { color: var(--ha-terra); }
.hh--fan { padding-bottom: 28px; }
@media (max-width: 860px) {
  .hh--fan .hh__text { padding-bottom: 8px; } .hf { margin-top: 6px; }
  .hf-cap { padding: 5px 4px; border-radius: 12px; } .hf-cap b { font-size: 12.5px; } .hf-cap span { font-size: 12px; }
  .hf-more { top: auto; bottom: -36px; right: 50%; transform: translateX(50%); white-space: nowrap; background: none; }
  .hh--fan { padding-bottom: 50px; }
}
@media (max-width: 420px) { .hf-cap span { display: none; } }
/* Отзывы: карточка из скрина — аватар, имя, курс, текст, работы */
.hr-list { --ha-scroll-w: 360px; align-items: stretch; }
.hr { background: var(--ha-paper); border-radius: 22px; padding: 18px; display: flex; flex-direction: column; gap: 10px; }
.hr__who { display: flex; gap: 10px; align-items: center; } .hr__ava { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: 15px; color: var(--ha-ink); flex: none; }
.hr__who b { display: block; font-size: 15.5px; line-height: 1.2; } .hr__who span { font-size: 13px; color: var(--ha-ink-2); }
.hr__t { margin: 0; font-size: 15px; line-height: 1.55; color: var(--ha-ink); } .hr__t--cut { display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }
.hr__more { align-self: flex-start; border: 0; background: none; padding: 0; font: 700 14px var(--ha-font); color: var(--ha-terra); cursor: pointer; }
.hr__ws { margin-top: auto; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; padding-top: 4px; }
.hr-w { aspect-ratio: 3 / 4; background: var(--ha-canvas); border-radius: 8px; display: grid; place-items: center; overflow: hidden; text-decoration: none; }
.hr-w img { max-width: 100%; max-height: 100%; width: auto; height: auto; display: block; }   /* работу не обрезаем */
.hr-w--more { font-weight: 800; color: var(--ha-ink-2); font-size: 15px; }
@media (max-width: 640px) { .hr-list { --ha-scroll-w: 84vw; } }
/* Онлайн или студия — две карточки; путь ученика — номера с линией */
.vs { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 14px; align-items: stretch; }
.vs__c { border-radius: 24px; padding: 22px 22px 18px; }
.vs__c--on { background: var(--ha-terra-soft, #F6E3D8); } .vs__c--off { background: var(--ha-paper); }
.vs__tag { display: inline-block; font-size: 12.5px; font-weight: 800; border-radius: 999px; padding: 4px 10px; background: rgba(255,255,255,.7); color: var(--ha-ink-2); }
.vs__c h3 { font-size: 22px; margin: 10px 0 14px; } .vs__c--off h3 { color: var(--ha-ink-2); }
.vs__c ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.vs__c li { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 2px 10px; } .vs__c li::before { grid-row: span 2; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: 14px; margin-top: 1px; }
.vs__c--on li::before { content: '✓'; background: var(--ha-ok, #3BB273); color: #fff; } .vs__c--off li::before { content: '–'; background: #E7DFD4; color: var(--ha-ink-2); }
.vs__c li b { font-size: 15.5px; line-height: 1.3; } .vs__c li span { font-size: 14.5px; line-height: 1.45; color: var(--ha-ink-2); } .vs__c--off li b { color: var(--ha-ink-2); }
.vs__or { align-self: center; width: 52px; height: 52px; border-radius: 50%; background: var(--ha-canvas); border: 1px solid var(--ha-line); display: grid; place-items: center; font-weight: 800; color: var(--ha-ink-2); font-size: 14px; }
.hp { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; position: relative; }
.hp::before { content: ''; position: absolute; left: 28px; right: 28px; top: 27px; border-top: 2px dashed var(--ha-line); }
.hp li { position: relative; display: grid; gap: 8px; align-content: start; }
.hp-n { width: 56px; height: 56px; border-radius: 50%; background: var(--ha-terra); color: #fff; font-weight: 800; font-size: 24px; display: grid; place-items: center; box-shadow: 0 0 0 6px var(--ha-canvas); }
.hp b { font-size: 18px; line-height: 1.25; margin-top: 4px; } .hp p { margin: 0; color: var(--ha-ink-2); font-size: 15px; line-height: 1.5; }
@media (max-width: 860px) {
  .vs { grid-template-columns: minmax(0, 1fr); } .vs__or { justify-self: center; margin: -6px 0; }
  .hp { grid-template-columns: minmax(0, 1fr); gap: 16px; } .hp::before { left: 27px; right: auto; top: 28px; bottom: 28px; border-top: 0; border-left: 2px dashed var(--ha-line); }
  .hp li { grid-template-columns: 56px minmax(0, 1fr); column-gap: 14px; } .hp-n { grid-row: span 2; } .hp b { margin-top: 6px; }
}
/* Блок под плашками: ключевой текст о школе */
.hk-intro { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 28px; align-items: center; }
.hk-intro__tx p { margin: 0 0 12px; font-size: 16.5px; line-height: 1.6; color: var(--ha-ink-2); } .hk-intro__tx p:first-of-type { color: var(--ha-ink); font-size: 18px; }
.hk-intro__links { display: flex; flex-wrap: wrap; gap: 8px 20px; font-weight: 700; } .hk-intro__links a { text-decoration: none; }
.hk-intro__ph { width: 100%; height: auto; border-radius: 22px; }
@media (max-width: 860px) { .hk-intro { grid-template-columns: minmax(0, 1fr); } }
/* Плашки под первым экраном: иконка слева, больше текста */
.hh-facts { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 12px; }
.hh-facts .mz-fact { flex-direction: row; align-items: flex-start; gap: 14px; padding: 18px; } .hh-facts .mz-fact img { width: 52px; height: 52px; flex: none; }
.hh-facts .mz-fact b { display: block; font-size: 18px; margin-bottom: 4px; } .hh-facts .mz-fact span { font-size: 14.5px; line-height: 1.45; }
@media (max-width: 860px) { .hh-facts { grid-template-columns: minmax(0, 1fr) !important; } .hh-facts .mz-fact b { font-size: 17px; } }
/* Работы учеников: Pinterest, без рамок и подписей */
.hw-pin { grid-auto-columns: 220px; } .hw-pin .ha-pin__col:nth-child(even) { padding-top: 34px; } .hw-pin img { border-radius: 12px; }
@media (max-width: 640px) { .hw-pin { grid-auto-columns: 40vw; } .hw-pin .ha-pin__col:nth-child(even) { padding-top: 24px; } }
.mz-top__logo img { width: auto !important; } /* знак прижат влево, без пустого поля справа и слева */
/* «Спасибо за оплату»: призыв написать менеджеру для оформления */
.sp-next { text-align: left; display: grid; justify-items: start; gap: 4px; }   /* «Спасибо» по левому краю (владелец 22.10.2026) */
.sp-next__t { max-width: 640px; margin: 0 0 14px; font-size: 17px; line-height: 1.55; color: var(--ha-ink-2); } .sp-next__t b { color: var(--ha-ink); }
.sp-mess { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 12px; }
.sp-mess__b { display: flex; align-items: center; gap: 12px; background: var(--ha-canvas); border: 2px solid transparent; border-radius: 18px; padding: 14px 22px 14px 16px; text-decoration: none; color: var(--ha-ink); min-width: 230px; box-shadow: 0 8px 20px rgba(61,36,27,.08); }
.sp-mess__b:hover { border-color: var(--ha-terra); color: var(--ha-ink); } .sp-mess__b img { width: 44px; height: 44px; border-radius: 12px; }
.sp-mess__b span { display: grid; text-align: left; font-size: 13.5px; color: var(--ha-ink-2); } .sp-mess__b b { font-size: 17px; color: var(--ha-ink); }
@media (max-width: 640px) { .sp-mess { display: grid; width: 100%; } .sp-mess__b { min-width: 0; } .sp-next__t { font-size: 16px; } }

/* ===== 06.10: масло в тёплых коричневых тонах вместо розового (правка владельца) ===== */
.ha-theme-maslo { --ha-dark: #3E2A1F; --ha-dark-2: #523829; --ha-paper-2: #EEE3D3; --ha-peach: #D9A77E; }
.ha-dir-maslo { --ha-dir-tint: #EEE3D3; --ha-dir-pill: #E2CBAE; --ha-dir-deep: #4A2E1F; }

/* ===== Заявка на первый урок: телефон → мессенджер (lf) ===== */
.lf { display: grid; gap: 10px; max-width: 620px; }
.lf-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.lf--name .lf-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
.lf-row input { font: 500 16px var(--ha-font); border: 1px solid var(--ha-line); background: var(--ha-canvas); border-radius: 999px; padding: 15px 20px; color: var(--ha-ink); min-width: 0; }
.lf-row input:focus { outline: 2px solid var(--ha-dir-deep, var(--ha-terra)); outline-offset: 1px; }
.lf .ha-check { font-size: 13px; margin-top: 4px; }
.lf-err { font-size: 14px; color: var(--ha-terra-d, var(--ha-terra)); min-height: 0; } .lf-err:empty { display: none; }
.lf-h { margin: 0 0 4px; font-weight: 800; font-size: 19px; color: var(--ha-ink); }
.lf-mess { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.lf-m { display: flex; align-items: center; justify-content: center; gap: 10px; background: var(--ha-canvas); border: 2px solid var(--ha-line); border-radius: 18px; padding: 14px 12px; text-decoration: none; color: var(--ha-ink); font-size: 16px; transition: border-color .15s, transform .15s; }
.lf-m:hover { border-color: var(--ha-dir-deep, var(--ha-terra)); color: var(--ha-ink); transform: translateY(-1px); }
.lf-m img { width: 34px; height: 34px; border-radius: 9px; flex: none; }
.lf-note { margin: 2px 0 0; font-size: 14px; color: var(--ha-ink-2); }
.lf-s3 .lf-where { color: var(--ha-terra-d, var(--ha-terra)); }
.lf-mess--again .lf-m { padding: 10px; font-size: 14px; } .lf-mess--again .lf-m img { width: 26px; height: 26px; }
.lf-trial { display: flex; gap: 14px; align-items: center; background: var(--ha-canvas); border-radius: 18px; padding: 10px 16px 10px 10px; margin: 0 0 14px; max-width: 620px; }
.lf-trial img { width: 72px; height: 72px; border-radius: 12px; object-fit: cover; flex: none; }
.lf-trial b { display: block; font-size: 16px; } .lf-trial small { font-size: 13.5px; color: var(--ha-ink-2); }
.lf-alt { margin: 14px 0 0; font-size: 15px; }
.mz-pop .lf { margin: 0 auto; text-align: left; } .mz-pop .lf-row { grid-template-columns: minmax(0, 1fr); } .mz-pop .lf-mess { grid-template-columns: minmax(0, 1fr); }
.ha-chat .lf-row { grid-template-columns: minmax(0, 1fr); } .ha-chat .lf-mess { grid-template-columns: minmax(0, 1fr); } .ha-chat .lf-row input { padding: 12px 16px; } .ha-chat .lf-h { font-size: 16px; }
@media (max-width: 640px) {
  .lf-row, .lf--name .lf-row { grid-template-columns: minmax(0, 1fr); }
  .lf-mess { grid-template-columns: minmax(0, 1fr); }
}

/* ===== Онлайн или студия: пары строка в строку ===== */
.vs2 { display: grid; gap: 10px; }
.vs2__r { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.vs2__on, .vs2__off { border-radius: 18px; padding: 16px 20px; display: grid; gap: 4px; }
.vs2__on { background: var(--ha-canvas); border: 2px solid var(--ha-terra-soft, #F3D9CC); }
.vs2__off { background: var(--ha-paper); color: var(--ha-ink-2); }
.vs2__on b { font-size: 17px; color: var(--ha-ink); } .vs2__off b { font-size: 17px; color: var(--ha-ink-3, var(--ha-ink-2)); }
.vs2__on span, .vs2__off span { font-size: 15px; line-height: 1.45; }
.vs2__head .vs2__on, .vs2__head .vs2__off { padding: 10px 20px; font-weight: 800; font-size: 15px; text-transform: uppercase; letter-spacing: .04em; border: 0; }
.vs2__head .vs2__on { background: var(--ha-terra); color: #fff; } .vs2__head .vs2__off { background: var(--ha-paper-2); color: var(--ha-ink-2); }
@media (max-width: 640px) {
  .vs2__head { display: none; }
  .vs2__r { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .vs2__on { border-radius: 18px 18px 0 0; } .vs2__off { border-radius: 0 0 18px 18px; }
  .vs2__on::before { content: "Онлайн в Home Art"; font-size: 12px; font-weight: 800; color: var(--ha-terra); text-transform: uppercase; letter-spacing: .05em; }
  .vs2__off::before { content: "Мастер-класс в студии"; font-size: 12px; font-weight: 800; color: var(--ha-ink-3, var(--ha-ink-2)); text-transform: uppercase; letter-spacing: .05em; }
}

/* ===== Факты курса с пояснением выгоды ===== */
.mz-fact--more p { margin: 6px 0 0; font-size: 14.5px; line-height: 1.45; color: var(--ha-ink-2); border-top: 1px solid var(--ha-line); padding-top: 10px; }

/* ===== Два куратора курса ===== */
.mz-kur2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 18px 0 10px; max-width: 460px; }
.mz-kur2__p { margin: 0; background: var(--ha-dir-tint, var(--ha-paper-2)); border-radius: 18px; overflow: hidden; }
.mz-kur2__p img { width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center 20%; display: block; }
.mz-kur2__p figcaption { padding: 10px 12px; display: grid; } .mz-kur2__p b { font-size: 15px; } .mz-kur2__p span { font-size: 13px; color: var(--ha-ink-2); }
.mz-kur2__t { margin: 0 0 6px; font-size: 15.5px; color: var(--ha-ink-2); line-height: 1.5; } .mz-kur2__t b { color: var(--ha-ink); }

/* ===== Главная: кнопка «Ещё N преподавателей» под подписями ===== */
.hf-wrap { display: grid; gap: 14px; justify-items: center; }
.hf-wrap .hf { width: 100%; }
.hf-wrap .hf-more { position: static; transform: none; background: var(--ha-canvas); }
@media (max-width: 960px) { .hf-wrap .hf-more { position: static; transform: none; bottom: auto; right: auto; margin-top: 4px; } }

/* ===== Страница сертификата ===== */
.cert-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 32px; align-items: center; }
.cert { position: relative; aspect-ratio: 1.414; max-width: 100%; background: #FFFCF6; border-radius: 6px; box-shadow: 0 22px 46px rgba(61,36,27,.18); padding: 3.2%; }
.cert__in { height: 100%; border: 2px solid #C9A97A; outline: 1px solid #C9A97A; outline-offset: -8px; border-radius: 2px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 4% 6%; gap: .35em; font-size: clamp(9px, 1.25vw, 15px); color: #3D241B; }
.cert__logo { height: 2.4em; width: auto; margin-bottom: .4em; }
.cert__t { font-size: 3em; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; line-height: 1; color: #B84E28; }
.cert__s { font-size: 1em; color: #6B5348; }
.cert__name { font-size: 2.1em; font-weight: 700; border-bottom: 1px solid #C9A97A; padding: 0 1.2em .1em; margin: .1em 0 .2em; }
.cert__c { font-size: 1.5em; font-weight: 800; } .cert__m { font-size: .95em; color: #6B5348; }
.cert__foot { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4em; width: 100%; margin-top: auto; font-size: .82em; align-items: end; }
.cert__foot div { display: grid; gap: .15em; } .cert__foot i { display: block; height: 1px; background: #C9A97A; margin-bottom: .4em; } .cert__foot span { color: #6B5348; }
.cert__tag { position: absolute; top: 12px; right: 12px; z-index: 2; background: var(--ha-terra); color: #fff; font: 800 12px var(--ha-font); letter-spacing: .06em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; }
@media (max-width: 860px) { .cert-hero { grid-template-columns: minmax(0, 1fr); } .cert__in { font-size: clamp(7px, 2.2vw, 13px); } }

/* ===== 06.10: «От простого к сложному» — макет телефона не наезжает на текст карточки ===== */
.ha-how .w-phone { overflow: hidden; }
.ha-how .w-phone__row b { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.ha-how .w-phone__row span { min-width: 0; overflow: hidden; }

/* ===== Отзывы: главная мысль жирным, текст крупнее ===== */
.ha-rev__text { font-size: 15.5px; line-height: 1.6; }
.ha-rev__text b { color: var(--ha-ink); font-weight: 700; }

/* ===== 06.10: цена в карточке курса не рвётся по цифрам ===== */
.ha-course-tile__price b, .ha-course-tile__price s { white-space: nowrap; word-break: keep-all; overflow-wrap: normal; }
.ha-course-tile__foot { flex-wrap: wrap; row-gap: 8px; }
.hr__t b { color: var(--ha-ink); font-weight: 700; }
.cert { aspect-ratio: auto; } .cert__in { height: auto; min-height: 0; gap: .45em; padding: 6% 7% 5%; }
.cert img.cert__logo { height: 2.2em !important; width: auto !important; max-width: 40%; }
.cert__foot { margin-top: 1.4em; }
.ha-fears--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 640px) { .ha-fears--2 { grid-template-columns: minmax(0, 1fr); } }

/* ===== 06.10: Анжелика с палитрой — на главной в одном масштабе с Юлией и Михаилом, на курсе подпись не закрывает палитру ===== */
.hf-who.hf--l.hf--pal { height: 62%; bottom: 6%; left: -2%; }
.hf-cap.hf--pal { left: 0; }
.mz-fan--pal .who { height: 92%; left: 50%; }
.mz-fan--pal .cap { left: 0; transform: none; bottom: 14px; width: min(290px, 58%); }

/* ===== 07.10: обещание первого экрана главной отдельной строкой ===== */
.hh-promise { display: inline-flex; align-items: center; gap: 12px; margin: 4px 0 14px; padding: 10px 18px 10px 10px; background: var(--ha-paper-2); border-radius: 16px; font-size: 19px; font-weight: 700; line-height: 1.3; color: var(--ha-ink); max-width: 100%; }
.hh-promise img { width: 40px; height: 40px; object-fit: contain; flex: none; }
@media (max-width: 640px) { .hh-promise { font-size: 16px; padding: 8px 14px 8px 8px; gap: 10px; } .hh-promise img { width: 32px; height: 32px; } }

/* ===== 07.10: первый экран главной — воздух между плашкой, заголовком и строкой-обещанием; на телефоне заголовок крупнее ===== */
.hh .hh__text > .ha-pill { margin-bottom: 0; }
.hh .hh__text > .ha-h1 { margin: 14px 0 18px; }
.hh .hh-promise { margin: 0 0 18px; }
@media (max-width: 640px) {
  .hh .ha-h1, .hh .hh__text > .ha-h1 { font-size: clamp(33px, 8.7vw, 44px); line-height: 1.08; margin: 16px 0 20px; }
  .hh .hh-promise { margin-bottom: 20px; }
}

/* ===== «Русская душа», правка 07.10.2026 ===== */
/* Чем этот курс отличается от других — под описанием курса */
.mz-diff { margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--ha-line); max-width: 780px; }
.mz-diff h3 { margin: 0 0 12px; }
.mz-diff p { margin: 0 0 12px; font-size: 17px; line-height: 1.6; color: var(--ha-ink-2); }
.mz-diff p:last-child { margin-bottom: 0; color: var(--ha-ink); font-weight: 600; }
/* Картины в программе целиком: паспарту вокруг холста, края картины не упираются в рамку */
.mz-pin--mat figure img { background: var(--ha-paper); padding: 8%; box-sizing: border-box; border-radius: 14px; }
/* Подарки по одному: «Подарок 1», условие, название, описание, все фото целиком */
.mz-gifts-lead { margin: -4px 0 18px; font-size: 17px; line-height: 1.5; color: var(--ha-ink-2); max-width: 780px; }
.mz-gifts2 { display: grid; gap: 16px; }
.mz-gift2 { background: var(--ha-canvas); border-radius: 22px; padding: 22px 24px 24px; }
.mz-gift2__tx { max-width: 780px; }
.mz-gift2__top { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.mz-gift2__num { font: 800 13px/1 var(--ha-font); letter-spacing: .05em; text-transform: uppercase; color: var(--ha-dir-deep); margin-right: 4px; }
.mz-gift2__cond { font-size: 12px; font-weight: 800; padding: 5px 10px; border-radius: 999px; background: var(--ha-paper); color: var(--ha-ink-2); }
.mz-gift2__cond--full { background: var(--ha-terra); color: #fff; }
.mz-gift2 h3 { margin: 0 0 8px; }
.mz-gift2 p.d { margin: 0; font-size: 16px; line-height: 1.55; color: var(--ha-ink-2); }
.mz-gift2 p.n { margin: 10px 0 0; font-size: 15.5px; font-weight: 700; color: var(--ha-ink); }
.mz-gift2__price { margin: 12px 0 0; display: flex; gap: 10px; align-items: baseline; }
.mz-gift2__price s { color: var(--ha-ink-3); font-size: 15px; } .mz-gift2__price b { color: var(--ha-ok); font-size: 16px; }
.mz-gift2__ph { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-top: 18px; }
.mz-gift2__ph img { height: 200px; width: auto; max-width: 100%; object-fit: contain; border-radius: 4px; box-shadow: 0 8px 20px rgba(61,36,27,.16); }
.mz-gift2__ph img.ico { height: 110px; box-shadow: none; }
@media (max-width: 900px) { .mz-gift2 { padding: 18px 18px 20px; } .mz-gift2__ph img { height: 150px; } }
@media (max-width: 640px) { .mz-gift2__ph { gap: 8px; } .mz-gift2__ph img { height: 112px; } }
/* Страница оплаты: подарок «только при полной оплате» при записи за 990 ₽ скрыт */
.op-gift.off { display: none; }
@media (min-width: 1100px) { .mz-pin--mat { grid-auto-columns: calc((100% - 4 * 14px) / 5); } }
@media (min-width: 901px) {
  .mz-gift2--row { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 28px; align-items: center; }
  .mz-gift2--row .mz-gift2__ph { margin-top: 0; justify-content: center; }
  .mz-gift2--row .mz-gift2__ph img { height: 220px; }
}

/* ===== Правки 07.10.2026 (вечер): формы, заголовки, программа, отзывы, подарки ===== */
/* Поля в фокусе сохраняют свою форму: общее правило дизайн-системы (.ha-root :focus-visible) сбрасывало скругление до 10 px */
.ha-root input:not([type=checkbox]):not([type=radio]):focus, .ha-root select:focus, .ha-root textarea:focus { outline: none !important; border-color: var(--ha-dir-deep, var(--ha-terra)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ha-dir-deep, var(--ha-terra)) 28%, transparent); }
.mz-pop input:not([type=checkbox]):focus-visible, .mz-fields input:focus-visible, .ha-chat__form input:not([type=checkbox]):focus-visible, .lf-row input:focus-visible, .ha-form-row input:focus-visible, .ha-qa__form input:focus-visible { border-radius: 999px; }
.op-fields input:focus-visible, .op-fields select:focus-visible, .op-fields textarea:focus-visible, .op-other input:focus-visible, .op-sum input:focus-visible { border-radius: 16px; }
.kv-fields input:focus-visible { border-radius: 14px; }
/* Заголовки не рвутся посреди слова; заголовок курса подстраивается под самое длинное слово (--lw) */
h1, h2, .ha-h1, .ha-big__title { overflow-wrap: normal; hyphens: manual; }
.mz-hero__text { container-type: inline-size; }
.mz-hero h1.ha-h1 { font-size: min(clamp(42px, 5vw, 68px), calc(100cqi / (var(--lw, 8) * .66))); }
@media (max-width: 640px) { .mz-hero h1.ha-h1 { font-size: min(44px, calc(100cqi / (var(--lw, 8) * .66))); } }
/* Программа курса не прилипает к краю белой карточки: лента внутри полей блока */
.mz-pin { margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }
@media (max-width: 640px) { .mz-pin { margin: 0; padding: 0 0 4px; } }
/* Отзывы: главная мысль маркером, кавычка в начале карточки */
.ha-rev__text b, .hr__t b { color: var(--ha-ink); font-weight: 700; background: linear-gradient(transparent 60%, color-mix(in srgb, var(--ha-dir-pill, #F2DFB0) 85%, transparent) 60%); -webkit-box-decoration-break: clone; box-decoration-break: clone; padding: 0 1px; }
.ha-rev { position: relative; padding-top: 34px; }
.ha-rev::before { content: '“'; position: absolute; left: 18px; top: 4px; font: 800 52px/1 Georgia, 'Times New Roman', serif; color: var(--ha-dir-deep, var(--ha-terra)); opacity: .55; }
.hr { position: relative; }
/* Подарки: значок с номером, цена наклейкой, картины полароидами */
.mz-gift2__top { gap: 10px; }
.mz-gift2__badge { position: relative; width: 46px; height: 46px; flex: none; }
.mz-gift2__badge img { width: 46px; height: 46px; object-fit: contain; }
.mz-gift2__badge i { position: absolute; right: -6px; bottom: -4px; min-width: 22px; height: 22px; border-radius: 999px; background: var(--ha-terra); color: #fff; font: 800 12px/22px var(--ha-font); font-style: normal; text-align: center; box-shadow: 0 0 0 2px #fff; }
.mz-gift2__price { display: inline-flex; gap: 10px; align-items: baseline; margin: 14px 0 0; padding: 7px 16px; border-radius: 999px; background: var(--ha-sun); color: var(--ha-sun-ink); transform: rotate(-2deg); }
.mz-gift2__price b { color: inherit; font-size: 15px; font-weight: 800; } .mz-gift2__price s { color: inherit; opacity: .7; font-size: 14px; }
.mz-gift2__ph { gap: 18px; padding: 6px 4px 10px; }
.mz-pola { margin: 0; background: #fff; padding: 8px; border-radius: 4px; box-shadow: 0 12px 26px rgba(61,36,27,.18); transform: rotate(-2deg); transition: transform .25s ease; }
.mz-pola:nth-child(2n) { transform: rotate(1.8deg) translateY(6px); }
.mz-pola:nth-child(3n) { transform: rotate(-.8deg); }
.mz-pola:hover { transform: rotate(0) scale(1.03); }
.mz-gift2__ph .mz-pola img { display: block; height: 190px; width: auto; max-width: 100%; border-radius: 2px; box-shadow: none; }
@media (min-width: 901px) { .mz-gift2--row .mz-gift2__ph .mz-pola img { height: 210px; } }
@media (max-width: 900px) { .mz-gift2__ph .mz-pola img { height: 140px; } }
@media (max-width: 640px) { .mz-gift2__ph { gap: 12px; } .mz-gift2__ph .mz-pola img { height: 104px; } .mz-pola { padding: 5px; } }
/* Пробный урок с синим фоном (Анималистика маслом: хаски на снегу) */
.ha-big--sky { background: #DCE8F3; }
.mz-why--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) { .mz-why--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .mz-why--3 { grid-template-columns: minmax(0, 1fr); } }
.mz-diff--lists { max-width: none; }
.mz-dlists { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.mz-dlist { background: var(--ha-canvas); border-radius: 18px; padding: 18px 20px; }
.mz-dlist b { display: block; font-size: 17px; margin-bottom: 10px; }
.mz-dlist ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.mz-dlist li { position: relative; padding-left: 26px; font-size: 15.5px; line-height: 1.5; color: var(--ha-ink-2); }
.mz-dlist li::before { position: absolute; left: 0; top: 0; font-weight: 800; }
.mz-dlist--yes li::before { content: '✓'; color: var(--ha-ok); } .mz-dlist--no li::before { content: '✕'; color: var(--ha-danger, #B84E28); } .mz-dlist--plus li::before { content: '+'; color: var(--ha-dir-deep, var(--ha-terra)); font-size: 18px; line-height: 1.2; }
@media (max-width: 900px) { .mz-dlists { grid-template-columns: minmax(0, 1fr); } }
/* Раскладки первого экрана привязаны к курсу (mz-hero--<slug>): тема оформления у курсов бывает общей. «Анималистика маслом»: Анжелика без картины, за ней бульдог, сова и волк — морды всех троих видны */
.mz-hero--animalistika-maslom .mz-fan--pal .who { left: 44%; height: 90%; }
.mz-hero--animalistika-maslom .mz-fan--pal .ship { left: 63%; top: -2%; width: 30%; transform: rotate(6deg); }
.mz-hero--animalistika-maslom .mz-fan--pal .rus { left: 0; top: 20%; width: 31%; }
.mz-hero--animalistika-maslom .mz-fan--pal .wave { right: -1%; top: 52%; width: 31%; }
.mz-hero--animalistika-maslom .mz-fan--pal .cap { left: 0; }
@media (max-width: 640px) { .mz-hero--animalistika-maslom .mz-fan--pal .wave { right: 3%; top: 54%; width: 28%; } .mz-hero--animalistika-maslom .mz-fan--pal .ship { left: 64%; width: 28%; } .mz-hero--animalistika-maslom .mz-fan--pal .rus { left: 3%; width: 28%; } }
/* «Магия акварели»: Вера держит «Склоны Тосканы» справа — фоновые картины слева и сверху справа, чтобы её картина их не закрывала */
.ha-theme-akvarel .mz-fan--pal .ship { left: 2%; top: -1%; width: 30%; transform: rotate(-6deg); }
.ha-theme-akvarel .mz-fan--pal .rus { left: 0; top: 40%; width: 27%; transform: rotate(-9deg); }
.ha-theme-akvarel .mz-fan--pal .wave { right: 0; top: -2%; width: 27%; transform: rotate(8deg); }
.ha-theme-akvarel .mz-fan--pal .who { left: 55%; }
@media (max-width: 640px) { .ha-theme-akvarel .mz-fan--pal .ship { left: 3%; width: 28%; } .ha-theme-akvarel .mz-fan--pal .rus { left: 3%; width: 25%; } .ha-theme-akvarel .mz-fan--pal .wave { right: 3%; width: 25%; } }
/* «Мастер портретов»: Евгений с руками на груди — фигура меньше, рисунки по краям, лица всех трёх портретов видны */
.ha-theme-grafika .mz-fan--pal .who { left: 52%; height: 82%; }
.ha-theme-grafika .mz-fan--pal .ship { left: 0; top: -1%; width: 27%; transform: rotate(-7deg); }
.ha-theme-grafika .mz-fan--pal .rus { left: 4%; top: 40%; width: 24%; transform: rotate(5deg); }
.ha-theme-grafika .mz-fan--pal .wave { right: 0; top: 4%; width: 27%; transform: rotate(8deg); }
@media (max-width: 640px) { .ha-theme-grafika .mz-fan--pal .ship { left: 3%; width: 26%; } .ha-theme-grafika .mz-fan--pal .rus { left: 3%; width: 23%; } .ha-theme-grafika .mz-fan--pal .wave { right: 3%; width: 26%; } }

/* Плашки фактов: слово не рвётся по буквам («портрето/в»), на телефоне шрифт чуть меньше */
.mz-fact b { overflow-wrap: normal; word-break: normal; hyphens: manual; }
@media (max-width: 640px) { .mz-fact b { font-size: 23px; } }
/* «Интерьерная анималистика» и «Цвет и стиль»: Юлия Миненко в кресле — картины выше кресла, чтобы оно их не закрывало */
.mz-hero--interernaya-animalistika .mz-fan--pal .wave { top: 30%; }
@media (max-width: 640px) { .mz-hero--interernaya-animalistika .mz-fan--pal .wave { top: 22%; right: 2%; } .mz-hero--interernaya-animalistika .mz-fan--pal .ship { top: -3%; } .mz-hero--cvet-i-stil .mz-fan--pal .wave { top: 26%; } }
.mz-hero--interernaya-animalistika .mz-fan--pal .ship { left: auto; right: 1%; top: -3%; width: 26%; transform: rotate(7deg); }
.mz-hero--interernaya-animalistika .mz-fan--pal .wave { right: 2%; top: 46%; width: 26%; }
@media (max-width: 640px) { .mz-hero--interernaya-animalistika .mz-fan--pal .ship { right: 2%; top: -4%; width: 26%; } .mz-hero--interernaya-animalistika .mz-fan--pal .wave { right: 2%; top: 44%; width: 26%; } }
@media (max-width: 640px) { .mz-hero--interernaya-animalistika .mz-fan--pal .wave { right: auto; left: 2%; top: -4%; width: 25%; transform: rotate(-6deg); } .mz-hero--interernaya-animalistika .mz-fan--pal .rus { left: 2%; top: 38%; width: 25%; } }
/* «Интерьерные портреты» и «Цвет и стиль»: лица на картинах не закрыты фигурой — картины по краям */
.mz-hero--interernye-portrety .mz-fan--pal .who, .mz-hero--cvet-i-stil .mz-fan--pal .who { left: 45%; }
.mz-hero--interernye-portrety .mz-fan--pal .ship, .mz-hero--cvet-i-stil .mz-fan--pal .ship { left: auto; right: 0; top: -3%; width: 27%; transform: rotate(6deg); }
.mz-hero--interernye-portrety .mz-fan--pal .wave, .mz-hero--cvet-i-stil .mz-fan--pal .wave { right: 1%; top: 47%; width: 26%; transform: rotate(-4deg); }
.mz-hero--interernye-portrety .mz-fan--pal .rus, .mz-hero--cvet-i-stil .mz-fan--pal .rus { left: 0; top: 14%; width: 28%; }
@media (max-width: 640px) {
  .mz-hero--interernye-portrety .mz-fan--pal .ship, .mz-hero--cvet-i-stil .mz-fan--pal .ship { right: 2%; top: -4%; width: 26%; }
  .mz-hero--interernye-portrety .mz-fan--pal .wave, .mz-hero--cvet-i-stil .mz-fan--pal .wave { right: auto; left: 2%; top: 42%; width: 25%; }
  .mz-hero--interernye-portrety .mz-fan--pal .rus, .mz-hero--cvet-i-stil .mz-fan--pal .rus { left: 2%; top: -4%; width: 25%; }
}
@media (max-width: 640px) {
  .mz-hero--interernye-portrety .mz-fan--pal .who, .mz-hero--cvet-i-stil .mz-fan--pal .who { height: 74%; left: 52%; }
  .mz-hero--interernye-portrety .mz-fan--pal .wave, .mz-hero--cvet-i-stil .mz-fan--pal .wave { left: 1%; top: 36%; width: 23%; }
  .mz-hero--interernye-portrety .mz-fan--pal .ship, .mz-hero--cvet-i-stil .mz-fan--pal .ship { right: 1%; width: 24%; }
  .mz-hero--interernye-portrety .mz-fan--pal .rus, .mz-hero--cvet-i-stil .mz-fan--pal .rus { left: 1%; width: 23%; }
}
@media (max-width: 640px) { .mz-hero--interernye-portrety .mz-fan--pal .ship, .mz-hero--cvet-i-stil .mz-fan--pal .ship, .mz-hero--interernye-portrety .mz-fan--pal .rus, .mz-hero--cvet-i-stil .mz-fan--pal .rus { top: 3%; } }
/* Телефон: картины первого экрана не заходят за край блока (картины не обрезаем) */
@media (max-width: 640px) {
  .mz-hero--interernaya-animalistika .mz-fan--pal .wave, .mz-hero--interernaya-animalistika .mz-fan--pal .ship { top: 3%; }
  .mz-hero--magiya-akvareli .mz-fan--pal .ship, .mz-hero--magiya-akvareli .mz-fan--pal .wave { top: 3%; }
  .mz-hero--magiya-akvareli .mz-fan--pal .wave { right: 3%; }
  .mz-hero--animalistika-maslom .mz-fan--pal .wave { right: 4%; width: 25%; top: 50%; }
  .mz-hero--animalistika-maslom .mz-fan--pal .ship { top: 3%; right: 4%; left: auto; width: 25%; }
}
@media (max-width: 640px) {
  .mz-hero--animalistika-maslom .mz-fan--pal .rus { left: 2%; top: 3%; width: 24%; }
  .mz-hero--animalistika-maslom .mz-fan--pal .wave { right: auto; left: 2%; top: 37%; width: 24%; }
  .mz-hero--animalistika-maslom .mz-fan--pal .who { left: 56%; }
  .mz-hero--magiya-akvareli .mz-fan--pal .rus { left: 2%; top: 36%; width: 21%; }
  .mz-hero--magiya-akvareli .mz-fan--pal .ship { left: 2%; width: 24%; }
}
/* «Цветы акрилом» и «Искусство акриловой живописи»: Юлия Климова в центре, три картины по краям целиком */
.mz-hero--cvety-akrilom .mz-fan .who, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .who { left: 47%; height: 84%; }
.mz-hero--cvety-akrilom .mz-fan .ship, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .ship { left: auto; right: 0; top: 1%; width: 26%; transform: rotate(6deg); }
.mz-hero--cvety-akrilom .mz-fan .wave, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .wave { right: 1%; top: 48%; width: 25%; transform: rotate(-4deg); }
.mz-hero--cvety-akrilom .mz-fan .rus, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .rus { left: 0; top: 12%; width: 27%; }
@media (max-width: 640px) {
  .mz-hero--cvety-akrilom .mz-fan .who, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .who { height: 72%; left: 52%; }
  .mz-hero--cvety-akrilom .mz-fan .ship, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .ship { right: 1%; top: 3%; width: 24%; }
  .mz-hero--cvety-akrilom .mz-fan .rus, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .rus { left: 1%; top: 3%; width: 23%; }
  .mz-hero--cvety-akrilom .mz-fan .wave, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .wave { right: auto; left: 1%; top: 37%; width: 23%; }
}
.mz-hero--cvety-akrilom .mz-fan .who, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .who { left: 44%; height: 76%; }
.mz-hero--cvety-akrilom .mz-fan .ship, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .ship { width: 24%; right: 0; }
.mz-hero--cvety-akrilom .mz-fan .wave, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .wave { width: 24%; right: 0; top: 50%; }
.mz-hero--cvety-akrilom .mz-fan .rus, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .rus { width: 25%; }
@media (max-width: 640px) { .mz-hero--cvety-akrilom .mz-fan .who, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .who { height: 66%; left: 52%; } .mz-hero--cvety-akrilom .mz-fan .wave, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .wave { left: 1%; right: auto; top: 37%; width: 22%; } .mz-hero--cvety-akrilom .mz-fan .ship, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .ship { width: 23%; right: 1%; } }
.mz-hero--cvety-akrilom .mz-fan .who, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .who { height: 84%; left: 46%; }
.mz-hero--cvety-akrilom .mz-fan .rus, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .rus { width: 24%; top: 8%; }
@media (max-width: 640px) { .mz-hero--cvety-akrilom .mz-fan .who, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .who { height: 76%; left: 54%; } .mz-hero--cvety-akrilom .mz-fan .rus, .mz-hero--iskusstvo-akrilovoy-zhivopisi .mz-fan .rus { top: 3%; width: 23%; } }

/* «Морская живопись», «Анатомия масла», «Мастер объёмных картин»: картины по краям, фигура их не закрывает */
.mz-hero--morskaya-zhivopis .mz-fan .who, .mz-hero--anatomiya-masla .mz-fan .who, .mz-hero--master-obemnyh-kartin .mz-fan .who { left: 46%; height: 84%; }
.mz-hero--morskaya-zhivopis .mz-fan .ship, .mz-hero--anatomiya-masla .mz-fan .ship, .mz-hero--master-obemnyh-kartin .mz-fan .ship { left: auto; right: 0; top: 2%; width: 24%; transform: rotate(6deg); }
.mz-hero--morskaya-zhivopis .mz-fan .wave, .mz-hero--anatomiya-masla .mz-fan .wave, .mz-hero--master-obemnyh-kartin .mz-fan .wave { right: 0; top: 50%; width: 24%; transform: rotate(-4deg); }
.mz-hero--morskaya-zhivopis .mz-fan .rus, .mz-hero--anatomiya-masla .mz-fan .rus, .mz-hero--master-obemnyh-kartin .mz-fan .rus { left: 0; top: 8%; width: 24%; transform: rotate(-6deg); }
.mz-hero--morskaya-zhivopis .mz-fan .cap, .mz-hero--anatomiya-masla .mz-fan .cap, .mz-hero--master-obemnyh-kartin .mz-fan .cap { left: 0; transform: none; }
@media (max-width: 640px) {
  .mz-hero--morskaya-zhivopis .mz-fan .who, .mz-hero--anatomiya-masla .mz-fan .who, .mz-hero--master-obemnyh-kartin .mz-fan .who { height: 74%; left: 55%; }
  .mz-hero--morskaya-zhivopis .mz-fan .ship, .mz-hero--anatomiya-masla .mz-fan .ship, .mz-hero--master-obemnyh-kartin .mz-fan .ship { right: 1%; top: 3%; width: 23%; }
  .mz-hero--morskaya-zhivopis .mz-fan .rus, .mz-hero--anatomiya-masla .mz-fan .rus, .mz-hero--master-obemnyh-kartin .mz-fan .rus { left: 1%; top: 3%; width: 23%; }
  .mz-hero--morskaya-zhivopis .mz-fan .wave, .mz-hero--anatomiya-masla .mz-fan .wave, .mz-hero--master-obemnyh-kartin .mz-fan .wave { right: auto; left: 1%; top: 37%; width: 22%; }
}

/* ===== Телефон компактнее (правка владельца 08.10.2026): масштаб ≈0,9, меньше воздуха и высоты ===== */
@media (max-width: 640px) {
  .ha-root { font-size: 15.5px; }
  .ha-page { padding: 12px 12px 40px; gap: 10px; }
  .ha-big { padding: 18px 16px; border-radius: 20px; }
  .ha-big__title { font-size: 23px; margin-bottom: 12px; }
  .ha-h1, .mz-hero h1.ha-h1, .hh .ha-h1, .hh .hh__text > .ha-h1 { font-size: min(36px, calc(100cqi / (var(--lw, 8) * .66))); margin: 12px 0 14px; }
  .ha-lead { font-size: 16px; line-height: 1.5; }
  .ha-btn { font-size: 15px; } .ha-btn--lg { min-height: 48px; padding: 0 20px; }
  .ha-pill { font-size: 12px; }
  .mz-about p, .ha-seo p, .mz-forever p, .mz-start p { font-size: 15.5px; }
  .mz-level b, .mz-why h4, .mz-steps b, .mz-bul b, .ha-fear b, .ha-steps4 b, .mz-gift2 h3 { font-size: 16px; }
  .mz-level span, .mz-why p, .mz-steps span, .ha-fear p, .mz-dlist li, .mz-diff p { font-size: 14.5px; }
  .mz-fact b { font-size: 21px; } .mz-fact span { font-size: 13px; } .mz-fact p { font-size: 13.5px; }
  .ha-rev__text, .hr__t { font-size: 14.5px; }
  /* Главная: кнопки первого экрана друг под другом, во всю ширину */
  .hh__btns { flex-wrap: wrap; } .hh__btns .ha-btn { flex: 1 1 100%; white-space: normal; font-size: 15.5px; }
  /* Главная: лента работ учеников — в три ряда, столбцы тоньше, без прилипания к левому краю */
  .hw-pin { grid-auto-columns: 31vw; gap: 8px; margin: 0 -16px; padding: 0 16px 4px; } .hw-pin .ha-pin__col { gap: 8px; } .hw-pin .ha-pin__col:nth-child(even) { padding-top: 16px; }
  /* Плитки курсов шире и ниже: один столбец карточек с картинами в ряд */
  .ha-courses, .mz-similar .ha-courses, .hk-group .ha-courses { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .ha-courses .ha-course-tile { display: grid; grid-template-columns: 44% minmax(0, 1fr); grid-template-rows: auto auto 1fr auto; column-gap: 12px; row-gap: 4px; padding: 10px; }
  .ha-courses .ha-course-tile__grid { grid-row: 1 / 5; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px; align-self: start; }
  .ha-courses .ha-course-tile .ha-pill { grid-column: 2; justify-self: start; margin: 0; }
  .ha-courses .ha-course-tile h3, .ha-courses .ha-course-tile h4 { grid-column: 2; font-size: 15.5px; margin: 0; }
  .ha-courses .ha-course-tile p { grid-column: 2; display: block; font-size: 12.5px; line-height: 1.35; color: var(--ha-ink-2); margin: 0; }
  .ha-courses .ha-course-tile__foot { grid-column: 2; flex-direction: row; align-items: center; justify-content: space-between; gap: 8px; }
  .ha-courses .ha-course-tile__foot .ha-btn { width: auto; min-height: 36px; padding: 0 12px; font-size: 13px; }
  .ha-courses .ha-course-tile__price { font-size: 13.5px; }
  /* Стоимость и оплата: белый фон на всю ширину, карточки тарифов шире */
  .mz-page-tarif { margin: 0 -12px; border-radius: 0; padding: 20px 12px; background: var(--ha-canvas); }
  .mz-tars { gap: 10px; } .mz-tar { padding: 16px 14px 16px; border-radius: 18px; gap: 10px; }
  .mz-tar h3 { font-size: 20px; } .mz-tar__price b { font-size: 30px; } .mz-tar p { font-size: 14px; }
  .mz-check li { font-size: 14px; }
  .mz-bonus-box { padding: 10px; gap: 6px; border-radius: 14px; } .mz-bonus-box__h { font-size: 15px; }
  .mz-bonus-row { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 8px; padding: 6px 10px 6px 6px; border-radius: 12px; align-items: center; }
  .mz-bonus-row > img { width: 40px; height: 40px; } .mz-bonus-row b { font-size: 14px; } .mz-bonus-row span { display: none; }
  .mz-bonus-row i { grid-column: 3; text-align: right; } .mz-bonus-row i s { display: none; } .mz-bonus-row i strong { display: inline; font-size: 13px; }
  /* Подарки: номер, название и фото без лишней высоты */
  .mz-gift2 { padding: 14px 14px 16px; } .mz-gift2__top { gap: 6px; margin-bottom: 6px; } .mz-gift2__badge, .mz-gift2__badge img { width: 32px; height: 32px; }
  .mz-gift2 p.d { font-size: 14px; } .mz-gift2__price { margin-top: 8px; padding: 5px 12px; } .mz-gift2__ph { margin-top: 10px; gap: 8px; }
  .mz-gift2__ph .mz-pola img { height: 96px; }
  .mz-gifts2 { gap: 10px; } .mz-gifts-lead { font-size: 15px; }
}
@media (max-width: 640px) {
  /* тариф во всю ширину экрана (у .ha-page поля 12 px, у .ha-big свои 16 px) */
  .ha-page > .mz-page-tarif { margin-left: -12px; margin-right: -12px; width: calc(100% + 24px); border-radius: 0; padding: 20px 12px; }
  /* подарки: фото слева от текста, а не под ним с пустотой */
  .mz-gift2, .mz-gift2--row { display: grid; grid-template-columns: 96px minmax(0, 1fr); column-gap: 12px; align-items: start; }
  .mz-gift2__ph, .mz-gift2--row .mz-gift2__ph { grid-column: 1; grid-row: 1; margin: 0; flex-direction: column; gap: 6px; justify-content: flex-start; }
  .mz-gift2__tx { grid-column: 2; grid-row: 1; }
  .mz-gift2__ph .mz-pola { transform: none; padding: 4px; } .mz-gift2__ph .mz-pola:nth-child(n+3) { display: none; }
  .mz-gift2__ph .mz-pola img { height: auto; width: 88px; max-height: 120px; object-fit: contain; }
  .mz-gift2__badge { display: none; } .mz-gift2__num { font-size: 12px; }
}
@media (max-width: 640px) { .ha-doc__h1 { font-size: clamp(22px, 5.6vw, 28px); } }

/* ===== Веер первого экрана на телефоне (правка владельца 08.10.2026): картины крупнее и ближе к преподавателю,
   разлёт небольшой. Одно правило для всех курсов, стоит после курсовых раскладок и поэтому главнее их. ===== */
@media (max-width: 640px) {
  .mz-hero .mz-fan:not(.mz-fan--one) { height: 400px; }
  .mz-hero .mz-fan .who { left: 50% !important; height: 78% !important; }
  .mz-hero .mz-fan:not(.mz-fan--one) .p { width: 36% !important; }
  .mz-hero .mz-fan .rus { left: 4% !important; right: auto !important; top: 10% !important; transform: rotate(-8deg) !important; }
  .mz-hero .mz-fan .ship { left: 32% !important; right: auto !important; top: -2% !important; transform: rotate(3deg) !important; }
  .mz-hero .mz-fan .wave { left: auto !important; right: 4% !important; top: 12% !important; transform: rotate(8deg) !important; }
  .mz-hero .mz-fan .cap { left: 50% !important; transform: translateX(-50%) !important; width: min(300px, 86%) !important; bottom: 10px !important; }
}

/* ===== Аудит телефона 08.10.2026: цели нажатия не меньше 40 px, кнопки-ссылки не прячем ===== */
@media (max-width: 640px) {
  .hr__more, .hk-intro__links a, .ha-seo a, .mz-tar + p a, .ha-mute a, .mz-teacher a, .ha-big > p > a { display: inline-block; min-height: 40px; line-height: 40px; }
  .op-back { min-height: 44px; padding: 0 10px; } .op-back span { display: inline; font-size: 14px; }
  .ha-check { min-height: 40px; align-items: center; } .ha-check__box { width: 26px; height: 26px; }
  .mz-top__logo { display: flex; align-items: center; min-height: 40px; }
  .ha-filter button, .hk-filters button, .ha-chips button { min-height: 40px; }
  .ha-form-row a, .lf-row + label a { min-height: 0; line-height: inherit; }
}
@media (max-width: 640px) { .ha-doc__text a[href^="mailto"], td a[href^="mailto"], .ha-rekv a[href^="mailto"] { overflow-wrap: anywhere; word-break: break-all; font-size: 14px; } }

/* Подсказка «Листайте →» на горизонтальных лентах: программа (.ha-pin), работы, отзывы, .ha-scroller (владелец 08.10.2026: непонятно, что листается).
   Обёртка .ha-swipe ставится скриптом site.js, пилюля исчезает после первой прокрутки или в конце ленты. */
.ha-swipe { position: relative; }
.ha-swipe__hint { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); z-index: 3; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px 0 18px; border-radius: 999px; border: 1.5px solid var(--ha-line); background: var(--ha-canvas, #fff); color: var(--ha-ink); font: 700 15px/1 var(--ha-font); box-shadow: 0 10px 24px rgba(28,52,72,.18); cursor: pointer; transition: opacity .3s, transform .3s; }
.ha-swipe__hint i { font-style: normal; font-size: 18px; animation: ha-nudge 1.1s ease-in-out infinite; }
.ha-swipe__hint:hover { border-color: var(--ha-terra); color: var(--ha-terra); }
.ha-swipe.is-done .ha-swipe__hint { opacity: 0; pointer-events: none; transform: translate(12px, -50%); }
@keyframes ha-nudge { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(6px); } }
@media (prefers-reduced-motion: reduce) { .ha-swipe__hint i { animation: none; } }
@media (max-width: 640px) { .ha-swipe__hint { right: 6px; padding: 0 14px 0 16px; font-size: 14px; } }

/* Вводные уроки курса под лентой картин: горизонтальные плашки без фото (правка владельца 09.10.2026) */
.mz-vvodnye { margin-top: 32px; padding-top: 26px; border-top: 1px solid var(--ha-line); }
.mz-vvodnye h3 { margin: 0 0 6px; }
.mz-vvodnye > p { margin: 0 0 18px; color: var(--ha-ink-2); }
.mz-vvodnye__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 14px; }
.mz-vv { margin: 0; display: flex; gap: 18px; align-items: center; background: var(--ha-dir-tint, var(--ha-paper-2)); border-radius: 18px; padding: 18px 22px; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.mz-vv:hover, .mz-vv:focus-visible { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(28,52,72,.12); }
.mz-vv__n { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--ha-dir-deep, var(--ha-dark)); color: #fff; font: 800 22px/1 var(--ha-font); }
.mz-vv figcaption { font-size: 15px; line-height: 1.45; color: var(--ha-ink-2); }
.mz-vv figcaption b { display: block; font-size: 18px; line-height: 1.25; color: var(--ha-ink); margin-bottom: 4px; }
.mz-vv .more { display: block; margin-top: 6px; color: var(--ha-terra); font-weight: 700; font-size: 14px; }
/* окно урока без картинки (вводные уроки): одна колонка текста */
.mz-lb__box:has(> .mz-lb__art[hidden]) { grid-template-columns: minmax(0, 1fr); max-width: 680px; }
@media (max-width: 640px) {
  .mz-vvodnye { margin-top: 24px; padding-top: 20px; }
  .mz-vv { gap: 14px; padding: 14px 16px; border-radius: 16px; }
  .mz-vv__n { width: 40px; height: 40px; font-size: 18px; }
  .mz-vv figcaption { font-size: 14px; }
  .mz-vv figcaption b { font-size: 16px; }
}
@media (min-width: 901px) { .mz-pin--mat[style*="--pin-cols"] { grid-auto-columns: calc((100% - (var(--pin-cols) - 1) * 14px) / var(--pin-cols)); } }

/* ---------- Бесплатные уроки: страница /urok/<курс>/, ссылку присылает бот после заявки (09.10.2026, по образцу «Морского заката») ---------- */
.pz-hero{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.pz-kartina{margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:8px}
.pz-kartina img{display:block;max-width:min(100%,440px);max-height:540px;width:auto;height:auto;border-radius:8px;box-shadow:0 26px 50px rgba(40,26,18,.22);background:#fff}
.pz-kartina figcaption{font-size:14px;color:var(--ha-ink-2,#6B5A50);text-align:center}
.pz-hero__ref{margin:14px 0 0;font-size:15px}
.pz-player{position:relative;aspect-ratio:16/9;max-width:960px;margin:0 auto;border-radius:22px;overflow:hidden;background:#20140F;box-shadow:0 24px 50px rgba(40,26,18,.22)}
.pz-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.pz-two{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr);gap:28px;align-items:start}.pz-two p{margin:0 0 14px;max-width:640px}
.pz-skills{background:var(--ha-dir-tint,var(--ha-paper-2));border-radius:22px;padding:22px 24px}.pz-skills b{display:block;font-size:18px;margin-bottom:10px}.pz-skills ul{margin:0;padding-left:20px;display:grid;gap:8px}
.pz-inv{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:start}.pz-inv--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.pz-inv__g{background:#fff;border-radius:22px;padding:18px 20px;display:grid;grid-template-columns:52px minmax(0,1fr);gap:10px 12px;align-items:center}
.pz-inv__g img{width:52px;height:52px;object-fit:contain;display:block}.pz-inv__g b{font-size:18px}
.pz-inv__g ul{grid-column:1/-1;margin:0;padding-left:18px;display:grid;gap:6px;font-size:15px}
.pz-inv__more{margin:18px 0 0}
.pz-ref{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:center}
.pz-ref__img{display:flex;justify-content:center}.pz-ref__img img{display:block;max-width:100%;max-height:460px;width:auto;height:auto;border-radius:12px;box-shadow:0 18px 40px rgba(40,26,18,.18)}
.pz-start{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:28px;align-items:center}.pz-start__pts{margin:0;padding-left:20px;display:grid;gap:8px;font-size:16px}
.pz-vopros{margin-top:14px;max-width:520px}
@media(max-width:900px){.pz-hero,.pz-two,.pz-start,.pz-ref{grid-template-columns:1fr}.pz-inv,.pz-inv--3{grid-template-columns:1fr 1fr}.pz-kartina img{max-height:420px}.pz-start .mz-art{display:none}}
@media(max-width:560px){.pz-inv,.pz-inv--3{grid-template-columns:1fr}}
/* Страница урока по экранам продающего вебинара (айсберг, 09.10.2026) */
.pz-rez{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:28px;align-items:center}.pz-rez p{max-width:680px}
.pz-ays{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:center}.pz-ays p{max-width:620px}
.pz-ays__mosaic{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pz-ays__t{margin:0;position:relative;aspect-ratio:3/4;background:rgba(255,255,255,.55);border-radius:14px;display:flex;align-items:center;justify-content:center;padding:8px}
.pz-ays__t img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:3px;box-shadow:0 6px 14px rgba(40,26,18,.16)}
.pz-ays__t.on{background:#fff;outline:3px solid var(--ha-terra)}.pz-ays__t figcaption{position:absolute;left:8px;top:8px;background:var(--ha-terra);color:#fff;font-size:12px;font-weight:700;border-radius:999px;padding:3px 10px}
.pz-cena{display:grid;grid-template-columns:repeat(2,minmax(0,280px));gap:14px}
.pz-cena__c{background:#fff;border-radius:22px;padding:20px 24px;display:grid;gap:6px;border:2px solid transparent}.pz-cena__c span{font-size:15px;color:var(--ha-ink-2,#6B5A50)}
.pz-cena__c s{font-size:30px;font-weight:700;color:var(--ha-ink-2,#6B5A50)}.pz-cena__c b{font-size:38px;line-height:1.1}.pz-cena__c em{font-style:normal;font-size:15px;color:var(--ha-terra);font-weight:700}
.pz-cena__c--now{border-color:var(--ha-terra)}
.ha-big:not(.ha-big--soft) .pz-cena__c{background:var(--ha-paper-2,#F1E9DB)}
.pz-okno .ha-lead{max-width:780px}
.pz-itog{margin:0;padding:0;list-style:none;display:grid;gap:10px;max-width:820px}.pz-itog li{background:#fff;border-radius:16px;padding:14px 18px 14px 50px;position:relative;font-size:17px}
.pz-itog li::before{content:"✓";position:absolute;left:16px;top:12px;width:24px;height:24px;border-radius:50%;background:var(--ha-terra);color:#fff;display:grid;place-items:center;font-size:14px;font-weight:700}
.pz-word{text-align:center}.pz-word .ha-lead{max-width:720px;margin-left:auto;margin-right:auto}
.pz-player--soon{display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px}.pz-player--soon p{margin:0;padding:20px;text-align:center}
@media(max-width:900px){.pz-rez,.pz-ays{grid-template-columns:1fr}.pz-rez .mz-art{display:none}.pz-ays__mosaic{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.pz-cena{grid-template-columns:1fr 1fr}.pz-cena__c{padding:14px 16px}.pz-cena__c s{font-size:22px}.pz-cena__c b{font-size:28px}}
/* Курс без пробного урока (bez_probnogo, «Пейзажи в технике лессировки» 09.10.2026): в форме-закрытии сначала оплата, ниже заявка */
.mz-form-pay{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 6px}
.mz-form-or{margin:18px 0 10px;font-size:15px;color:var(--ha-ink-2)}
@media(max-width:560px){.mz-form-pay .ha-btn{width:100%;justify-content:center}}

/* Формы: ошибка подсвечивает поле и галочку (09.10) */
.mz-fields input.err,.lf-row input.err{outline:2px solid var(--ha-terra);outline-offset:1px;animation:pz-shake .35s}
.ha-check.err .ha-check__box{border-color:var(--ha-terra);box-shadow:0 0 0 3px rgba(184,78,40,.22)}.ha-check.err{color:#8A3A1E;animation:pz-shake .35s}
.mz-done.err{background:#FBE9E3;color:#8A3A1E;border:1px solid #F0C9B8}
@keyframes pz-shake{0%,100%{transform:none}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
/* Мессенджеры у вопросов крупнее (09.10) */
.ha-qa .mz-msgr a{padding:8px 18px 8px 8px;font-size:15px}.ha-qa .mz-msgr img{width:40px;height:40px;border-radius:10px}
.pz-mess{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,240px));gap:10px;margin-top:14px}
.pz-mess__b{display:flex;align-items:center;gap:12px;background:#fff;border:2px solid transparent;border-radius:18px;padding:12px 16px;text-decoration:none;color:var(--ha-ink);transition:border-color var(--ha-fast),transform var(--ha-fast)}
.pz-mess__b:hover{border-color:var(--ha-dir-deep);color:var(--ha-ink);transform:translateY(-1px)}.pz-mess__b img{width:44px;height:44px;flex:none;border-radius:12px}
.pz-mess__b span{display:grid;line-height:1.2;font-size:14px;color:var(--ha-ink-2,#6B5A50)}.pz-mess__b b{font-size:17px;color:var(--ha-ink)}
.ha-big--soft .pz-mess__b,.ha-big--dir .pz-mess__b{background:#fff}.ha-big:not(.ha-big--soft):not(.ha-big--dir) .pz-mess__b{background:var(--ha-paper-2,#F1E9DB)}
/* Материалы: кнопки и референс */
.pz-inv__foot{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:22px}
.pz-inv__ref{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ha-ink-2,#6B5A50);font-size:14px;max-width:360px}.pz-inv__ref img{width:72px;height:72px;object-fit:cover;border-radius:12px;flex:none;box-shadow:0 8px 18px rgba(40,26,18,.18)}
/* Видео из нескольких частей: кнопки под плеером */
.pz-vnav{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;max-width:960px;margin:16px auto 0}
.pz-vnav__cap{text-align:center;display:grid;gap:2px}.pz-vnav__cap b{font-size:17px}.pz-vnav__cap span{font-size:14px;color:var(--ha-ink-2,#6B5A50)}
.pz-dots{display:flex;justify-content:center;gap:6px;margin-top:6px}.pz-dot{width:10px;height:10px;border-radius:50%;border:0;background:var(--ha-paper-2,#F1E9DB);padding:0;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(61,36,27,.15)}.pz-dot.on{background:var(--ha-terra)}
.pz-vnav .ha-btn[disabled]{opacity:.4;pointer-events:none}
/* Программа: слайдер без рамок, картина крупно, подпись под ней */
.pz-pr{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:6px 4px 10px;margin:0 -4px;align-items:flex-start}.pz-pr::-webkit-scrollbar{display:none}
.pz-pr__s{flex:0 0 calc((100% - 48px)/3);scroll-snap-align:start;display:grid;gap:14px}
.pz-pr__art{height:460px;display:flex;align-items:flex-end;justify-content:center}.pz-pr__art img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:6px;box-shadow:0 18px 36px rgba(40,26,18,.22);cursor:zoom-in}
.pz-pr__tx{display:grid;gap:8px;align-content:start}.pz-pr__tx h3{margin:4px 0 0}.pz-pr__short{margin:0;color:var(--ha-ink-2,#6B5A50)}.pz-pr__more p{margin:0 0 8px;font-size:15px}
.pz-pr__btn{justify-self:start;background:none;border:0;padding:0;font:inherit;font-size:15px;font-weight:700;color:var(--ha-terra);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.pz-pr__mine{display:inline-block;justify-self:start;background:var(--ha-terra);color:#fff;border-radius:999px;font-size:13px;font-weight:700;padding:4px 12px}
@media(max-width:900px){.pz-pr__s{flex-basis:calc((100% - 24px)/2)}.pz-pr__art{height:400px}.pz-vnav{grid-template-columns:1fr 1fr}.pz-vnav__cap{grid-column:1/-1;order:-1}.pz-inv__foot{flex-direction:column;align-items:flex-start}}
@media(max-width:560px){.pz-pr__s{flex-basis:80%}.pz-pr__art{height:360px}.pz-vnav .ha-btn{justify-content:center}.pz-mess{grid-template-columns:1fr}}
.pz-lb{position:fixed;inset:0;z-index:200;background:rgba(32,20,15,.92);display:none;align-items:center;justify-content:center;padding:16px}.pz-lb.open{display:flex}
.pz-lb img{max-width:100%;max-height:100%;width:auto;height:auto;border-radius:10px;box-shadow:0 30px 60px rgba(0,0,0,.5)}
.pz-lb button{position:absolute;top:16px;right:16px;width:48px;height:48px;border-radius:50%;border:0;background:#fff;color:#3D241B;font-size:28px;line-height:1;cursor:pointer}
.pz-kartina img{cursor:zoom-in}

/* Логика заявок 09.10: главная — подбор курса с 2 000 ₽, курс — заявка на курс */
.hh-gift{display:flex;align-items:center;gap:10px;margin:14px 0 0;font-weight:700;color:var(--ha-ink)}.hh-gift img{width:34px;height:34px;flex:none}
.mz-hero__get{margin:10px 0 0;font-size:15px;color:var(--ha-ink-2,#6B5A50)}
.pz-gift-pts{margin:0 0 14px;padding-left:20px;display:grid;gap:6px;max-width:560px}
.mz-form-or{font-size:14px;color:var(--ha-ink-2,#6B5A50)}
.kv-get{margin-top:18px;display:grid;gap:10px}.kv-mess2{grid-template-columns:repeat(3,minmax(0,1fr))}
.kv-m{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--ha-canvas);border:2px solid var(--ha-line);border-radius:18px;padding:12px;text-decoration:none;color:var(--ha-ink);font-weight:700}
.kv-m:hover{border-color:var(--ha-terra);color:var(--ha-ink)}.kv-m img{width:30px;height:30px;border-radius:8px;flex:none}
.kv .ha-check.err .ha-check__box{border-color:var(--ha-terra)}.kv-fields input.err{outline:2px solid var(--ha-terra)}
@media(max-width:560px){.kv-mess2{grid-template-columns:1fr}}
#probnyy .ha-pill{white-space:normal;text-align:left;line-height:1.35;max-width:100%}

/* Мессенджеры заявки: только Telegram и MAX (09.10) — две кнопки в ряд */
.lf-mess{grid-template-columns:repeat(2,minmax(0,1fr))}.kv-mess2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:560px){.lf-mess,.kv-mess2{grid-template-columns:1fr}}
.mz-pop .lf-mess,.ha-chat .lf-mess{grid-template-columns:minmax(0,1fr)}

/* ===== Аудит дизайна страницы курса 13.10.2026 («Вальс цветов», правила общие для всех курсов) ===== */
/* Липкая шапка: над ней полоса цвета фона, текст страницы не просвечивает в зазоре сверху */
.mz-top::before { content: ''; position: absolute; left: 0; right: 0; top: calc(-10px - env(safe-area-inset-top, 0px)); height: calc(40px + env(safe-area-inset-top, 0px)); background: var(--ha-paper); z-index: -1; }
/* Первый экран: цена отдельной строкой и крупно, а не последним пунктом списка */
.mz-hero__note span:last-child { flex-basis: 100%; display: inline-flex; align-items: baseline; gap: 10px; margin-top: 8px; }
.mz-hero__note span:last-child::before { display: none; }
.mz-hero__note span:last-child b { order: -1; font-size: 28px; font-weight: 800; color: var(--ha-ink); letter-spacing: -.01em; line-height: 1; }
.mz-hero__note span:last-child s { font-size: 16px; color: var(--ha-ink-3); font-weight: 600; }
.mz-hero .ha-row > a:not(.ha-btn) { display: inline-flex; align-items: center; min-height: 44px; }
.mz-hero .ha-pill { line-height: 1.35; padding-top: 6px; padding-bottom: 6px; }
.mz-fan .cap span { display: block; line-height: 1.45; }
/* Первый экран без фигуры преподавателя: на телефоне без пустоты между картинами и подписью */
@media (max-width: 640px) { .mz-hero .mz-fan:not(:has(.who)):not(.mz-fan--one) { height: 320px; } }
/* Плашки фактов страницы курса (--lw задаёт шаблон): один кегль на ряд по самому длинному слову, подписи и линии на одной высоте во всех плашках */
.mz-facts[style*="--lw"] > .mz-fact { container-type: inline-size; display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 6px; align-content: start; }
.mz-facts[style*="--lw"] > .mz-fact b { font-size: min(34px, calc(100cqi / (var(--lw, 6) * .64))); }
@media (max-width: 640px) { .mz-facts[style*="--lw"] > .mz-fact b { font-size: min(21px, calc(100cqi / (var(--lw, 6) * .64))); } }
/* Нумерованных кружков меньше и они одного цвета: причины «Почему особенный» без номеров, шаги — тёмные, как остальные списки */
.mz-why .ha-num { display: none; }
.mz-why h3 { margin-top: 0 !important; }
@media (max-width: 640px) { .mz-why > div { display: block; } }
body:has(.mz-hero) .hp-n { background: var(--ha-dir-deep, var(--ha-ink)); }
/* «Впервые онлайн» на узком экране: пунктир только между шагами, после последнего не тянется */
@media (max-width: 860px) {
  .hp::before { display: none; }
  .hp li:not(:last-child)::after { content: ''; position: absolute; left: 27px; top: 62px; bottom: -14px; border-left: 2px dashed var(--ha-line); }
}
/* Программа на телефоне: ровно две карточки в ряд без срезанной третьей, «Листайте» над картиной, а не над подписью */
@media (max-width: 640px) {
  .mz-pin { grid-auto-columns: calc((100% - 10px) / 2); }
  .mz-pin .ha-pin__col { display: contents; }   /* одна строка карточек: высота ленты по самой высокой карточке, без пустоты под короткими колонками */
  .mz-pin figure { scroll-snap-align: start; }
  .ha-swipe:has(> .mz-pin) .ha-swipe__hint { top: 110px; transform: none; }
  .ha-swipe.is-done:has(> .mz-pin) .ha-swipe__hint { transform: translateX(12px); }
}
/* «Мы с вами»: колонка с кураторами по ширине фото, без дыры перед чатом */
@media (min-width: 961px) { #obuchenie .mz-split { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); } }
@media (max-width: 640px) { .mz-kur2__p b { font-size: 14px; line-height: 1.3; } }
/* Макеты платформы: подписи 6 px в ноутбуке не читаются — убираем; телефон по высоте содержимого, название урока в две строки, картина целиком */
.ha-how .w-lap__grid div { font-size: 0; gap: 0; }
.ha-how .w-phone { height: auto; min-height: 214px; }
.ha-how .w-phone__row b { -webkit-line-clamp: 2; }
.w-phone__row img { object-fit: contain; background: var(--ha-paper-2); }
/* Доступ бессрочный: подписи не рвутся посреди слова, знак ∞ в размер цифр; на телефоне строки вместо узких плиток */
.mz-forever__nums span { overflow-wrap: normal; }
.mz-forever__nums b { white-space: nowrap; }
.mz-forever__nums div:last-child b { font-size: 42px; line-height: 30px; }
@media (max-width: 640px) {
  .mz-forever__nums { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .mz-forever__nums div { display: flex; align-items: center; gap: 14px; min-width: 0; padding: 10px 14px; }
  .mz-forever__nums b { min-width: 92px; }
  .mz-forever__nums span { margin-top: 0; font-size: 14px; }
  .mz-forever__nums div:last-child b { font-size: 34px; line-height: 24px; }
}
/* Подарки: три-четыре фото справа от текста одной строкой, без второго ряда */
@media (min-width: 901px) {
  .mz-gift2--row .mz-gift2__ph:has(> .mz-pola:nth-child(3)) { gap: 14px; }
  .mz-gift2--row .mz-gift2__ph:has(> .mz-pola:nth-child(3)) .mz-pola img { height: 165px; }
  .mz-gift2--row .mz-gift2__ph:has(> .mz-pola:nth-child(4)) .mz-pola img { height: 150px; }
}
/* Стоимость: карточки тарифов одной высоты, кнопка внизу */
.mz-tars { align-items: stretch; }
.mz-tar > .ha-btn:last-child { margin-top: auto; }
/* Вопросы: левая колонка едет вместе со списком, мессенджеры столбиком без переноса по одному */
@media (min-width: 901px) { .ha-qa > :first-child { position: sticky; top: 100px; } }
.ha-qa .mz-msgr { display: grid; grid-template-columns: minmax(0, 1fr); max-width: 260px; }
@media (max-width: 640px) { .mz-form .mz-msgr { display: grid; grid-template-columns: minmax(0, 1fr); max-width: 260px; } }
/* Похожие курсы: у всех курсов три — три колонки без пустой четверти */
@media (min-width: 961px) { .mz-similar .ha-courses { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* Подвал на телефоне: ссылки с целью нажатия не меньше 40 px */
@media (max-width: 640px) { .ha-footer ul { gap: 0; } .ha-footer ul a { display: inline-block; padding: 9px 0; } }
/* «Вальс цветов»: первый экран без фигуры — три картины плотной группой по центру, с полями от краёв блока (владелец 13.10.2026: ромашки прижимались к краю, в центре дыра) */
@media (min-width: 641px) and (max-width: 960px) {
  .mz-hero--cvety-maslom .mz-fan .rus { left: 14%; top: 11%; width: 30%; transform: rotate(-5deg); z-index: 2; }
  .mz-hero--cvety-maslom .mz-fan .ship { left: 43%; right: auto; top: 0; width: 32%; transform: rotate(4deg); z-index: 1; }
  .mz-hero--cvety-maslom .mz-fan .wave { left: 46%; right: auto; top: 29%; width: 32%; transform: rotate(-3deg); z-index: 3; }
}
@media (min-width: 961px) {
  .mz-hero--cvety-maslom .mz-fan .rus { left: 6%; top: 11%; width: 38%; transform: rotate(-5deg); z-index: 2; }
  .mz-hero--cvety-maslom .mz-fan .ship { left: 42%; right: auto; top: 0; width: 40%; transform: rotate(4deg); z-index: 1; }
  .mz-hero--cvety-maslom .mz-fan .wave { left: 46%; right: auto; top: 36%; width: 40%; transform: rotate(-3deg); z-index: 3; }
}
/* Программа крупно (programma_krupno, «Вальс цветов», владелец 13.10.2026): картины крупные, два ровных ряда, по три колонки на экране;
   картина прямо на белом фоне с лёгкой тенью по контуру, без подложки (без «рамки в рамке»), целиком; номер урока под картиной */
.mz-pin--big { grid-template-rows: auto auto; grid-auto-columns: calc((100% - 2 * 26px) / 3); gap: 34px 26px; padding-bottom: 6px; }
.mz-pin--big .ha-pin__col { display: contents; }
.mz-pin--big figure { display: flex; flex-direction: column; align-items: flex-start; scroll-snap-align: start; min-width: 0; }
.mz-pin--big figure > img { width: 100%; height: 360px; object-fit: contain; object-position: left bottom; border-radius: 0; background: none; padding: 0; box-shadow: none !important; filter: drop-shadow(0 12px 16px rgba(61,36,27,.2)); }
.mz-pin--big figure:hover > img { filter: drop-shadow(0 16px 22px rgba(61,36,27,.28)); }
.mz-pin--big figure .n { position: static; order: 1; margin: 16px 0 0; font-size: 12.5px; }
.mz-pin--big figure figcaption { order: 2; margin-top: 8px; font-size: 14.5px; line-height: 1.45; }
.mz-pin--big figure figcaption b { font-size: 17px; margin-bottom: 2px; }
.mz-pin--big figure .more { font-size: 14px; }
@media (max-width: 960px) { .mz-pin--big { grid-auto-columns: calc((100% - 22px) / 2); gap: 30px 22px; } .mz-pin--big figure > img { height: 320px; } }
@media (max-width: 640px) {
  .mz-pin--big { grid-template-rows: auto; grid-auto-columns: 80%; gap: 16px; }
  .mz-pin--big figure > img { height: 290px; }
}
@media (min-width: 641px) { .ha-swipe:has(> .mz-pin--big) .ha-swipe__hint { top: 180px; transform: none; } .ha-swipe.is-done:has(> .mz-pin--big) .ha-swipe__hint { transform: translateX(12px); } }

/* ===== 14.10.2026: страница курса v2 — правки владельца по «Анатомии масла» для всех курсов + методичка дизайна ===== */
/* Первый экран: заголовок крупнее; без строки «Кому подойдёт» и плашек «Онлайн / Сертификат / Доступ» (они лентой под фактами) */
.mz-hero h1.ha-h1 { font-size: min(clamp(48px, 6.2vw, 90px), calc(100cqi / (var(--lw, 8) * .66))); line-height: .98; letter-spacing: -.025em; margin: 16px 0 18px; }
@media (max-width: 640px) { .mz-hero h1.ha-h1 { font-size: min(48px, calc(100cqi / (var(--lw, 8) * .66))); margin: 12px 0 14px; } }
/* Главная кнопка: стрелка и блик раз в несколько секунд; вторая — с ценой и старой ценой */
.mz-cta { position: relative; overflow: hidden; gap: 10px; }
.mz-cta i { font-style: normal; display: inline-block; transition: transform .2s; }
.mz-cta:hover i { transform: translateX(4px); }
.mz-cta::after { content: ''; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.38), transparent); transform: skewX(-20deg); animation: mzShine 5s ease-in-out 1.5s infinite; pointer-events: none; }
@keyframes mzShine { 0%, 72% { left: -60%; } 100% { left: 130%; } }
.mz-btn-price { gap: 8px; } .mz-btn-price s { font-weight: 600; font-size: .86em; opacity: .55; }
.mz-hero__price { display: flex; align-items: baseline; gap: 10px; margin: 16px 0 0; } .mz-hero__price b { font-size: 30px; font-weight: 800; } .mz-hero__price s { font-size: 17px; color: var(--ha-ink-3); }
.mz-float.top { opacity: 0; pointer-events: none; transform: translateY(20px); animation: none; }
/* Веер v2: четыре картины в белых рамках, одна за головой преподавателя; медленно плывут */
.mz-fan2 { position: relative; height: 600px; }
.mz-fan2 .p { position: absolute; height: auto; background: #fff; padding: 6px; border-radius: 8px; box-shadow: 0 16px 36px rgba(61,36,27,.24); animation: mzFloat 7s ease-in-out infinite; }
.mz-fan2 .p.c { left: 50%; top: 1%; width: 32%; margin-left: -16%; transform: rotate(-2deg); z-index: 1; animation-duration: 9s; animation-delay: -3s; }
.mz-fan2 .p.l { left: 1%; top: 16%; width: 26%; transform: rotate(-6deg); z-index: 2; animation-delay: -1.5s; }
.mz-fan2 .p.r1 { right: 1%; top: 3%; width: 25%; transform: rotate(5deg); z-index: 2; animation-duration: 8s; animation-delay: -5s; }
.mz-fan2 .p.r2 { right: 3%; top: 50%; width: 24%; transform: rotate(-3deg); z-index: 2; animation-duration: 7.5s; }
.mz-fan2 .who { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); height: 86%; width: auto; z-index: 3; filter: drop-shadow(0 18px 30px rgba(61,36,27,.18)); }
.mz-fan2 .cap { position: absolute; left: 0; bottom: 18px; z-index: 4; background: rgba(255,255,255,.95); border-radius: 16px; padding: 12px 18px; width: min(300px, 58%); box-shadow: 0 10px 26px rgba(61,36,27,.14); }
.mz-fan2 .cap b { display: block; font-size: 16px; } .mz-fan2 .cap span { display: block; font-size: 14px; line-height: 1.4; color: var(--ha-ink-2); }
@keyframes mzFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
@media (max-width: 960px) { .mz-fan2 { height: 540px; } }
@media (max-width: 640px) {
  .mz-fan2 { height: 420px; } .mz-fan2 .p { padding: 4px; border-radius: 6px; } .mz-fan2 .who { height: 80%; }
  .mz-fan2 .p.c { width: 34%; margin-left: -17%; } .mz-fan2 .p.l { width: 27%; top: 30%; } .mz-fan2 .p.r1 { width: 27%; } .mz-fan2 .p.r2 { width: 26%; top: 52%; }
  .mz-fan2 .cap { bottom: 12px; padding: 9px 12px; width: min(250px, 66%); } .mz-fan2 .cap b { font-size: 14px; } .mz-fan2 .cap span { font-size: 12.5px; }
}
/* Лента под плашками фактов: «Онлайн, в записи», «Именной сертификат» (и «Доступ навсегда», если его нет среди фактов) */
.mz-facts__lenta { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 48px; background: var(--ha-canvas); border-radius: 22px; padding: 16px 24px; }
.mz-facts__lenta > span { display: flex; align-items: center; gap: 12px; }
.mz-facts__lenta img { width: 44px; height: 44px; object-fit: contain; flex: none; }
.mz-facts__lenta b { display: block; font-size: 17px; color: var(--ha-ink); }
.mz-facts__lenta span span { font-size: 15px; line-height: 1.35; color: var(--ha-ink-2); }
@media (max-width: 640px) { .mz-facts__lenta { flex-direction: column; justify-content: flex-start; gap: 10px; padding: 14px 16px; border-radius: 18px; } .mz-facts__lenta img { width: 36px; height: 36px; } .mz-facts__lenta b { font-size: 15.5px; } .mz-facts__lenta span span { font-size: 14px; } }
/* Программа крупно у всех курсов: заглушка урока без фото той же высоты, что картины */
.mz-pin--big figure > .mz-ph { width: 100%; height: 360px; display: grid; place-items: center; background: var(--ha-paper-2); border-radius: 14px; }
.mz-pin--big figure > .mz-ph img { width: 96px; height: 96px; object-fit: contain; }
@media (max-width: 960px) { .mz-pin--big figure > .mz-ph { height: 320px; } }
@media (max-width: 640px) { .mz-pin--big figure > .mz-ph { height: 290px; } }
/* «Что входит в обучение»: карточки с 3D-иконками; большая — платформа с картинами курса, широкая — лицензия */
.mz-inc { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.mz-inc__c { background: var(--ha-dir-tint, var(--ha-paper-2)); border-radius: 22px; padding: 22px 22px 24px; display: flex; flex-direction: column; gap: 8px; }
.mz-inc__c .ic { width: 64px; height: 64px; object-fit: contain; margin-bottom: 6px; }
.mz-inc__c h3 { margin: 0; font-size: 20px; line-height: 1.25; }
.mz-inc__c p { margin: 0; font-size: 16px; line-height: 1.5; color: var(--ha-ink-2); } .mz-inc__c p b { color: var(--ha-ink); }
.mz-inc__c--big { grid-row: span 2; }
.mz-inc__pics { margin-top: auto; padding-top: 20px; display: flex; align-items: flex-end; gap: 12px; height: 190px; }
.mz-inc__pics img { flex: 1 1 0; min-width: 0; height: 100%; object-fit: contain; object-position: bottom; filter: drop-shadow(0 10px 14px rgba(61,36,27,.22)); }
.mz-inc__c--wide { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 18px; }
.mz-inc__c--wide .ic { margin: 0; flex: none; }
.mz-inc__lic { margin-left: auto; font-size: 14px; color: var(--ha-ink-3); white-space: nowrap; }
@media (max-width: 960px) { .mz-inc { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mz-inc__c--big { grid-row: auto; grid-column: 1 / -1; } }
@media (max-width: 640px) {
  .mz-inc { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .mz-inc__c, .mz-inc__c--wide { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 14px; row-gap: 4px; align-items: start; padding: 16px; border-radius: 18px; }
  .mz-inc__c .ic { grid-row: span 2; width: 48px; height: 48px; margin: 0; }
  .mz-inc__c h3 { font-size: 17px; } .mz-inc__c p { font-size: 15px; }
  .mz-inc__pics { grid-column: 1 / -1; height: 130px; padding-top: 12px; gap: 8px; }
  .mz-inc__c--wide > div { grid-column: 2; } .mz-inc__lic { grid-column: 2; margin: 2px 0 0; white-space: normal; font-size: 13px; }
}
/* Подарки карточками (два или три в ряд): картины целиком сверху, без значка-коробки и плашки «в подарок» */
.mz-gifts3 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.mz-gifts3--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mz-gift3 { background: var(--ha-canvas); border-radius: 22px; padding: 20px 20px 22px; display: flex; flex-direction: column; gap: 16px; }
.mz-gift3__ph { display: flex; justify-content: center; align-items: flex-end; gap: 12px; height: 260px; }
.mz-gift3__ph img { height: 100%; width: auto; min-width: 0; max-width: 100%; flex: 0 1 auto; object-fit: contain; object-position: bottom; filter: drop-shadow(0 12px 16px rgba(61,36,27,.22)); }
.mz-gifts3--3 .mz-gift3__ph { height: 230px; }
.mz-gift3__ph--ico { align-items: center; } .mz-gift3__ph .ico { height: 120px; filter: none; }   /* та же высота, что у фото: заголовки в ряду на одной линии */
.mz-gift3__top { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.mz-gift3__num { font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ha-dir-deep, var(--ha-terra)); }
.mz-gift3 h3 { margin: 2px 0 0; font-size: 24px; line-height: 1.2; }
.mz-gift3 .d { margin: 0; font-size: 16px; line-height: 1.5; color: var(--ha-ink-2); }
.mz-gift3 .n { margin: 0; font-size: 14px; line-height: 1.45; color: var(--ha-ink-3); }
.mz-gift3__val { margin: 0; font-size: 15px; color: var(--ha-ink-2); } .mz-gift3__val s { font-weight: 700; color: var(--ha-ink-3); }
@media (max-width: 960px) { .mz-gifts3--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .mz-gifts3, .mz-gifts3--3 { grid-template-columns: minmax(0, 1fr); gap: 10px; } .mz-gift3 { padding: 16px; border-radius: 18px; gap: 12px; } .mz-gift3__ph, .mz-gifts3--3 .mz-gift3__ph { height: 210px; } .mz-gift3 h3 { font-size: 20px; } .mz-gift3 .d { font-size: 15px; } }
/* Цена: крупнее, на телефоне заголовок блока и сумма заметнее остальных */
.mz-tar__price b { font-size: 42px; }
@media (max-width: 640px) { .mz-page-tarif .ha-big__title { font-size: 30px; line-height: 1.15; } .mz-tar__price b { font-size: 44px; } .mz-tar__price s { font-size: 18px; } .mz-tar h3 { font-size: 22px; } .mz-tar-lead { font-size: 16px; line-height: 1.5; } }
/* Форма заявки курса: белая карточка; шаг мессенджера как в анкете «Вальса цветов» (без «Шаг 2 из 2») */
.lf-box { background: var(--ha-canvas); border-radius: 24px; padding: 20px 22px 18px; max-width: 620px; box-shadow: 0 12px 30px rgba(61,36,27,.08); }
.lf-box .lf-trial { background: none; padding: 0 0 14px; margin: 0 0 14px; border-bottom: 1px solid var(--ha-line); border-radius: 0; max-width: none; }
.lf-box .lf-row input { background: var(--ha-paper); }
.lf-h--go { font-size: 21px; line-height: 1.25; margin: 0 0 2px; }
.lf-arrow { display: inline-block; animation: lfBounce 1s ease-in-out infinite; }
@keyframes lfBounce { 50% { transform: translateY(6px); } }
.lf-s2t { margin: 0 0 6px; font-size: 15.5px; line-height: 1.45; color: var(--ha-ink-2); } .lf-s2t b { color: var(--ha-dir-deep, var(--ha-terra)); }
.lf .lf-mess.lf-mess--go { grid-template-columns: minmax(0, 1fr); gap: 10px; }
.lf-mess--go .lf-m { justify-content: flex-start; gap: 12px; padding: 12px 14px; border: 2px solid var(--ha-dir-deep, var(--ha-terra)); background: #fff; animation: lfPulse 2s ease-in-out infinite, lfNudge 5s ease-in-out 3s infinite; }
.lf-mess--go .lf-m:nth-child(2) { animation-delay: .25s, 3.2s; }
.lf-mess--go .lf-m b { font-size: 17px; }
.lf-mess--go .lf-m:hover { transform: translateY(-2px); }
.lf-go { margin-left: auto; font-size: 13px; font-weight: 700; color: #fff; background: var(--ha-dir-deep, var(--ha-terra)); border-radius: 99px; padding: 5px 12px; white-space: nowrap; }
.lf-mess--again .lf-go { display: none; }
.lf--on { animation: lfGlow 1.6s ease-out 3; } .lf.lf--on { border-radius: 22px; }
@keyframes lfPulse { 0%, 100% { box-shadow: 0 8px 22px rgba(61,36,27,.12), 0 0 0 0 color-mix(in srgb, var(--ha-dir-deep, #B84E28) 35%, transparent); } 50% { box-shadow: 0 8px 22px rgba(61,36,27,.12), 0 0 0 8px color-mix(in srgb, var(--ha-dir-deep, #B84E28) 0%, transparent); } }
@keyframes lfNudge { 0%, 86%, 100% { transform: none; } 89% { transform: translateY(-6px); } 92% { transform: none; } 95% { transform: translateY(-3px); } }
@keyframes lfGlow { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--ha-dir-deep, #B84E28) 50%, transparent); } 100% { box-shadow: 0 0 0 18px color-mix(in srgb, var(--ha-dir-deep, #B84E28) 0%, transparent); } }
@media (max-width: 640px) { .lf-box { padding: 16px 14px 14px; border-radius: 20px; } .lf-h--go { font-size: 19px; } }
/* Похожие курсы на телефоне: лента вертикальных карточек, как на компьютере, вместо сжатых строк */
@media (max-width: 640px) {
  .mz-similar .ha-courses { display: grid; grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: 82%; overflow-x: auto; scroll-snap-type: x mandatory; gap: 10px; margin: 0 -16px; padding: 0 16px 6px; scrollbar-width: none; }
  .mz-similar .ha-courses::-webkit-scrollbar { display: none; }
  .mz-similar .ha-courses .ha-course-tile { display: flex; flex-direction: column; gap: 8px; padding: 12px 12px 14px; scroll-snap-align: start; }
  .mz-similar .ha-courses .ha-course-tile__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
  .mz-similar .ha-courses .ha-course-tile h3 { font-size: 18px; margin: 4px 0 0 !important; }
  .mz-similar .ha-courses .ha-course-tile p { display: block; font-size: 14px; line-height: 1.4; }
  .mz-similar .ha-courses .ha-course-tile__foot { flex-direction: row; align-items: center; justify-content: space-between; margin-top: auto; }
  .mz-similar .ha-courses .ha-course-tile__foot .ha-btn { width: auto; min-height: 40px; padding: 0 16px; font-size: 14px; }
  .mz-similar .ha-courses .ha-course-tile__price { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) { .mz-fan2 .p, .mz-cta::after, .lf-arrow, .lf-mess--go .lf-m, .lf--on { animation: none !important; } }
/* Большая карточка «Все уроки на одной платформе»: картины курса 2×2 на всю свободную высоту, целиком */
.mz-inc__c--big .mz-inc__pics { flex: 1 1 auto; height: auto; min-height: 260px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(0, 1fr); gap: 14px; }
.mz-inc__c--big .mz-inc__pics img { width: 100%; height: 100%; min-height: 0; }
.mz-hero .ha-row > .ha-btn { min-width: 320px; }
@media (max-width: 960px) { .mz-inc__c--big .mz-inc__pics { min-height: 0; height: 200px; display: flex; } .mz-hero .ha-row > .ha-btn { min-width: 0; } }
@media (max-width: 640px) { .mz-inc__c--big .mz-inc__pics { height: 130px; } }
.mz-gifts3 + .mz-gifts-note { margin-top: 16px; }
/* Подпись карточки программы одной строкой «Урок 1. «Авокадо»», без плашки номера (владелец 14.10.2026) */
.mz-pin--big figure figcaption { margin-top: 14px; }
.mz-pin__m { display: block; font-size: 13px; font-weight: 600; color: var(--ha-ink-3); margin-bottom: 2px; }

/* ===== 14.10.2026, вечер: вторая волна правок владельца по странице курса ===== */
/* Оффер первого экрана: карточка пробного урока с картинкой, внутри главная кнопка */
.mz-offer { background: var(--ha-canvas); border-radius: 22px; padding: 16px 16px 16px; max-width: 560px; box-shadow: 0 14px 34px rgba(61,36,27,.10); display: grid; gap: 14px; }
.mz-offer__top { display: flex; gap: 14px; align-items: center; }
.mz-offer__pic { position: relative; flex: none; width: 96px; height: 96px; border-radius: 14px; overflow: hidden; }
.mz-offer__pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mz-offer__pic i { position: absolute; left: 50%; top: 50%; width: 36px; height: 36px; margin: -18px 0 0 -18px; border-radius: 50%; background: rgba(255,255,255,.92); box-shadow: 0 4px 12px rgba(0,0,0,.25); }
.mz-offer__pic i::after { content: ''; position: absolute; left: 14px; top: 11px; border-style: solid; border-width: 7px 0 7px 11px; border-color: transparent transparent transparent var(--ha-terra); }
.mz-offer__top b { display: block; font-size: 19px; line-height: 1.25; color: var(--ha-ink); margin-bottom: 4px; }
.mz-offer__top span { display: block; font-size: 15px; line-height: 1.45; color: var(--ha-ink-2); }
.mz-offer .mz-cta { width: 100%; justify-content: center; }
@media (max-width: 640px) { .mz-offer { padding: 12px; border-radius: 18px; gap: 12px; } .mz-offer__pic { width: 76px; height: 76px; } .mz-offer__top b { font-size: 16.5px; } .mz-offer__top span { font-size: 14px; } }
/* Веер: «Гранат» (правая нижняя) крупнее, «Кувшин» (правая верхняя) ниже */
.mz-fan2 .p.r1 { top: 11%; }
.mz-fan2 .p.r2 { width: 28%; top: 47%; right: 1%; }
@media (max-width: 640px) { .mz-fan2 .p.r1 { top: 9%; } .mz-fan2 .p.r2 { width: 29%; top: 50%; } }
/* «Онлайн, в записи» и «Именной сертификат» — отдельными плашками по центру */
.mz-facts__lenta { background: none; padding: 0; gap: 12px; }
.mz-facts__lenta > span { background: var(--ha-canvas); border-radius: 18px; padding: 12px 22px 12px 14px; }
@media (max-width: 640px) { .mz-facts__lenta { padding: 0; gap: 8px; } .mz-facts__lenta > span { padding: 10px 14px 10px 10px; border-radius: 16px; } }
/* Программа: картины крупнее, промежутки меньше — длинное название не ломает ряд */
.mz-pin--big { grid-auto-columns: calc((100% - 2 * 16px) / 3); gap: 36px 16px; }
.mz-pin--big figure > img, .mz-pin--big figure > .mz-ph { height: 410px; }
@media (max-width: 960px) { .mz-pin--big { grid-auto-columns: calc((100% - 14px) / 2); gap: 30px 14px; } .mz-pin--big figure > img, .mz-pin--big figure > .mz-ph { height: 340px; } }
@media (max-width: 640px) { .mz-pin--big { grid-auto-columns: 82%; gap: 14px; } .mz-pin--big figure > img, .mz-pin--big figure > .mz-ph { height: 300px; } }
/* Пробный урок: картина меньше, не перетягивает внимание */
@media (min-width: 821px) { #probnyy .ha-trial { grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 40px; } #probnyy .ha-trial img { max-height: 420px; } }
/* Отзывы без кружков-инициалов: только имя */
.ha-rev__who b { font-size: 15.5px; }
/* Подарки уже: фото ниже, четыре подарка с одним фото — в один ряд */
.mz-gifts3--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.mz-gift3__ph { height: 210px; }
.mz-gifts3--3 .mz-gift3__ph, .mz-gifts3--4 .mz-gift3__ph { height: 190px; }
.mz-gifts3--4 .mz-gift3 h3 { font-size: 20px; } .mz-gifts3--4 .mz-gift3 .d { font-size: 15px; }
@media (max-width: 1100px) { .mz-gifts3--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .mz-gifts3--4 { grid-template-columns: minmax(0, 1fr); } .mz-gift3__ph, .mz-gifts3--3 .mz-gift3__ph, .mz-gifts3--4 .mz-gift3__ph { height: 180px; } }
/* Финальная форма: что придёт после заявки, снятие страхов, живой менеджер */
.mz-zf-get { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 10px; max-width: 620px; }
.mz-zf-get li { display: flex; gap: 12px; align-items: center; }
.mz-zf-get img { width: 44px; height: 44px; object-fit: contain; flex: none; }
.mz-zf-get img.pic { object-fit: cover; border-radius: 10px; }
.mz-zf-get b { display: block; font-size: 16px; color: var(--ha-ink); }
.mz-zf-get span { font-size: 14.5px; line-height: 1.4; color: var(--ha-ink-2); }
.mz-zf-trust { margin: 12px 0 0; font-size: 13.5px; color: var(--ha-ink-3); max-width: 620px; }
.mz-zf-val { display: flex; gap: 10px; align-items: center; margin-top: 14px; max-width: 620px; font-size: 14.5px; line-height: 1.4; color: var(--ha-ink-2); }
.mz-zf-val img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex: none; }
.mz-zf-val b { color: var(--ha-ink); }
/* Похожие курсы: без цены, картины без паспарту; на телефоне карточки меньше */
.mz-similar .ha-course-tile__grid > div { background: none; aspect-ratio: 3 / 4; display: grid; place-items: center; }
.mz-similar .ha-course-tile__grid img { object-fit: contain; height: 100%; width: 100%; }
.mz-similar .ha-course-tile__foot { justify-content: flex-end; }
@media (max-width: 640px) {
  .mz-similar .ha-courses { grid-auto-columns: 62%; }
  .mz-similar .ha-courses .ha-course-tile { padding: 10px 10px 12px; gap: 6px; }
  .mz-similar .ha-courses .ha-course-tile h3 { font-size: 16px; }
  .mz-similar .ha-courses .ha-course-tile p { font-size: 13px; }
  .mz-similar .ha-courses .ha-course-tile__foot .ha-btn { width: 100%; min-height: 38px; }
}
@media (max-width: 640px) { #zayavka .mz-art { display: none; } }   /* на телефоне форма без кота: короче путь до кнопки */

/* ===== 14.10.2026: проверка главной по методичке ===== */
/* Нижняя полоса телефона не дублирует кнопки первого экрана */
.mz-sticky.top { opacity: 0; pointer-events: none; transform: translateY(20px); }
/* Картины в карточках курсов без полей-паспарту: картина целиком, без «рамки» */
.ha-course-tile__grid > div { background: none !important; display: grid; place-items: center; }
.ha-course-tile__grid img { object-fit: contain !important; width: 100%; height: 100%; }
/* Группы курсов главной: четыре курса — в один ряд, один курс — широкая карточка (без одинокой карточки в ряду) */
@media (min-width: 1100px) { .hk-group .ha-courses--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 641px) {
  .hk-group .ha-courses--1 { grid-template-columns: minmax(0, 1fr); }
  .hk-group .ha-courses--1 .ha-course-tile { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); grid-template-rows: auto auto 1fr auto; column-gap: 28px; row-gap: 8px; align-items: start; }
  .hk-group .ha-courses--1 .ha-course-tile__grid { grid-row: 1 / 5; }
  .hk-group .ha-courses--1 .ha-course-tile h3 { margin-top: 8px !important; font-size: 24px; }
  .hk-group .ha-courses--1 .ha-course-tile p { font-size: 16px; max-width: 520px; }
  .hk-group .ha-courses--1 .ha-course-tile__foot { align-self: end; justify-content: flex-start; gap: 18px; }
}
/* «Без риска для вас»: заголовки карточек ниже заголовка блока, текст читаемый */
#garantii .mz-fact b { font-size: 22px; line-height: 1.2; letter-spacing: -.01em; }
#garantii .mz-fact span { font-size: 15px; line-height: 1.45; }
@media (max-width: 640px) { #garantii .mz-fact b { font-size: 17px; } #garantii .mz-fact span { font-size: 14px; } #garantii .mz-fact img { width: 44px; height: 44px; } }
/* Плашка обещания первого экрана без значка */
.hh-promise { padding: 10px 18px; }
/* Подарок под кнопками первого экрана — одной строкой на компьютере */
@media (min-width: 961px) { .hh-gift { white-space: nowrap; } }
/* Лента работ учеников начинается по левой линии заголовков */
@media (min-width: 641px) { .hw-pin { margin-left: 0; padding-left: 0; } }
/* Телефон: текст в плашках главной не мельче 14 px, кнопки карточек — палец 44 px */
@media (max-width: 640px) {
  .hf-item p, .hfacts p, .hh-facts p { font-size: 14px; }
  .ha-courses .ha-course-tile__foot .ha-btn { min-height: 40px; }
  .ha-courses .ha-course-tile p { font-size: 13.5px; }
}
.hh-facts .mz-fact span { font-size: 15px; line-height: 1.5; }
@media (max-width: 640px) { .hh-facts .mz-fact span { font-size: 14px; line-height: 1.45; } }
@media (min-width: 641px) {
  .hk-group .ha-courses--1 .ha-course-tile { grid-template-columns: minmax(0, 240px) minmax(0, 1fr); grid-template-rows: auto auto auto 1fr; }
  .hk-group .ha-courses--1 .ha-course-tile__foot { align-self: start; margin-top: 10px; }
}

/* ===== Аудит дизайна 21.10.2026 (ZHEN3-35). Только страницы сайта школы (body.ha-shkola): эфиры /veb/ и анкеты /ap/
   подключают этот же файл, их вид не меняем. Находки и номера — audit-dizayna-2110/nahodki.json ===== */
/* №2, №13. Форма заявки v2: подпись → телефон → согласие → кнопка (галочка под кнопкой давала ошибку на первом нажатии) */
.ha-shkola .lf-s1 { display: grid; gap: 12px; }
.ha-shkola .lf-lab { font: 600 15px/1.3 var(--ha-font); color: var(--ha-ink); }
.ha-shkola .lf-s1 .lf-row { grid-template-columns: minmax(0, 1fr); }
.ha-shkola .lf--name .lf-s1 .lf-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.ha-shkola .lf-s1 > .ha-btn { width: 100%; justify-content: center; }
.ha-shkola .lf-s1 > .lf-err:empty { display: none; }
.ha-shkola .lf-row input { border: 1.5px solid color-mix(in srgb, var(--ha-ink-3) 70%, var(--ha-canvas)); }
@media (max-width: 640px) { .ha-shkola .lf--name .lf-s1 .lf-row { grid-template-columns: minmax(0, 1fr); } }
/* №3. Миниатюра пробного урока целиком, в своих пропорциях, без кружка ▶ (он никуда не вёл) */
.ha-shkola .mz-offer__pic { width: auto; height: 96px; border-radius: 0; overflow: visible; display: flex; align-items: center; }
.ha-shkola .mz-offer__pic img { width: auto; height: 100%; max-width: 132px; object-fit: contain; border: 3px solid var(--ha-canvas); border-radius: 4px; box-shadow: 0 6px 14px rgba(61,36,27,.18); box-sizing: border-box; }
@media (max-width: 640px) { .ha-shkola .mz-offer__pic { width: auto; height: 80px; } .ha-shkola .mz-offer__pic img { max-width: 104px; } }
.ha-shkola .mz-zf-get img.pic { width: auto; max-width: 60px; height: 48px; object-fit: contain; border: 2px solid var(--ha-canvas); border-radius: 3px; box-shadow: 0 3px 8px rgba(61,36,27,.18); box-sizing: border-box; }
/* №18. Картина пробного урока: белая обводка и поле, углы почти прямые; урок без картины — блок текстом */
.ha-shkola #probnyy .ha-trial img { border-radius: 4px; border: 6px solid var(--ha-canvas); box-shadow: 0 12px 28px rgba(61,36,27,.18); box-sizing: border-box; }
@media (max-width: 640px) { .ha-shkola #probnyy .ha-trial img { max-height: 58vh; width: auto; max-width: 100%; margin: 0 auto; } }
.ha-shkola #probnyy .ha-trial.ha-trial--text { grid-template-columns: minmax(0, 1fr); max-width: 760px; }
/* №5. «Частые вопросы» по центру: заголовок, вопросы, под ними мессенджеры */
.ha-shkola .ha-qa--c { display: block; max-width: 820px; margin: 0 auto; }
.ha-shkola .ha-qa--c > .ha-qa__head { position: static; text-align: center; margin-bottom: 22px; }
.ha-shkola .ha-qa__more { text-align: center; margin-top: 24px; }
.ha-shkola .ha-qa__more .mz-msgr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 460px; margin: 12px auto 0; }
@media (max-width: 640px) { .ha-shkola .ha-qa__more .mz-msgr { grid-template-columns: minmax(0, 1fr); max-width: 300px; } }
/* №15. Отзывы: выделение только жирным, без маркера и декоративной кавычки */
.ha-shkola .ha-rev__text b, .ha-shkola .hr__t b { background: none; padding: 0; }
.ha-shkola .ha-rev::before { content: none; }
/* №8. Без рамки в рамке (правило владельца): внутри белых блоков плашки без фона, разделяет тонкая линия */
.ha-shkola .mz-level, .ha-shkola .mz-why > div, .ha-shkola .ha-fear, .ha-shkola .mz-start li { background: none; border-radius: 0; padding: 14px 0 0; border-top: 1px solid var(--ha-line); }
.ha-shkola .mz-levels { gap: 16px; }
.ha-shkola .ha-faq details { background: none; border-radius: 0; padding: 0 4px; border-bottom: 1px solid var(--ha-line); }
/* №21. Терракота только у действий: заголовки сомнений чернилами, «Подробнее» серым, кнопки похожих курсов контурные */
.ha-shkola .ha-fear b { color: var(--ha-ink); }
.ha-shkola .mz-pin figure .more { color: var(--ha-ink-2); font-weight: 600; }
.ha-shkola .mz-similar .ha-btn--primary { background: transparent; color: var(--ha-ink); border: 1.5px solid var(--ha-line); box-shadow: none; }
.ha-shkola .mz-similar .ha-btn--primary:hover { border-color: var(--ha-terra); color: var(--ha-terra); }
.ha-shkola .ha-val__dot, .ha-shkola .mz-sticky .ha-val-btn i { background: var(--ha-ok); }
/* №16. «Листайте →» под лентой программы, а не на картине */
.ha-shkola .ha-swipe:has(> .mz-pin--big) { padding-bottom: 56px; }
.ha-shkola .ha-swipe:has(> .mz-pin--big) .ha-swipe__hint { top: auto !important; bottom: 0; right: 0; transform: none !important; }
/* №27. Одно движение на странице: веер не качается, блик по кнопке два раза и всё */
.ha-shkola .mz-fan2 .p { animation: none; }
.ha-shkola .mz-cta::after { animation-iteration-count: 2; }
/* №28. Цифры преподавателя не переносятся по частям («более 2 / 000»): мельче на телефоне, подпись отдельной строкой */
.ha-shkola .mz-tstats b { white-space: nowrap; }
.ha-shkola .mz-tstats span { display: block; line-height: 1.35; }
@media (max-width: 640px) { .ha-shkola .mz-tstats b { font-size: 24px; } }
/* №11. Нумерация шагов только в «Как всё устроено»: «Мы с вами» без номеров, «Когда начинается курс» текстом */
.ha-shkola .mz-steps li { grid-template-columns: minmax(0, 1fr); }
.ha-shkola .mz-steps li::before { display: none; }
.ha-shkola .mz-start { grid-template-columns: minmax(0, 1fr); }
.ha-shkola .mz-start ol { display: none; }
/* №9. Тариф: общий список «В оба варианта входит» над карточками, подарки в карточке списком без картинок и подложек */
.ha-shkola .mz-tar-inc { margin: 6px 0 18px; }
.ha-shkola .mz-tar-inc .mz-check { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 8px 32px; }
.ha-shkola .mz-tar-inc .mz-tar__h { font-size: 16px; margin-bottom: 10px; }
.ha-shkola .mz-bonus-box { background: none; padding: 0; border-radius: 0; }
.ha-shkola .mz-bonus-row { background: none; border-radius: 0; padding: 8px 0; border-top: 1px solid var(--ha-line); grid-template-columns: minmax(0, 1fr) auto !important; }
.ha-shkola .mz-bonus-row > img { display: none; }
.ha-shkola .mz-tar__forever { margin: 14px 0 0; color: var(--ha-ink-2); max-width: 720px; }
/* №12, №23. Текст на телефоне крупнее (база 16 px), компактность держим отступами; у плиток фактов без абзаца-пояснения */
@media (max-width: 640px) {
  .ha-root.ha-shkola { font-size: 16px; }
  .ha-shkola .mz-about p, .ha-shkola .ha-seo p, .ha-shkola .mz-start p, .ha-shkola .mz-tar__forever { font-size: 16px; }
  .ha-shkola .mz-level span, .ha-shkola .mz-steps span, .ha-shkola .ha-fear p, .ha-shkola .mz-dlist li, .ha-shkola .mz-diff p, .ha-shkola .ha-rev__text, .ha-shkola .mz-pin--big figcaption { font-size: 15.5px; }
  .ha-shkola .mz-check li, .ha-shkola .mz-tar p, .ha-shkola .mz-offer__top span { font-size: 15px; }
  .ha-shkola .mz-fact span { font-size: 14.5px; }
  .ha-shkola .mz-fact p { display: none; }
  .ha-shkola .lf .ha-check { font-size: 14.5px; }
}
/* №39. Межстрочный у описаний в плашках как у абзацев (строчный span брал высоту строки родителя, выходило ~1,75) */
.ha-shkola .mz-level span, .ha-shkola .mz-steps span, .ha-shkola .mz-start li span { display: block; line-height: 1.5; }
.ha-shkola .ha-big p, .ha-shkola .mz-fact span, .ha-shkola .ha-fear p, .ha-shkola .mz-level span { text-wrap: pretty; }
/* №40. Форма прямо в блоке пробного урока: не прыгать вниз на 25 экранов */
.ha-shkola .mz-trial-form { margin-top: 16px; max-width: 520px; padding: 18px; border-radius: 18px; background: var(--ha-canvas); }
/* №25. Без меток над заголовками там, где заголовок и так говорит всё; без жёлтой пилюли «Урок» у подарков */
.ha-shkola #prepodavatel .ha-pill, .ha-shkola .mz-gift__tag { display: none; }
/* №31. Мелкие подписи и ссылки на песке и розовом — темнее, контраст ≥ 4,5:1 */
.ha-shkola .mz-zf-trust, .ha-shkola .mz-gift3 .n, .ha-shkola .mz-pin__m, .ha-shkola .mz-inc__lic, .ha-shkola .mz-tar__note { color: var(--ha-ink-2); }
.ha-shkola .ha-big--soft a:not(.ha-btn):not(.lf-m):not(.mz-mess__b), .ha-shkola .ha-big--sand a:not(.ha-btn):not(.lf-m), .ha-shkola .mz-vv .more, .ha-shkola .mz-inc__c a { color: var(--ha-terra-d); }
/* №32. Крестики окон и подсказки — зона нажатия 44 px */
.ha-shkola .ha-modal__x, .ha-shkola .ha-chat__x { min-width: 44px; min-height: 44px; }
.ha-shkola .ha-val-tease__x { min-width: 36px; min-height: 36px; display: grid; place-items: center; }
/* №33. Хлебные крошки на телефоне прячем: место первого экрана (разметка для поиска остаётся в JSON-LD) */
@media (max-width: 640px) { .ha-shkola .ha-crumbs { display: none; } }
/* №36. Кнопки соседних тарифов на одной линии внизу карточек */
.ha-shkola .mz-tar { display: flex; flex-direction: column; }
.ha-shkola .mz-tar > .ha-btn:last-child, .ha-shkola .mz-tar__btns { margin-top: auto; }
/* №38. Тени и затемнения в тон бумаги (синие остались от «Моря») */
.ha-shkola .mz-fan .p { box-shadow: 0 22px 46px rgba(61,36,27,.24); }
.ha-shkola .mz-fan .cap { box-shadow: 0 10px 26px rgba(61,36,27,.14); }
.ha-shkola .mz-lb__art img { box-shadow: 0 20px 44px rgba(61,36,27,.26); }
.ha-shkola .ha-swipe__hint { box-shadow: 0 8px 20px rgba(61,36,27,.14); }
/* №53. «Анатомия масла»: палитра в руке Анжелики закрывала треть «Гранатов» — картина выше палитры, «Кувшин» к верху */
.ha-shkola .mz-hero--anatomiya-masla .mz-fan2 .p.r1 { top: 0; width: 23%; }
.ha-shkola .mz-hero--anatomiya-masla .mz-fan2 .p.r2 { top: 31%; width: 23%; right: 0; }
@media (max-width: 640px) { .ha-shkola .mz-hero--anatomiya-masla .mz-fan2 .p.r1 { top: 2%; } .ha-shkola .mz-hero--anatomiya-masla .mz-fan2 .p.r2 { top: 33%; } }
/* №34. «Кому подойдёт» на компьютере: две колонки — «для вас» и «не для вас» одна под другой слева, «чем отличается» справа;
   списки по линии заголовка (невидимая белая карточка на белом сдвигала их на 20 px) */
.ha-shkola .mz-dlist { background: none; padding: 0; border-radius: 0; }
@media (min-width: 901px) {
  .ha-shkola .mz-dlists { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 40px; }
  .ha-shkola .mz-dlist--plus { grid-column: 2; grid-row: 1 / span 2; }
}
/* №29. Подпись над примером чата — мелким серым текстом, без пунктирной плашки */
.ha-shkola .mz-chatbox__tag { border: 0; background: none; padding: 0; font-weight: 600; color: var(--ha-ink-3); }
/* №47. Подарок без фото — карточка текстом, без пустого места под картинку */
.ha-shkola .mz-gift3__ph:empty { display: none; }

/* ===== 22.10.2026: окно урока («Подробнее» в программе) на телефоне и планшете =====
   Было: сетка окна с min-height:0 у блока картины сжимала строку, картина вылезала вверх и на текст, крестик уезжал при прокрутке,
   кнопки снизу прятались (sticky bottom:-22px), 100vh на iPhone короче экрана. Стало: окно прокручивается целиком, картина целиком над текстом,
   крестик закреплён, кнопки «← →» прилипают к низу, фон страницы не прокручивается; длинное описание сокращено (site.js, «Читать полностью»). */
@media (max-width: 960px) {
  html.lb-open, html.lb-open body { overflow: hidden; }
  .mz-lb { padding: 0; align-items: stretch; }
  .mz-lb__box { display: block; height: 100%; height: 100dvh; max-height: none; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; border-radius: 0; }
  .mz-lb__art { padding: 60px 16px 14px; min-height: 0; }
  .mz-lb__art img { display: block; margin: 0 auto; max-width: 100%; max-height: 50vh; max-height: 50dvh; width: auto; height: auto; object-fit: contain; }
  .mz-lb__tx { padding: 16px 16px 0; overflow: visible; min-width: 0; }
  .mz-lb__art[hidden] + .mz-lb__tx { padding-top: 60px; }
  .mz-lb__tx p, .mz-lb__tx ul, #lb-body { font-size: 15px; overflow-wrap: anywhere; }
  .mz-lb__nav { position: sticky; bottom: 0; margin: 6px -16px 0; padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); background: var(--ha-canvas); border-top: 1px solid var(--ha-line); }
  .mz-lb__nav .ha-btn { white-space: nowrap; }
  .mz-lb__x { position: fixed; top: calc(10px + env(safe-area-inset-top, 0px)); right: 10px; z-index: 5; background: var(--ha-canvas); box-shadow: 0 2px 10px rgba(20,30,40,.18); }
  #lb-body.is-cut { max-height: 8.4em; overflow: hidden; position: relative; }
  #lb-body.is-cut::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2.6em; background: linear-gradient(rgba(255,255,255,0), var(--ha-canvas)); }
  .mz-lb__more { align-self: flex-start; border: 0; background: none; padding: 2px 0; font: 700 15px/1.4 var(--ha-font); color: var(--ha-terra); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
}
@media (min-width: 961px) { .mz-lb__more { display: none !important; } }
