/* Стиль страниц сайта slotbord.ru, кроме главной (6.40.1-Л «Единый стиль», решение владельца
   11.10.2026: «стилистика главной должна быть и для других страниц»).
   Кто подключает: ниши /dlya/*, /tarify/, /zapis-na-sayt/, /cookies/, 404 и справка /help/
   (landing/build-help.mjs) — строкой <link rel="stylesheet" href="/pages.css"> после /site.css.
   На главной этого файла нет.
   Что в site.css: палитра --home-* на body.site и её тёмные значения, шрифты, база, .skip, .vh,
   .shell, .logo, .theme-btn, кнопки .btn* и .home-btn*, шапка home-top, подвал .footer,
   панель home-mbar, вопрос о Метрике .cookie-note и блоки главной.
   Что здесь: части страниц без аналога на главной, в языке главной — ровный фон, белые
   карточки с линией 1 px без тени (тень --home-sh-card только у доски первого экрана ниш),
   заголовки Unbounded как home-h1/home-h2, вопросы как home-qa, финал как home-final.
   Раскладки (grid/flex, колонки, min-width: 0) взяты из прежнего общего styles.css — ссылки
   «styles.css:N» у разделов указывают строки, откуда; цвета, стекло, пятна, тени и размытие
   оттуда не переносились. Точка перелома одна — 767 px.
   Значения — только переменные --home-* и шкалы кита (сторож declaration-strict-value,
   frontend/stylelint.config.mjs). */

/* ── Свои переменные страниц ──────────────────────────────────────── */
.site {
  /* затемнение под окном записи в макете чужого сайта (/zapis-na-sayt/): у прежнего
     styles.css это был --scrim кита; одно значение в обеих темах — сайт клиента светлый */
  --pages-scrim: rgba(27, 20, 51, .4);
  /* Заголовок первого экрана ниш стоит в колонке рядом с доской: кегль главной (до 58 px) ломал
     слово «бронирование» на 1440. Та же шкала, верх ниже. */
  --pages-fs-h1-hero: clamp(28px, 3vw, 44px);
}

/* ── Ссылки в тексте ──────────────────────────────────────────────── */
/* Только ссылки без класса: кнопки .btn и пункты списков со своим классом не задеваются. */
.site main a:where(:not([class])) { color: var(--home-link); }
.site main a:where(:not([class])):hover { color: var(--home-link-hover); }
/* Ссылка внутри абзаца отличается не только цветом (WCAG 1.4.1), как в styles.css:141, 949. */
.lede a, .note a, .small a, .qa p a, .bento__c p a, .hsec__note a { text-decoration: underline; text-underline-offset: 2px; }
/* Фокус на тёмном финале — белой обводкой, как у home-final в site.css */
.site .final :focus-visible { outline-color: var(--home-on-dark); }

/* ── Ритм разделов, styles.css:127–132 ────────────────────────────── */
.sec { padding: var(--home-sp-72) 0; position: relative; z-index: 1; }
.sec--first { padding-top: var(--home-sp-48); }
/* Линия между разделами — как между блоками главной (home-vygoda, home-rabota…) */
.sec + .sec:not(.final) { border-top: 1px solid var(--home-line); }
.sec__head { max-width: 780px; margin-bottom: var(--home-sp-32); }
.sec__head--c { margin-left: auto; margin-right: auto; text-align: center; }

/* ── Типографика, styles.css:131–139, 946–948 ─────────────────────── */
/* Как home-eyebrow: обычный регистр, 15 px, без точки-маркера */
.eyebrow { display: block; margin-bottom: var(--home-sp-12); font-weight: 400; font-size: var(--home-fs-15); line-height: 1.4; color: var(--home-muted); text-transform: none; letter-spacing: 0; }
.dot { display: none; }
.h1 { font-family: var(--font-cover); font-weight: 600; font-size: var(--home-fs-h1); line-height: 1.06; letter-spacing: -.025em; color: var(--home-ink); text-wrap: balance; }
.h2 { font-family: var(--font-cover); font-weight: 600; font-size: var(--home-fs-h2); line-height: 1.12; letter-spacing: -.02em; color: var(--home-ink); text-wrap: balance; }
/* Заголовок карточки (h3 в .bento): Onest 700 20 px — вид .h3 по контракту, класса .h3 на страницах нет */
.subhead { font-family: var(--font); font-weight: 700; font-size: var(--home-fs-20); line-height: 1.3; color: var(--home-ink); }
.slogan { margin-top: var(--home-sp-12); font-family: var(--font); font-weight: 600; font-size: var(--home-fs-20); line-height: 1.35; color: var(--home-ink); text-wrap: balance; }
.lede { max-width: 60ch; margin-top: var(--home-sp-16); font-size: var(--home-fs-18); line-height: 1.5; color: var(--home-text); }
.note { max-width: 64ch; margin-top: var(--home-sp-12); font-size: var(--home-fs-14); line-height: 1.45; color: var(--home-text-2); }
.note b { color: var(--home-ink); font-weight: 600; }
.small { font-size: var(--home-fs-13); line-height: 1.45; color: var(--home-muted); }
.stack { display: flex; flex-direction: column; gap: var(--home-sp-12); }

/* ── Карточка, styles.css:165–171 ─────────────────────────────────── */
/* Белая карточка с линией, без стекла и тени */
.plate { position: relative; padding: var(--home-sp-24); border: 1px solid var(--home-line); border-radius: var(--home-r-20); background: var(--home-surface); color: var(--home-text); }
.plate--tight { padding: var(--home-sp-16) var(--home-sp-20); border-radius: var(--home-r-16); }

/* ── Чипы, styles.css:195–207 ─────────────────────────────────────── */
.chip { position: relative; display: inline-flex; align-items: center; gap: var(--home-sp-8); min-height: 36px; padding: 0 var(--home-sp-14); border: 1px solid var(--home-control-line); border-radius: var(--home-r-10);
  background: var(--home-surface); color: var(--home-ink); font-size: var(--home-fs-14); font-weight: 500; white-space: nowrap; flex-shrink: 0; }
.chip .ic { width: 18px; height: 18px; color: var(--home-muted); }
.chip--sm { min-height: 32px; padding: 0 var(--home-sp-12); font-size: var(--home-fs-13); }

/* ── Первый экран, styles.css:347–386 ─────────────────────────────── */
/* Две колонки 5 : 7 переносом, как home-hero__row: без промежуточных порогов 900/1100 текст
   и доска встают друг под друга сами, когда колонке текста не хватает 340 px. */
.hero { display: flex; flex-wrap: wrap; gap: var(--home-sp-40); align-items: center; }
.hero > :first-child { flex: 5 1 340px; min-width: 0; }
.hero .h1 { font-size: var(--pages-fs-h1-hero); overflow-wrap: normal; hyphens: manual; }
.hero > :last-child { flex: 7 1 480px; min-width: 0; }
.hero__cta { display: flex; gap: var(--home-sp-12); flex-wrap: wrap; margin-top: var(--home-sp-24); align-items: center; }
.hero__marks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--home-sp-24); margin-top: var(--home-sp-32); }
.mark { display: flex; gap: var(--home-sp-12); align-items: flex-start; font-size: var(--home-fs-14); line-height: 1.45; color: var(--home-text); }
.mark b { display: block; margin-bottom: var(--home-sp-2); font-size: var(--home-fs-15); font-weight: 600; color: var(--home-ink); }
/* Значок — линией без фона и без квадратика */
.mark .ic { color: var(--home-muted); translate: 0 1px; }

/* ── Доска ниши, styles.css:285–320, 431–439 ──────────────────────── */
/* Карточка как home-board: единственная тень страницы */
.board { position: relative; }
.plate.board { padding: var(--home-sp-18) var(--home-sp-18) var(--home-sp-16); border-radius: var(--home-r-16); box-shadow: var(--home-sh-card); }
.board__top { display: flex; align-items: center; justify-content: space-between; gap: var(--home-sp-12); margin-bottom: var(--home-sp-12); }
.board__title { font-size: var(--home-fs-15); font-weight: 600; color: var(--home-ink); }
.board__scroll { overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain; }
.board__scroll::-webkit-scrollbar { display: none; }
.board__hd { padding: 0 0 var(--home-sp-4) var(--home-sp-4); font-size: var(--home-fs-12); font-weight: 600; color: var(--home-muted); text-align: left; font-variant-numeric: tabular-nums; }
.board__name { display: flex; align-items: center; gap: var(--home-sp-8); min-height: 46px; padding-right: var(--home-sp-8); font-size: var(--home-fs-13); font-weight: 600; color: var(--home-ink);
  position: sticky; left: 0; z-index: 2; background: var(--home-surface); }
