/*
  Доступно - стили сайта.
  Светлая тема по умолчанию, тёмная по prefers-color-scheme и по [data-theme="dark"].
  Шрифт без засечек везде, включая заголовки (700): PT Sans, самостоятельный
  хостинг (лицензия OFL в assets/fonts/OFL.txt), внешних запросов к шрифтовым
  CDN сайт не делает. Запасной стек - системные шрифты без засечек.
*/

/* ---------- Шрифты (самостоятельный хостинг, лицензия OFL в assets/fonts/OFL.txt) ---------- */

@font-face {
  font-family: "PT Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/pt-sans-cyrillic-400-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "PT Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/pt-sans-latin-400-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122;
}
@font-face {
  font-family: "PT Sans";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/pt-sans-cyrillic-400-italic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "PT Sans";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/pt-sans-latin-400-italic.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122;
}
@font-face {
  font-family: "PT Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/pt-sans-cyrillic-700-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "PT Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/pt-sans-latin-700-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122;
}

/* ---------- Токены темы ---------- */
:root {
  --font-sans: "PT Sans", -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Точные цвета сайта инициативы */
  --color-bg: #f2f5fa;
  --color-surface: #ffffff;
  --color-surface-muted: #eaf0f8;
  --color-text: #0e1726;
  --color-text-muted: #3b4658;
  --color-border: #d5deea;
  --color-border-strong: #6e85a8;
  /* --color-accent (#1F6FEB, точный акцент инициативы) - для кнопок с белым
     текстом и рамок/фокуса, 4.63:1 на белом - недостаточно надёжно для мелкого
     текста ссылок. Для текста ссылок отдельный затемнённый --color-accent-strong. */
  --color-accent: #1f6feb;
  --color-accent-strong: #1550a0;
  --color-accent-bright: #1f6feb;
  --color-accent-tint: #e3ecfb;
  --color-focus: #b34700;
  --color-navy: #0b2a4a;
  --color-navy-2: #133a63;
  --color-on-navy-text: #ffffff;
  --color-on-navy-muted: #c7d6ea;
  --color-on-navy-accent: #a9d2ff;
  --color-proposal-bg: #fbead0;
  --color-proposal-text: #5c3a00;
  --color-proposal-border: #b37b1f;
  --color-danger-text: #7a1f1f;
  --color-danger-bg: #f8e6e6;
  --shadow-card: 0 1px 2px rgba(14, 23, 38, 0.08), 0 1px 1px rgba(14, 23, 38, 0.05);
  --radius-s: 6px;
  --radius-m: 10px;
  --max-text-width: 68ch;
  --header-height: 64px;
  --text-scale: 1;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: #0a1420;
    --color-surface: #101e30;
    --color-surface-muted: #16273e;
    --color-text: #eaf1fa;
    --color-text-muted: #a9bbd3;
    --color-border: #22344a;
    --color-border-strong: #4a6488;
    --color-accent: #6fa8ff;
    --color-accent-strong: #6fa8ff;
    --color-accent-bright: #4c8dff;
    --color-accent-tint: #16273e;
    --color-focus: #f0a365;
    --color-navy: #0a1420;
    --color-navy-2: #101e30;
    --color-on-navy-text: #eaf1fa;
    --color-on-navy-muted: #a9bbd3;
    --color-on-navy-accent: #6fa8ff;
    --color-proposal-bg: #2e2410;
    --color-proposal-text: #f0c989;
    --color-proposal-border: #a97a34;
    --color-danger-text: #f0b3b3;
    --color-danger-bg: #35201f;
    --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.3);
  }
}

:root[data-theme="dark"] {
  --color-bg: #0a1420;
  --color-surface: #101e30;
  --color-surface-muted: #16273e;
  --color-text: #eaf1fa;
  --color-text-muted: #a9bbd3;
  --color-border: #22344a;
  --color-border-strong: #4a6488;
  --color-accent: #6fa8ff;
  --color-accent-strong: #6fa8ff;
  --color-accent-bright: #4c8dff;
  --color-accent-tint: #16273e;
  --color-focus: #f0a365;
  --color-navy: #0a1420;
  --color-navy-2: #101e30;
  --color-on-navy-text: #eaf1fa;
  --color-on-navy-muted: #a9bbd3;
  --color-on-navy-accent: #6fa8ff;
  --color-proposal-bg: #2e2410;
  --color-proposal-text: #f0c989;
  --color-proposal-border: #a97a34;
  --color-danger-text: #f0b3b3;
  --color-danger-bg: #35201f;
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.3);
}

/* ---------- Спокойный режим: приглушённая, но контрастная палитра ---------- */

:root[data-calm="on"] {
  --color-accent: #3d5a78;
  --color-accent-strong: #3d5a78;
  --color-accent-bright: #5a7290;
  --color-accent-tint: #e7ecf1;
  --color-navy: #33475c;
  --color-navy-2: #3d5468;
  /* Приглушённый navy светлее обычного, поэтому текст на нём остаётся белым,
     а не приглушённо-голубым - иначе контраст к карточке падает ниже 7:1. */
  --color-on-navy-muted: #ffffff;
  --color-on-navy-accent: #ffffff;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"])[data-calm="on"] {
    --color-accent: #b7c4d6;
    --color-accent-strong: #b7c4d6;
    --color-accent-bright: #9db0c9;
    --color-accent-tint: #1c2a3a;
    --color-on-navy-muted: #ffffff;
    --color-on-navy-accent: #ffffff;
  }
}
:root[data-theme="dark"][data-calm="on"] {
  --color-accent: #b7c4d6;
  --color-accent-strong: #b7c4d6;
  --color-accent-bright: #9db0c9;
  --color-accent-tint: #1c2a3a;
  --color-on-navy-muted: #ffffff;
  --color-on-navy-accent: #ffffff;
}

/* ---------- Базовый сброс ---------- */
* {
  box-sizing: border-box;
}

html {
  color-scheme: light dark;
  font-size: 100%;
}

/* Размер текста настроек чтения масштабирует корень: rem-величины (заголовки,
   отступы) растут вместе с базовым текстом, а не только числа на глаз. */
html[data-text-size="large"] { font-size: 125%; }
html[data-text-size="xlarge"] { font-size: 150%; }

body {
  margin: 0;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: 1.125rem;
  line-height: 1.6;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  /* Защита от переполнения на узких экранах при увеличенном тексте: длинное
     неразрывное слово переносится, а не раздвигает страницу по горизонтали. */
  overflow-wrap: anywhere;
}

/* Грид-ячейки по умолчанию не сжимаются меньше min-content: явно разрешаем. */
.offer-item, .doc-card, .demo-card, .fact-grid li, .principle-list > div, .status-list li {
  min-width: 0;
}

/* Интервалы (критерий 1.4.12): межстрочный 1.5+, между абзацами 2em,
   межбуквенный 0.12em, межсловный 0.16em. */
html[data-spacing="wide"] body {
  line-height: 1.7;
  letter-spacing: 0.12em;
  word-spacing: 0.16em;
}
html[data-spacing="wide"] p,
html[data-spacing="wide"] li,
html[data-spacing="wide"] dd {
  margin-bottom: 2em;
}

img {
  max-width: 100%;
}

main {
  display: block;
}

h1, h2, h3, h4 {
  font-family: var(--font-sans);
  line-height: 1.25;
  font-weight: 700;
  color: var(--color-text);
}

