/* ============================================================
   ПМК — страница статьи (/stati/<имя-статьи>/)
   ------------------------------------------------------------
   ОБЩИЙ файл всех статей раздела, не под одну (требование ТЗ
   statya-01). Заведён 15.09.2026 первой статьёй
   «Как проверить, подходит ли ваш проект под заём ФРП».

   Раскладка — по «ПРАВИЛА СТАТЕЙ — свод.md», раздел «Вёрстка
   статьи»:
   — тело статьи на белом, текст --chernila: длинное чтение
     на цветном фоне выцветает (web-grabli);
   — меток листа в теле НЕТ: навигация длинного текста —
     заголовки;
   — линий между разделами нет, разделы разделяет воздух;
   — ≥1181px: текст 720px слева, выносы 300px справа, зазор
     от 60px (при контейнере 1200 фактический зазор больше —
     это разрешённый диапазон свода);
   — <1181px: выносы в потоке, порядок чтения H2 → вынос → текст
     (в разметке вынос стоит сразу после H2 — порядок даёт сам
     поток);
   — механика выносов — position:absolute внутри обёртки раздела,
     НЕ грид и НЕ float: грид растягивает ряд по выносу и оставляет
     дыру под заголовком, float не поднимается до уровня H2
     (web-grabli, «Длинный текст и страницы-статьи»). Цена
     absolute: вынос обязан быть короче раздела — проверено
     замером в отчёте;
   — таблица — .tabl редакции 3 (base.css, 15.09.2026): подложка
     --sinij-fon из свода снята вместе с редизайном таблиц, акцент
     даёт верхняя линия рамы 3px --sinij;
   — похожих статей нет: статья пока одна.

   Редакция 2 от 15.09.2026 («СТАТЬИ — переделка, редакция 2»):
   добавлены сноски .snoska и список источников .ist-spisok,
   зона примера .st-primer, обложка перечня .karta-razdelov,
   макет формы фонда .forma-maket, примечание под таблицей
   .st-tabl-primech. Ссылки-пункты строкой в тексте статьи
   больше не используются — привязка к пунктам переехала
   в сноски и список источников.

   Шапка статьи — НЕ компонент .geroy: тому база задаёт
   min-height 100svh, а статье первый экран должен вместить
   врезку «Коротко» (ответ до прокрутки — свод). Плашка знака
   фонда — компонент .geroy__frp из base.css, он не привязан
   к родителю.

   Новых цветов и компонентов нет: врезка «Коротко» — модификация
   .vrezka (вместо числа 76px — ярлык 13/500), вынос — типографика
   боковой пометки .pometka-sbok главной (13/1.55, опорная линия
   2px --linia) шириной 300px из свода.

   Ритм фонов: шапка fon-2 — тело белое — заявка fon-2 —
   финал белый — подвал тёмный. Смежные не совпадают.
   Красного --krasnyj на странице нет: крестики перечня
   «не устранимо» — смысловое «нельзя» из словаря .spisok--net
   (base.css), другого красного не заведено.
   ============================================================ */

/* ================= Шапка статьи ================= */
.statya-shapka{background:var(--fon-2);border-bottom:1px solid var(--linia)}
.statya-shapka .w{padding-top:56px;padding-bottom:44px}
.statya-shapka h1{max-width:24ch}
/* Мета-строка: тема и дата. Дата — числовой слой, Geologica
   с tabular-nums (типографика .statya__data раздела). */
.statya-meta{display:flex;align-items:center;gap:18px;margin-top:18px;font-family:var(--sans);font-size:13px;font-weight:500;line-height:1.3;color:var(--seryj-2)}
.statya-meta time{font-variant-numeric:tabular-nums}
.statya-shapka .geroy__lead{margin-top:18px}
@media (max-width:1024px){
  .statya-shapka .w{padding-top:44px;padding-bottom:36px}
}
@media (max-width:768px){
  .statya-shapka .w{padding-top:36px;padding-bottom:30px}
  .statya-shapka h1{font-size:34px}
}
@media (max-width:479px){
  .statya-shapka h1{font-size:29px}
}

/* ================= Тело статьи ================= */
/* Полоса чтения 720px. Обёртка разделов относительная — якорь
   для абсолютных выносов. Отступ между разделами задаёт раздел,
   а не H2: верх выноса должен совпадать с верхом H2, поэтому
   H2 внутри раздела стоит без верхнего поля (грабля :first-child
   из web-grabli учтена — поле раздаёт .st-razdel). */