/* Ячейки — как home-cell: радиус 6, цвета --home-cell-* */
.bk { position: relative; min-width: 0; min-height: 46px; display: flex; align-items: center; gap: var(--home-sp-4); padding: 0 var(--home-sp-8); border: 1px solid transparent; border-radius: var(--home-r-6);
  font-size: var(--home-fs-13); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bk--free { background: var(--home-cell-free-bg); border-color: var(--home-cell-free-line); color: var(--home-cell-free-text); }
.bk--bron { background: var(--home-cell-busy-bg); border-color: var(--home-cell-busy-line); color: var(--home-cell-busy-text); font-weight: 600; }
/* У home-cell--brk подписи нет; здесь она есть («Просушка») — цветом --home-warn */
.bk--break { background: var(--home-cell-brk-bg); border-color: var(--home-cell-brk-line); color: var(--home-warn); }
/* Сетки сцен: шесть часов (.mini--wide), восемь — ночь бани (.mini--night) */
.mini { display: grid; grid-template-columns: 110px repeat(6, minmax(0, 1fr)); gap: var(--home-sp-4); }
.mini .board__hd { padding-bottom: var(--home-sp-4); }
.mini .board__name { min-height: 40px; font-size: var(--home-fs-12); background: transparent; position: static; }
.mini .bk { min-height: 40px; font-size: var(--home-fs-12); }
.mini--wide { grid-template-columns: 136px repeat(6, minmax(52px, 1fr)); min-width: 500px; }
.mini--night { grid-template-columns: 136px repeat(8, minmax(44px, 1fr)); min-width: 560px; }
.mini--wide .board__name { position: sticky; left: 0; z-index: 2; background: var(--home-surface); }
/* Легенда — как home-legend */
.legend { display: flex; flex-wrap: wrap; align-items: center; gap: var(--home-sp-16); margin-top: var(--home-sp-12); padding-top: var(--home-sp-10); border-top: 1px solid var(--home-line-4); }
.legend span { display: inline-flex; align-items: center; gap: var(--home-sp-6); font-size: var(--home-fs-12); color: var(--home-text); }
.legend i { display: inline-block; width: 14px; height: 10px; border: 1px solid transparent; border-radius: var(--home-r-3); }
.legend .l-free { background: var(--home-cell-free-bg); border-color: var(--home-cell-free-line); }
.legend .l-bron { background: var(--home-cell-busy-bg); border-color: var(--home-cell-busy-line); }
.legend .l-break { background: var(--home-cell-brk-bg); border-color: var(--home-cell-brk-line); }

/* ── «Что видно в кабинете», styles.css:950–964 ───────────────────── */
.bento { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--home-sp-20); }
.bento__c { display: flex; flex-direction: column; gap: var(--home-sp-12); }
/* Нечётное число карточек: последняя занимает обе колонки. */
.bento__c:last-child:nth-child(odd) { grid-column: 1 / -1; }
.bento__c p { font-size: var(--home-fs-15); line-height: 1.5; color: var(--home-text); }
/* Фрагмент интерфейса внутри карточки — как home-plate: рамка, внутри линии --home-line-3 */
.ui { margin-top: auto; padding: var(--home-sp-4) var(--home-sp-14); border: 1px solid var(--home-line); border-radius: var(--home-r-10); background: var(--home-surface); font-size: var(--home-fs-13); color: var(--home-text-2); }
.ui__row { display: flex; justify-content: space-between; gap: var(--home-sp-12); padding: var(--home-sp-8) 0; font-variant-numeric: tabular-nums; }
.ui__row + .ui__row { border-top: 1px solid var(--home-line-3); }
.ui__row b { font-weight: 600; color: var(--home-ink); }
.ui__row span { color: var(--home-muted); text-align: right; }
.ui__sum { display: flex; justify-content: space-between; gap: var(--home-sp-12); padding: var(--home-sp-8) 0; border-top: 1px solid var(--home-line-3); font-weight: 600; color: var(--home-ink); }
.ui__note { display: flex; gap: var(--home-sp-8); align-items: flex-start; padding: var(--home-sp-8) 0; }
.ui__note b { color: var(--home-ink); }
.ui__note i { width: 8px; height: 8px; margin-top: var(--home-sp-6); border-radius: var(--r-pill); background: var(--home-warn); flex: none; }
.ui__link { padding-top: var(--home-sp-8); font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: var(--home-fs-12); font-weight: 500; line-height: 1.4; color: var(--home-link); word-break: break-all; }

/* ── Тарифы генератора, styles.css:772–798; вид — home-prices/home-price ── */
.prices { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--home-sp-20); align-items: stretch; }
.plate.price { min-width: 0; display: flex; flex-direction: column; gap: var(--home-sp-18); padding: var(--home-sp-28); border-radius: var(--home-r-16); }
/* «Бесплатно» — первая карточка, рамка 2 px, как home-price--free */
.prices .price:first-child { border: 2px solid var(--home-ink); }
.price__name { display: flex; justify-content: space-between; align-items: center; gap: var(--home-sp-8); font-size: var(--home-fs-17); font-weight: 700; color: var(--home-ink); }
.price__num { font-family: var(--font); font-size: var(--home-fs-44); font-weight: 600; line-height: 1; letter-spacing: -.01em; color: var(--home-ink); font-variant-numeric: tabular-nums; }
.price__num small { font-size: var(--home-fs-15); font-weight: 400; letter-spacing: 0; color: var(--home-text); }
.price__sub { min-height: 20px; margin-top: var(--home-sp-6); font-size: var(--home-fs-13); line-height: 1.45; color: var(--home-muted); }
/* Список с маркерами, как home-price__list: галочка-значок генератора скрыта */
.price ul { flex: 1; display: flex; flex-direction: column; gap: var(--home-sp-10); margin: 0; padding: 0 0 0 var(--home-sp-18); list-style: disc; font-size: var(--home-fs-15); line-height: 1.4; color: var(--home-text-2); }
.price li .ic { display: none; }
.price__foot { margin-top: auto; display: grid; gap: var(--home-sp-8); }
/* «помесячно / за год» — радиокнопки, цену переключает :has(); вид — home-period */
.seg { display: inline-flex; gap: var(--home-sp-2); min-width: 0; margin: 0; padding: var(--home-sp-3); border: 1px solid var(--home-line); border-radius: var(--home-r-10); background: var(--home-surface); }
.seg label { position: relative; display: inline-flex; }
.seg input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.seg span { display: inline-flex; align-items: center; height: 36px; padding: 0 var(--home-sp-14); border-radius: var(--home-r-8); font-size: var(--home-fs-14); font-weight: 600; color: var(--home-text); white-space: nowrap; }
/* Активная — как home-period__b[aria-pressed]: --home-dark-bg и белый (в тёмной теме --home-ink светлый, белый текст на нём не читался бы) */
.seg input:checked + span { background: var(--home-dark-bg); color: var(--home-on-dark); }
.seg input:focus-visible + span { outline: 2px solid var(--home-ink); outline-offset: 2px; }
.py { display: none; }
.price:has(input[value="year"]:checked) .pm { display: none; }
.price:has(input[value="year"]:checked) .py { display: inline; }
.riskbar { display: flex; flex-wrap: wrap; gap: var(--home-sp-8) var(--home-sp-20); justify-content: center; margin-top: var(--home-sp-20); font-size: var(--home-fs-14); color: var(--home-text); }
.riskbar span { display: inline-flex; gap: var(--home-sp-8); align-items: center; }
.riskbar .ic { color: var(--home-ok); }