h1 { font-size: clamp(1.9rem, 1.5rem + 1.6vw, 2.75rem); margin: 0 0 0.6em; }
h2 { font-size: clamp(1.4rem, 1.2rem + 0.8vw, 1.85rem); margin: 1.8em 0 0.6em; }
h3 { font-size: 1.3rem; margin: 1.5em 0 0.5em; }
h4 { font-size: 1.1rem; margin: 1.3em 0 0.4em; }

p, ul, ol, dl, table, pre, blockquote {
  max-width: var(--max-text-width);
}

.doc-content > table,
.doc-content > .table-scroll {
  max-width: 100%;
}

p { margin: 0 0 1.1em; }

a {
  color: var(--color-accent-strong);
  text-decoration-thickness: from-font;
  text-underline-offset: 0.15em;
}

a:hover { text-decoration-thickness: 2px; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 2px;
  border-radius: 2px;
}

button {
  font-family: inherit;
  font-size: 1rem;
  color: inherit;
}

ul, ol {
  padding-left: 1.4em;
}

li { margin-bottom: 0.4em; }

code, pre {
  font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 0.92em;
}

pre {
  background: var(--color-surface-muted);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-s);
  padding: 1em 1.1em;
  overflow-x: auto;
  line-height: 1.5;
}

code {
  background: var(--color-surface-muted);
  padding: 0.1em 0.35em;
  border-radius: 4px;
}

pre code {
  background: none;
  padding: 0;
  border-radius: 0;
}

hr {
  border: none;
  border-top: 1px solid var(--color-border);
  margin: 2.5em 0;
}

blockquote {
  margin: 1.2em 0;
  padding: 0.2em 1.2em;
  border-left: 3px solid var(--color-border-strong);
  color: var(--color-text-muted);
}

/* ---------- Служебные ---------- */

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: absolute;
  left: 1em;
  top: -3.5em;
  background: var(--color-text);
  color: var(--color-bg);
  padding: 0.7em 1.1em;
  border-radius: var(--radius-s);
  z-index: 1000;
  /* Без анимации: при уходе фокуса ссылка 150 мс перекрывала логотип, и фокус
     на нём не был виден (сигналы focus-hidden в отчёте версии 2). */
  font-weight: 700;
}

.skip-link:focus {
  top: 0.8em;
}

@media (prefers-reduced-motion: reduce) {
  * { transition-duration: 0.001ms !important; animation-duration: 0.001ms !important; }
}

/* scroll-behavior: smooth на html сознательно не используется (было убрано
   14.09.2026): оно действует на ЛЮБУЮ прокрутку в пределах документа, включая
   служебную прокрутку браузера к элементу, получившему фокус по Tab. Пока
   анимация идёт (несколько сотен мс на длинной странице), элемент в фокусе
   физически смещён из точки, для которой посчитан scroll-padding-top, и
   оказывается частично под липкой шапкой - раскрывающиеся заголовки
   протоколов (2. Протоколы) ловили это как 2.4.11 при обычной скорости Tab.
   Мгновенная прокрутка убирает окно гонки: позиция после фокуса сразу
   соответствует scroll-padding-top/scroll-margin-top. */

.external-icon {
  display: inline-block;
  width: 0.85em;
  height: 0.85em;
  margin-left: 0.2em;
  vertical-align: -0.05em;
}

/* ---------- Декоративная трёхцветная полоска над шапкой ----------
   Три равных сегмента (красный/синий/зелёный), чисто декоративная,
   aria-hidden, не несёт информации. В спокойном режиме приглушается
   фильтром насыщенности, в режиме принудительных цветов скрыта
   (см. @media (forced-colors: active) ниже). */

.brand-stripe {
  display: flex;
  height: 5px;
}

.brand-stripe span {
  flex: 1 1 0;
}

.brand-stripe span:nth-child(1) { background: #e53935; }
.brand-stripe span:nth-child(2) { background: #1f6feb; }
.brand-stripe span:nth-child(3) { background: #2fa84f; }

html[data-calm="on"] .brand-stripe {
  filter: saturate(0.35) brightness(1.05);
}

/* ---------- Шапка сайта ---------- */

.site-header {
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface);
  position: sticky;
  top: 0;
  z-index: 50;
}

.header-inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0.75em 1.25em;
  display: flex;
  align-items: center;
  gap: 1em;
  flex-wrap: wrap;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 0.55em;
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: 1.3rem;
  color: var(--color-text);
  text-decoration: none;
  margin-right: auto;
}

.brand:hover { text-decoration: underline; }

.brand-mark {
  width: 34px;
  height: 34px;
  flex-shrink: 0;
}

.nav-toggle {
  display: none;
  background: var(--color-surface-muted);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-s);
  padding: 0.5em 0.9em;
  min-height: 44px;
  cursor: pointer;
}

.site-nav ul {
  list-style: none;
  max-width: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.3em 1.3em;
  margin: 0;
  padding: 0;
}

.site-nav a {
  display: inline-flex;
  align-items: center;
  color: var(--color-text);
  text-decoration: none;
  font-weight: 700;
  font-size: 1rem;
  min-height: 44px;
  padding: 0.2em 0.3em;
  border-bottom: 2px solid transparent;
}

.site-nav a:hover,
.site-nav a[aria-current="page"] {
  border-bottom-color: var(--color-accent);
}

.tool-btn .icon { width: 1.1em; height: 1.1em; }

/* ---------- Раскрывающиеся группы меню («Методики», «Демонстрации») ----------
   Шаблон «кнопка раскрытия + ссылки», не ARIA-меню. Панели скрыты в
   разметке (hidden); без скрипта их показывает стиль в <noscript>. */

.header-inner { position: relative; }

.nav-group-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3em;
  min-height: 44px;
  padding: 0.2em 0.3em;
  font: inherit;
  font-weight: 700;
  font-size: 1rem;
  color: var(--color-text);
  background: none;
  border: 0;
  border-bottom: 2px solid transparent;
  cursor: pointer;
}

.nav-group-btn:hover,
.nav-group.is-current > .nav-group-btn,
.nav-group-btn[aria-expanded="true"] {
  border-bottom-color: var(--color-accent);
}

.nav-chevron { transition: transform 0.15s ease; }
.nav-group-btn[aria-expanded="true"] .nav-chevron { transform: rotate(180deg); }

@media (prefers-reduced-motion: reduce) {
  .nav-chevron { transition: none; }
}

.nav-dropdown[hidden] { display: none; }

.nav-dropdown-heading {
  margin: 0 0 0.3em;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.nav-dropdown-subhead {
  margin: 0.9em 0 0.3em;
  padding-top: 0.7em;
  border-top: 1px solid var(--color-border);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--color-text-muted);
}

.site-nav .nav-dropdown ul {
  display: block;
  padding: 0;
  margin: 0;
}

/* Пункт панели - прямоугольный блок: наведение и текущая страница видны
   рамкой вокруг всего блока, а линии связи выходят из края рамки
   (владелец, 24.09.2026). Текущая страница - тонкая синяя рамка, заливка
   и полужирный текст; фокус с клавиатуры остаётся толстой оранжевой
   обводкой с отступом, поэтому их не спутать. */
.site-nav .nav-dropdown ul li + li { margin-top: 0.25em; }

.site-nav .nav-dropdown a {
  display: flex;
  align-items: center;
  font-weight: 400;
  min-height: 44px;
  padding: 0.3em 0.6em;
  border: 1px solid transparent;
  border-radius: var(--radius-s);
  text-decoration: none;
}