.statya-telo{padding-top:56px;padding-bottom:96px}
.st-razdel{position:relative;margin-top:72px}
.st-razdel:first-child{margin-top:0}
.st-razdel>h2{margin:0;max-width:22ch}
.st-razdel>p,.st-razdel>ul,.st-razdel>ol,.st-razdel>h3{max-width:720px}
.st-razdel>p{margin:20px 0 0}
.st-razdel>h2+p,.st-razdel>.st-vynos+p{margin-top:24px}
.st-razdel>h3{font-size:20px;margin:36px 0 0}
.st-razdel b{font-weight:600}
/* Ссылка на пункт документа в строке текста: тот же опознавательный
   знак .ssylka-punkt (base.css), но в потоке абзаца — не блоком. */
.st-razdel p .ssylka-punkt,.st-razdel li .ssylka-punkt,.st-razdel td .ssylka-punkt{display:inline;width:auto}

/* Перечни в теле: перечень с линией-маркером — словарь .spisok
   (base.css); da/net-перечни раздела «Что устранимо» — оттуда же. */
.st-razdel>ul.spisok,.st-razdel>ol{margin:20px 0 0;padding:0}
.st-razdel .spisok li{font-size:16px;line-height:1.6}
.st-razdel h3+.spisok{margin-top:18px}

/* Врезка «Коротко» — модификация .vrezka: без числа, с ярлыком.
   Стоит первой в теле — ответ виден до прокрутки (свод). */
.vrezka--korotko{display:block}
.vrezka--korotko .vrezka__yarlyk{display:block;font-family:var(--sans);font-size:13px;font-weight:500;line-height:1.3;color:var(--seryj-2);margin-bottom:12px}
.vrezka--korotko p{font-size:16px;line-height:1.6;color:var(--chernila)}
/* Ссылка на пункт внутри врезки — в потоке фразы, не блоком:
   блочная рвала перечисление на абзацы (замечено на первом прогоне). */
.vrezka--korotko .ssylka-punkt{display:inline;width:auto}

/* Вынос на поле. Типографика боковой пометки главной
   (.pometka-sbok, glavnaya.css): 13/1.55 --seryj, опорная линия
   2px --linia. До 1181px — в потоке между H2 и текстом. */
.st-vynos{max-width:720px;margin:20px 0 4px;font-family:var(--text);font-size:13px;line-height:1.55;color:var(--seryj);border-left:2px solid var(--linia);padding-left:14px}
.st-vynos .ssylka-punkt{display:inline;width:auto}
@media (min-width:1181px){
  .st-vynos{position:absolute;top:0;right:0;width:300px;margin:0}
}

/* Таблица статьи — .tabl редакции 3 (base.css, 15.09.2026): без
   заливок, воздух и волосяные линии. Прежняя подложка --sinij-fon
   из свода статей снята вместе с редизайном таблиц — рисование
   заливок и было предметом жалобы; акцент ядру статьи теперь даёт
   верхняя линия рамы 3px --sinij (акцент карточки из словаря).
   Расхождение со сводом статей — в отчёте. Шире полосы чтения
   на 60px: 780 — верх диапазона свода. */
.st-razdel .tabl-rama{max-width:780px;margin-top:28px;border-top:3px solid var(--sinij)}
.st-razdel .tabl{font-size:15px}
.st-razdel .tabl td{padding-right:16px}
.st-razdel .tabl tbody th{padding-right:16px}
/* Диапазон суммы не рвётся («100–1000 / млн ₽») — nowrap даёт
   base (td.chislo); на ≤767 таблица складывается в карточки. */

/* Примечание под таблицей — правило Омникса 12: «Примечание.»
   жирным, в нём единственная сноска таблицы (в строках сносок нет —
   ссылки в таблице превращают её в частокол). */
.st-tabl-primech{max-width:780px;margin-top:14px;font-size:14px;line-height:1.55;color:var(--seryj)}
.st-tabl-primech b{color:var(--chernila)}

/* Вывод-строка (дожим 1) — base.css, здесь только связь с ритмом
   раздела. */
.st-razdel .vyvod-stroka{margin-top:44px}