/* ── Сравнение тарифов, styles.css:804–834 ────────────────────────── */
.tcmp { margin-top: var(--home-sp-32); }
.tcmp__sum { list-style: none; display: flex; justify-content: center; align-items: center; gap: var(--home-sp-8); min-height: var(--hit); cursor: pointer; font-size: var(--home-fs-16); font-weight: 600; color: var(--home-link); }
.tcmp__sum::-webkit-details-marker { display: none; }
.tcmp__sum .ic { transition: transform .2s ease; }
.tcmp[open] > .tcmp__sum { margin-bottom: var(--home-sp-16); }
.tcmp[open] > .tcmp__sum .ic { transform: rotate(180deg); }
.tcmp__more { margin-top: var(--home-sp-12); text-align: center; }
.tcmp__wrap { overflow: hidden; border: 1px solid var(--home-line); border-radius: var(--home-r-16); background: var(--home-surface); }
.tcmp__table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: var(--home-fs-14); }
.tcmp__table th, .tcmp__table td { height: 48px; padding: var(--home-sp-8) var(--home-sp-16); vertical-align: middle; border-top: 1px solid var(--home-line-2); color: var(--home-text-2); text-align: center; }
.tcmp__table thead th { height: 64px; border-top: 0; font-size: var(--home-fs-15); font-weight: 600; color: var(--home-ink); }
.tcmp__table thead th:first-child { width: 46%; }
.tcmp__table tbody th { text-align: left; font-weight: 500; color: var(--home-ink); }
/* Строка раздела — 12 px --home-muted, обычный регистр */
.tcmp__table .tcmp__sec th { height: 36px; text-align: left; font-size: var(--home-fs-12); font-weight: 600; color: var(--home-muted); background: var(--home-control); }
.tcmp__table td .ic { vertical-align: middle; }
.tcmp__price { display: block; font-size: var(--home-fs-12); font-weight: 500; color: var(--home-muted); }
.tv--yes { color: var(--home-ok); }
.tv--no { color: var(--home-muted); }
.tv--text { color: var(--home-ink); font-weight: 500; }
.tcards { display: none; }
.tcard { padding: var(--home-sp-16); border: 1px solid var(--home-line); border-radius: var(--home-r-16); background: var(--home-surface); }
.tcard__t { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--home-sp-4) var(--home-sp-8); font-family: var(--font); font-size: var(--home-fs-18); font-weight: 700; color: var(--home-ink); }
.tcard__t .tcmp__price { display: inline; font-size: var(--home-fs-13); }
.tcard__sec { margin: var(--home-sp-16) 0 var(--home-sp-8); font-size: var(--home-fs-12); font-weight: 600; color: var(--home-muted); }
.tcard__r { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--home-sp-8) var(--home-sp-12); align-items: center; margin: 0; font-size: var(--home-fs-14); }
.tcard__r dt { color: var(--home-text-2); }
.tcard__r dd { margin: 0; text-align: right; }

/* ── Вопросы, styles.css:839–848; вид — home-qa ───────────────────── */
/* Две колонки переносом, как home-faq__row */
.faq { display: flex; flex-wrap: wrap; gap: var(--home-sp-40); align-items: flex-start; }
.faq > :first-child { flex: 1 1 260px; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: var(--home-sp-14); }
.faq > :first-child > * { margin: 0; }
/* Правая колонка — без общей карточки, линия сверху. У разметки поля заданы атрибутом style
   (руками не правится), поэтому !important. */
.faq > .plate { flex: 3 1 560px; min-width: 0; padding: 0 !important; border: 0; border-top: 1px solid var(--home-line-2); border-radius: 0; background: transparent; }
.qa { border-bottom: 1px solid var(--home-line-2); }
.qa summary { display: flex; align-items: center; gap: var(--home-sp-16); min-height: 44px; padding: var(--home-sp-20) 0; list-style: none; cursor: pointer;
  font-family: var(--font); font-size: var(--home-fs-18); font-weight: 600; line-height: 1.35; color: var(--home-ink); }
.qa summary::-webkit-details-marker { display: none; }
.qa summary .ic { display: none; }
.qa summary::after { content: "+"; flex: none; width: 20px; margin-left: auto; text-align: center; font-size: var(--home-fs-22); font-weight: 400; line-height: 1; color: var(--home-muted); }
.qa[open] summary::after { content: "−"; }
.qa p { max-width: 640px; margin: 0 0 var(--home-sp-20); font-size: var(--home-fs-16); line-height: 1.55; color: var(--home-text); }

/* ── Финал, styles.css:858–878; вид — home-final ──────────────────── */
/* Тёмный блок на всю ширину: фон у секции, колонка — .shell внутри */
.sec.final { padding: var(--home-sp-72) 0; background: var(--home-dark-bg); color: var(--home-on-dark); text-align: center; }
.final .h2 { font-size: var(--home-fs-h2-final); line-height: 1.08; color: var(--home-on-dark); }
.final .lede, .final .note, .final .small { color: var(--home-on-dark-2); }
.final .note b { color: var(--home-on-dark); }
.final a:where(:not([class])), .final a:where(:not([class])):hover { color: var(--home-on-dark); }
/* Ссылка в строке про почту финала: правило .note a сильнее по весу, поэтому цвет на тёмном задаётся отдельно (Lighthouse: контраст). */
.site .final .note a, .site .final .note a:hover { color: var(--home-on-dark); }
/* Вторая кнопка — контуром, как home-btn--ghost */
.final .btn--secondary { background: transparent; border-color: var(--home-on-dark-btn); color: var(--home-on-dark); }
.final .btn--secondary:hover { border-color: var(--home-on-dark); }
.final__trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--home-sp-12) var(--home-sp-32); margin-top: var(--home-sp-40); padding-top: var(--home-sp-24); border-top: 1px solid var(--home-on-dark-line); }
.final__trio > div { display: grid; gap: var(--home-sp-4); align-content: start; text-align: center; }
.final__trio b { font-size: var(--home-fs-15); font-weight: 600; color: var(--home-on-dark); }

/* ── «Запись на сайт»: макет чужого сайта, styles.css:647, 660–706 ─── */
.slide__vis { display: flex; flex-direction: column; justify-content: center; gap: var(--home-sp-12); padding: var(--home-sp-24); border: 1px solid var(--home-line); border-radius: var(--home-r-20); background: var(--home-surface); }
/* Цвета условного сайта клиента — свои, тёплые, в обеих темах (исключение сторожа,
   frontend/stylelint.config.mjs: макет чужого сайта). */