.site-nav .nav-dropdown a:hover,
.nav-dropdown.is-linking a[data-nav-link="source"] {
  /* --color-text-muted: не ниже 3:1 к фону панели в обеих темах (1.4.11) */
  border-color: var(--color-text-muted);
  background: var(--color-accent-tint);
}

/* Родитель текущей страницы: методология, к которой относится открытый
   протокол. Пунктир = «родитель», сплошная рамка = «вы здесь». */
.site-nav .nav-dropdown a.is-ancestor {
  border: 1px dashed var(--color-accent);
}

.site-nav .nav-dropdown a[aria-current="page"] {
  font-weight: 700;
  border-color: var(--color-accent);
  background: var(--color-accent-tint);
}

/* Линии связи «методология оценки -> протоколы» в панели «Методики».
   Декоративные: связь для программ экранного доступа передана текстом
   в заголовке колонки. Рисуются скриптом только на широкой панели. */
.nav-links-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: visible;
}
.nav-links-svg path {
  fill: none;
  stroke: var(--color-accent);
  stroke-width: 1.25;
  stroke-dasharray: 4 4;
  opacity: 0.45;
  transition: opacity 0.15s ease;
}
.nav-links-svg circle { fill: var(--color-accent); opacity: 0.6; }
.nav-dropdown.is-linking .nav-links-svg path { opacity: 0.95; stroke-dasharray: none; }
.nav-links-svg path.is-current { opacity: 0.95; stroke-dasharray: none; stroke-width: 1.6; }
.site-nav .nav-dropdown a[data-nav-link="source"] .nav-link-text,
.site-nav .nav-dropdown a[data-nav-link="target"] .nav-link-text { position: relative; }
@media (prefers-reduced-motion: reduce) {
  .nav-links-svg path { transition: none; }
}
@media (forced-colors: active) {
  .nav-links-svg path { stroke: CanvasText; }
  .nav-links-svg circle { fill: CanvasText; }
}

@media (min-width: 768px) {
  .nav-dropdown {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: min(880px, calc(100vw - 2rem));
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1em 2em;
    padding: 1.1em 1.5em 1.2em;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0 0 var(--radius-m) var(--radius-m);
    box-shadow: 0 12px 28px rgba(14, 23, 38, 0.14);
    z-index: 60;
  }
  .nav-dropdown--demo { width: min(360px, calc(100vw - 2rem)); grid-template-columns: 1fr; }
}

@media (max-width: 767px) {
  .nav-group-btn { width: 100%; justify-content: space-between; padding: 0.6em 0.2em; }
  .nav-dropdown { padding: 0.2em 0 0.6em 0.9em; border-left: 2px solid var(--color-border); margin-left: 0.2em; }
  .nav-dropdown-col + .nav-dropdown-col { margin-top: 0.6em; }
}


/* ---------- Шапка: до 768px - лого + гамбургер + компактные иконки ---------- */

@media (max-width: 767px) {
  :root { --header-height: 64px; }
  .nav-toggle { display: inline-flex; align-items: center; gap: 0.4em; }
  .site-nav {
    flex-basis: 100%;
    order: 3;
  }
  .site-nav[hidden] { display: none; }
  .site-nav ul { flex-direction: column; gap: 0; padding: 0.5em 0; }
  .site-nav a { display: block; padding: 0.6em 0.2em; }

  /* Кнопки поиска и настроек становятся компактными иконками рядом с «Меню» */
  .tool-btn {
    padding: 0.6em;
    min-width: 44px;
    justify-content: center;
    flex-shrink: 0;
  }
  .tool-btn [data-tool-label] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
}

@media (max-width: 499px) {
  /* На узких экранах текст названия сайта уходит в доступное имя, чтобы «Меню»
     и обе кнопки-иконки (поиск, настройки) поместились в одну строку с логотипом. */
  .header-inner { gap: 0.5em; }
  .brand span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
}

/* ---------- Шапка: 768-1149px - две строки (лого+кнопки, затем навигация) ----------
   Размер шрифта пунктов навигации нигде не опускается ниже 1rem (16px): если
   восемь пунктов не помещаются в одну строку, шапка становится двухстрочной
   вместо того, чтобы мельчить текст. */

@media (min-width: 768px) and (max-width: 1149px) {
  :root { --header-height: 116px; }
  .header-inner { padding: 0.7em 1.25em 0.5em; }
  .nav-toggle { display: none; }
  .site-nav { order: 3; flex-basis: 100%; }
  .site-nav[hidden] { display: block; }
  .site-nav ul { justify-content: center; padding-top: 0.4em; gap: 0.2em 1em; }
}

/* ---------- Шапка: от 1150px - одна строка, навигация по центру ---------- */

@media (min-width: 1150px) {
  :root { --header-height: 76px; }
  .header-inner {
    max-width: 1600px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    padding: 0.6em 1.5em;
    gap: 1em;
  }
  .brand { grid-column: 1; margin-right: 0; }
  .nav-toggle { display: none; }
  .site-nav {
    grid-column: 2;
    order: initial;
    flex-basis: auto;
    min-width: 0;
  }
  .site-nav[hidden] { display: block; }
  .site-nav ul {
    justify-content: center;
    gap: 0.2em 1em;
  }
  .header-tools { grid-column: 3; gap: 0.5em; }
}

/* ---------- Разметка документа ---------- */

main { scroll-margin-top: 1em; }

/* Липкая шапка не должна перекрывать заголовок, на который перешли по ссылке
   (оглавление документа, результат поиска, якорь критерия в demonstracii.html). */
:target {
  scroll-margin-top: calc(var(--header-height) + 1em);
}

.doc-header {
  max-width: 1180px;
  margin: 0 auto;
  padding: 2.2em 1.25em 1em;
}

.doc-kicker {
  color: var(--color-text-muted);
  font-size: 0.98rem;
  margin: 0 0 0.5em;
}

/* Короткая капсом-подпись над заголовком раздела (не для длинных фраз статуса) */
.kicker {
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-accent-strong);
  margin: 0 0 0.5em;
}

.doc-header h1 { margin-bottom: 0.4em; }

.doc-meta-list {
  list-style: none;
  padding: 0;
  margin: 1em 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.6em 1.6em;
  font-size: 0.98rem;
  color: var(--color-text-muted);
}

.doc-meta-list a { color: var(--color-accent-strong); font-weight: 700; }

.doc-file-pending {
  color: var(--color-text-muted);
  font-style: normal;
}

.doc-layout {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 1.25em 4em;
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 2.5em;
  align-items: start;
}

@media (max-width: 900px) {
  .doc-layout { grid-template-columns: 1fr; }
}

.doc-layout--notoc {
  grid-template-columns: minmax(0, 1fr);
  max-width: 900px;
}

.doc-toc {
  position: sticky;
  top: calc(var(--header-height) + 1em);
  max-height: calc(100vh - var(--header-height) - 2em);
  overflow-y: auto;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  padding: 1.1em 1.2em;
}

@media (max-width: 900px) {
  .doc-toc {
    position: static;
    max-height: none;
  }
}

.doc-toc-heading {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: 1.05rem;
  margin: 0 0 0.6em;
}

.toc-toggle {
  display: none;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 0;
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: 1.05rem;
  cursor: pointer;
  margin-bottom: 0.6em;
}