/* ================= Сноска — научный аппарат статьи =================
   Правка заказчика 15.09.2026: «источники ставить внизу списком,
   а там, где применяются, делать сноску с цифрами». Номер
   надстрочный, кликабельный, ведёт на пункт списка «Источники»;
   один документ — один номер; id стоит только на ПЕРВОМ появлении
   номера (стрелка возврата из списка ведёт туда). */
.snoska{text-decoration:none;color:var(--sinij-yark);font-family:var(--sans);font-weight:500;white-space:nowrap;transition:color .12s}
.snoska:hover{color:var(--sinij)}
.snoska sup{font-size:11px;line-height:0}
/* Две сноски подряд не слипаются */
.snoska+.snoska{margin-left:4px}
/* Якорь не прячется под прилипшие этажи навигации */
.snoska[id]{scroll-margin-top:calc(var(--header-h) + 76px)}

/* ================= Список источников =================
   Внизу статьи, секция на --fon-2 (ритм фонов: финал белый,
   источники fon-2, подвал тёмный). Каждый пункт: точное название,
   реквизиты редакции, пункты и страницы в статье, ссылка на якорь
   документа на /istochniki/ и стрелка возврата к месту в тексте. */
.st-istochniki{background:var(--fon-2);border-top:1px solid var(--linia);padding-top:var(--sek);padding-bottom:var(--sek)}
.st-istochniki h2{max-width:22ch}
.st-istochniki .podzag{margin-top:16px}
.ist-spisok{max-width:780px;margin-top:36px;counter-reset:ist}
.ist-spisok li{counter-increment:ist;position:relative;display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:14px;padding:16px 0;border-top:1px solid var(--linia-2)}
.ist-spisok li:first-child{border-top-color:transparent}
.ist-spisok li::before{content:counter(ist);grid-column:1;font-family:var(--sans);font-size:24px;font-weight:300;line-height:1.2;color:var(--seryj-2);font-variant-numeric:tabular-nums}
.ist-spisok li>div{grid-column:2;min-width:0}
.ist-spisok li[id]{scroll-margin-top:calc(var(--header-h) + 76px)}
/* Пришли по сноске — пункт подсвечен */
.ist-spisok li:target{background:var(--sinij-fon)}
.ist-nazvanie{font-family:var(--sans);font-size:15px;font-weight:500;line-height:1.4;color:var(--chernila)}
.ist-rekvizity{font-size:13px;line-height:1.55;color:var(--seryj);margin-top:3px}
.ist-gde{font-size:13px;line-height:1.55;color:var(--seryj-2);margin-top:3px}
.ist-dejstviya{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin-top:6px;font-size:13px}
.ist-vozvrat{font-family:var(--sans);font-size:13px;color:var(--seryj);text-decoration:none;border-bottom:1px dotted var(--seryj-2);transition:color .12s,border-bottom-color .12s}
.ist-vozvrat:hover{color:var(--chernila);border-bottom:1px solid var(--seryj)}

/* ================= Зона примера =================
   Правка заказчика 15.09.2026: применение пункта к сквозному
   примеру отделяется от самой нормы, «чтобы глаз легче
   адаптировался». Подложка --fon-2, линия-указатель --sinij
   слева (словарь), ярлык — как у плашки «работа ПМК» маршрута.
   Внутри только применение к нашему заводу, новые нормы
   не вводятся. */
.st-primer{max-width:720px;margin:20px 0 0;background:var(--fon-2);border-left:3px solid var(--sinij);padding:16px 22px}
.st-primer__yarlyk{display:block;font-family:var(--sans);font-size:12px;font-weight:500;line-height:1.3;color:var(--sinij);margin-bottom:6px}
.st-primer p{font-size:16px;line-height:1.6;color:var(--chernila)}
.st-primer p+p{margin-top:10px}

/* ================= Обложка перечня =================
   Правка заказчика 15.09.2026: нумерованное перечисление
   подаётся карточками, а не простынёй. Номер — порядковый знак:
   числовой слой Geologica 28/300 --seryj-2, как у перечня
   .razdel (base.css). Применяется только там, где нумерация
   есть в документе фонда. Отклик — словарные: рамка синеет,
   номер синеет. */