.wsite { position: relative; height: 330px; overflow: hidden; border-radius: var(--home-r-16);
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- макет чужого сайта: фон сайта клиента */
  background: #F6F0E8;
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- макет чужого сайта: кромка */
  border: 1px solid; border-color: #E4D8C8;
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- макет чужого сайта: текст */
  color: #3A2A1C; }
/* Окно записи поверх сайта — наше и светлое в любой теме страницы: светлые --home-* внутри,
   как у home-win в site.css. */
:root[data-theme="dark"] .site .wsite {
  --home-surface: #FFFFFF;
  --home-ink: #1B1433;
  --home-text: #4A4270;
  --home-text-2: #3A3355;
  --home-muted: #6F6888;
  --home-line: #E6E1F0;
}
.wsite__bar { height: 36px; display: flex; align-items: center; padding: 0 var(--home-sp-12); font: 700 13px/1 Georgia, "Times New Roman", serif;
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- макет чужого сайта: шапка */
  background: #3A2A1C;
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- макет чужого сайта: текст шапки */
  color: #F6F0E8; }
.wsite__page { display: grid; gap: var(--home-sp-8); padding: var(--home-sp-16) var(--home-sp-12); }
.wsite__ln { display: block; height: 8px; border-radius: var(--r-pill);
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- макет чужого сайта: строка текста */
  background: #E4D8C8; }
.wsite__ph { display: block; width: 60%; height: 96px; border-radius: var(--home-r-12);
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- макет чужого сайта: фотография */
  background: linear-gradient(135deg, #C9A882, #8A6444); }
.wsite__shade { position: absolute; top: 36px; right: 0; bottom: 0; left: 0; background: var(--pages-scrim); }
.wsite__fab { position: absolute; left: 14px; bottom: 14px; padding: var(--home-sp-8) var(--home-sp-12); border-radius: var(--r-pill); color: var(--home-on-dark); font-size: var(--home-fs-12); font-weight: 600;
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- макет чужого сайта: цвет сайта у кнопки виджета (лист 18, --site) */
  background: #7A4B2A;
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- кнопка виджета на чужом фоне: своя тень, исключение №2 листа 18 */
  box-shadow: 0 6px 20px rgba(0, 0, 0, .25); }
/* Окно — без тени: край отбит линией */
.wsite__panel { position: absolute; top: 0; right: 0; bottom: 0; width: 60%; max-width: 250px; display: flex; flex-direction: column; gap: var(--home-sp-8); padding: 0 var(--home-sp-12) var(--home-sp-8);
  border-left: 1px solid var(--home-line); background: var(--home-surface); color: var(--home-ink); font-size: var(--home-fs-12); }
.wsite__head { height: 44px; display: flex; align-items: center; justify-content: space-between; margin: 0 calc(-1 * var(--home-sp-12)); padding: 0 var(--home-sp-8) 0 var(--home-sp-12); border-bottom: 1px solid var(--home-line); font-size: var(--home-fs-13); font-weight: 600; }
.wsite__x { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--home-line); border-radius: var(--r-pill); color: var(--home-text-2); }
.wsite__x .ic { width: 16px; height: 16px; }
.wsite__days, .wsite__times { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--home-sp-4); }
.wsite__days span { display: flex; flex-direction: column; align-items: center; padding: var(--home-sp-4) 0; border: 1px solid var(--home-line); border-radius: var(--home-r-6); font-size: var(--home-fs-12); color: var(--home-text-2); }
.wsite__days b { font-size: var(--home-fs-13); color: var(--home-ink); }
.wsite__times span { padding: var(--home-sp-8) 0; border: 1px solid var(--home-line); border-radius: var(--home-r-6); text-align: center; font-size: var(--home-fs-12); font-variant-numeric: tabular-nums; }
.wsite__days .on, .wsite__times .on, .wsite__cta { color: var(--home-on-dark);
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- цвет сайта клиента (лист 18, --site): выбранный день, время и кнопка окна */
  background: #7A4B2A;
  /* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- цвет сайта клиента (лист 18, --site) */
  border-color: #7A4B2A; }
.wsite__days .on b { color: var(--home-on-dark); }
.wsite__sum { margin-top: auto; font-size: var(--home-fs-12); color: var(--home-text-2); }
.wsite__cta { min-height: 36px; display: flex; align-items: center; justify-content: center; border-radius: var(--home-r-10); font-weight: 600; }
.wsite__legal { text-align: center; font-size: var(--home-fs-12); color: var(--home-muted); }

/* ── Картинки окна и статей, styles.css:1002–1013 ─────────────────── */
.doc__fig { margin: var(--home-sp-4) 0 var(--home-sp-20); }
.doc__fig a { display: block; }
.doc__fig a:hover { text-decoration: none; }
.doc__fig img { display: block; width: 100%; height: auto; border: 1px solid var(--home-line); border-radius: var(--home-r-12); }
.doc__fig a:hover img { border-color: var(--home-control-line); }
/* Кадр под телефон: на компьютере — половина своего размера */
.doc__fig--tall { max-width: 400px; }
.bento__c .doc__fig { margin-bottom: 0; }

/* ── /cookies/: состояние согласия, styles.css:975–976 ────────────── */
.consent-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: var(--home-sp-8) var(--home-sp-12); margin: var(--home-sp-16) 0; padding-top: var(--home-sp-16); border-top: 1px solid var(--home-line); }
/* Блок скрыт, пока скрипт не покажет его, но место держит: в разметке уже лежит текст состояния,
   и показ не двигает то, что ниже (CLS /cookies/, 6.43-Л). Без скрипта блок остаётся невидимым. */
.consent-ctl[hidden] { display: flex; visibility: hidden; }
.consent-ctl p { font-size: var(--home-fs-14); color: var(--home-text-2); }

/* ── Справка /help/ и 404, styles.css:986–1031 ────────────────────── */
.page-h1 { font-family: var(--font-cover); font-weight: 600; font-size: var(--home-fs-h2-final); line-height: 1.1; letter-spacing: -.02em; color: var(--home-ink); text-wrap: balance; }
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: var(--home-sp-4); margin: 0 0 var(--home-sp-16); font-size: var(--home-fs-13); color: var(--home-muted); }
.site .crumbs a { color: var(--home-muted); text-decoration: underline; text-underline-offset: 2px; }
.crumbs .ic { color: var(--home-muted); }
.crumbs span { color: var(--home-ink); }
/* Статья: 68 знаков в строке */
.doc { max-width: 68ch; margin-top: var(--home-sp-20); font-size: var(--home-fs-16); line-height: 1.6; color: var(--home-text); }
.doc p { margin: 0 0 var(--home-sp-16); }
.doc p:last-child { margin-bottom: 0; }
.doc strong { color: var(--home-ink); font-weight: 600; }
.doc a { text-decoration: underline; text-underline-offset: 3px; }
.doc h2 { margin: var(--home-sp-32) 0 var(--home-sp-12); font-family: var(--font); font-size: var(--home-fs-22); font-weight: 700; line-height: 1.3; letter-spacing: -.01em; color: var(--home-ink); }
.doc h3 { margin: var(--home-sp-24) 0 var(--home-sp-8); font-family: var(--font); font-size: var(--home-fs-18); font-weight: 700; line-height: 1.35; color: var(--home-ink); }
.doc h2[id], .doc h3[id] { scroll-margin-top: 88px; }
.doc ul, .doc ol { display: grid; gap: var(--home-sp-8); margin: 0 0 var(--home-sp-16); padding-left: var(--home-sp-24); }
.doc ul { list-style: disc; }
.doc ol { list-style: decimal; }
.doc code { padding: 0 var(--home-sp-4); border: 1px solid var(--home-line); border-radius: var(--home-r-6); background: var(--home-control); font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: var(--home-fs-14); color: var(--home-ink); }
.doc__code { margin: 0 0 var(--home-sp-16); padding: var(--home-sp-12) var(--home-sp-16); overflow-x: auto; border: 1px solid var(--home-line); border-radius: var(--home-r-12); background: var(--home-control); }
.doc__code code { padding: 0; border: 0; background: none; font-size: var(--home-fs-13); line-height: 1.55; white-space: pre; }
/* Оглавление справки */
.hsec { margin: 0 0 var(--home-sp-40); }
.hsec:last-of-type { margin-bottom: 0; }
.hsec h2 { margin-bottom: var(--home-sp-8); font-family: var(--font); font-size: var(--home-fs-22); font-weight: 700; line-height: 1.3; letter-spacing: -.01em; color: var(--home-ink); }
.hsec__note { max-width: 60ch; margin: 0 0 var(--home-sp-16); font-size: var(--home-fs-15); line-height: 1.45; color: var(--home-text); }
/* Список статей (и ссылки 404) — белые карточки с линией */
.hlist { display: grid; gap: var(--home-sp-12); }
.site .hlist a { display: grid; gap: var(--home-sp-4); padding: var(--home-sp-16) var(--home-sp-20); border: 1px solid var(--home-line); border-radius: var(--home-r-16); background: var(--home-surface); color: var(--home-text); }
.site .hlist a:hover { border-color: var(--home-ink); text-decoration: none; }
.hlist b { font-size: var(--home-fs-16); font-weight: 600; color: var(--home-ink); }
.hlist span { font-size: var(--home-fs-14); line-height: 1.45; color: var(--home-text); }
/* 404 (6.43-Л, Д-2): две кнопки под строкой и строки-ссылки ниже; плашек нет */
.nf-cta { padding-top: var(--home-sp-24); }
.nf-links { display: grid; gap: var(--home-sp-8); margin-top: var(--home-sp-32); font-size: var(--home-fs-16); }
.site .nf-links a { color: var(--home-text); text-decoration: underline; text-underline-offset: 3px; }
.site .nf-links a:hover { color: var(--home-ink); }
.hnext { max-width: 68ch; margin-top: var(--home-sp-40); }
.hnext h2 { margin: 0 0 var(--home-sp-12); font-size: var(--home-fs-15); font-weight: 600; color: var(--home-muted); }

/* ── Телефон: единственная точка перелома ─────────────────────────── */
@media (max-width: 767px) {
  .sec { padding: var(--home-sp-48) 0; }
  .sec--first { padding-top: var(--home-sp-32); }
  .sec__head { margin-bottom: var(--home-sp-24); }
  .lede { font-size: var(--home-fs-16); }
  .slogan { font-size: var(--home-fs-18); }
  .plate { padding: var(--home-sp-20); }
  .plate.price { padding: var(--home-sp-24); }
  /* Кнопки первого экрана и финала — во всю ширину, надпись переносится (на 320 px «Открыть
     демо без регистрации» в строку не помещается), как home-btn в site.css */
  .hero__cta > .btn { width: 100%; max-width: 100%; height: auto; min-height: 56px; padding-top: var(--home-sp-8); padding-bottom: var(--home-sp-8); white-space: normal; text-align: center; }
  .hero__marks { grid-template-columns: minmax(0, 1fr); gap: var(--home-sp-16); }
  .bento { grid-template-columns: minmax(0, 1fr); }
  .note a { padding-block: var(--home-sp-12); }
  .nf-links { gap: 0; }
  .site .nf-links a { display: flex; align-items: center; min-height: var(--hit); }
  .price__num { font-size: var(--home-fs-40); }
  .tcmp__wrap { display: none; }
  .tcards { display: grid; gap: var(--home-sp-12); }
  .sec.final { padding: var(--home-sp-56) 0; }
  .final__trio { grid-template-columns: minmax(0, 1fr); }
  .wsite__panel { width: 74%; }
  .wsite__times { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .doc { line-height: 1.75; }
  .doc a { padding-block: var(--home-sp-8); }
}

/* ── 6.42-Л: ниши на блоках главной — свои части ───────────────────── */
.home-board__cap { font-size: var(--home-fs-12); color: var(--home-muted); }
.home-grid--6 .home-grid__row { grid-template-columns: 148px repeat(6, minmax(0, 1fr)); }
.home-grid--8 .home-grid__row { grid-template-columns: 148px repeat(8, minmax(0, 1fr)); }
/* На шести часах ячейка в один час — 60 px текста при полях 8 px, а слово «свободно» в 13 px
   занимает 61: на нишах поля ячейки на 2 px уже, чтобы подпись не резалась на 1280 и шире. */
.home-grid--6 .home-cell { padding: 0 var(--home-sp-6); }
/* На телефоне доска листается внутри карточки (.home-panel 600 px): шести часам этого мало,
   «свободно» в ячейке на час резалось — сетке на шесть часов своя ширина. */
.home-grid--6 { min-width: 616px; }
/* Ссылка «Условия тарифов» в тёмном финале: правило .site main a:where(:not([class])) выше
   по весу, чем .home-fine--dark a из site.css, и красило её в фиолетовый на тёмном. */
.site .home-fine--dark a, .site .home-fine--dark a:hover { color: var(--home-on-dark); }
.home-fine__demo { color: var(--home-text-2); }
.home-fig__link { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: var(--home-fs-12); font-weight: 500; color: var(--home-link); word-break: break-all; }
.home-fig__sum { font-weight: 600; color: var(--home-ink); }
.home-final__steps { flex: 1 1 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--home-sp-24); margin: 0; padding: var(--home-sp-24) 0 0; list-style: none; border-top: 1px solid var(--home-on-dark-line); }
.home-final__step { display: grid; gap: var(--home-sp-6); align-content: start; }
.home-final__step b { font-size: var(--home-fs-15); font-weight: 600; color: var(--home-on-dark-accent); font-variant-numeric: tabular-nums; }
.home-final__step h3 { font-family: var(--font); font-size: var(--home-fs-18); font-weight: 700; line-height: 1.3; color: var(--home-on-dark); }
.home-final__step p { font-size: var(--home-fs-15); line-height: 1.45; color: var(--home-on-dark-2); }
@media (max-width: 767px) {
  .home-final__steps { grid-template-columns: minmax(0, 1fr); }
}

/* ── 6.41: строки статей (блог и ниши) ───────────────────────────────── */
/* «Читайте дальше» в статье блога и блок «Статьи для {отрасли}» на нишах — строками под линией
   со стрелкой справа (ТЗ блога 2, ТЗ справки 6.1). Здесь, а не в blog.css: ниши blog.css не
   подключают. .hlist справки не трогается: справка 6.43-Л может перейти на эти строки. */
.blog-links { margin: 0; padding: 0; list-style: none; }
.blog-links > li { border-top: 1px solid var(--home-line-2); }
/* У последней строки — и снизу, как у строк списков блога (.blog-row) */
.blog-links > li:last-child { border-bottom: 1px solid var(--home-line-2); }
.site .blog-links a { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--home-sp-16); row-gap: var(--home-sp-4); align-items: center; padding: var(--home-sp-16) 0; color: var(--home-text); text-decoration: none; }
.site .blog-links a:hover { color: var(--home-text); text-decoration: none; }
.site .blog-links a:hover b { text-decoration: underline; text-underline-offset: 3px; }
.site .blog-links a::after { content: "→"; grid-column: 2; grid-row: 1 / span 2; font-size: var(--home-fs-18); line-height: 1; color: var(--home-muted); }
.blog-links b { grid-column: 1; font-size: var(--home-fs-17); font-weight: 600; line-height: 1.35; color: var(--home-ink); }
.blog-links span { grid-column: 1; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; font-size: var(--home-fs-15); line-height: 1.45; color: var(--home-text); }
/* Блок на нишах: линия сверху, как между блоками главной; строки — колонкой текста */
.blog-niche { border-top: 1px solid var(--home-line); }
.blog-niche .home-h2 { margin-bottom: var(--home-sp-24); }
.blog-niche .blog-links { max-width: 760px; }

/* ── 6.51-Л: блок :::calc (калькулятор) ──────────────────────────────── */
/* Разметка — landing/calc-block.mjs, скрипт — calc.js. Поля слева, итог справа; на телефоне
   итог под полями. У итога постоянная высота: числа сменяют «—», строка сменяет строку, вёрстка
   не сдвигается. Поле и кнопки — не ниже 44 px (область нажатия). */
.calc { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--home-sp-20); margin-top: var(--home-sp-32); align-items: start; }
.calc__form, .calc__out { padding: var(--home-sp-24); border: 1px solid var(--home-line); border-radius: var(--home-r-20); background: var(--home-surface); }
.calc__t { margin-bottom: var(--home-sp-16); font-family: var(--font); font-size: var(--home-fs-20); font-weight: 700; line-height: 1.3; color: var(--home-ink); }
.calc__field + .calc__field { margin-top: var(--home-sp-18); }
.calc__label { display: block; margin-bottom: var(--home-sp-6); font-size: var(--home-fs-16); font-weight: 600; line-height: 1.35; color: var(--home-ink); }
.calc__in { display: block; width: 100%; max-width: 320px; height: 52px; box-sizing: border-box; padding: 0 var(--home-sp-16); border: 1px solid var(--home-control-line); border-radius: var(--home-r-12);
  background: var(--home-surface); color: var(--home-ink); font-family: var(--font); font-size: var(--home-fs-18); font-variant-numeric: tabular-nums; }
