/* Internal pages only. The shared layout owns the header, footer and skip link.
   Empty URL fallbacks use sibling selectors, with no JavaScript dependency. */
.page-document {
  box-sizing: border-box;
  width: min(760px, calc(100% - 112px));
  /* ЛЕВЫЙ КРАЙ КОЛОНКИ СОВПАДАЕТ С ЛЕВЫМ КРАЕМ ШАПКИ И ПОДВАЛА.
     Замер 10 сентября 2026: шапка везде начиналась с 56 точек, содержимое
     главной — тоже с 56, а колонка текста на «Установке» и правовых была
     отцентрована и начиналась с 333. При переходе между страницами текст
     прыгал вбок почти на 280 точек. Отступ повторяет поле .shell: 56 точек,
     а на широком экране — половину остатка сверх 1440, чтобы колонка шла
     ровно под логотипом и на любой ширине. */
  margin-inline: max(56px, calc((100% - 1440px) / 2)) auto;
  padding-block: 96px 72px;
  color: var(--foreground, #f3f4f7);
  font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

.page-document *,
.page-document *::before,
.page-document *::after {
  box-sizing: border-box;
}

.page-document h1 {
  margin: 0 0 20px;
  color: #f6f7fa;
  font-size: clamp(28px, 2.4vw, 38px);
  font-weight: 570;
  letter-spacing: -.038em;
  line-height: 1.14;
  text-wrap: balance;
}

.page-document h2 {
  margin: 44px 0 14px;
  color: #f6f7fa;
  font-size: 21px;
  font-weight: 570;
  letter-spacing: -.025em;
  line-height: 1.3;
  text-wrap: balance;
}

.page-document p { margin: 0 0 16px; }
.page-document p:last-child { margin-bottom: 0; }
.page-document .page-eyebrow {
  margin-bottom: 16px;
  color: var(--dim, #969ba6);
  font-size: 12px;
  font-weight: 550;
  letter-spacing: .14em;
  line-height: 1.5;
  text-transform: uppercase;
}

.page-document .page-lead,
.page-document__header > p:not(.page-eyebrow) {
  margin-top: 14px;
  color: var(--muted, #aaaeb7);
  font-size: 17px;
  line-height: 1.6;
}

.page-document .page-note,
.page-document .muted {
  color: var(--dim, #969ba6);
  font-size: 13px;
  line-height: 1.75;
}

.page-document .page-verification {
  color: var(--muted, #aaaeb7);
}

.page-document a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  max-width: 100%;
  color: #70afff;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
  transition: color 160ms ease;
}

.page-document a:hover { color: #a1caff; }
.page-document a:focus-visible {
  outline: 2px solid #83b7ff;
  outline-offset: 7px;
}

.page-document ::selection { color: #fff; background: #245fb6; }
.page-document [id] { scroll-margin-top: 100px; }

.page-document .page-action {
  display: inline-grid;
  grid-template-columns: minmax(0, 1fr) 35px;
  gap: 13px;
  min-height: 56px;
  margin-top: 13px;
  padding: 0 13px 0 22px;
  border: 1px solid rgba(90, 146, 255, .38);
  border-radius: 7px;
  background: linear-gradient(145deg, #0950ef, #0643d3);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14);
  color: #f3f4f7;
  font-size: 16px;
  font-weight: 450;
  letter-spacing: -.016em;
  line-height: 1.5;
  text-decoration: none;
  transition: transform 160ms ease, filter 160ms ease;
}

.page-document .page-action:hover {
  color: #fff;
  filter: brightness(1.08);
  transform: translateY(-1px);
}

.page-action__arrow {
  display: grid;
  place-items: center;
  width: 35px;
  height: 35px;
  border-left: 1px solid rgba(255, 255, 255, .24);
}

.page-download,
.page-contact { margin-top: 22px; }
.page-download__fallback > .page-note { margin-bottom: 0; }

.page-document .page-download__link[href=""],
.page-document .page-contact__link[href=""],
.page-download__link:not([href=""]) + .page-download__fallback,
.page-contact__link:not([href=""]) + .page-contact__fallback {
  display: none;
}

.page-toc {
  display: flex;
  flex-wrap: wrap;
  gap: 0 22px;
  margin-block: 44px 0;
  padding-block: 13px;
  border-block: 1px solid var(--line, rgba(255, 255, 255, .13));
  font-size: 14px;
  line-height: 1.6;
}

.page-toc--legal { display: grid; gap: 0; }
.page-section,
.page-legal-section { margin-top: 44px; }
.page-section > h2:first-child,
.page-legal-section > h2:first-child { margin-top: 0; }

.page-rows { margin: 0 0 22px; }
.page-rows > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: 22px;
  padding-block: 22px;
  border-bottom: 1px solid var(--line, rgba(255, 255, 255, .13));
}
.page-rows dt { display: flex; align-items: center; gap: 10px; color: var(--muted, #aaaeb7); }
/* Значок системы — тот же, что в списке платформ на главной. Он тут не
   украшение: человек выбирает сборку под свой компьютер, и знак помогает
   узнать её быстрее, чем слово. */
.page-znak { flex: none; }
.page-rows dd { margin: 0; }

.page-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0 22px;
  margin-top: 22px;
}

.page-document-list { margin: 0; padding: 0; list-style: none; }
.page-document-list > li {
  padding-block: 22px;
  border-bottom: 1px solid var(--line, rgba(255, 255, 255, .13));
}
.page-document-list p { color: var(--muted, #aaaeb7); }
.page-document--error { min-height: calc(100svh - 115px); }

@media (max-width: 1100px) {
  .page-document { width: min(760px, calc(100% - 72px)); margin-inline: 36px auto; }
}

@media (max-width: 700px) {
  .page-document { width: calc(100% - 40px); margin-inline: 20px auto; }
  .page-document [id] { scroll-margin-top: 26px; }
  .page-rows > div { grid-template-columns: 1fr; gap: 7px; }
  .page-toc { display: grid; gap: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .page-document *,
  .page-document *::before,
  .page-document *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
  .page-document .page-action:hover { transform: none; }
}

/* ── Тарифы ────────────────────────────────────────────────────────────────
   СЕТКА ТАРИФОВ — ТА ЖЕ, ЧТО В КАБИНЕТЕ, ДО ЗНАКА.
   Правила .lk-* ниже обязаны совпадать с app/src/app/globals.css: их сверяет
   app/tests/vitrina-na-saite.test.mjs. Владелец 15 сентября 2026 увидел две
   разные страницы тарифов у одного дела — узкую колонку на сайте против
   широкой сетки в кабинете — и спросил, зачем. Правильный ответ: незачем.
   Отличия сайта от кабинета — только те, что ниже под заголовком «контекст». */
.page-document--kabinet { width: min(1440px, calc(100% - 112px)); }

.lk-sroki { display: flex; flex-wrap: wrap; gap: 0 22px; margin-bottom: 22px; border-bottom: 1px solid var(--line); }
.lk-srok {
  min-height: 44px; padding: 9px 0 11px; margin-bottom: -1px; border: 0; border-bottom: 1px solid transparent; border-radius: 7px;
  background: none; color: var(--muted); font-size: 15px; font-weight: 450; line-height: 1.5; cursor: pointer;
}
.lk-srok i { color: var(--dim); font-style: normal; font-size: 13px; }
.lk-srok:hover:not(:disabled) { color: #fff; border-bottom-color: transparent; }
.lk-srok--tekushchiy:hover:not(:disabled) { border-bottom-color: var(--accent); }
.lk-srok--tekushchiy { color: #F6F7FA; border-bottom-color: var(--accent); }

.lk-tarify { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 0; border-top: 1px solid var(--line); }
.lk-tarif { padding: 22px 26px 26px 0; border-bottom: 1px solid var(--line); min-width: 0; }
.lk-tarif + .lk-tarif { padding-left: 26px; border-left: 1px solid var(--line); }
.lk-tarif--tekushchiy { background: rgba(43, 123, 246, .05); }
.lk-tarif__imya { color: #F6F7FA; font-size: 19px; font-weight: 570; letter-spacing: -.022em; }
.lk-tarif__profiley { margin-top: 2px; color: var(--muted); font-size: 14px; }
.lk-tarif__cena { margin-top: 9px; color: #F6F7FA; font-size: 28px; font-weight: 570; letter-spacing: -.03em; }
.lk-tarif__cena i { color: var(--dim); font-size: 14px; font-style: normal; font-weight: 400; letter-spacing: 0; }
.lk-melko { margin: 7px 0 0; color: var(--dim); font-size: 13px; line-height: 1.6; }
.lk-knopka {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 16px;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: none;
  color: #70AFFF;
  font-size: 15px;
  font-weight: 450;
  line-height: 1.5;
  text-decoration: none;
  cursor: pointer;
}
.lk-knopka:hover:not(:disabled) { color: #A1CAFF; }

/* Контекст сайта: то, что в кабинете задано окружением, а здесь — явно.
   Тело кабинета набрано --font с межстрочным 1.65, документ сайта — иным
   порядком шрифтов и 1.7; срок и сноска зажаты в 900 точек, как в кабинете;
   ссылка-кнопка не наследует подчёркивание обычной ссылки документа;
   заголовок стоит на той же высоте, что в кабинете (там над ним меню
   разделов, здесь — воздух). */
.page-document--kabinet { padding-top: 32px; font-family: var(--font); line-height: 1.65; }
.page-document--kabinet .page-document__header > p { max-width: 760px; margin: 0 0 16px; font-size: 16px; line-height: 1.7; }
.tarify .lk-sroki, .tarify > .lk-melko { max-width: 900px; }
.page-document .lk-knopka { text-decoration: none; }
.page-document .lk-knopka:focus-visible, .page-document .lk-srok:focus-visible { border-radius: 7px; }

@media (max-width: 1100px) { .page-document--kabinet { width: min(1440px, calc(100% - 72px)); } }
@media (max-width: 700px) {
  .page-document--kabinet { width: calc(100% - 40px); }
  .lk-tarif { padding: 20px 0; }
  .lk-tarif + .lk-tarif { padding-left: 0; border-left: 0; }
}