.karta-razdelov{max-width:780px;margin-top:24px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.karta-razdelov__kartochka{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:16px;align-items:start;background:#fff;border:1px solid var(--linia);padding:16px 18px;transition:border-color .12s}
.karta-razdelov__kartochka:hover{border-color:var(--sinij)}
.karta-razdelov__nomer{font-family:var(--sans);font-size:28px;font-weight:300;line-height:1.15;color:var(--seryj-2);font-variant-numeric:tabular-nums;min-width:44px;transition:color .2s ease}
.karta-razdelov__kartochka:hover .karta-razdelov__nomer{color:var(--sinij)}
.karta-razdelov__imya{display:block;font-family:var(--sans);font-size:15px;font-weight:500;line-height:1.35;color:var(--chernila)}
.karta-razdelov__opis{font-size:13px;line-height:1.5;color:var(--seryj);margin-top:4px}
@media (max-width:600px){
  .karta-razdelov{grid-template-columns:1fr}
}
@media (hover:none){
  .karta-razdelov__kartochka:hover{border-color:var(--linia)}
  .karta-razdelov__kartochka:hover .karta-razdelov__nomer{color:var(--seryj-2)}
}

/* ================= Макет формы фонда =================
   Правка заказчика 15.09.2026: «не приводишь примеры, как это
   визуально выглядит». Структура формы воспроизводится в вёрстке
   с настоящими названиями колонок и настоящими строками.
   Компонент НАРОЧНО противоположен .tabl: тонкая серая сетка
   С ВЕРТИКАЛЬНЫМИ линиями, мелкий кегль, серые заливки шапки —
   как в самой форме фонда. Если макет можно спутать с нашей
   таблицей — компонент не сделан.
   Сверху ярлык «так выглядит форма фонда», снизу точное название
   приложения и кнопка «Скачать оригинал». Легенда обязательна. */
.forma-maket{max-width:780px;margin-top:28px;border:1px solid var(--linia);background:#fff;padding:18px 22px 20px}
.forma-maket__yarlyk{display:flex;align-items:center;gap:9px;font-family:var(--sans);font-size:12px;font-weight:500;line-height:1.3;color:var(--seryj-2);margin-bottom:14px}
.forma-maket__yarlyk::before{content:"";width:6px;height:6px;flex:0 0 auto;background:var(--seryj-2)}
/* Форма шире полосы чтения — прокрутка внутри своего контейнера,
   страницу не тащит (макет — «матрица», карточкой её не сложить) */
.forma-maket__prokrutka{overflow-x:auto}
.forma-maket table{border-collapse:collapse;width:100%;min-width:640px;font-family:var(--text);font-size:12px;line-height:1.4;color:var(--chernila)}
.forma-maket th,.forma-maket td{border:1px solid var(--linia);padding:6px 9px;text-align:left;vertical-align:middle;font-weight:400}
.forma-maket th{background:var(--fon-2);font-weight:500;text-align:center}
.forma-maket .fm-nomer{text-align:center;white-space:nowrap;font-variant-numeric:tabular-nums}
.forma-maket .fm-x{text-align:center;font-family:var(--sans);font-weight:500}
.forma-maket .fm-mnogotochie td{text-align:center;color:var(--seryj-2);padding:4px 9px}
.forma-maket__edinicy{font-size:11px;color:var(--seryj);text-align:right;margin-bottom:4px}
.forma-maket__nad{font-size:12px;font-weight:500;text-align:center;margin-bottom:6px}
.forma-maket__legenda{font-size:13px;line-height:1.5;color:var(--seryj);margin-top:12px}
.forma-maket__podpis{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 24px;margin-top:14px;border-top:1px solid var(--linia-2);padding-top:14px}
.forma-maket__istochnik{font-size:13px;line-height:1.5;color:var(--seryj);max-width:52ch}
.forma-maket .knopka{font-size:14px;padding:11px 18px;flex:0 0 auto}

/* ================= Финал: работа ПМК ================= */
/* Продолжение статьи после формы — та же полоса чтения. */
.st-final{padding-top:var(--sek);padding-bottom:var(--sek)}
.st-final h2{max-width:22ch}
.st-final p,.st-final ul{max-width:720px}
.st-final p{margin:20px 0 0}
.st-final .spisok{margin:24px 0 0;padding:0}
.st-final .spisok li{font-size:16px;line-height:1.6}

@media (max-width:1024px){
  .statya-telo{padding-top:44px;padding-bottom:72px}
  .st-razdel{margin-top:56px}
}
@media (max-width:767px){
  .statya-telo{padding-top:36px;padding-bottom:56px}
  .st-razdel{margin-top:44px}
  .st-razdel>h3{margin-top:28px}
}