.calc__in:hover { border-color: var(--home-muted); }
.calc__in:focus-visible { outline: 2px solid var(--home-link); outline-offset: 2px; border-color: var(--home-link); }
.calc__in[aria-invalid="true"] { border-color: var(--home-warn); }
.calc__hint { margin-top: var(--home-sp-6); font-size: var(--home-fs-14); line-height: 1.45; color: var(--home-text-2); }
.calc__err { font-size: var(--home-fs-14); font-weight: 600; line-height: 1.45; color: var(--home-warn); }
.calc__err:not(:empty) { margin-top: var(--home-sp-4); }
.calc__ex { display: flex; flex-wrap: wrap; align-items: center; gap: var(--home-sp-12); margin-top: var(--home-sp-24); }
.calc__exnote { font-size: var(--home-fs-14); line-height: 1.45; color: var(--home-text-2); }
.calc__res { margin: 0; }
/* Строка итога переносится: на 768 px карточка итога уже, чем «43 333 333 333 ₽» кеглем 26 (вторая проверка 6.51-Л). */
.calc__row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--home-sp-12); padding: var(--home-sp-12) 0; border-bottom: 1px solid var(--home-line-2); }
.calc__row:first-child { padding-top: 0; }
.calc__row dt { font-size: var(--home-fs-16); line-height: 1.35; color: var(--home-text); }
.calc__row dd { margin: 0; font-size: var(--home-fs-20); font-weight: 700; line-height: 1.2; color: var(--home-ink); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.calc__row--main dd { font-family: var(--font-cover); font-size: var(--home-fs-26); font-weight: 600; letter-spacing: -.01em; }
/* Строка под итогом — две строки места заранее: «Заполните три поля…» сменяется сценарием Х-6 той же высоты. */
.calc__line { min-height: calc(2 * 1.45em); margin-top: var(--home-sp-16); font-size: var(--home-fs-15); line-height: 1.45; color: var(--home-text-2); }
.calc--ready .calc__line { color: var(--home-ink); }
.calc-how { max-width: 780px; }
.calc-how p + p { margin-top: var(--home-sp-12); }
.calc-how .note { max-width: none; }
#po-teme .blog-links { max-width: 760px; }
/* Первый экран без сдвига при смене шрифта: запасной шрифт кладёт заголовок в одну строку, а вводный
   абзац — в четыре; Unbounded и Onest — в две и в три. Блок калькулятора ниже прыгал на 27 px (замер
   CLS 6.51-Л, 1280 px). Место под две строки заголовка и четыре строки абзаца — заранее. */
@media (min-width: 768px) {
  .calc-top .h1 { min-height: 2.12em; }
  .calc-top .lede { min-height: 6em; }
}
@media (max-width: 767px) {
  .calc { grid-template-columns: minmax(0, 1fr); margin-top: var(--home-sp-24); }
  .calc__form, .calc__out { padding: var(--home-sp-20); }
  .calc__in { max-width: none; }
  .calc__line { min-height: calc(3 * 1.45em); }
  /* 320 px и большой итог («32 500 000 ₽», предел — 12 цифр): число уходит под подпись и
     переносится внутри, а не вылезает за карточку (проверка качества 6.51-Л). */
  .calc__row--main dd { font-size: var(--home-fs-22); }
}

/* ── 6.43-Л тарифы: первый экран, таблица с липкой строкой заголовков, вкладки на телефоне ──────
   Карточки, период, условия, вопросы и финал — компоненты home-* главной (site.css).
   Здесь только то, чего на главной нет. Липкость строки заголовков ломает overflow у любого предка
   таблицы, поэтому у .tcmp__wrap он снят; таблица на ≥768 px — линии без рамки и скруглений. */
.tar-top { padding: var(--home-sp-32) 0 var(--home-sp-48); }
.tar-top .crumbs { margin-bottom: var(--home-sp-16); }
/* Переключатель периода на /tarify/ стоит в разметке без hidden: показ из home.js после первой отрисовки
   сдвигал карточки цен (CLS 0,045 на 390 при CPU ×4). Без JS он бесполезен — его прячет стиль. */
@media (scripting: none) { .tar-top .home-period { display: none; } }
.tar-top .home-cena__head { margin-bottom: var(--home-sp-24); }
.tar-top .home-cena__head > div:first-child { gap: var(--home-sp-12); }
.tar-top .page-h1 { margin: 0; }
.tar-top .home-lede { max-width: 60ch; }
.tar-cmp { border-top: 1px solid var(--home-line); }
.tar-cmp .home-h2 { margin-bottom: var(--home-sp-8); }
.tar-cmp .home-lede { margin-bottom: var(--home-sp-32); }
.tar-cmp .tcmp { margin-top: 0; }
.tar-note { max-width: 760px; margin: var(--home-sp-12) 0 0; font-size: var(--home-fs-14); line-height: 1.5; color: var(--home-text); }
.tcmp__wrap { overflow: visible; border: 0; border-radius: 0; background: transparent; }
.tcmp__table { border-collapse: separate; border-spacing: 0; }
.tcmp__table th, .tcmp__table td { border-top: 0; border-bottom: 1px solid var(--home-line-2); }
.tcmp__table thead th { position: sticky; top: calc(var(--topbar-h) + var(--home-sp-4)); z-index: 2; background: var(--home-bg); border-bottom: 1px solid var(--home-line); }
.tcmp__table tbody th a { color: var(--home-link); text-decoration: underline; text-underline-offset: 2px; }
.tcmp__table tbody th a:hover { color: var(--home-link-hover); }
.tar-m { display: none; }
.tar-m__tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--home-sp-2); padding: var(--home-sp-3); margin-bottom: var(--home-sp-20); border: 1px solid var(--home-line); border-radius: var(--home-r-10); background: var(--home-surface); }
.tar-m__tab { min-height: 44px; padding: var(--home-sp-4); border: 0; border-radius: var(--home-r-8); background: transparent; color: var(--home-text); font-family: var(--font); font-size: var(--home-fs-14); font-weight: 600; line-height: 1.2; cursor: pointer; }
.tar-m__tab[aria-selected="true"] { background: var(--home-dark-bg); color: var(--home-on-dark); }
.tar-m__tab:focus-visible, .tar-m__panel:focus-visible { outline: 2px solid var(--home-ink); outline-offset: 2px; }
.tar-m__panel + .tar-m__panel { margin-top: var(--home-sp-40); }
[data-tar-js] .tar-m__panel + .tar-m__panel { margin-top: 0; }
.tar-m__t { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--home-sp-4) var(--home-sp-8); margin: 0 0 var(--home-sp-4); font-family: var(--font); font-size: var(--home-fs-18); font-weight: 700; color: var(--home-ink); }
.tar-m__t .tcmp__price { display: inline; font-size: var(--home-fs-13); }
.tar-m__sec { margin: var(--home-sp-16) 0 var(--home-sp-4); font-size: var(--home-fs-12); font-weight: 600; color: var(--home-muted); }
.tar-m__rows { margin: 0; border-top: 1px solid var(--home-line-2); font-size: var(--home-fs-14); }
.tar-r { display: flex; justify-content: space-between; align-items: center; gap: var(--home-sp-12); padding: var(--home-sp-6) 0; border-bottom: 1px solid var(--home-line-2); }
.tar-r dt { min-width: 0; color: var(--home-text-2); }
.tar-r dd { flex: none; margin: 0; text-align: right; }
.tar-r--no dt { color: var(--home-muted); }
.tar-r dt a { color: var(--home-link); text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 767px) {
  .tar-top { padding: var(--home-sp-24) 0 var(--home-sp-40); }
  .tcmp__wrap { display: none; }
  .tar-m { display: block; }
  .tar-cmp .home-lede { margin-bottom: var(--home-sp-24); }
  /* Высота страницы на 390 (приёмка 6.43-Л: не больше 7 500 px): карточки и списки плотнее, чем на главной. */
  .tar-top .home-lede { font-size: var(--home-fs-16); }
  .tar-top .home-price { gap: var(--home-sp-14); padding: var(--home-sp-20); }
  .tar-top .home-price__list { gap: var(--home-sp-6); }
}