.toc-toggle .chevron { float: right; transition: transform 0.15s ease; }
.toc-toggle[aria-expanded="false"] .chevron { transform: rotate(-90deg); }

@media (max-width: 900px) {
  .toc-toggle { display: block; }
  .doc-toc-heading { display: none; }
  #toc-list[hidden] { display: none; }
}

#toc-list {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.95rem;
}

#toc-list ol {
  list-style: none;
  padding-left: 1em;
  margin: 0.2em 0 0.4em;
}

#toc-list li { margin-bottom: 0.2em; }

#toc-list a {
  display: block;
  color: var(--color-text-muted);
  text-decoration: none;
  padding: 0.25em 0.5em;
  border-radius: 4px;
  border-left: 3px solid transparent;
}

#toc-list a:hover {
  background: var(--color-surface-muted);
  color: var(--color-text);
}

#toc-list a[aria-current="true"] {
  color: var(--color-accent-strong);
  border-left-color: var(--color-accent);
  background: var(--color-accent-tint);
  font-weight: 700;
}

.doc-content h2:first-of-type { margin-top: 0; }

.doc-content { min-width: 0; }

/* ---------- Плашка «Предложение проекта» ---------- */

.doc-content strong:only-child {}

.proposal-plate {
  background: var(--color-proposal-bg);
  color: var(--color-proposal-text);
  border: 1px solid var(--color-proposal-border);
  border-radius: var(--radius-s);
  padding: 0.2em 0.5em;
  font-weight: 700;
  font-size: 0.92em;
  white-space: normal;
}

p.has-proposal {
  background: var(--color-proposal-bg);
  border: 1px solid var(--color-proposal-border);
  border-radius: var(--radius-m);
  padding: 0.9em 1.1em;
  max-width: none;
}

p.has-proposal .proposal-plate {
  display: inline-block;
  margin: 0 0.5em 0.4em 0;
}

/* ---------- Таблицы ---------- */

.table-scroll {
  overflow-x: auto;
  position: relative; /* абсолютно позиционированные потомки (скрытые подписи ссылок) остаются внутри контейнера и не расширяют документ на 320 px */
  margin: 0 0 1.4em;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-s);
}

table {
  border-collapse: collapse;
  width: 100%;
  font-size: 0.96rem;
}

.table-scroll table { margin: 0; border: none; }

th, td {
  text-align: left;
  padding: 0.65em 0.9em;
  border-bottom: 1px solid var(--color-border);
  vertical-align: top;
}

thead th {
  background: var(--color-surface-muted);
  font-family: var(--font-sans);
  font-weight: 700;
}

tbody tr:last-child td { border-bottom: none; }

/* ---------- Кнопка «наверх» ---------- */

:root {
  /* Резерв места снизу под плавающую кнопку (высота + отступ + запас),
     чтобы прокрутка к элементу в фокусе никогда не прятала его под кнопкой. */
  --btt-reserve: 92px;
}

@media (max-width: 767px) {
  :root { --btt-reserve: 76px; }
}

html {
  scroll-padding-top: calc(var(--header-height) + 1em);
  scroll-padding-bottom: var(--btt-reserve);
}

.back-to-top {
  position: fixed;
  right: 1.2em;
  bottom: 1.2em;
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  background: var(--color-text);
  color: var(--color-bg);
  padding: 0.7em 1.1em;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 700;
  font-size: 0.92rem;
  box-shadow: var(--shadow-card);
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.back-to-top .icon {
  width: 1.1em;
  height: 1.1em;
  flex-shrink: 0;
}

.back-to-top.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

@media (max-width: 767px) {
  /* Компактная кнопка-иконка 44x44, доступное имя остаётся визуально скрытым текстом. */
  .back-to-top {
    right: 0.75em;
    bottom: 0.75em;
    width: 44px;
    height: 44px;
    padding: 0;
    justify-content: center;
    gap: 0;
  }
  .back-to-top [data-back-to-top-label] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  /* Запас снизу у main, чтобы кнопка не перекрывала последние элементы страницы. */
  main { padding-bottom: var(--btt-reserve); }
}

@media print {
  .back-to-top { display: none; }
}

/* ---------- Подвал ---------- */

.site-footer {
  border-top: 1px solid var(--color-border);
  background: var(--color-surface);
  padding: 2.2em 1.25em 3em;
  margin-top: 3em;
}

.footer-inner {
  max-width: 1180px;
  margin: 0 auto;
  color: var(--color-text-muted);
  font-size: 0.95rem;
}

.footer-inner p { margin: 0 0 0.5em; max-width: none; }

/* ============================================================
   Лендинг
   ============================================================ */

.landing-hero {
  max-width: 1180px;
  margin: 2em auto 0;
  padding: 3.2em 2.4em;
  border-radius: 20px;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 3em;
  align-items: center;
}

@media (max-width: 860px) {
  .landing-hero {
    grid-template-columns: minmax(0, 1fr);
    padding: 2.2em 1.4em;
    margin-top: 1.2em;
    border-radius: 14px;
  }
}

.landing-hero .lede {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: clamp(1.5rem, 1.15rem + 1.4vw, 2.15rem);
  line-height: 1.3;
  max-width: 30ch;
  margin: 0 0 0.7em;
}

.landing-hero .sub {
  max-width: 52ch;
  color: var(--color-text-muted);
  font-size: 1.05rem;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
  margin-top: 1.7em;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.8em 1.4em;
  min-height: 44px;
  border-radius: var(--radius-s);
  font-weight: 700;
  text-decoration: none;
  line-height: 1.2;
  border: 2px solid transparent;
}

.btn-primary {
  background: var(--color-accent);
  color: #fff;
}

.btn-primary:hover {
  background: var(--color-accent-strong);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .btn-primary { color: #0a1211; }
}
:root[data-theme="dark"] .btn-primary { color: #0a1211; }

.btn-secondary {
  background: transparent;
  border-color: var(--color-border-strong);
  color: var(--color-text);
}

.btn-secondary:hover {
  border-color: var(--color-accent);
  color: var(--color-accent-strong);
}

.hero-facts {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  padding: 1.8em 1.9em;
}

.hero-facts-heading {
  margin: 0 0 1.2em;
  font-weight: 700;
  color: var(--color-text-muted);
  font-size: 0.95rem;
}

.fact-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1.5em 1.2em;
  max-width: none;
}

.fact-grid li {
  display: flex;
  flex-direction: column;
  gap: 0.25em;
}

.fact-number {
  font-family: var(--font-sans);
  font-size: 2.3rem;
  font-weight: 700;
  color: var(--color-accent-strong);
  line-height: 1;
}

.fact-label {
  color: var(--color-text-muted);
  font-size: 0.92rem;
  max-width: none;
}

.landing-section {
  max-width: 1180px;
  margin: 0 auto;
  padding: 2.6em 1.25em;
  border-top: 1px solid var(--color-border);
}

.landing-section--feature {
  border-top: none;
  border-radius: 20px;
  padding: 2.6em 2.4em;
  margin-top: 1em;
  margin-bottom: 1em;
}

@media (max-width: 860px) {
  .landing-section--feature { padding: 2em 1.4em; border-radius: 14px; }
}

.landing-section--feature .btn-primary {
  margin-top: 0.6em;
}

.landing-section > h2 {
  max-width: 62ch;
}

.landing-section > .section-intro {
  max-width: 62ch;
  color: var(--color-text-muted);
  margin-bottom: 1.6em;
}

/* Список "что предлагается": литерный список а/б/в */

.offer-list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: none;
  display: grid;
  gap: 1.1em;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 860px) {
  .offer-list { grid-template-columns: 1fr; }
}

.offer-item {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  padding: 1.3em 1.4em;
  background: var(--color-surface);
}

.offer-letter {
  font-family: var(--font-sans);
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--color-accent-strong);
  display: block;
  margin-bottom: 0.3em;
}