/* ── 6.43-Л запись на сайт: блоки главной, три способа, строка ссылок, одна карточка цены ─────────
   Первый экран, «Удобно… Выгодно…», вопросы и финал — классы home-* из site.css. Здесь только то,
   чего на главной нет. */
.home-sposoby { border-top: 1px solid var(--home-line); }
.zs-head { display: flex; flex-direction: column; gap: var(--home-sp-12); max-width: 780px; margin-bottom: var(--home-sp-32); }
.zs-head > * { margin: 0; }
/* Строка «Пошагово: …» под тремя способами (ТЗ 5.5) */
.zs-steps { max-width: none; margin: var(--home-sp-24) 0 0; font-size: var(--home-fs-16); line-height: 1.5; color: var(--home-text); }
.zs-steps a { text-decoration: underline; text-underline-offset: 2px; }
/* Одна карточка «Одна точка» вместо ряда из трёх: ширина как у карточки в ряду, слева */
.home-prices--one { grid-template-columns: minmax(0, 420px); justify-content: start; }
.zs-cena .home-cena__foot { text-align: left; }
.zs-cena .home-cena__head { margin-bottom: var(--home-sp-24); }
/* Окно на телефоне — вторая картинка карточки «Кнопка в углу», только до 767 px (ТЗ 5.4) */
.zs-phone { display: none; }
@media (max-width: 767px) {
  .zs-phone { display: block; width: 100%; max-width: 240px; align-self: center; }
  .zs-cena .home-price { gap: var(--home-sp-14); padding: var(--home-sp-20); }
  .zs-cena .home-price__list { gap: var(--home-sp-6); }
  .zs-cena .home-lede { font-size: var(--home-fs-16); }
  .zs-steps a { padding-block: var(--home-sp-8); }
  .home-prices--one { grid-template-columns: minmax(0, 1fr); }
}

/* ── Справка 6.43-Л, задача Г: снимки с метками и сценарии по шагам (ТЗ страниц 6.3) ──────────────────────────
   Рамка окна — линия var(--home-line), радиус 12, без тени. Две темы — две картинки, переключаются атрибутом
   data-theme сайта (медиазапрос системной темы сайт не видит). Метка 28 px, поле нажатия 44 px; подсказка —
   плашка с линией, до 280 px. Размеры картинок заданы в HTML (width и height), вёрстка не прыгает. */
.hshot, .hscn { margin: var(--home-sp-8) 0 var(--home-sp-24); }
.hshot__frame { position: relative; border: 1px solid var(--home-line); border-radius: var(--home-r-12); }
.hshot__img { display: block; width: 100%; height: auto; border-radius: calc(var(--home-r-12) - 1px); }
:root[data-theme="dark"] .hshot__img--light, :root:not([data-theme="dark"]) .hshot__img--dark { display: none; }
.hshot__v--m { display: none; }
.hshot--tall { max-width: 400px; }
.hshot__mark {
  position: absolute; left: var(--x); top: var(--y); translate: -50% -50%; z-index: 1;
  width: 28px; height: 28px; padding: 0; display: grid; place-items: center;
  border: 0; border-radius: var(--r-pill); background: var(--home-ink); color: var(--home-bg);
  font-family: var(--font); font-size: var(--home-fs-13); font-weight: 600; line-height: 1; cursor: pointer;
}
.hshot__mark::before { content: ""; position: absolute; inset: calc(-1 * var(--home-sp-8)); }
.site .hshot__mark:focus-visible { outline: 2px solid var(--home-ink); outline-offset: 2px; }
.hshot__tip { position: absolute; z-index: 2; width: max-content; max-width: min(280px, calc(100% - 16px)); padding: var(--home-sp-8) var(--home-sp-12);
  border: 1px solid var(--home-line); border-radius: var(--home-r-10); background: var(--home-surface); font-size: var(--home-fs-14); line-height: 1.4; color: var(--home-ink); }
.doc .hshot__list { display: grid; gap: var(--home-sp-4); margin: var(--home-sp-12) 0 0; padding-left: 0; list-style: none; font-size: var(--home-fs-15); line-height: 1.45; }
.doc .hshot__off { margin: var(--home-sp-8) 0 0; font-size: var(--home-fs-14); line-height: 1.45; color: var(--home-muted); }
.hshot__cap { margin-top: var(--home-sp-8); font-size: var(--home-fs-13); line-height: 1.4; color: var(--home-muted); }
/* Сценарий: без скриптов виден первый шаг (остальные открывает noscript-стиль страницы), help.js ставит .hscn--js и
   показывает один шаг — на загрузке ничего не сдвигается. */
.doc .hscn__steps { margin: 0; padding: 0; list-style: none; }
.hscn__step { display: none; margin: 0; padding: 0; }
.hscn__step:first-child { display: block; }
/* Со скриптом шаги лежат в одной сетке: кадр текущего шага в первой строке, подписи всех шагов друг на друге во второй.
   Строка подписи высотой с самую длинную подпись, поэтому кнопки и текст ниже при листании не сдвигаются. */
.hscn--js .hscn__steps { display: grid; }
.hscn--js .hscn__step { display: contents; }
.hscn--js .hscn__step .hshot__v { grid-area: 1 / 1; min-width: 0; }
.hscn--js .hscn__step:not(.is-cur) .hshot__v { display: none; }
.hscn--js .hscn__step .hscn__cap { grid-area: 2 / 1; }
.hscn--js .hscn__step:not(.is-cur) .hscn__cap { visibility: hidden; }
/* Рамка кадра сценария — по самому высокому кадру (build-help: --hscn-ar-d и --hscn-ar-m), поэтому текст ниже не
   прыгает при листании. Рамка считает отношение по содержимому, чтобы кадр лёг без зазора. */
.hscn--js .hshot__frame { box-sizing: content-box; aspect-ratio: var(--hscn-ar-d); }
.hscn--js .hshot__v--m .hshot__frame { aspect-ratio: var(--hscn-ar-m); }
.doc .hscn__cap { margin: var(--home-sp-12) 0 0; font-size: var(--home-fs-16); line-height: 1.45; color: var(--home-ink); }
.hscn__k { display: none; font-weight: 600; }
.hscn__nav { display: flex; align-items: center; gap: var(--home-sp-12); margin-top: var(--home-sp-12); }
.hscn__btn { height: 44px; min-width: 44px; padding: 0 var(--home-sp-20); }
.hscn__btn:disabled { opacity: .45; cursor: default; }
.hscn__mid { flex: 1; min-width: 0; display: grid; justify-items: center; gap: var(--home-sp-4); }
.hscn__st { font-size: var(--home-fs-14); line-height: 1.3; color: var(--home-muted); font-variant-numeric: tabular-nums; }
.hscn__dots { display: flex; flex-wrap: wrap; justify-content: center; }
.hscn__dot { position: relative; width: 28px; height: 44px; padding: 0; border: 0; background: none; cursor: pointer; }
.hscn__dot::before { content: ""; position: absolute; left: 50%; top: 50%; width: 10px; height: 10px; translate: -50% -50%; border-radius: 50%; background: var(--home-control-line); }
.hscn__dot[aria-current="true"]::before { background: var(--home-ink); }
.site .hscn__dot:focus-visible, .site .hscn__btn:focus-visible { outline: 2px solid var(--home-ink); outline-offset: 2px; }
@media (max-width: 767px) {
  .hshot--m .hshot__v--d { display: none; }
  .hshot--m .hshot__v--m { display: block; }
}

/* ── 6.43-Л справка ─────────────────────────────────────────────────────
   Оглавление /help/ (поиск, «Путь по продукту», строки разделов) и статья (оглавление слева, «Где в
   кабинете», шаги, подсказки терминов, «Помогла ли статья?»). Цвета — только палитра --home-*; на
   ≥1024 px оглавление статьи уходит в боковую колонку (ТЗ справки 6.2), это вторая точка перелома,
   разрешённая сторожем site6401Css.test.ts только для этого блока. */
.hsearch[hidden], .hpath[hidden], .hpath__cnt[hidden], .hpath__ok[hidden], .hsec[hidden], .hrows li[hidden],
.fb[hidden], .fb [hidden], .hsearch__empty[hidden] { display: none; }
/* Поиск и «Прочитано N из 6» видны с первой отрисовки, если JS включён, и прячутся без него. Раньше их показывал
   help.js, и при медленном процессоре «Путь по продукту» съезжал вниз уже после отрисовки (CLS /help/ 0,036–0,056). */
@media (scripting: none) { .hsearch, .hpath__cnt { display: none; } }

/* Строки: оглавление разделов и «Читайте дальше» — линия, заголовок, описание, стрелка справа */
.hrows { margin: 0; padding: 0; list-style: none; }
.hrows > li { border-top: 1px solid var(--home-line-2); }
.hrows > li:last-child { border-bottom: 1px solid var(--home-line-2); }
.site .hrows a { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--home-sp-16); row-gap: var(--home-sp-4); align-items: center; min-height: 44px; padding: var(--home-sp-16) 0; color: var(--home-text); text-decoration: none; }
.site .hrows a:hover { color: var(--home-text); text-decoration: none; }
.site .hrows a:hover .hrows__tx { text-decoration: underline; text-underline-offset: 3px; }
.hrows__t { grid-column: 1; display: flex; align-items: center; gap: var(--home-sp-8); font-size: var(--home-fs-17); font-weight: 600; line-height: 1.35; color: var(--home-ink); }
.hrows__scr { flex: none; color: var(--home-muted); }
.hrows__d { grid-column: 1; font-size: var(--home-fs-15); line-height: 1.45; color: var(--home-text); }
.hrows__go { grid-column: 2; grid-row: 1 / span 2; font-size: var(--home-fs-18); line-height: 1; color: var(--home-muted); }
.hrows li:not(:has(.hrows__d)) .hrows__go { grid-row: 1; }
.hsec .hrows { margin-top: var(--home-sp-8); }
mark { padding: 0; border-radius: var(--home-r-3); background: var(--home-cell-sel-bg); color: var(--home-cell-sel-text); }