.offer-item h3 { margin-top: 0; font-size: 1.15rem; }
.offer-item p:last-child { margin-bottom: 0; }
.offer-item p { max-width: 42ch; }

/* Принципы: определения, сетка 2x2 на широком экране */

.principle-list {
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1.6em 2em;
  max-width: none;
}

@media (max-width: 700px) {
  .principle-list { grid-template-columns: 1fr; }
}

.principle-list > div {
  border-left: 3px solid var(--color-accent);
  padding-left: 1.1em;
}

.principle-list dt {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: 1.1rem;
  margin-bottom: 0.25em;
}

.principle-list dd {
  margin: 0;
  color: var(--color-text-muted);
  max-width: 46ch;
}

/* Схема процесса оценки: вертикальная шкала на узком экране, горизонтальная на широком */

.process-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: none;
  counter-reset: step;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.process-steps li {
  counter-increment: step;
  position: relative;
  padding: 0 0 1.6em 3.2em;
  border-left: 2px solid var(--color-border);
  margin-left: 1.1em;
  margin-bottom: 0;
}

.process-steps li:last-child {
  border-left-color: transparent;
  padding-bottom: 0;
}

.process-steps li::before {
  content: counter(step);
  position: absolute;
  left: -1.1em;
  top: 0;
  transform: translateX(-50%);
  width: 2.2em;
  height: 2.2em;
  border-radius: 50%;
  background: var(--color-accent);
  color: #fff;
  font-family: var(--font-sans);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  z-index: 1;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .process-steps li::before { color: #0a1211; }
}
:root[data-theme="dark"] .process-steps li::before { color: #0a1211; }

.process-steps h3 {
  margin: 0 0 0.3em;
  font-size: 1.15rem;
}

.process-steps p {
  margin: 0;
  color: var(--color-text-muted);
  max-width: 42ch;
}

@media (min-width: 900px) {
  .process-steps {
    flex-direction: row;
    align-items: stretch;
    gap: 1.6em;
  }

  .process-steps li {
    flex: 1;
    padding: 3.2em 0 0;
    margin-left: 0;
    border-left: none;
    border-top: 2px solid var(--color-border);
  }

  .process-steps li:last-child {
    border-top-color: var(--color-border);
  }

  .process-steps li::before {
    left: 0;
    top: 0;
    transform: translateY(-50%);
  }

  .process-steps p {
    max-width: none;
  }
}

/* Документы */

.doc-cards {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: none;
  display: grid;
  gap: 1.1em;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 760px) {
  .doc-cards { grid-template-columns: 1fr; }
}

.doc-card {
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-accent);
  border-radius: var(--radius-m);
  padding: 1.3em 1.4em;
  background: var(--color-surface);
}

.doc-card .doc-card-eyebrow {
  color: var(--color-text-muted);
  font-size: 0.9rem;
  margin: 0 0 0.3em;
}

.doc-card h3 {
  margin: 0 0 0.4em;
  font-size: 1.2rem;
}

.doc-card p { color: var(--color-text-muted); max-width: 48ch; }

.doc-card-links {
  list-style: none;
  padding: 0;
  margin: 0.8em 0 0;
  display: flex;
  gap: 1.2em;
  flex-wrap: wrap;
}

.doc-card-links a {
  font-weight: 700;
}

/* Статус и этапы */

.status-list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: none;
  display: grid;
  gap: 0.9em;
}

.status-list li {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3em 0.9em;
  align-items: baseline;
  padding: 0.9em 1.1em;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-s);
  background: var(--color-surface);
}

.status-badge {
  flex-shrink: 0;
  font-size: 0.85rem;
  font-weight: 700;
  padding: 0.25em 0.6em;
  border-radius: 999px;
  white-space: nowrap;
}

.status-badge.is-current {
  background: var(--color-accent-tint);
  color: var(--color-accent-strong);
}

.status-badge.is-next {
  background: var(--color-surface-muted);
  color: var(--color-text-muted);
}

/* ============================================================
   Протоколы (55 карточек)
   ============================================================ */

.criteria-controls {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  padding: 1.1em 1.3em;
  margin: 1.5em 0 1.6em;
  background: var(--color-surface);
  max-width: none;
}

.criteria-controls .row {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
  align-items: end;
}

.criteria-search label,
.level-filter > span {
  display: block;
  font-weight: 700;
  margin-bottom: 0.35em;
  font-size: 0.95rem;
}

.criteria-search {
  min-width: 0;
  flex: 1 1 260px;
}

.criteria-search input {
  font: inherit;
  padding: 0.55em 0.8em;
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-s);
  width: 100%;
  min-height: 44px;
  background: var(--color-surface);
  color: var(--color-text);
}

.level-filter {
  display: flex;
  gap: 0.5em;
}

.level-filter .buttons {
  display: inline-flex;
  gap: 0.4em;
  flex-wrap: wrap;
}

.level-btn {
  border: 1px solid var(--color-border-strong);
  background: var(--color-surface);
  color: var(--color-text);
  padding: 0.55em 1em;
  min-height: 44px;
  border-radius: var(--radius-s);
  cursor: pointer;
  font-weight: 700;
}

.level-btn[aria-pressed="true"] {
  background: var(--color-accent);
  color: #fff;
  border-color: var(--color-accent);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .level-btn[aria-pressed="true"] { color: #0a1211; }
}
:root[data-theme="dark"] .level-btn[aria-pressed="true"] { color: #0a1211; }

.criteria-status {
  margin-top: 0.8em;
  color: var(--color-text-muted);
  font-size: 0.92rem;
}

.criteria-list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: none;
}

.criteria-list > li {
  margin: 0 0 0.8em;
}

.criterion-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  background: var(--color-surface);
  overflow: hidden;
}

.criterion-card[hidden] { display: none; }

.criterion-card > summary {
  cursor: pointer;
  padding: 1em 1.2em;
  display: flex;
  gap: 0.9em;
  align-items: baseline;
  flex-wrap: wrap;
  list-style: none;
  font-weight: 700;
}

.criterion-card > summary::-webkit-details-marker { display: none; }

.criterion-card > summary::before {
  content: "▸";
  color: var(--color-text-muted);
  margin-right: 0.2em;
  transition: transform 0.15s ease;
}

.criterion-card[open] > summary::before {
  transform: rotate(90deg);
}

.crit-number {
  font-family: var(--font-sans);
  color: var(--color-accent-strong);
  min-width: 3.6em;
}

.crit-title { flex: 1 1 auto; min-width: 0; }

.crit-level {
  font-size: 0.8rem;
  padding: 0.2em 0.55em;
  border-radius: 999px;
  background: var(--color-surface-muted);
  color: var(--color-text-muted);
  font-weight: 700;
}

.crit-level.level-AA {
  background: var(--color-accent-tint);
  color: var(--color-accent-strong);
}

.crit-automation-tag {
  font-size: 0.82rem;
  color: var(--color-text-muted);
  font-weight: 400;
  white-space: nowrap;
}