/* Поиск */
.hsearch { max-width: 640px; margin-top: var(--home-sp-28); }
.hsearch__l { display: block; margin-bottom: var(--home-sp-8); font-size: var(--home-fs-15); font-weight: 600; line-height: 1.35; color: var(--home-ink); }
.hsearch__i { display: block; width: 100%; height: 52px; box-sizing: border-box; padding: 0 var(--home-sp-16); border: 1px solid var(--home-control-line); border-radius: var(--home-r-12);
  background: var(--home-surface); color: var(--home-ink); font-family: var(--font); font-size: var(--home-fs-16); -webkit-appearance: none; appearance: none; }
.hsearch__i:hover { border-color: var(--home-muted); }
.hsearch__i:focus-visible { outline: 2px solid var(--home-link); outline-offset: 2px; border-color: var(--home-link); }
.hsearch__empty { margin: var(--home-sp-12) 0 0; font-size: var(--home-fs-16); line-height: 1.5; color: var(--home-text); }
.hsearch__empty a { text-decoration: underline; text-underline-offset: 2px; }

/* «Путь по продукту» */
.hpath { margin-top: var(--home-sp-40); }
.hpath__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--home-sp-4) var(--home-sp-16); margin-bottom: var(--home-sp-8); }
.hpath h2 { margin: 0; font-family: var(--font); font-size: var(--home-fs-22); font-weight: 700; line-height: 1.3; letter-spacing: -.01em; color: var(--home-ink); }
.hpath__cnt { margin: 0; font-size: var(--home-fs-15); line-height: 1.4; color: var(--home-muted); }
.hpath__l { margin: 0; padding: 0; list-style: none; }
.hpath__l > li { border-top: 1px solid var(--home-line-2); }
.hpath__l > li:last-child { border-bottom: 1px solid var(--home-line-2); }
.site .hpath__l a { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto auto; column-gap: var(--home-sp-16); align-items: center; min-height: 56px; padding: var(--home-sp-12) 0; color: var(--home-ink); text-decoration: none; }
.site .hpath__l a:hover .hpath__t { text-decoration: underline; text-underline-offset: 3px; }
.hpath__i { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid var(--home-control-line); border-radius: 50%; font-size: var(--home-fs-14); font-weight: 600; line-height: 1; font-variant-numeric: tabular-nums; color: var(--home-ink); }
.hpath__i { grid-column: 1; }
.hpath__t { grid-column: 2; font-size: var(--home-fs-17); font-weight: 600; line-height: 1.35; }
.hpath__ok { grid-column: 3; display: inline-flex; align-items: center; color: var(--home-ok); }
.hpath__l .hrows__go { grid-column: 4; grid-row: 1; }

/* Статья: «Где в кабинете» и «Открыть этот экран в демо» */
.where { display: flex; flex-wrap: wrap; align-items: center; gap: var(--home-sp-12) var(--home-sp-16); margin-top: var(--home-sp-12); }
.where__p { margin: 0; font-size: var(--home-fs-14); line-height: 1.4; color: var(--home-muted); }

/* Статья: колонка текста и оглавление */
.art { margin-top: var(--home-sp-20); }
.art__main { min-width: 0; max-width: 68ch; }
.art .doc { margin-top: 0; }
.toc--fold + .doc { margin-top: var(--home-sp-20); }
.toc--rail { display: none; }
.toc--fold { border: 1px solid var(--home-line-2); border-radius: var(--home-r-12); }
.toc--fold summary { display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: var(--home-sp-10) var(--home-sp-16); list-style: none; cursor: pointer; font-size: var(--home-fs-16); font-weight: 600; color: var(--home-ink); }
.toc--fold summary::-webkit-details-marker { display: none; }
.toc--fold summary::after { content: "+"; font-size: var(--home-fs-22); font-weight: 400; line-height: 1; color: var(--home-muted); }
.toc--fold[open] summary::after { content: "−"; }
.toc--fold .toc__l { padding: 0 var(--home-sp-8) var(--home-sp-12); }
.toc__h { margin: 0 0 var(--home-sp-8); padding-left: var(--home-sp-12); font-size: var(--home-fs-14); font-weight: 600; line-height: 1.4; color: var(--home-muted); }
.toc__l { display: grid; gap: var(--home-sp-2); margin: 0; padding: 0; list-style: none; }
.site .toc__l a { display: block; min-height: 36px; padding: var(--home-sp-8) var(--home-sp-12); border-left: 2px solid transparent; font-size: var(--home-fs-15); line-height: 1.35; color: var(--home-text); text-decoration: none; }
.site .toc__l a:hover { color: var(--home-ink); background: var(--home-control); }
.site .toc__l a.is-active { border-left-color: var(--home-ink); background: var(--home-control); color: var(--home-ink); }

/* Шаги (hsteps: .steps и .step заняты блоками лендинга): номер в круге 28 px, заголовок, текст */
.doc .hsteps { display: grid; gap: var(--home-sp-20); margin: 0 0 var(--home-sp-20); padding: 0; list-style: none; }
.hstep { display: grid; grid-template-columns: 28px minmax(0, 1fr); column-gap: var(--home-sp-16); align-items: start; }
.hstep__n { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--home-ink); color: var(--home-surface); font-size: var(--home-fs-14); font-weight: 600; line-height: 1; font-variant-numeric: tabular-nums; }
.doc .hstep__t { margin: 0 0 var(--home-sp-4); font-size: var(--home-fs-16); font-weight: 600; line-height: 28px; color: var(--home-ink); }
.doc .hstep__b p:not(.hstep__t) { margin: 0 0 var(--home-sp-8); }
.doc .hstep__b p:last-child { margin-bottom: 0; }

/* Термины словаря: пунктир, подсказка по наведению, фокусу и нажатию */
.gl { position: relative; }
.gl__t { text-decoration: underline dotted; text-decoration-color: var(--home-muted); text-decoration-thickness: 1px; text-underline-offset: 4px; cursor: help; }
.gl__t:focus-visible { outline: 2px solid var(--home-ink); outline-offset: 2px; border-radius: var(--home-r-3); }
.gl__tip { position: absolute; left: 0; top: calc(100% + var(--home-sp-6)); z-index: 5; display: none; width: min(280px, calc(100vw - 32px)); box-sizing: border-box; padding: var(--home-sp-12) var(--home-sp-14);
  border: 1px solid var(--home-control-line); border-radius: var(--home-r-10); background: var(--home-surface); color: var(--home-text); font-size: var(--home-fs-14); font-weight: 400; font-style: normal; line-height: 1.45; letter-spacing: 0; text-align: left; white-space: normal; }
.gl__tip::before { content: ""; position: absolute; left: 0; right: 0; top: calc(-1 * var(--home-sp-8)); height: var(--home-sp-8); }
/* display, а не visibility: скрытая подсказка не должна расширять страницу вбок (check:landing меряет scrollWidth).
   aria-describedby читает текст и из скрытого элемента. */
.gl:hover .gl__tip, .gl:focus-within .gl__tip, .gl.is-open .gl__tip { display: block; }
.gl.is-off .gl__tip { display: none; }
.doc .gl__tip a { white-space: nowrap; }

/* Конец статьи */
.fb { margin-top: var(--home-sp-40); padding-top: var(--home-sp-24); border-top: 1px solid var(--home-line-2); }
.fb__q { margin: 0 0 var(--home-sp-12); font-size: var(--home-fs-18); font-weight: 600; line-height: 1.35; color: var(--home-ink); }
.fb__btns { display: flex; flex-wrap: wrap; gap: var(--home-sp-12); }
.fb__thanks, .fb__more { margin: 0; font-size: var(--home-fs-16); line-height: 1.5; color: var(--home-text); }
.fb__thanks { font-weight: 600; color: var(--home-ink); }
.fb__thanks:focus { outline: none; }
.fb__more { margin-top: var(--home-sp-4); }
.fb__more a { text-decoration: underline; text-underline-offset: 2px; }
.pnext { margin: var(--home-sp-24) 0 0; }
.pnext .btn { height: auto; min-height: 56px; max-width: 100%; padding-top: var(--home-sp-12); padding-bottom: var(--home-sp-12); white-space: normal; text-align: left; }

@media (min-width: 1024px) {
  .art--rail { display: grid; grid-template-columns: 240px minmax(0, 68ch); column-gap: var(--home-sp-48); align-items: start; }
  .art--rail .toc--rail { display: block; position: sticky; top: calc(var(--topbar-h) + var(--home-sp-24)); max-height: calc(100vh - var(--topbar-h) - var(--home-sp-48)); overflow-y: auto; }
  .art--rail .toc--fold { display: none; }
}