.crit-automation-tag.automation-частично {
  color: var(--color-accent-strong);
}

.criterion-body {
  padding: 0 1.2em 1.2em;
  border-top: 1px solid var(--color-border);
}

.criterion-body dl {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.2em 0;
  margin: 1em 0 0;
  max-width: none;
}

.criterion-body dt {
  font-weight: 700;
  margin-top: 0.8em;
}

.criterion-body dd {
  margin: 0.2em 0 0;
  color: var(--color-text-muted);
}

.automation-block {
  margin-top: 1.3em;
  padding-top: 1.1em;
  border-top: 1px dashed var(--color-border);
}

.automation-heading {
  font-weight: 700;
  margin: 0;
  color: var(--color-text);
}

.automation-block .automation-unavailable {
  color: var(--color-text-muted);
  margin: 0.4em 0 0;
}

.automation-badge {
  display: inline-block;
  font-size: 0.85rem;
  font-weight: 700;
  padding: 0.15em 0.6em;
  border-radius: 999px;
  background: var(--color-surface-muted);
  color: var(--color-text-muted);
}

.automation-badge.automation-частично {
  background: var(--color-accent-tint);
  color: var(--color-accent-strong);
}

.rule-ids {
  font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 0.85em;
  word-break: break-word;
}

.automation-summary {
  color: var(--color-text-muted);
  max-width: 68ch;
  margin: 1em 0 0;
}

.automation-line {
  margin-top: 1.4em;
}

@media print {
  .criteria-controls { display: none; }
  .criterion-card { break-inside: avoid; border: 1px solid #999; }
  .criterion-card:not([open]) .criterion-body { display: block !important; }
}

/* ============================================================
   Печать
   ============================================================ */

@media print {
  .site-header, .site-footer, .doc-toc, .skip-link, .nav-toggle, .header-tools, .tool-panel { display: none !important; }
  .doc-layout { display: block; padding: 0; max-width: none; }
  body { font-size: 12pt; color: #000; background: #fff; }
  a { color: #000; }
  a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 0.8em;
    color: #333;
  }
  .doc-content, main { max-width: none; }
}

/* ============================================================
   Инструменты шапки: поиск и настройки чтения
   ============================================================ */

.header-tools {
  display: flex;
  gap: 0.6em;
  align-items: center;
}

.tool-btn {
  display: none;
  align-items: center;
  gap: 0.5em;
  background: var(--color-surface-muted);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-s);
  padding: 0.5em 0.9em;
  min-height: 44px;
  cursor: pointer;
  color: var(--color-text);
  white-space: nowrap;
}

/* Без JavaScript кнопки поиска и настроек скрыты: сайт работает по системным настройкам. */
.js .tool-btn {
  display: inline-flex;
}

.tool-btn[aria-expanded="true"] {
  background: var(--color-accent);
  color: #fff;
  border-color: var(--color-accent);
}
:root[data-theme="dark"] .tool-btn[aria-expanded="true"] { color: #071019; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .tool-btn[aria-expanded="true"] { color: #071019; }
}

.tool-btn--close {
  background: transparent;
  border: 1px solid var(--color-border-strong);
}

.tool-panel {
  position: absolute;
  top: 100%;
  right: 1.25em;
  z-index: 60;
  width: min(420px, calc(100vw - 2.5em));
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  box-shadow: var(--shadow-card), 0 12px 30px rgba(14, 23, 38, 0.18);
  margin-top: 0.5em;
}

.tool-panel[hidden] { display: none; }

.tool-panel-inner {
  padding: 1.2em 1.3em;
  max-height: calc(100vh - var(--header-height) - 2em);
  overflow-y: auto;
}

@media (max-width: 500px) {
  .tool-panel { right: 0.6em; left: 0.6em; width: auto; }
}

.settings-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1em;
  margin-bottom: 0.8em;
}

.settings-panel-head h2 {
  font-size: 1.15rem;
  margin: 0;
}

.settings-group {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-s);
  padding: 0.8em 1em;
  margin: 0 0 1em;
}

.settings-group legend {
  font-weight: 700;
  padding: 0 0.3em;
}

.settings-group label {
  display: flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.4em 0.1em;
  cursor: pointer;
}

.settings-group input[type="radio"] {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.search-field {
  display: flex;
  align-items: center;
  gap: 0.6em;
  flex-wrap: wrap;
}

.search-field label {
  flex-basis: 100%;
  font-weight: 700;
  margin-bottom: 0.2em;
}

.search-field input[type="search"] {
  flex: 1 1 200px;
  font: inherit;
  padding: 0.55em 0.8em;
  min-height: 44px;
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-s);
  background: var(--color-surface);
  color: var(--color-text);
}

.search-status {
  color: var(--color-text-muted);
  margin: 0.8em 0 0;
  font-size: 0.95rem;
}

.search-results {
  list-style: none;
  margin: 0.6em 0 0;
  padding: 0;
  max-height: 50vh;
  overflow-y: auto;
}

.search-results li {
  margin: 0 0 0.6em;
}

.search-results a {
  display: block;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-s);
  padding: 0.6em 0.8em;
  text-decoration: none;
}

.search-results a:hover,
.search-results a:focus-visible {
  border-color: var(--color-accent);
}

.search-result-doc {
  font-size: 0.82rem;
  color: var(--color-text-muted);
}

.search-result-heading {
  font-weight: 700;
  color: var(--color-text);
}

.search-result-snippet {
  color: var(--color-text-muted);
  font-size: 0.95rem;
  margin-top: 0.2em;
}

.search-result-snippet mark {
  background: var(--color-accent-tint);
  color: var(--color-text);
  font-weight: 700;
  border-radius: 3px;
}

/* ============================================================
   Контакты в подвале
   ============================================================ */

.contact-block {
  margin-top: 1.2em;
}

.contact-cta {
  font-weight: 700;
  color: var(--color-text);
  margin: 0 0 0.5em;
}

.contact-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1em 1.6em;
  max-width: none;
}

.contact-list li {
  display: flex;
  align-items: center;
  gap: 0.5em;
  min-height: 24px;
}

.contact-list a {
  font-weight: 700;
  color: var(--color-accent-strong);
}

.contact-icon {
  width: 1.15em;
  height: 1.15em;
  flex-shrink: 0;
  color: var(--color-text-muted);
}

/* ============================================================
   Спокойный режим: анимации, декоративные элементы, «Наверх»
   ============================================================ */

html[data-calm="on"] *,
html[data-calm="on"] *::before,
html[data-calm="on"] *::after {
  transition: none !important;
  animation: none !important;
}

html[data-calm="on"] .back-to-top {
  position: static;
  display: flex;
  width: max-content;
  min-width: 44px;
  min-height: 44px;
  margin: 2em auto 0;
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

html[data-calm="on"] .back-to-top [data-back-to-top-label] {
  /* В спокойном режиме кнопка не перекрывает контент (она в потоке страницы),
     поэтому подпись возвращаем на экран даже на мобильной ширине. */
  position: static;
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
}

html[data-calm="on"] .brand-mark,
html[data-calm="on"] .external-icon,
html[data-calm="on"] .process-steps li::before {
  display: none;
}

html[data-calm="on"] .criterion-card > summary::before {
  content: "-";
}

/* ============================================================
   Высококонтрастный режим ОС (forced-colors)
   ============================================================ */

@media (forced-colors: active) {
  .brand-stripe {
    display: none;
  }
  .btn,
  .demo-toggle,
  .level-btn,
  .tool-btn,
  .criterion-card,
  .offer-item,
  .doc-card,
  .hero-facts,
  .settings-group,
  .search-results a,
  input[type="search"],
  input[type="radio"] {
    forced-color-adjust: auto;
    border: 1px solid ButtonText;
  }
  .on-navy {
    background: Canvas !important;
    color: CanvasText !important;
    border: 1px solid CanvasText;
  }
  a:focus-visible, button:focus-visible, input:focus-visible {
    outline: 3px solid Highlight;
  }
}

/* ============================================================
   Страница «Как это ощущается»
   ============================================================ */

.demo-intro {
  max-width: 68ch;
  color: var(--color-text-muted);
  margin-top: 1em;
}

.demo-page {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 1.25em 4em;
}

.demo-toc {
  margin-bottom: 2em;
}

.demo-toc ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.8em 1.4em;
}

.demo-toc a {
  font-weight: 700;
}

.demo-section {
  padding: 2.4em 0;
  border-top: 1px solid var(--color-border);
}

.demo-section:first-of-type {
  border-top: none;
  padding-top: 0;
}

.demo-meta {
  color: var(--color-text-muted);
}

.demo-disclaimer {
  font-size: 0.92rem;
  color: var(--color-text-muted);
  border-left: 3px solid var(--color-border-strong);
  padding-left: 0.9em;
  max-width: 68ch;
}

/* ---------- Списки страницы «Проект» ---------- */

.proekt-list {
  max-width: 68ch;
  padding-left: 1.3em;
}

.proekt-list li {
  margin-bottom: 0.6em;
  color: var(--color-text);
}

.proekt-list--numbered {
  list-style: decimal;
}

.demo-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6em;
  margin: 1em 0;
}

.demo-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  font: inherit;
  background: var(--color-surface);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-s);
  padding: 0.55em 1em;
  min-height: 44px;
  cursor: pointer;
  color: var(--color-text);
}

.demo-toggle[aria-pressed="true"] {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: #fff;
}
:root[data-theme="dark"] .demo-toggle[aria-pressed="true"] { color: #071019; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .demo-toggle[aria-pressed="true"] { color: #071019; }
}

.demo-toggle:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.demo-status {
  color: var(--color-text-muted);
  font-size: 0.95rem;
}

.demo-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1.2em;
  margin: 1em 0;
}

@media (max-width: 760px) {
  .demo-grid { grid-template-columns: 1fr; }
}

.demo-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  padding: 1.2em 1.3em;
  background: var(--color-surface);
}

.demo-card--wide {
  max-width: none;
}

.demo-card-label {
  font-weight: 700;
  margin: 0 0 0.8em;
  color: var(--color-text-muted);
  font-size: 0.9rem;
}

.demo-area[data-cvd-area] {
  filter: none;
}

.fake-form label {
  display: block;
  font-weight: 700;
  margin-bottom: 0.4em;
}

.demo-input {
  font: inherit;
  width: 100%;
  padding: 0.6em 0.8em;
  min-height: 44px;
  border-radius: var(--radius-s);
  border: 1px solid var(--color-border-strong);
  background: var(--color-surface);
  color: var(--color-text);
}

.demo-input--error-color-only {
  border: 2px solid #c0392b;
}

.demo-input--error {
  border: 2px solid #c0392b;
}

.demo-error {
  display: flex;
  align-items: center;
  gap: 0.4em;
  color: #9c2b1f;
  font-weight: 700;
  margin: 0.5em 0 0;
}
:root[data-theme="dark"] .demo-error { color: #f0b3b3; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .demo-error { color: #f0b3b3; }
}

.inline-icon {
  width: 1.1em;
  height: 1.1em;
  flex-shrink: 0;
}

.demo-chart {
  width: 100%;
  height: auto;
  color: var(--color-text-muted);
}

.demo-scramble-text {
  font-size: 1.1rem;
  line-height: 1.7;
}

.demo-readable {
  font-size: 1.05rem;
}

.demo-readable p {
  text-align: left;
  margin-bottom: 0.9em;
}

.fake-widget {
  border: 1px dashed var(--color-border-strong);
  border-radius: var(--radius-s);
  padding: 1em;
  display: flex;
  flex-direction: column;
  gap: 0.8em;
  margin-bottom: 1em;
}

.fake-div-button, .fake-real-button {
  display: inline-block;
  background: var(--color-accent);
  color: #fff;
  padding: 0.6em 1.2em;
  border-radius: var(--radius-s);
  border: none;
  font: inherit;
  font-weight: 700;
  max-width: 100%;
}
:root[data-theme="dark"] .fake-div-button, :root[data-theme="dark"] .fake-real-button { color: #071019; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .fake-div-button,
  :root:not([data-theme="light"]) .fake-real-button { color: #071019; }
}

.fake-img {
  width: 32px;
  height: 32px;
}

.demo-transcript {
  font-size: 0.92rem;
  color: var(--color-text-muted);
  margin-top: 0.6em;
}

.demo-fallback {
  color: var(--color-danger-text);
  font-weight: 700;
}

[data-blur-area] {
  transition: filter 0.15s ease;
}

[data-blur-area].blur-light {
  filter: blur(1.5px);
}

[data-blur-area].blur-strong {
  filter: blur(4px);
}

html[data-calm="on"] [data-blur-area],
html[data-calm="on"] .demo-scramble-text {
  transition: none;
}

/* ---------- Форма «Проверить сайт» (страница публикуется по флагу PUBLISH_PROVERKA) ---------- */

.check-beta-notice {
  background: var(--color-surface-muted);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  padding: 1.2em 1.4em;
}

.check-beta-notice p {
  margin: 0;
  max-width: 68ch;
}

.check-queue-stats {
  display: flex;
  flex-direction: column;
  gap: 0.8em;
}

.check-queue-numbers {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
}

.check-queue-stat {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.15em;
  min-width: 9em;
  padding: 0.8em 1em;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-s);
  background: var(--color-surface);
}

.check-queue-stat-value {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.1;
}

.check-queue-stat-label {
  color: var(--color-text-muted);
  font-size: 0.88rem;
}

.check-queue-eta,
.check-queue-loading,
.check-queue-error {
  margin: 0;
}

.check-queue-error {
  color: var(--color-danger-text);
}

.check-form {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.2em;
  max-width: 52ch;
}

.check-field {
  display: flex;
  flex-direction: column;
  gap: 0.4em;
  width: 100%;
}

.check-field label {
  font-weight: 700;
}

.check-hint {
  color: var(--color-text-muted);
  font-size: 0.92rem;
  margin: 0;
}

.check-input {
  font: inherit;
  padding: 0.6em 0.8em;
  min-height: 44px;
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-s);
  background: var(--color-surface);
  color: var(--color-text);
  width: 100%;
}

.check-input[aria-invalid="true"] {
  border-color: var(--color-danger-text);
}

.field-error {
  color: var(--color-danger-text);
  background: var(--color-danger-bg);
  border-radius: var(--radius-s);
  padding: 0.6em 0.8em;
  margin: 0;
  font-weight: 700;
}

.field-error[hidden] {
  display: none;
}

.check-result {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  padding: 1em 1.2em;
  margin-top: 1.2em;
  background: var(--color-surface-muted);
}

.check-result[hidden] {
  display: none;
}

.check-result a {
  word-break: break-all;
}

.check-noscript {
  color: var(--color-danger-text);
  background: var(--color-danger-bg);
  border-radius: var(--radius-s);
  padding: 0.8em 1em;
}

.check-progress-actions {
  margin-top: 1.2em;
}

.check-save-hint {
  color: var(--color-text-muted);
  font-size: 0.92rem;
}

.check-actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8em;
}

.check-copy-btn {
  font: inherit;
  cursor: pointer;
}

.check-copy-feedback {
  color: var(--color-text-muted);
  font-size: 0.9rem;
}

.check-copy-feedback[hidden] {
  display: none;
}

.check-telegram-status {
  color: var(--color-text-muted);
}

/* ============================================================
   Страница «Цикл проверки на своём сайте»
   ============================================================ */

.cikl-steps {
  list-style: none;
  margin: 0 0 2.2em;
  padding: 0;
  max-width: none;
  counter-reset: cikl-step;
  display: flex;
  flex-direction: column;
  gap: 1.1em;
}

.cikl-step {
  counter-increment: cikl-step;
  position: relative;
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-accent);
  border-radius: var(--radius-m);
  padding: 1.2em 1.4em 1.3em 3.6em;
  background: var(--color-surface);
}

.cikl-step::before {
  content: counter(cikl-step);
  position: absolute;
  left: 1.1em;
  top: 1.25em;
  width: 1.9em;
  height: 1.9em;
  border-radius: 50%;
  background: var(--color-accent);
  color: #fff;
  font-family: var(--font-sans);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
}

:root[data-theme="dark"] .cikl-step::before { color: #0a1211; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .cikl-step::before { color: #0a1211; }
}

.cikl-step-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.3em 0.9em;
  margin-bottom: 0.35em;
}

.cikl-step-head h3 {
  margin: 0;
  font-size: 1.15rem;
}

.cikl-step-date {
  color: var(--color-text-muted);
  font-size: 0.92rem;
  white-space: nowrap;
}

.cikl-step-note {
  color: var(--color-text-muted);
  max-width: 68ch;
  margin: 0 0 0.7em;
}

.cikl-step-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em 1.2em;
}

.cikl-step-links a {
  font-weight: 700;
}

.cikl-step-pending {
  font-size: 0.92rem;
  color: var(--color-text-muted);
  font-style: italic;
}

.cikl-changes {
  max-width: 68ch;
  padding-left: 1.3em;
}

.cikl-changes li {
  margin-bottom: 0.6em;
}

/* ============================================================
   Тёмно-синий фон крупных блоков (первый экран, витрина): собственный
   набор цветов текста, не зависящий от текущей темы сайта - как титульный
   слайд. Блок специально расположен в конце файла, чтобы перебить более
   ранние по каскаду правила той же специфичности (.landing-hero .sub и т.п.).
   ============================================================ */

.on-navy {
  background: linear-gradient(135deg, var(--color-navy), var(--color-navy-2));
  color: var(--color-on-navy-text);
}
.on-navy .kicker { color: var(--color-on-navy-accent); }
.on-navy h1, .on-navy h2, .on-navy h3 { color: var(--color-on-navy-text); }
.on-navy a:not(.btn) { color: var(--color-on-navy-accent); }
.on-navy .lede { color: var(--color-on-navy-text); }
.on-navy .sub, .on-navy .section-intro { color: var(--color-on-navy-muted); }
.on-navy .btn-secondary { border-color: rgba(255, 255, 255, 0.55); color: var(--color-on-navy-text); }
.on-navy .btn-secondary:hover { border-color: var(--color-on-navy-text); color: var(--color-on-navy-text); }
.on-navy .fact-number { color: var(--color-on-navy-accent); }
.on-navy .fact-label { color: var(--color-on-navy-muted); }
.on-navy .hero-facts { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.18); }
.on-navy .hero-facts-heading { color: var(--color-on-navy-muted); }

/* Версия 3 (по ТЗ к отчёту 2): на узких или низких окнах закреплённая шапка
   занимает до половины высоты и частично перекрывала элементы в фокусе
   (критерий 2.4.11, конфигурация 320x256). Здесь шапка прокручивается вместе
   со страницей. */
@media (max-width: 767px), (max-height: 560px) {
  .site-header { position: static; }
  html { scroll-padding-top: 1em; }
}
/* Прокручиваемая таблица не выше видимой части окна под шапкой: при фокусе она
   помещается целиком и не уходит под закреплённую шапку (2.4.11). Длинные
   таблицы прокручиваются внутри своей области с клавиатуры. */
@media screen and (min-width: 768px) and (min-height: 561px) {
  .table-scroll {
    /* Минус место под кнопку «Наверх»: иначе нижний угол области оказывался
       под ней (проверка версии 3, 15.09.2026). */
    max-height: calc(100vh - var(--header-height) - var(--btt-reserve) - 2em);
    overflow: auto;
    scroll-margin-top: calc(var(--header-height) + 1em);
    scroll-margin-bottom: var(--btt-reserve);
  }
}
/* Внутри прокручиваемой области слова в ячейках не рвутся посередине: общее
   правило overflow-wrap:anywhere для страницы сжимало таблицы до минимума
   («Потребнос-ти»). Горизонтальное переполнение остаётся внутри области. */
.table-scroll table { max-width: none; }
.table-scroll th, .table-scroll td { overflow-wrap: normal; }

/* Расшифровки сокращений: пунктирное подчёркивание и курсор подсказки. */
abbr[title] {
  text-decoration: underline dotted;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.15em;
  cursor: help;
}

/* ============================================================
   Форма «Заявка на техническое задание» (tz-zayavka.html) - переиспользует
   .check-form/.check-field/.check-input/.field-error/.check-result из формы
   «Проверить сайт» и .settings-group из панели настроек чтения (fieldset +
   legend). Здесь - только добавления, которых не хватало этим общим классам.
   ============================================================ */

.tz-form {
  max-width: 68ch;
  gap: 1.6em;
}

/* .check-form (общий класс) задаёт display:flex авторским правилом, которое
   перебивает стандартное правило браузера [hidden]{display:none} (то же
   происхождение таблицы стилей, та же специфичность - выигрывает более
   позднее объявление). Без этого уточнения form.hidden=true в tz.js не
   скрывал бы форму после успешной отправки. */
.tz-form[hidden] {
  display: none;
}

.tz-group {
  width: 100%;
}

.tz-group .check-field {
  margin-top: 0.6em;
}

.tz-group label {
  display: flex;
  align-items: flex-start;
  gap: 0.5em;
  padding: 0.35em 0.1em;
  cursor: pointer;
  font-weight: 400;
}

.tz-group input[type="checkbox"] {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  margin-top: 0.1em;
}

.tz-textarea {
  min-height: 7em;
  resize: vertical;
  font: inherit;
}

.doc-tz-cta {
  margin-top: 2.5em;
  padding: 1.4em 1.6em;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-m);
  background: var(--color-surface-muted);
}

.doc-tz-cta h2 {
  margin-top: 0;
  font-size: 1.15rem;
}

.doc-tz-cta p:last-child {
  margin-bottom: 0;
}

/* Общее правило для всех форм сервиса: авторское display:flex у .check-form
   перебивает стандартное [hidden]{display:none} браузера, поэтому скрытие
   после отправки заявки задаётся явно (закрывает и .tz-form). */
.check-form[hidden] {
  display: none;
}