:root{--ink:#151b22;--mut:#59636e;--line:#e4e6df;--bg:#f6f7f2;
  --bad:#c1342d;--ok:#0c7f55;--ask:#9e5f08;--acc:#1a5c55;
  --sc-ok:#0a7c53;--sc-mid:#8d7000;--sc-bad:#bf2c26;--track:#e7ece6;
  /* 24.10.2026: ЦВЕТ ТЕКСТА и ЦВЕТ ГРАФИКИ — разные. Текст красим тёмным
     вариантом (яркий жёлтый на белом даёт контраст 1,8 — нечитаем), а дуги,
     полосы и точки — ярким, иначе «жёлтый» выглядит оливково-коричневым и
     шкала «зелёный/жёлтый/красный» не читается с первого взгляда. */
  --sc-ok-v:#16a34a;--sc-mid-v:#b8860b;--sc-bad-v:#e33a30;
  --sh1:0 1px 2px rgba(18,28,24,.05);--sh2:0 12px 26px -14px rgba(18,28,24,.28),0 2px 6px rgba(18,28,24,.05)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font:16px/1.55 -apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:#fff}
a{color:var(--acc)}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.top{border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:5}
.topi{display:flex;align-items:center;justify-content:space-between;min-height:64px;gap:16px}
/* 24.10.2026 (КАПИТАН: «поиск прилип»): замер при 1100px — .topi 65px, а навигация
   после переноса 68px: верх строки уезжал за край (-2px), кнопка свисала на 2px ниже
   белого поля. Фиксированную высоту заменил min-height: шапка растёт по содержимому,
   но никогда не ниже 64px. */
/* .logo: раскладка задана ОДИН раз здесь (row + центр + gap:10px) — так он и
   выглядел на живой странице, где правило из блока логотипа перебивало это.
   24.10.2026 дубль ниже (.logo{flex-direction:row;...} в блоке «крест в логотипе»)
   убран, цвет/тень темы v2 остались в своём блоке. */
.logo{text-decoration:none;color:var(--ink);display:flex;flex-direction:row;align-items:center;line-height:1.1;gap:10px}
.logo b{font-size:19px;letter-spacing:.2px}
.logo span{font-size:11.5px;color:var(--mut);text-transform:uppercase;letter-spacing:.6px}
.tnav a{margin-left:18px;text-decoration:none;font-size:14.5px}
main{padding-bottom:60px}
.phead{background:var(--bg);border-bottom:1px solid var(--line);padding:28px 0 32px;margin-bottom:28px}
.phead h1{font-size:30px;line-height:1.2;margin:6px 0 12px;max-width:900px}
.phead--main h1{font-size:34px;max-width:860px}
.dom{display:block;font-size:14px;color:var(--acc);font-weight:400;letter-spacing:.2px;text-decoration:none;border-bottom:1px dotted rgba(31,95,91,.45);width:fit-content}
a.dom:hover{color:#123f3c;border-bottom-style:solid}
.dom .ext{font-size:12px;opacity:.75;margin-left:3px}
.lead{color:var(--mut);max-width:680px;margin:0 0 18px}
/* Первый экран главной: текст слева, диаграмма справа (23.10.2026).
   КАПИТАН: «туда диаграмма напрашивается» — на 1920 справа от вводного текста
   пустовало 400 px, а колонка текста оставалась 680. Диаграмма заполняет ровно
   это место и не растит первый экран в высоту: блок текста 264 px, диаграмма 184. */
.hero2__t{min-width:0}
@media(min-width:1101px){
  .hero2{display:grid;grid-template-columns:minmax(0,680px) minmax(0,400px);
    gap:28px;justify-content:space-between;align-items:start}}
.hc{margin:0;padding:13px 16px 12px;background:#fff;border:1px solid var(--line);
  border-radius:12px;box-shadow:var(--sh1)}
.hc__cap{font-size:13px;font-weight:600;color:var(--ink);margin:0 0 11px}
.hc__rows{display:grid;gap:7px}
.hc__r{display:grid;grid-template-columns:118px minmax(0,1fr) 46px;align-items:center;gap:8px}
.hc__l{font-size:12.5px;color:var(--mut);line-height:1.2;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.hc__b{position:relative;height:8px;border-radius:5px;background:var(--track);overflow:hidden}
.hc__b i{position:absolute;top:0;bottom:0;left:0;border-radius:5px;
  background:linear-gradient(90deg,#1a5c55,#2e8f7d)}
.hc__v{font-size:12.5px;font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.hc__pc{font-size:10.5px;color:var(--mut);margin-left:1px}
.hc__note{font-size:11.5px;color:var(--mut);line-height:1.35;margin:10px 0 0}
@media(max-width:1100px){.hc{margin-top:16px}}
@media(max-width:420px){.hc__r{grid-template-columns:104px minmax(0,1fr) 44px}.hc__l{font-size:11.5px}}
/* Движок и балл (24.10.2026). Полоски на обрезанной шкале 4–7: обрезка названа
   в подписи, поэтому сравнение остаётся честным, а полоски — различимыми.
   u внутри полоски — медиана, тонкая чёрточка: среднее и медиана расходятся,
   и когда они расходятся, это видно, а не спрятано в одно число. */
.pc{margin:22px 0 0;padding:16px 18px 14px;background:#fff;border:1px solid var(--line);
  border-radius:12px;box-shadow:var(--sh1)}
.pc__cap{font-size:15px;font-weight:600;color:var(--ink);margin:0 0 6px}
.pc__sub{font-size:12.5px;color:var(--mut);line-height:1.4;margin:0 0 14px;max-width:820px}
.pc__rows{display:grid;gap:9px}
.pc__r{display:grid;grid-template-columns:132px 52px minmax(0,1fr) 56px;gap:10px;align-items:center}
.pc__l{font-size:13px;color:var(--ink);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc__n{font-size:12px;color:var(--mut);text-align:right;font-variant-numeric:tabular-nums}
/* 24.10.2026 (t_1f47d4d2): метка «меньше 10 сайтов в группе» и её расшифровка под
   шкалой. Классы новые, в файле их до этого не было (проверено grep pc__sm/pc__foot). */
.pc__sm{font-style:normal;font-size:10.5px;vertical-align:.45em;color:var(--mut)}
.pc__foot{font-size:11.5px;color:var(--mut);line-height:1.35;margin:7px 0 0}
.pc__b{position:relative;height:12px;border-radius:6px;background:var(--track);overflow:hidden}
.pc__b i{position:absolute;top:0;bottom:0;left:0;border-radius:6px;
  background:linear-gradient(90deg,#1a5c55,#2e8f7d)}
.pc__b u{position:absolute;top:2px;bottom:2px;width:2px;margin-left:-1px;background:#123f3c;
  border-radius:1px;opacity:.85}
.pc__v{font-size:13px;font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.pc__r--unk .pc__l{color:var(--mut)}
.pc__r--unk .pc__b i{background:linear-gradient(90deg,#aab6b0,#c3cec8)}
.pc__ax{display:grid;grid-template-columns:132px 52px minmax(0,1fr) 56px;gap:10px;margin-top:5px}
.pc__ticks{display:flex;justify-content:space-between;font-size:11px;color:var(--mut);
  font-variant-numeric:tabular-nums}
.pc__ticks b{font-weight:400}
.pc__note{font-size:12.5px;color:var(--mut);line-height:1.45;margin:13px 0 0;max-width:820px}
.pc__note b{color:var(--ink);font-weight:600}
/* График движков на первом экране (24.10.2026). Лежит в колонке 400 px,
   поэтому сетка строк уже, чем в методике: подпись движка 98 px, счётчик n 30,
   значение 44 — на полоску остаётся ~150 px. Обрезка шкалы 4–7 и оговорка
   про описательность сохранены — на них график держится. */
.hero2 .pc--hero{margin:0;padding:13px 15px 12px}
.hero2 .pc--hero .pc__cap{font-size:17px;line-height:1.25;letter-spacing:-.01em;margin:0 0 13px}
.hero2 .pc--hero .pc__sub{font-size:11.5px;line-height:1.35;margin:0 0 11px}
.hero2 .pc--hero .pc__rows{gap:7px}
.hero2 .pc--hero .pc__r,.hero2 .pc--hero .pc__ax{grid-template-columns:98px 30px minmax(0,1fr) 44px;gap:6px}
.hero2 .pc--hero .pc__l{font-size:12.5px}
.hero2 .pc--hero .pc__n{font-size:11.5px}
.hero2 .pc--hero .pc__v{font-size:12.5px}
.hero2 .pc--hero .pc__b{height:10px}
/* замер 24.10.2026: подпись «движок не определён» в колонке 98 px
   давала горизонтальный overflow 125 px и резалась многоточием — разрешаем перенос */
.hero2 .pc--hero .pc__r--unk .pc__l{white-space:normal;line-height:1.15}
.hero2 .pc--hero .pc__note{font-size:11.5px;line-height:1.35;margin:10px 0 0}
/* метка n<10 на первом экране: колонка узкая, поэтому строка-легенда короче и мельче */
.hero2 .pc--hero .pc__foot{font-size:11px;line-height:1.3;margin:5px 0 0}
@media(max-width:1100px){.hero2 .pc--hero{margin-top:16px}}
@media(max-width:420px){.hero2 .pc--hero .pc__r,.hero2 .pc--hero .pc__ax{grid-template-columns:92px 26px minmax(0,1fr) 40px;gap:5px}.hero2 .pc--hero .pc__l{font-size:11.5px;white-space:normal}}
@media(max-width:620px){
  .pc{padding:14px 13px 12px}
  .pc__r,.pc__ax{grid-template-columns:104px 30px minmax(0,1fr) 44px;gap:7px}
  /* на телефоне «движок не определён» в одну строку не влезает и обрезался
     многоточием (проверено кадром 390px 24.10.2026) — разрешаем перенос в две */
  .pc__l{font-size:12px;white-space:normal;line-height:1.15}
  .pc__v{font-size:12.5px}
}


.crumbs{margin:0 0 6px;font-size:13.5px}
.nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:12px;margin:18px 0 6px}
/* Плашки-переключатели: стоят там, где начинается то, что они фильтруют
   (КАПИТАН 18.10.2026: «этот блок вниз опустить, он же переключатель»). */
.nums--bar{margin:0 0 8px}
.n{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.n b{display:block;font-size:26px;line-height:1.1}
.n span{font-size:12.5px;color:var(--mut)}
/* Плашки-цифры на главной: у каждой свой цвет (КАПИТАН 23.10.2026: «покрась разными
   цветами, повеселее будет»). Цвет живёт в переменной --c, из неё же берётся мягкий
   тон фона (--cbg) — поэтому плашки читаются как семейство, а не как радуга.
   Классы применяются ТОЛЬКО к пяти плашкам главной; в карточках .n остаётся белым. */
.n--c1{--c:#0e9c68;--cbg:#eff9f4;--cbr:#c9e9da}
.n--c2{--c:#bf7305;--cbg:#fdf5e9;--cbr:#efdcc0}
.n--c3{--c:#2e6fd0;--cbg:#eef4fd;--cbr:#cbdff7}
.n--c4{--c:#7a4fc4;--cbg:#f5f1fd;--cbr:#ddd1f2}
.n--c5{--c:#3f6672;--cbg:#f0f6f7;--cbr:#cfe0e4}
.n--c1,.n--c2,.n--c3,.n--c4,.n--c5{background:var(--cbg);border-color:var(--cbr);
 border-top:3px solid var(--c);padding-top:11px}
.n--c1 b,.n--c2 b,.n--c3 b,.n--c4 b,.n--c5 b{color:var(--c)}
.n--c1 span,.n--c2 span,.n--c3 span,.n--c4 span,.n--c5 span{color:#5a6167}
/* «О проверке» — вверху карточки (17.10.2026). Спокойный блок: он объясняет,
   а не кричит, поэтому серый фон и акцентная полоса слева, без рамок-коробок. */
/* «О проверке» — паспорт проверки вверху карточки.
   18.10.2026, второй заход (КАПИТАН: «у меня был вопрос по тому как выглядит блок,
   а не где он находится, дизайн блока»). Замер прежней версии: 4 яруса одного серого
   тона + 3 волосяные линии во всю ширину (под шапкой, над списком, над сноской) —
   блок читался как таблица из админки. Стало: два визуальных контейнера вместо
   четырёх ярусов — (1) шапка с пилюлями даты и объёма, (2) мягкая тонированная
   полоса охвата «Закон | Сайт | SEO» с точками-маркерами и вертикальными
   разделителями; список остался без линий (ритм задаёт воздух), единственная
   линия — над сноской, она отделяет оговорку от фактов. Иерархия подпись/значение
   сделана ЦВЕТОМ и начертанием: подпись 12,5px 600 приглушённая, значение 13,5px
   тёмное — раньше и то и другое было почти одного тона. */
.about{background:#fdfdfb;border:1px solid #e8eae5;border-radius:12px;padding:17px 22px 17px;margin:0 0 20px;font-size:14px;color:#2a3038}
.about p{margin:0}
.about__top{display:flex;align-items:center;justify-content:space-between;gap:8px 18px;flex-wrap:wrap}
.about__h{line-height:1.2}
.about__h b{font-size:16px;font-weight:700;letter-spacing:.2px;color:#14171c}
.about__meta{display:flex;gap:6px;flex-wrap:wrap;font-size:11.5px;line-height:1.5;color:#5c6570;white-space:nowrap}
.about__meta span{background:#f0f2ec;border-radius:999px;padding:3px 10px;font-variant-numeric:tabular-nums}
/* Список «что мы проверяли» — простой вертикальный список фактов (18.10.2026,
   КАПИТАН: «напиши так "Что мы проверяем" и просто список красивый сделай»;
   18.10.2026 позже: «лучше "Что мы проверяли"» — заголовок в about.html).
   Было: таблица «подпись 182px | значение» — колонка подписей держала пустой жёлоб
   и читалась как выгрузка из админки. Стало: обычный список с точкой-маркером в
   левом поле; подпись тёмная жирная, результат — обычным серым, разделитель —
   короткое тире приглушённым цветом. Маркер вынесен в поле (absolute), поэтому
   текст пункта и текст пункта под ним стоят на одной оси. */
.about__did{list-style:none;margin:14px 0 0;padding:0;display:block}
.about__did li{position:relative;margin:0;padding:4px 0 4px 18px;font-size:13.5px;line-height:1.6;color:#5b646e}
.about__did li::before{content:"";position:absolute;left:1px;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--acc);opacity:.5}
.about__did b{font-weight:650;color:#171b21}
.about__did b::after{content:" — ";font-weight:400;color:#b9bfc6}
.about__did span{color:#5b646e}
/* margin без !important: 24.10.2026 снята война !important с правилом ниже
   (`.about--foot .about__foot{margin:0}`) — оно и так специфичнее, поведение то же. */
.about__foot{margin:15px 0 0;padding-top:14px;border-top:1px solid #eceee7;font-size:12px;line-height:1.55;color:#6b737d}
/* 22.10.2026: от блока «Что мы проверяли» осталась одна оговорка — без списка
   сверху разделительная линейка над ней висела в воздухе и читалась как обрыв. */
.about--foot{padding:14px 20px 13px;margin-top:26px}
.about--foot .about__foot{margin:0;padding-top:0;border-top:0}
/* 23.10.2026: оговорка стала дисклеймером на 5 предложений — 12px для неё мелко,
   а выделение <b> гасилось в font-weight:400 (было нужно для короткой строки). */
.about--foot .about__connote{margin:0 0 7px;font-size:11px;line-height:1.3;letter-spacing:.07em;text-transform:uppercase;color:#8b939c;font-weight:700}
.about--foot .about__foot{font-size:13px;line-height:1.62;color:#5c646d}
.about__foot b{font-weight:650;color:#2a3038}
.about__foot a{color:inherit;border-bottom:1px solid #cfd4da;text-decoration:none}
.about__foot a:hover{color:var(--acc);border-bottom-color:var(--acc)}
/* ≤760: список тот же, только компактнее. */
@media (max-width:980px){
 .about__did li{font-size:13px;padding:3.5px 0 3.5px 16px}
}
@media (max-width:760px){
 .about{padding:15px 16px 14px;border-radius:10px}
 .about__meta{font-size:11px;gap:5px}
 .about__meta span{padding:2px 9px}
 .about__foot{font-size:12px}
 .about--foot .about__foot{font-size:12.5px;line-height:1.58}
}
.disc{background:#fff;border:1px solid var(--line);border-left:3px solid var(--acc);border-radius:8px;padding:14px 16px;margin-top:18px;font-size:14px;color:#2a3038}
.disc p{margin:6px 0 0}
/* 27.10.2026: пометка «карточка не пересчитывалась» (сайт не открылся при обходе) —
   нейтральная, не красная: это не нарушение клиники, а наша честность про дату. */
.stalenote{background:#fff8e6;border:1px solid #efe0b4;border-left:4px solid #d3a12a;
 border-radius:8px;padding:12px 16px;margin-top:14px}
.stalenote b{display:block;font-size:15px;color:#7a5b12;margin-bottom:4px}
.stalenote p{margin:4px 0 0;font-size:14px;color:#3a3324}
.tlsbad{background:#fceceb;border:1px solid #f0c7c4;border-left:4px solid var(--bad);border-radius:8px;padding:12px 16px;margin-top:14px}
.tlsbad b{display:block;font-size:15px;color:var(--bad);margin-bottom:4px}
.tlsbad p{margin:4px 0 0;font-size:14px;color:#2a3038}
.tlsbad .mini{color:var(--mut);font-size:12.5px}
.tlsunk{margin-top:12px;color:var(--ask)}
.disc b{font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--mut)}
.check{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px;margin-top:20px}
.check h2{margin:0 0 4px;font-size:19px}
.cform{display:flex;gap:8px;margin-top:12px}
.cform input{flex:1;min-width:0;padding:12px 14px;border:1px solid #cfd3d8;border-radius:8px;font-size:16px}
.cform button{padding:12px 22px;border:0;border-radius:8px;background:var(--acc);color:#fff;font-size:16px;cursor:pointer}
.cform button[disabled]{opacity:.6;cursor:default}
.sug{margin-top:8px;border:1px solid var(--line);border-radius:9px;background:#fff;overflow:hidden;max-width:640px;box-shadow:0 10px 24px rgba(20,23,28,.09)}
.sug[hidden]{display:none}
.sug a{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 12px;padding:9px 13px;text-decoration:none;color:var(--ink);font-size:14.5px;border-bottom:1px solid #f2f2ee}
.sug a:last-child{border-bottom:0}
.sug a:hover,.sug a:focus{background:#f4f7f5}
.sug a b{font-weight:600;overflow-wrap:anywhere}
.sug a span{color:var(--mut);font-size:12.5px;margin-left:auto;letter-spacing:.2px}
.cres{margin-top:10px;font-size:14px}.cres.on{padding:10px 12px;border-radius:8px;background:#f3f4f2}
/* 23.10.2026: ссылка «написать нам» в блоке ответа */
.cres a{color:#1667d1;text-decoration:underline}
.mini--ask{margin:10px 0 0;font-size:13px;color:#5b6360}
.mini--ask a{color:#1667d1;text-decoration:underline}
.cres.okb{background:#eaf5ee;color:var(--ok)}.cres.badb{background:#fceceb;color:var(--bad)}
.sec{font-size:22px;margin:26px 0 6px}
#qcnt{margin:10px 0 0}
.tbl{width:100%;border-collapse:collapse;font-size:14.5px;background:#fff}
.tbl th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--mut);border-bottom:1px solid var(--line);padding:8px 10px}
.tbl td{border-bottom:1px solid #f0f0ec;padding:9px 10px;vertical-align:top}
.tbl td .dom{font-size:12px}
.pill{display:inline-block;min-width:34px;text-align:center;padding:2px 7px;border-radius:3px;font-weight:600;color:#fff;font-size:13px}
.pill--bad{background:var(--bad)}.pill--mid{background:var(--ask)}.pill--low{background:var(--ok)}
.grp{margin:20px 0 34px}
.grp h2{font-size:22px;margin:0 0 12px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.sub{font-size:14px;text-transform:uppercase;letter-spacing:.5px;color:var(--mut);margin:20px 0 8px}
.card{border:1px solid var(--line);border-left:3px solid var(--bad);border-radius:10px;padding:16px 18px;margin:0 0 16px;background:#fff}
.card--bad{border-left-color:var(--bad)}.card--ask{border-left-color:var(--ask)}.card--ok{border-left-color:var(--ok)}
.card__h{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.card__h h3{margin:0;font-size:18px}
.chip{font-size:12px;white-space:nowrap;font-weight:600}
.chip--bad{color:var(--bad)}.chip--ok{color:var(--ok)}
.chip--ask{color:var(--ask)}.chip--unk,.chip--na{color:var(--mut)}
.card__norm{font-size:13.5px;color:var(--mut);margin:8px 0 6px}
blockquote{margin:0 0 10px;padding:8px 14px;border-left:2px solid var(--line);color:#333;font-size:14.5px;background:#fafaf7}
.card__seen{font-size:14.5px;margin:0 0 12px}
.card__page{font-size:13px;color:var(--mut);margin:6px 0 10px}
.shot--none{background:#fff;border:1px dashed #d8d8d2;border-radius:8px;padding:12px 16px;margin-top:14px}
.shot--none b{display:block;color:var(--mut);font-size:14px}
.shot--none p{margin:4px 0 0;font-size:13.5px}
.pill--none{background:#efefea;color:#6b6b64}
/* 18.10.2026: оценки — продолжение блока «Что видит посетитель», а не отдельная
   коробка внутри коробки. Ритм (после разбора виженом, 18.10): оценка идёт
   ГОРИЗОНТАЛЬНОЙ ПОЛОСОЙ над текстом. Почему не плашкой слева: колонка 170px
   против 888px текста давала перекос — плашка либо «висела» в верхней части,
   либо растягивалась на высоту описания и внутри неё появлялись дыры.
   Ниже полосы: вывод, описание в читаемую меру, линия и пять шкал в один ряд
   (было 4 + брошенный пятый в пустом углу). Шкала красится по баллу. */
.vv{margin:18px 0 20px;padding:0;border:0;border-radius:0;background:none}
/* Оценка стоит в ЛЕВОЙ колонке, текст справа (КАПИТАН 18.10.2026, «поменяй местами»). */
.vv__top{display:grid;grid-template-columns:280px minmax(0,1fr);gap:0 40px;align-items:stretch;margin:0 0 10px}
/* 18.10.2026 КАПИТАН: «плашку по высоте делать по тексту справа, будет гармоничнее» —
   колонки тянутся по самой высокой, плашка заполняет высоту описания, кольцо
   центрируется по вертикали. Короткого текста это не касается: ниже своей
   минимальной высоты (кольцо + метка + слово) плашка не сжимается. */
.vv__top--one{grid-template-columns:minmax(0,1fr);margin:0}  /* без плашки текст на всю ширину, иначе он уехал бы в 280px */
.vv__body{min-width:0}
.vv__side{min-width:0;display:flex;flex-direction:column}
/* 18.10.2026 КАПИТАН: «эту плашку можно сделать красивее». Метка сверху, под ней
   кольцо-шкала: серая окружность = максимум, цветная дуга = набранный балл, в
   центре цифра и «из 10», под кольцом слово вердикта с точкой. Фон плашки тонирован
   по вердикту (зелёный/янтарный/красный), поэтому серьёзность видна до чтения цифры. */
.vv__total{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;height:100%;flex:1 1 auto;box-sizing:border-box;margin:0;padding:16px 16px 18px;border-radius:14px;
 box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(16,24,40,.04);border:1px solid #e6e9ee;background:linear-gradient(180deg,#f6f7f9,#f1f3f6)}
.vv__lab{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#6b7280;font-weight:800;line-height:1}
.vv__ring{position:relative;display:grid;place-items:center;width:128px;height:128px}
.vv__ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.vv__ring::after{content:"";position:absolute;inset:16px;border-radius:50%;pointer-events:none;z-index:0;
 background:radial-gradient(circle,rgba(255,255,255,.75),rgba(255,255,255,0))}
.vv__in{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;line-height:1}
.vv__total b{font-size:46px;line-height:.86;font-weight:800;letter-spacing:-.035em;font-variant-numeric:tabular-nums;color:var(--vv-num,currentColor)}
.vv__in u{text-decoration:none;font-size:11px;font-weight:700;color:#4b5563;margin-top:5px;letter-spacing:.04em}
.vv__wordrow{display:flex;align-items:center;gap:7px;margin-top:4px}
.vv__dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.vv__word{font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;line-height:1}
.vv__total--bad{--vv-num:#7f1d1d;background:linear-gradient(180deg,#fdf5f5,#fbebeb);border-color:#f0d5d5;color:#b91c1c}
.vv__total--mid{--vv-num:#78350f;background:linear-gradient(180deg,#fffaf1,#fdf3e0);border-color:#f0dfc0;color:#b45309}
.vv__total--ok{--vv-num:#14532d;background:linear-gradient(180deg,#f5faf6,#eef6f0);border-color:#d7e9db;color:#15803d}
/* 18.10.2026 КАПИТАН: «плашку можно убрать ПОД «Прилично, но есть что поправить…»,
   тогда она встанет на один уровень с текстом справа». Вывод идёт строкой во всю
   ширину, поэтому снизу отбит 14px — это и есть линия, по которой начинаются
   плашка слева и описание справа. */
.vv__verdict{margin:0 0 14px;padding:0 0 0 12px;border-left:3px solid #7c8ea6;font-size:16px;line-height:1.45;font-weight:600;color:#111827;max-width:none}
.vv__verdict:first-child{margin-top:0}
.vv__verdict--bad{border-left-color:#b91c1c}
.vv__verdict--mid{border-left-color:#b45309}
.vv__verdict--ok{border-left-color:#15803d}
.vv__note{margin:-6px 0 14px;padding-left:15px;font-size:14px;line-height:1.45;color:#5d6b7a}
.vv__desc{margin:0;font-size:15px;line-height:1.62;color:#2f3338;max-width:80ch;text-wrap:pretty}
/* 19.10.2026, КАПИТАН: «в комментариях учитывать и версию для слабовидящих».
   Второй абзац комментария — про режим. Отделён воздухом, полосой слева по цвету
   вердикта и меткой-жирным в начале, чтобы читалось как часть отзыва, а не как
   ещё одна справка. Мера та же 80ch, что у описания. */
.vv__va{margin:12px 0 0;padding:0 0 0 12px;border-left:3px solid #7c8ea6;font-size:15px;line-height:1.62;color:#2f3338;max-width:80ch;text-wrap:pretty}
.vv__va--bad{border-left-color:#b91c1c}
.vv__va--mid{border-left-color:#b45309}
.vv__va--ok{border-left-color:#15803d}
.vv__vat{font-weight:700;color:#111827}
.vv__subs{list-style:none;margin:16px 0 0;padding:16px 0 0;border-top:1px solid #ececec;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px 22px}
/* шестая шкала (режим для слабовидящих): своя сетка, иначе она одна уезжает на
   второй ряд под пустыми колонками */
.vv__subs--6{grid-template-columns:repeat(6,minmax(0,1fr))}
/* шесть шкал: подпись любой длины не должна сдвигать свою полоску — иначе шкалы
   встают лесенкой и сравнивать оценки глазом нельзя (19.10.2026) */
.vv__subs--6 .vv__sr{min-height:34px;align-content:start}
.vv__s{font-size:13px;min-width:0}
.vv__sr{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin:0 0 6px}
.vv__n{font-weight:600;line-height:1.3}
.vv__v{color:#4b5563;font-variant-numeric:tabular-nums;white-space:nowrap}
.vv__bar{display:block;height:6px;border-radius:3px;background:#eceef2;overflow:hidden}
.vv__bar i{display:block;height:100%;background:#7c8ea6}
.vv__bar--ok i{background:#2f855a}
.vv__bar--mid i{background:#b45309}
.vv__bar--bad i{background:#b91c1c}
.vv__why{margin:6px 0 0;font-size:12px;line-height:1.45;color:#6b7280;text-wrap:pretty}
@media (max-width:960px){
 /* в одну колонку: сначала оценка, под ней вывод и описание */
 .vv__top{grid-template-columns:minmax(0,1fr);gap:0}
 .vv__side{margin:0 0 14px;display:flex}
 .vv__total{width:max-content;max-width:100%;height:auto;flex:0 0 auto}
 /* Плашка в одну колонку шла во всю ширину и вокруг кольца оставалась мёртвая
    полоса (728px при кольце 128). Теперь она — строка: кольцо слева, справа
    метка и слово вердикта над/под ним (18.10.2026). */
 .vv__total{display:grid;grid-template-columns:auto minmax(0,1fr);
  grid-template-areas:"ring lab" "ring word";height:auto;padding:12px 18px;
  column-gap:18px;row-gap:5px;justify-items:start;align-content:center}
 .vv__ring{grid-area:ring;width:92px;height:92px}
 .vv__lab{grid-area:lab;align-self:end}
 .vv__wordrow{grid-area:word;align-self:start;margin-top:0}
 .vv__total b{font-size:35px}
 .vv__in u{font-size:11px;margin-top:3px}

 .vv__subs,.vv__subs--6{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
 /* пять пунктов в две колонки дают сироту в последнем ряду — растягиваем её
    на обе колонки, чтобы правый край оставался ровным */
 .vv__s:last-child:nth-child(odd){grid-column:1/-1}
}
@media (max-width:620px){
 .vv__total{padding:11px 14px;column-gap:14px}
 .vv__ring{width:84px;height:84px}
 .vv__total b{font-size:32px}
 .vv__in u{font-size:9.5px}
 .vv__subs,.vv__subs--6{grid-template-columns:minmax(0,1fr)}
 .vv__why{font-size:12.5px}
}
.sp{margin:14px 0 16px;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:#fff}
.sp__h{font-weight:700;margin:0 0 8px}
.sp__t{margin:0 0 12px;line-height:1.55}
.sp--bad{border-left:4px solid var(--bad)}
.sp--mid{border-left:4px solid #d97706}
.sp--ok{border-left:4px solid #15803d}
/* 19.10.2026: кадры режима для слабовидящих переехали вторым рядом ленты
   (.shots3--va ниже). Прежние правила .sp__band / .sp__f оставлены в истории правок;
   вида (1920·1440·768·390). Только отступ сверху и сброс рамки у figure. */
.shots3wrap{margin:18px 0 6px}
/* ВТОРОЙ РЯД ЛЕНТЫ — тот же сайт в режиме для слабовидящих (19.10.2026, КАПИТАН:
   «размещать сразу после нормальных скринов, второй строкой, но соблюдая отступы»).
   Отступы не выдуманы, а взяты из той же шкалы, что у первого ряда: между рядами
   20px, под ней 10px: подпись принадлежит НИЖНЕМУ ряду, поэтому снизу она ближе
   к своим кадрам, чем сверху к чужим (иначе читается как подпись верхнего ряда).
   Зазор между кадрами 12px — тот же, что в первом
   ряду: колонки двух рядов стоят на одних и тех же x, и «было / стало» сравнивается
   одним движением глаза, без пересчёта. */
.shots3--va{margin-top:0}
.sh3__rowh{margin:20px 0 10px;font-size:15px;font-weight:700;color:var(--ink);line-height:1.3}
.sh3__rowh .mini{font-weight:400}
/* Пустое место вместо кадра, которого в этом режиме нет: ширину держим, чтобы
   соседние кадры не разъехались и ряды остались в одной сетке. */
.sh3--gap{visibility:hidden}
.sh3__h{margin:0 0 12px;font-size:16px;font-weight:700;color:var(--ink)}
.sh3__h .mini{font-weight:400}
/* ЛЕНТА КАДРОВ (18.10.2026). КАПИТАН: «можно уменьшить скрины и скомпоновать
   удачнее, подумай» → выбран вариант «все четыре в один ряд мелко».
   Что это дало:
     • блок занимает ~235px по высоте вместо ~1900 (раньше две простыни во всю ширину);
     • кадры стоят на одной высоте — сравниваются между собой сразу;
     • ширина у каждого своя, по реальной пропорции снимка: монитор широкий,
       телефон — узкий столбик. Обрезки и растяжения нет, виден весь первый экран;
     • «всё равно увеличиваются» — клик открывает кадр в полном размере.
   Механика: высота задана переменной --h3, ширина получается сама
   (img{height:var(--h3);width:auto}), поэтому пропорции держатся сами. */
.shots3{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 14px;
  max-width:1120px;align-items:start;
  --h3:min(calc((100% - (var(--n) - 1) * 12px) / var(--sum)), 380px)}
/* Ширина кадра считается от высоты и ПРОПОРЦИИ снимка: --ar — это naturalWidth/naturalHeight.
   Раньше ширину задавал контент (картинка + подпись), и подпись оказывалась шире кадра
   (у 1920 — 483px против 356px), уезжала вправо и давала горизонтальный скролл страницы
   (поймано замером на 1024 и 820). Теперь ширина задана формулой, подпись переносится
   внутри кадра.
   --n (сколько кадров) и --sum (сумма их пропорций) подставляет сборка — поэтому лента
   ровно заполняет ширину контента и при трёх кадрах, и при четырёх: высота выводится
   из ширины, а не задана числом. Пустого места справа не остаётся ни в одном случае. */
.sh3{--ar:1.6;margin:0;min-width:0;width:auto;max-width:100%}
.sh3--1920{--ar:1.7778;grid-column:span 2}
.sh3--1440{--ar:1.6;grid-column:span 2}
.sh3--768{--ar:0.75;grid-column:span 2;width:300px;max-width:100%;justify-self:start}
.sh3--390{--ar:0.4616;grid-column:span 2;width:170px;max-width:100%;justify-self:start}
.sh3>a{display:block;position:relative;border:1px solid var(--line);border-radius:9px;
  overflow:hidden;background:#f5f5f5;cursor:zoom-in;box-shadow:0 1px 2px rgba(0,0,0,.05);
  transition:box-shadow .14s,border-color .14s}
.sh3>a:hover{box-shadow:0 3px 12px rgba(0,0,0,.13);border-color:#c4c4c4}
.sh3>a{aspect-ratio:var(--ar)}
.sh3 img{display:block;width:100%;height:100%;
  position:absolute;inset:0;object-fit:cover;object-position:top left}
/* Разрешение — меткой в углу кадра: подпись под ним остаётся про «что не так»
   и не рвётся на две строки ради «1440×900». */
.sh3__dim{position:absolute;left:6px;bottom:6px;margin:0;padding:2px 7px;
  background:rgba(20,20,20,.76);color:#fff;font-size:11.5px;font-weight:700;
  letter-spacing:.4px;border-radius:4px;z-index:1}
/* Подпись под кадром: КОРОТКАЯ (см. _sh3_short). В ленте кадр 768 — это ~145px,
   телефон ~92px: фраза на 120 знаков под ними превращается в башню. Полные цифры
   и пороги лежат в таблице замеров ниже, там же, где все остальные цифры карточки. */
.sh3__cap{margin:7px 0 0;min-width:0;font-size:13px;font-weight:600;
  color:var(--ink);line-height:1.32;letter-spacing:0}
/* Подпись режется на строки-смыслы: первая — что не так, вторая — цифра.
   КАПИТАН 18.10.2026 «важно что и как ты напишешь»; местное зрение к первой
   версии ленты: текст шёл полотном и рвался в неудобном месте («50 px против //
   блоков ниже»). Теперь каждая мысль — своя строка. */
.sh3__t{display:block;min-width:0}
.sh3__l{display:block}
.sh3__l + .sh3__l{margin-top:3px;font-weight:500;color:#505860;font-size:12.5px}
/* Рамка у всех кадров одна, серая. КАПИТАН 18.10.2026: «непонятно зачем первый
   скрин в жёлтой рамке?» — жёлтая рамка была меткой «этот кадр снят из-за найденной
   ошибки», но читателю она ничего не говорила и спорила с зелёной галочкой.
   Цвет теперь говорит только значок под кадром, рамка — нейтральная. */
.sh3__miss{color:#8a5a00;margin:10px 0 0}
/* Узкие кадры: метка разрешения мельче, иначе накрывает пол-кадра. */
.sh3--768 .sh3__dim,.sh3--390 .sh3__dim{font-size:10.5px;padding:2px 6px}
/* Телефон: четыре кадра в ряд дали бы высоту 70px — не разглядеть. Переносим
   и фиксируем высоту, пропорции держатся сами (width:calc(h*ar)). */
/* 19.10.2026: кадров стало ЧЕТЫРЕ у всех карточек (раньше 1920 был только там, где
   замер нашёл расхождение). Старое правило «wrap + высота 180px» на четырёх кадрах
   давало разъезд: 1920 (ширина 320) занимал строку целиком, 1440 уходил на вторую,
   а 768 с 390 жались в третью — три рваные строки разной высоты (замер 390px:
   y=1073 / 1336 / 1578, высоты 249 / 228 / 175).
   Стало: на узком экране — сетка 2×2, ячейки равные, кадры встают парами
   «компьютерные / планшет и телефон», оба ряда ленты (обычный и режим) совпадают
   по x, потому что считаются одинаково. */
@media (max-width:600px){
  .shots3{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .shots3 .sh3--768{width:100%;max-width:none}
  .shots3 .sh3--390{width:100%;max-width:none}
  .shots3 .sh3>a{max-height:430px}
}
@media (max-width:420px){.sh3__cap{font-size:12px}}

/* ── Плашки-фильтры в шапке карточки (17.10.2026) ──────────────────────────────
   КАПИТАН: «надо расположить плашки в таком порядке и сделать их кликабельными,
   чтобы фильтровать результаты вывода ниже, чтобы не было простыни». Плашка —
   <button>, поэтому она работает и с клавиатуры, и на телефоне пальцем. */
button.n{font:inherit;text-align:left;color:var(--ink);cursor:pointer;appearance:none;
  transition:border-color .12s,box-shadow .12s,background .12s}
button.n:hover{border-color:var(--acc);box-shadow:0 2px 8px rgba(31,95,91,.12)}
button.n:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
button.n.is-on{border-color:var(--acc);background:#eef4f3;box-shadow:inset 0 0 0 1px var(--acc)}
button.n.is-on b{color:var(--acc)}
.nums__hint{font-size:12.5px;color:var(--mut);margin:8px 0 0;line-height:1.5}
/* 18.10.2026, КАПИТАН: «при переключении на плашках заголовок прыгает». Три причины,
   все замерены: (1) статус фильтра стоял инлайном в подсказке и менял её высоту
   (390px: 75 → 56px; 1024px: 37,5 → 18,8) — вместе с ним уезжал заголовок;
   (2) .grp--law h2{margin-top:0}; (3) .grp--tech{margin-top:20px}.
   Теперь статус — своя строка с зарезервированной высотой (visibility, не hidden
   из потока), а отступ от плашек до первого блока у всех один. */
.filbar{display:flex;gap:10px;align-items:baseline;margin:3px 0 0;min-height:19px;
  font-size:12.5px;line-height:1.5;color:var(--acc);
  visibility:hidden;white-space:nowrap;overflow:hidden}
.filbar.is-on{visibility:visible}
.filbar__t{min-width:0;overflow:hidden;text-overflow:ellipsis}
.filbar b{font-weight:600}
.filreset{background:none;border:0;padding:0;color:var(--acc);font:inherit;cursor:pointer;
  text-decoration:underline;text-underline-offset:2px}
/* фильтр: по умолчанию всё видно, при выборе плашки остаются только её блоки */
body[data-fil] .fblk{display:none}
body[data-fil="pg"] .fblk--pg,
body[data-fil="ok"] .fblk[data-f="ok"],
body[data-fil="viol"] .fblk[data-f="viol"],
body[data-fil="ask"] .fblk[data-f="ask"],
body[data-fil="tech"] .fblk[data-f="tech"],
body[data-fil="seo"] .fblk[data-f="seo"]{display:block}
body[data-fil] .grp>.tintro{display:none}
/* 18.10.2026: h2 блока замера живёт внутри .tintro, и фильтр его прятал — после
   нажатия «технические замечания» шли 4 строки с крестиками без заголовка и без
   оговорки «не требование закона». Заголовок возвращаем, длинный лид оставляем
   спрятанным (он дублирует методику). */
body[data-fil="tech"] .grp--tech>.tintro{display:block}
body[data-fil="tech"] .grp--tech>.tintro .tlead{display:none}
body[data-fil="tech"] .trow{display:list-item}
body[data-fil="seo"] .trow{display:none}
body[data-fil="seo"] .trow--seo{display:list-item}
.fblk--pg{display:none}
body[data-fil="pg"] .fblk--pg{display:block}
.fblk--pg{margin-top:20px}
.fblk--pg h2{margin:0 0 12px;padding-bottom:6px;border-bottom:1px solid var(--line);font-size:22px}
/* значок под кадром: цвет говорит сам, слов-состояний нет */
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.sh3__v{margin:0;font-size:inherit;font-weight:600;line-height:1.35;
  display:inline-flex;gap:9px;align-items:baseline;max-width:100%;min-width:0;
  background:none;border-radius:0;padding:0}
.sh3__v .sh3__i{flex:0 0 auto;width:21px;height:21px;border-radius:50%;font-size:14px;
  font-weight:700;line-height:21px;text-align:center;color:#fff;background:#8a8a80;
  display:inline-block;align-self:center}
.sh3__v span{color:inherit}
.sh3__v--ok{color:var(--ok)}
.sh3__v--ok .sh3__i{background:var(--ok)}
.sh3__v--bad{color:#8a1f1f}
.sh3__v--bad .sh3__i{background:var(--bad)}
.sh3__v--warn{color:#6d5000}
.sh3__v--warn .sh3__i{background:#d18b00}
.sh3__v--na{color:var(--mut)}
/* В ленте значок мельче текста подписи: кружок 21px при тексте 12,5px выглядит
   как наклейка на странице. */
.sh3__cap .sh3__i{width:16px;height:16px;line-height:16px;font-size:11px}
.sh3__cap .sh3__v{gap:7px;align-items:flex-start;display:flex}
.shot{margin:0 0 12px}
.shot img{width:100%;max-width:760px;height:auto;border:1px solid var(--line);border-radius:8px;display:block;background:#fafafa}
.shot figcaption{font-size:12.5px;color:var(--mut);margin-top:6px}
.how{margin:4px 0 0;padding-left:20px;font-size:14px;color:#2a3038}
.how code{background:#f2f2ee;padding:1px 5px;border-radius:4px}
kbd{border:1px solid #cfd3d8;border-bottom-width:2px;border-radius:4px;padding:0 4px;font-size:12px;background:#fafafa}
.lst{margin:0 0 8px;padding-left:20px;font-size:14.5px}
.lst li{margin-bottom:6px}
/* 18.10.2026: длинный путь без пробелов (/upload/iblock/…) растягивал карточку
   на телефоне — 440px контента в 390px экрана, горизонтальная прокрутка. */
.lst li,.lst a,.phead h1,.fblk{overflow-wrap:anywhere}

.mini{font-size:13px;color:var(--mut)}
.grp--tech{margin-top:20px}
.grp--tech h2{font-size:22px}
.grp--tech h2 .mini{font-weight:400}
.tlead{font-size:13.5px;color:#5a5347;margin:0 0 14px;line-height:1.55}
.lst--tech{padding-left:0}
.lst--tech li.trow{display:grid;grid-template-columns:22px 1fr;column-gap:12px;align-items:start;
  margin:0;padding:11px 0;border-bottom:1px solid #f1f0ec;font-size:16px}
.lst--tech li.trow:last-child{border-bottom:0}
.tx{display:block;min-width:0}
.tmeas{display:block;margin-top:2px;font-size:13px;line-height:1.5;color:#4a4438}
/* «Что это значит» у технического/SEO-пункта (18.10.2026, КАПИТАН: «пояснялки
   на все пункты проверки»). Оформлено как пояснение у правового пункта
   (.lw__mean): та же вертикальная линейка, тот же кегль — чтобы два вида
   пунктов на карточке читались одинаково. Зелёная плашка .tsay над ней
   больше не печатается: она трижды повторяла одну и ту же цифру. */
.tmean{display:block;margin:6px 0 0;padding:0 0 0 11px;border-left:2px solid #ece9df;
 font-size:13.5px;line-height:1.55;color:#33332e;max-width:78ch;overflow-wrap:break-word}
.tmean b{font-weight:700;color:#111110}

/* Строка пункта по плашке (18.10.2026): значок + что проверяли + ссылка на статью
   закона. Доказательство свёрнуто, чтобы не было простыни. */
.grp--law h2{margin-top:0}
.sub .mini{text-transform:none;letter-spacing:0;font-weight:400}
.subhint{font-size:13.5px;color:var(--mut);margin:-4px 0 12px;max-width:80ch}
.lw{list-style:none;margin:0 0 10px;padding:0}
.lw__i{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;
  padding:11px 0;border-bottom:1px solid #f1f0ec}
.lw__i:last-child{border-bottom:0}
.lw__m{width:22px;height:22px;border-radius:50%;color:#fff;font-weight:700;font-size:13px;
  line-height:22px;text-align:center;background:#8f8f85;display:inline-block}
.lw__i--ok .lw__m{background:var(--ok)}
.lw__i--bad .lw__m{background:var(--bad)}
.lw__i--ask .lw__m{background:#d18b00}
.lw__i--unk .lw__m,.lw__i--na .lw__m{background:#b9b9b2}
.lw__x{min-width:0}
.lw__g{display:inline-block;font-size:11px;letter-spacing:.5px;text-transform:uppercase;
  color:var(--mut);margin-right:6px}
.lw__w{font-weight:600}
.lw__n{display:block;margin:4px 0 0;font-size:13px;line-height:1.5;
  white-space:normal;color:var(--mut)}
.lw__n a{color:var(--acc);text-decoration:none;border-bottom:1px solid rgba(29,99,180,.28)}
.lw__n a:hover{border-bottom-color:var(--acc)}
.lw__sep{color:#c6c5be}
/* Цитата нужного абзаца нормы (КАПИТАН 18.10.2026: «дополнить цитатой»).
   Слева волосяная линейка того же цвета, что и акцент блока, но приглушённая:
   цитата должна читаться как сноска к норме, а не как ещё один абзац текста. */
.lw__q{display:block;margin:5px 0 0;padding:1px 0 1px 11px;
 border-left:2px solid rgba(29,99,180,.22);font-size:12.5px;line-height:1.6;
 color:#5a5a52;font-style:normal;letter-spacing:.1px;max-width:78ch;overflow-wrap:break-word}
/* отсылка к абзацу выше: тем же кеглем, но приглушённо — чтобы не читалась
   как «тут забыли текст» (18.10.2026: длинный юридический абзац курсивом
   читать тяжело, а повторять его три раза подряд — простыня) */
.lw__q--same{color:#8a8a81;font-size:12.5px}
.lw__mean{display:block;margin:6px 0 0;padding:0 0 0 11px;font-size:13.5px;line-height:1.55;
 color:#33332e;font-style:normal;max-width:78ch}
.lw__mean b{font-weight:700;color:#111110}
/* Штраф по КоАП (КАПИТАН 18.10.2026: «можно добавить ещё штраф какой там по
   закону»). Отдельная пилюля приглушённого красного, а не ещё одна серая строка:
   это единственное место на карточке, где речь про деньги, и его должно быть
   видно, но оно не должно орать — фон #fdf4f3, не алый. Печатается только в
   блоке «не нашли — по закону это должно быть на сайте».

   18.10.2026, вторая правка (КАПИТАН: «тут что-то с вёрсткой, штраф почему-то не
   на другой строчке»). display был inline-block, и там, где у пункта НЕТ
   пояснения-факта (.lw__n), плашка прилипала к хвосту заголовка: «…а раздела про
   cookie нет Штраф для юрлица: …». Теперь block + width:fit-content — всегда своя
   строка, а ширина по содержимому (пилюля, а не полоса на всю карточку).
   ГРАБЛИ: нельзя вставлять внутрь этого комментария его же закрывающий маркер —
   блок обрывается на нём, хвост текста уезжает в CSS как мусор, и правило
   .lw__f{…} МОЛЧА выбрасывается парсером. Проверка: computedStyle у плашки
   оставался inline с margin 0, хотя в файле правило есть. */
/* Обёртка плашки: разрыв строки — в РАЗМЕТКЕ (block), а не только в правиле
   .lw__f. Тогда склейка «…cookie нет Штраф для юрлица…» не вернётся, даже если
   кто-то поменяет display у самой плашки. */
.lw__frow{display:block}
.lw__f{display:inline-block;margin:7px 0 0;padding:3px 10px;border-radius:7px;
 background:#fdf4f3;border:1px solid #f0dcda;font-size:12.5px;line-height:1.45;
 color:#8a3a33;max-width:78ch}
.lw__f b{font-weight:700;color:var(--bad);margin-right:3px}
.lw__i--unk .lw__mean,.lw__i--na .lw__mean{color:#8c8c83}
.lw__i--unk .lw__mean b,.lw__i--na .lw__mean b{color:#6f6f68}
.card__mean{margin:6px 0 0;font-size:13.5px;line-height:1.55;color:#46463f}
.card__mean b{font-weight:600;color:#1d1d1a}
.lw__i--unk .lw__q,.lw__i--na .lw__q{color:#8c8c83;border-left-color:rgba(0,0,0,.13)}
.lw__i--unk .lw__w,.lw__i--unk .lw__n,.lw__i--na .lw__w,.lw__i--na .lw__n{color:var(--mut)}
.lw__i--unk .lw__n a,.lw__i--na .lw__n a{color:#8f8f85;border-bottom-color:rgba(0,0,0,.14)}
.tk{display:inline-block;width:22px;height:22px;border-radius:50%;color:#fff;font-weight:700;
  font-size:13px;line-height:22px;text-align:center;background:#8f8f85;margin:0}
.tk--bad{background:var(--bad)}.tk--ask{background:#d18b00}.tk--ok{background:var(--ok)}
.tk--unk{background:#b9b9b2}
.rx{margin:6px 0 0;font-size:13.5px;color:var(--mut)}
.rx summary{cursor:pointer;color:var(--acc);font-size:12.5px}
.rx p{margin:6px 0 0;max-width:900px;background:#fbfaf7;border-left:2px solid var(--line);padding:6px 10px}
.pglist{margin:8px 0 0;padding:0;list-style:none;font-size:14.5px;line-height:1.6;max-width:900px}
.pglist li{margin:0 0 3px;break-inside:avoid;display:grid;grid-template-columns:22px 1fr;column-gap:12px}
.pgn{color:var(--mut);font-size:12px;line-height:1.75;text-align:right}
.pgmore{margin:6px 0 0}
.pgmore summary{cursor:pointer;color:var(--acc);font-size:12.5px;padding:2px 0}
.pgmore ul{padding-left:0;margin-top:4px}
@media(max-width:720px){.lw__n{font-size:12px}}
@media(max-width:520px){.lw__g{display:block;margin:0 0 2px}}
.foot{border-top:1px solid var(--line);padding:22px 0;background:var(--bg);font-size:13.5px;color:var(--mut)}
.foot p{margin:0 0 8px;max-width:900px}
/* 23.10.2026: на главной пять плашек. auto-fit давал на 768 «4 + 1» — одна
   плашка висела в одиночестве на второй строке. На средних ширинах ставим
   три колонки: выходит 3 + 2, без сироты. Карточек это не касается — у них
   в .nums четыре плашки и они стоят в ряд. */
@media(min-width:721px) and (max-width:1100px){.phead--main .nums{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.nums{grid-template-columns:repeat(2,1fr)}.hide-s{display:none}.phead h1{font-size:24px}.phead--main h1{font-size:26px}}
/* ТАБЛИЦА НА ТЕЛЕФОНЕ (18.10.2026): 5 колонок в 390px не влезали — таблица
   выходила 474px и страница ехала вбок (scrollWidth 494 при 390). На узком экране
   скрываем «Категорию» и «Страницы» (класс hide-s) и разрешаем домену переноситься:
   остаются три колонки — Название, Сайт, Замечания. */
@media(max-width:720px){
 .tbl{font-size:13px;table-layout:fixed}
 /* фиксированные доли: иначе домен получал 67px и рвался по буквам.
    23.10.2026: :not(.tbl--m) — эти доли написаны под каталог (2-я колонка = домен).
    Таблица методики (.tbl--m/.tbl--mm) устроена наоборот: во 2-й колонке норма с
    цитатой, ей нужно больше половины ширины. Раньше правило доставалось и ей —
    колонка получала 118px и 159 знаков текста рвались на 13 строк по 12 знаков. */
 .tbl:not(.tbl--m):not(.tbl--mm) th:nth-child(2),.tbl:not(.tbl--m):not(.tbl--mm) td:nth-child(2){width:118px}
 .tbl:not(.tbl--m):not(.tbl--mm) th:nth-child(5),.tbl:not(.tbl--m):not(.tbl--mm) td:nth-child(5){width:76px}
 .tbl th{font-size:11px;padding:7px 6px;letter-spacing:.3px}
 .tbl td{padding:8px 6px}
 .tbl td .dom{font-size:11.5px;overflow-wrap:anywhere;word-break:break-word}
}

/* ЧЕСТНАЯ ПОМЕТКА ОБХОДА (18.10.2026): звёздочка у числа страниц — «открыто столько,
   но обход остановился по времени». Не пугать, а объяснять: цвет тот же янтарный,
   что у плашки «требует уточнения». */
.pmark{color:var(--ask);font-weight:600;margin-left:1px}

/* 18.10.2026 (КАПИТАН): «в блоке "Требуют уточнения" есть штрафы? если они
   проверили и у них этого нет — есть ли штраф?» Штраф печатается и там, но
   это НЕ факт, а условие: «если сведений действительно нет». Поэтому тон
   другой — песочный, а не красный: факт нарушения и предположение о нём
   должны различаться с первого взгляда, не чтением подписи. */
.lw__f--ask{background:#fdfaf1;border-color:#efe3c6;color:#6d5a33}
.lw__f--ask b{color:#8a6a1f}
/* 18.10.2026 (КАПИТАН): у части обязательных пунктов суммы штрафа нет —
   её устанавливает проверка, а не наш обход. Такую строку печатаем не как
   штраф, а как справку: серый тон вместо красного/песочного, чтобы в ряду она
   не читалась ни «нарушение», ни «штраф известен». */
.lw__f--nosum{background:#f7f7f4;border-color:#e6e6df;color:#5c5c55}
.lw__f--nosum b{color:#3d3d38}

/* ── Цитата с сайта клиники в шапке карточки (18.10.2026) ────────────────────
   КАПИТАН: «справа можно процитировать информацию с их сайта про клинику, больше
   доверия будет». Слева наши данные (имя, домен, категория), справа дословная
   цитата с сайта клиники с адресом страницы и датой съёма.

   18.10.2026, второй заход (КАПИТАН: «сделал некрасиво … и то что так клиника
   пишет о себе — не надо, достаточно просто цитаты»). Что было не так и что стало:
   1) ярлык «ТАК КЛИНИКА ПИШЕТ О СЕБЕ» мелким серым капсом висел отдельно от
      цитаты и спорил с ней за внимание — убран совсем;
   2) глобальный стиль blockquote (фон #fafaf7, padding, своя серая линейка слева)
      накладывался на наш border-left — получалась коробка без скруглений с ДВУМЯ
      линейками и текстом, вжатым в край. Теперь blockquote внутри карточки
      обнулён, а карточка одна: белая, с рамкой и скруглением 12 px (как «О
      проверке»), акцентная полоса слева — как у остальных врезок сайта;
   3) подпись «Источник: … · снято 18.10.2026» шла вплотную к тексту — теперь она
      отделена волосяной линией и читается как подпись под цитатой.

   18.10.2026, третий заход (КАПИТАН: «блок надо нормально расположить относительно
   инфы слева, а не прижимать в край сайта»). Было: сетка 1fr + 372 px, карточка
   упиралась в правый край контейнера (x 888–1260 при 1440), а слева короткий текст
   «Dnclinic / dnclinic.ru / Стоматологическая клиника» кончался на ~470 — между
   ними зияло 420 px пустоты, и карточка читалась как отдельный блок, приклеенный к
   краю. Стало: одна колонка, цитата идёт ПОД названием и категорией, по той же
   левой оси (180), ширина до 680 px (~78 знаков — комфортная строка для цитаты).
   Пустоты справа нет по определению: блок не тянется к краю, а стоит в тексте.
   Замер 1440: карточка 180–860, шапка выросла с 186 до 242 px (+56).

   18.10.2026, четвёртый заход (КАПИТАН: «почему внизу, почему не справа от названия
   и домена?»). Под цитатой — не то, что он просил: она должна стоять СПРАВА от
   названия. Причина, по которой в третьем заходе ушла вниз, была не в «справа»,
   а в фиксированной колонке 372 px: слева короткий текст, справа блок, прижатый к
   самому краю контейнера, между ними 420 px пустоты. Теперь сетка из двух РАВНЫХ
   колонок (1fr / 1.02fr, зазор 40): левая занимает половину независимо от длины
   названия — пустота читается как колонка, а не как дыра, и цитата стоит справа
   от названия. Класс .phead__row--q ставится только когда цитата есть: без неё
   шапка остаётся одноколоночной (иначе заголовок получал половину ширины зря).
   На <=900 px колонки не помещаются — цитата возвращается под название. */
.phead__row{display:flex;align-items:flex-start;justify-content:space-between;gap:28px}
.phead__main{min-width:0;flex:1 1 auto}
/* PDF ДЛЯ ПЕЧАТИ — КНОПКА ВПЛОТНУЮ К НАЗВАНИЮ (24.10.2026, второй заход)
   КАПИТАН: «поставь кнопку пдф рядом с названием, что-то не впечатляет она меня
   сейчас в том виде где стоит». Первый заход ставил её отдельной колонкой
   `.phead__act` с `margin-left:auto` — то есть в правый край контейнера: при 1440
   кнопка стояла на x=1096, а название кончалось на x=294 — 800 px пустоты между
   ними, кнопка читалась как «приклеена к краю страницы», а не к названию.
   Теперь она живёт ВНУТРИ h1 сразу после текста названия (inline-flex,
   vertical-align:middle) — идёт следом за именем клиники на любой ширине,
   сколько бы знаков в названии ни было. Домен и категория остаются ниже.

   Размер: h1 = 30px/1.2, поэтому кнопка взята на 13.5px с рамкой 1px и скруглением
   8px — на одной линии с названием не спорит, но и не теряется. В печати (и в
   PDF, который снимается через emulate_media('print')) кнопка не нужна — скрыта.

   ВЫСОТА = ВЫСОТА БУКВ НАЗВАНИЯ (27.10.2026). КАПИТАН: «кнопку в шаблоне
   карточки PDF для печати выровняй по высоте относительно название».
   Замер до правки: кнопка 32 px, а видимые буквы названия (ink) 26–28 px,
   и центр кнопки стоял на 2 px ниже центра строки. Пробовал 36 px
   (=line-height) — на замере кнопка вышла выше и ниже букв, читалась тяжелее
   названия. Итог: height 28 px, padding только по горизонтали,
   box-sizing:border-box, vertical-align:middle. Замер: кнопка y=154.2…182.2
   при буквах 154.1…182.1 (расхождение 0,1 px), на ≤720px — 24 px. */
.pdfbtn{display:inline-flex;align-items:center;justify-content:center;gap:7px;font:inherit;
  font-size:13.5px;font-weight:600;line-height:1;color:var(--acc);background:#fff;
  border:1px solid rgba(31,95,91,.34);border-radius:8px;padding:0 13px;
  height:28px;box-sizing:border-box;          /* = высота букв названия (30px, ink 26–28 px) */
  vertical-align:middle;margin-left:14px;text-decoration:none;white-space:nowrap;
  box-shadow:0 1px 2px rgba(20,30,25,.05);
  transition:background .15s,color .15s,border-color .15s}
.pdfbtn:hover,.pdfbtn:focus-visible{background:#174b47;color:#fff;border-color:#174b47}
.pdfbtn svg{width:14px;height:14px;flex:0 0 auto}
/* высота кнопки = высота САМИХ БУКВ названия (замер ink, не line-height):
   h1 30px → ink 26–28 px, поэтому 28 px; на ≤720px h1 24px и кнопка 24 px
   (это же минимум WCAG 2.2 AA по размеру цели — мельче делать нельзя) */
@media(max-width:720px){.pdfbtn{height:24px}}
@media(max-width:700px){
  .phead__row{display:block}
  .pdfbtn{font-size:12.5px;padding:0 11px;margin-left:10px;gap:6px}
  .pdfbtn svg{width:13px;height:13px}
}
@media print{.pdfbtn{display:none!important}}
.phead__row .phead__main h1{max-width:none}
/* цитата справа от названия: две РАВНЫЕ колонки, а не «текст + фикс 372 px» */
.phead__row--q{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);
  column-gap:40px;align-items:start;margin:0 0 18px}
.phead__row--q .selfq{margin:6px 0 0;max-width:none}
/* Отступы карточки-цитаты считаются от ЕЁ ВНЕШНИХ КРАЁВ, а не от content-box:
   слева стоит цветная полоса 3px, справа рамка 1px, поэтому равные padding давали
   разный воздух (21 слева против 19 справа — замер 18.10.2026). Подобраны так,
   чтобы замер сошёлся: слева 3+16=19, справа 18+1=19, сверху 1+15=16, снизу 15+1=16.
   КАПИТАН 18.10.2026: «чтобы там отступы были хотя бы соблюдены и чтобы так было
   сразу, а не я тебе по 10 раз говорил» — ворота T22 в medstat_qa.py теперь валят
   сборку, если эти числа разъедутся. */
.selfq{margin:16px 0 20px;max-width:680px;padding:15px 18px 15px 16px;background:#fff;
  border:1px solid #e6e8e2;border-left:3px solid rgba(31,95,91,.35);border-radius:12px;min-width:0}
/* сброс глобального blockquote: он приносил свой фон, отступы и вторую линейку */
.selfq__t{margin:0 0 10px;padding:0;border:0;background:none;font-size:15px;
  line-height:1.6;color:#21262c;overflow-wrap:anywhere;
  /* hyphens:auto пробовал 18.10.2026 ради ровного правого края — отказался: слова
     рвались «па-циентами», «здо-ровые», и цитата читалась как брак вёрстки.
     Рваный правый край в цитате — норма типографики; воздух в карточке мерится
     по padding (слева 16+3 полосы = 19, справа 18+1 рамки = 19), а не по концу
     последней строки. */
  text-wrap:pretty}
/* подпись без волосяной линии: на узкой карточке линия читалась как обрезанная
   рамка, а подпись и так отделяется кеглем и цветом */
.selfq__src{margin:0;padding:0;font-size:12.5px;
  line-height:1.5;color:var(--mut);overflow-wrap:anywhere}
.selfq__src a{text-decoration:none;color:var(--acc);border-bottom:1px dotted rgba(31,95,91,.45)}
.selfq__src .ext{font-size:11px;opacity:.75;margin-left:4px}
@media(max-width:900px){
  /* на узком экране колонки не помещаются — цитата уходит под название */
  .phead__row--q{display:block}
  .phead__row--q .selfq{margin:16px 0 18px}
  .selfq{padding:15px 16px 15px 14px;max-width:none}
  .selfq__t{font-size:15px}
}

/* ── Чек-лист «Что должно быть в политике» (18.10.2026) ─────────────────────
   КАПИТАН: «нам надо проверять, это чек-лист прямо на политику… там большие
   штрафы». Второй список в блоке политики: 13 пунктов содержания документа.
   Строки те же .lw__i, что и в остальных блоках (значок + текст), отличие
   только в пояснении: у чек-листа под названием пункта идёт «что это должно
   быть» — иначе владелец клиники видит «сроки хранения — нет» и не понимает,
   что от него хотят. */
.pchk__h{margin:20px 0 6px;font-size:15px;line-height:1.5;color:var(--ink);
  font-weight:600;max-width:78ch}
.pchk__h b{color:var(--ok);font-weight:700}
.lw--chk{margin-bottom:0}
.lw--chk .lw__i{padding:10px 0}
.lw--chk .lw__w2{display:block;margin:3px 0 0;padding-left:11px;
  border-left:2px solid #ece9df;font-size:13px;line-height:1.5;color:#33332e;
  font-weight:400;max-width:78ch;overflow-wrap:break-word}

/* ── Аудит по 12 направлениям (21.10.2026, шаблон КАПИТАНА) ──────────────────
   Верхний блок карточки: 12 направлений с баллом, градация проблем (где найдено /
   почему важно / как исправить), структура сайта, блоки главной, таблица задач,
   модульные ТЗ и план внедрения.

   ОФОРМЛЕНИЕ ПЕРЕДЕЛАНО 21.10.2026 («подумай над оформлением») по замеру:
   контекст — flex вместо сетки (5 ячеек в сетке на 4 колонки давали серую дыру),
   шкалы — одна строка на направление с баллом справа и цветом статуса,
   шапка — средний балл карточкой справа, у секций номера/якоря + липкая навигация.
   Ритм: строки шкал разделены пунктиром (не рамками), воздух между секциями 34px —
   блок читается как документ, а не как дашборд. */
.aud{margin:30px 0 6px}
.aud__top{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px 28px;
  align-items:center;border-top:1px solid var(--line);padding:24px 0 0}
/* 28.10.2026 КАПИТАН: «оценка в начале слева, а потом блок „оценка по 12 направлениям“,
   и по высоте по центру относительно самой оценки». Кружок встал первой колонкой,
   заголовок с лидом — второй; колонки заданы явно (grid-column/grid-row), а не порядком
   в разметке: узел .aud__ring идёт в HTML ПОСЛЕ .aud__ttl, и без явного размещения
   он остался бы справа. align-items:center центрирует заголовок по кружку (кружок
   с подписью ~173 px, заголовок с лидом ~80 px — до правки заголовок прилипал кверху). */
.aud__ttl{grid-column:2;grid-row:1;min-width:0}
/* Карточка без среднего балла (у фактовой ещё нет ни одного замера — сборка не
   печатает .aud__ring вовсе). Тогда первой колонки нет, и заголовок не должен
   висеть с пустым отступом слева. Сейчас таких карточек 0 из 912, правило на
   будущее. */
.aud__top:not(:has(.aud__ring)){grid-template-columns:minmax(0,1fr)}
.aud__top:not(:has(.aud__ring)) .aud__ttl{grid-column:1;grid-row:1}
.aud__h2{font-size:24px;line-height:1.2;margin:0 0 8px;letter-spacing:-.3px}
.aud__lead{color:var(--mut);font-size:14px;line-height:1.55;margin:0;max-width:64ch}

/* Средний балл кружком — в шапке блока оценок (22.10.2026, перенос из паспорта:
   «средний бал у тебя не так где нужен, из скринов его убери, поставь его в
   оценка по 12 направлениям»). Правая колонка .aud__top (216px) под него и была
   заведена, но до этого пустовала. Заливка кружка = доля от 10, цифра внутри,
   цвет по градации — слова «хорошо/прилично» не пишем. */
.aud__ring{grid-column:1;grid-row:1;display:flex;align-items:center;justify-content:flex-start;padding:0}
/* 28.10.2026 КАПИТАН (уточнение к той же правке): «выравнивать надо по высоте
   относительно кружка, а ты сейчас относительно всего поровнял». Заголовок должен
   центрироваться по ДИСКУ, а не по диску вместе с подписью «средний балл».
   Было: подпись (8 + 17 = 25 px под диском) входила в высоту колонки (175 px),
   align-items:center центрировал по 87,5 px, а центр диска — 75 px: заголовок
   стоял на 12,6 px НИЖЕ центра кружка (замер 1440). Стало: подпись выведена из
   потока (position:absolute, top:100%), высота колонки = высоте диска, и центр
   заголовка совпадает с центром кружка (замер: delta 0,0 на 1920/1440/1280/1100/
   1024). Место под подпись возвращается padding-bottom у .aud__top — иначе
   карточки направлений наехали бы на неё.
   Приём с :has — как у .aud__top:not(:has(.aud__ring)) выше: правил «без кружка»
   сейчас не касается (у всех 912 карточек оценка есть), но пусть будет честно. */
.aud__top:has(.aud__ring){padding-bottom:25px}
.aud__ring .psp__avg{position:relative}
.aud__ring .psp__cap{position:absolute;left:50%;top:100%;transform:translateX(-50%);
  margin:8px 0 0;white-space:nowrap}

/* Контекст сайта — инфографика из пяти плиток (22.10.2026, КАПИТАН: «Тип сайта,
   Цель сайта, Аудитория, География, Действие — надо разработать инфографику»).
   Было: пять плоских ячеек «подпись / текст» в общей рамке, все одного серого
   тона — читалось как выгрузка из админки. Стало: отдельные плитки, у каждой
   иконка в цветном квадрате и цветная полоса по левой кромке; цвет кодирует поле
   (тип — бирюза, цель — синий, аудитория — фиолет, география — охра, действие —
   вино), поэтому плитку узнаёшь до чтения. Flex, а не grid: в grid на 4 колонки
   пятая ячейка уезжала во второй ряд и оставляла справа серую дыру (21.10.2026). */
/* Контекст сайта — инфографика из пяти плиток (22.10.2026, КАПИТАН: «Тип сайта,
   Цель сайта, Аудитория, География, Действие — надо разработать инфографику»).
   Было: пять плоских ячеек «подпись / текст» в общей рамке, все одного серого
   тона — читалось как выгрузка из админки. Стало: плитки «иконка + подпись в
   шапке, значение под ними», у каждой цветная полоса по левой кромке; цвет
   кодирует поле (тип — бирюза, цель — синий, аудитория — фиолет, география —
   охра, действие — вино), поэтому плитку узнаёшь до чтения.
   Значение стоит ПОД шапкой, а не справа от иконки: в ряд «иконка | текст»
   тексту оставалось 136 px и слово «нейрореабилитации» вылезало за кромку
   (замер 22.10.2026). Здесь ширина значения = вся плитка минус поля. */
/* Ряды плиток ОДНОЙ высоты (28.10.2026, КАПИТАН: «первая строка по высотке
   больше чем вторая, глаз скачет, надо брать самую высокую и остальные делать
   по ней»). Причина была не в отступах: высота ряда = самая высокая плитка в
   НЁМ, а значение занимает 1-3 строки. Замер до правки: на 32 карточках
   разброс между рядами 0-39 px (медиана 19). grid-auto-rows:1fr делает все
   ряды равными самому высокому — замер после: разброс 0, блок выше на 0-39 px.
   На одной колонке (≤560) правило ОТКЛЮЧЕНО: там 6 рядов, и выравнивание
   добавило бы пустоты в 6 раз больше (замер 390 px: 541 → 655 px). */
/* Пять плиток ОДНОЙ ширины (КАПИТАН 22.10.2026: «выровнять ширину плашек»).
   Раньше у цели/аудитории был flex-grow 1.15, у географии 0.8, у действия 0.98 —
   колонки выходили 265 / 305 / 305 / 212 / 250 px. Теперь сетка с равными
   долями: на широком 5 колонок по (1260 − 4×12) / 5 = 242,4 px, на планшете
   3 колонки, на телефоне 1. Высоту строки выравнивает сам grid (stretch).
   Раньше тут был flex: он не умеет «равно» при переносе — 5 плиток ложились
   4+1, и последняя растягивалась на всю ширину (замер 22.10.2026). */
.ctx{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;
  grid-auto-rows:1fr;
  margin:20px 0 0;padding:0}
/* Пять плиток ОДНОЙ ширины (КАПИТАН 22.10.2026: «выровнять ширину плашек»).
   Раньше у цели/аудитории был flex-grow 1.15, у географии 0.8, у действия 0.98 —
   колонки выходили 265 / 305 / 305 / 212 / 250 px. Теперь у всех один и тот же
   шорткат flex:1 1 200px и ни у одной плитки своего flex нет: свободное место
   делится поровну, ширина = (1260 − 4×12) / 5 = 242,4 px на 1440.
   Высоту строки выравнивает сам flex (align-items:stretch по умолчанию). */
.ctx__i{--c:#1f5f5b;--t:#e7f0ee;
  display:flex;flex-direction:column;gap:9px;
  min-width:0;
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:12px 14px 13px 15px;position:relative;overflow:hidden}
.ctx__i::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--c)}
.ctx__i--type{--c:#1f5f5b;--t:#e7f0ee}
.ctx__i--goal{--c:#2b558f;--t:#e8eef8}
.ctx__i--audience{--c:#6a4c93;--t:#f0ecf7}
.ctx__i--geo{--c:#96632a;--t:#f7f0e5}
.ctx__i--action{--c:#8d2f4a;--t:#f8ebef}
/* Телефон клиники (22.10.2026, КАПИТАН: «в Геолокация телефон обрезался, а зря,
   менеджеру было бы удобнее звонить глядя на сайт»). Отдельная плитка, номер
   целиком и кликабельный: tel: открывает звонилку на телефоне и в мессенджерах. */
.ctx__i--phone{--c:#1c6b3a;--t:#e8f4ec}
/* Шесть плиток = три колонки (телефон добавил шестую, 22.10.2026).
   .ctx — это grid, а не flex (я сначала правил flex-basis и не увидел эффекта:
   ширина задавалась колонками grid). При пяти колонках шестая уезжала во второй
   ряд ОДИНОЧКОЙ (замер: 1440 → 5+1). Три колонки дают ровные 3+3 на десктопе;
   на 1100 и ниже уже стоит repeat(3), на 560 и ниже — одна колонка. */
.ctx--6{grid-template-columns:repeat(3,minmax(0,1fr))}
.ctx__h{display:flex;align-items:center;gap:9px;min-width:0}
.ctx__ic{flex:0 0 30px;width:30px;height:30px;border-radius:8px;background:var(--t);
  color:var(--c);display:flex;align-items:center;justify-content:center}
.ctx__ic svg{width:17px;height:17px;display:block}
.ctx__l{display:block;font-size:11px;font-weight:700;text-transform:uppercase;
  letter-spacing:.6px;color:#565f6a;min-width:0}
/* Значение — простой текст во всех пяти плитках, включая «Действие»: пилюли
   .ctx__act убраны по КАПИТАНу 22.10.2026 («достаточно как в других плашках»). */
.ctx__v{display:block;font-size:13.5px;font-weight:600;line-height:1.45;color:#1b2027;
  overflow-wrap:break-word;text-wrap:balance}
/* Номер не рвётся по строке и не «схлопывается» на узком экране: white-space
   nowrap только для телефона, остальные значения переносятся как прежде. */
.ctx__v .ctx__tel{color:inherit;text-decoration:none;white-space:nowrap;
  border-bottom:1px dotted rgba(28,107,58,.55)}
.ctx__v .ctx__tel:hover{border-bottom-style:solid}
/* Телефон не нашли — плитка остаётся и говорит об этом прямо (КАПИТАН
   28.10.2026: «прямо говорит в этой плашке, а не прячь плашку»). Краска
   приглушённая: это не номер и не тревога, а честный результат проверки. */
/* «Не нашли на сайте» — это НАХОДКА, а не сбой сбора: номер искали тремя
   проходами (главная, страницы контактов, отрендеренная страница), и его там
   нет. Поэтому не серая заглушка «нет данных», а спокойная янтарная пометка с
   расшифровкой, где именно смотрели (28.10.2026). */
.ctx__i--na{--c:#a2701f;--t:#faf3e4}
.ctx__v .ctx__na{display:block;color:#8a5f16;font-weight:600}
.ctx__v .ctx__nah{display:block;margin-top:2px;font-size:11.5px;line-height:1.35;
  font-weight:500;color:#8b8f97}
@media print{.ctx__v .ctx__tel{border-bottom:0}}

.aud__h{display:flex;align-items:baseline;gap:11px;font-size:17px;line-height:1.25;
  margin:34px 0 12px;padding-bottom:9px;border-bottom:1px solid var(--line);
  letter-spacing:-.1px;scroll-margin-top:124px}
.aud__hn{font-size:12px;font-weight:800;color:var(--acc);font-variant-numeric:tabular-nums;
  letter-spacing:.04em;opacity:.8}

/* 22.10.2026: вместо шаблонных «Рекомендуемой структуры» и «Порядка блоков» —
   фактическая структура из карты сайта (22.10.2026, КАПИТАН: «убирай»). */
.aud__sm{display:grid;gap:14px}
.aud__smhd{margin:0;display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;
  font-size:13.5px;line-height:1.5;color:#3a4149}
.aud__smhd>b{font-size:20px;font-weight:750;color:#171b21;font-variant-numeric:tabular-nums;
  letter-spacing:-.2px}
.aud__smhd a{color:var(--acc);text-decoration:none;
  border-bottom:1px solid rgba(31,95,91,.28);padding-bottom:1px}
.aud__smhd a:hover{border-bottom-color:var(--acc)}
.aud__smw{font-size:12px;color:var(--mut)}
.aud__smhd--na{margin:0;font-size:13px;line-height:1.55;color:#a5630a}

.aud__bars{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.aud__bars li{display:grid;grid-template-columns:minmax(96px,196px) minmax(0,1fr) 46px;
  gap:12px;align-items:center}
.aud__bars a{font-size:13px;color:#2a3038;text-decoration:none;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;border-bottom:1px dotted #d3d6cf}
.aud__bars a:hover{color:var(--acc);border-bottom-color:var(--acc)}
.aud__bbar{height:8px;border-radius:999px;background:#ebeee9;overflow:hidden}
.aud__bbar i{display:block;height:100%;min-width:3px;border-radius:999px;
  background:linear-gradient(90deg,#2a7a72,#1f5f5b)}
.aud__bars b{font-size:12.5px;font-weight:700;color:#171b21;text-align:right;
  font-variant-numeric:tabular-nums}

/* 23.10.2026: КАРТА ПО МЕНЮ — для сайтов, у которых карты сайта нет или она пустая.
   КАПИТАН: «или честно отображаешь, что видишь по меню, и строй карту так».
   Никаких выводов о сайте: только пункты меню, их порядок и адреса. */
.aud__mn{list-style:none;margin:0;padding:0;display:grid;gap:0 18px;
  grid-template-columns:repeat(auto-fit,minmax(168px,1fr))}
.aud__mn li{min-width:0}
.aud__mn a{display:block;font-size:13.5px;line-height:1.45;color:#2a3038;text-decoration:none;
  padding:6px 0;border-bottom:1px solid #eceee9;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap}
.aud__mn a:hover{color:var(--acc);border-bottom-color:var(--acc)}
.aud__smnote{margin:0;font-size:12.5px;line-height:1.55;color:#5c6570;
  border-left:3px solid #e6cfa4;padding:2px 0 2px 11px}

@media (max-width:560px){
  .aud__bars li{grid-template-columns:minmax(0,1fr) 60px;gap:8px 10px}
  .aud__bars .aud__bbar{grid-column:1 / -1;order:3}
  .aud__bars b{grid-column:2;grid-row:1;text-align:right}
}

.aud__tw{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.aud__task{width:100%;border-collapse:collapse;font-size:13px}
.aud__task th{background:#f4f5f1;text-align:left;padding:9px 12px;font-size:11px;
  text-transform:uppercase;letter-spacing:.55px;color:var(--mut);font-weight:650;white-space:nowrap}
.aud__task td{padding:10px 12px;border-top:1px solid var(--line);vertical-align:top;
  line-height:1.5;color:#2a3038}
.aud__task tbody tr:nth-child(even){background:#fcfcfa}
.aud__pr{font-size:11.5px;font-weight:700;border-radius:999px;padding:3px 9px;
  white-space:nowrap;display:inline-block}
.aud__pr--crit{background:#fde3e0;color:#b3251e}
.aud__pr--hi{background:#ffefd3;color:#8a5300}
.aud__pr--mid{background:#e2f5ef;color:#0b6a55}

.aud__mod{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.aud__mod li{font-size:13.8px;line-height:1.55;color:#2a3038;padding-left:16px;position:relative}
.aud__mod li::before{content:"";position:absolute;left:2px;top:.62em;width:5px;height:5px;
  border-radius:50%;background:var(--acc);opacity:.5}
.aud__mod b{font-weight:650;color:#171b21}

@media (max-width:1100px){
  .ctx{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:560px){
  .ctx{grid-template-columns:1fr;grid-auto-rows:auto}
}
.tnav a{white-space:nowrap}
/* 28.10.2026: на ≤960 диск сжимается до 112 px, а отступ подписи — до 6 px
   (см. .psp__cap ниже), значит и место под неё в шапке 23 px, не 25. */
@media (min-width:861px) and (max-width:960px){
  .aud__top:has(.aud__ring){padding-bottom:23px}
  .aud__ring .psp__cap{margin:6px 0 0}
}
/* 28.10.2026: на ≤860 шапка становится одноколоночной — кружок сверху, заголовок
   под ним. Там центрировать не по чему, а вынесенная из потока подпись наехала бы
   на заголовок (подпись ниже диска 6+17 = 23 px, а заголовок начинается через
   12 px). Поэтому на телефоне подпись возвращается в поток. */
@media (max-width:860px){
  .aud__top:has(.aud__ring){padding-bottom:0}
  .aud__ring .psp__avg{position:static}
  .aud__ring .psp__cap{position:static;left:auto;top:auto;transform:none;
    margin:6px 0 0;white-space:normal}
}
@media (max-width:860px){
  .aud__top{grid-template-columns:1fr;gap:12px}
  .aud__ring{grid-column:1;grid-row:1;justify-content:flex-start;padding:0}
  .aud__ttl{grid-column:1;grid-row:2}
  .ctx{margin-top:16px;gap:10px}
  .ctx__i{padding:10px 12px 11px 14px}
  .ctx__ic{flex:0 0 27px;width:27px;height:27px;border-radius:7px}
  .ctx__ic svg{width:15px;height:15px}
  .aud__h{margin-top:28px;font-size:16px;scroll-margin-top:152px}
  .aud__tw{overflow:visible;border:0}
  .aud__task thead{display:none}
  .aud__task,.aud__task tbody,.aud__task tr,.aud__task td{display:block;width:auto}
  .aud__task tr{border:1px solid var(--line);border-radius:12px;margin-bottom:10px;
    background:#fff;padding:4px 0}
  .aud__task td{border-top:0;padding:6px 14px}
  .aud__task td[data-l]::before{content:attr(data-l);display:block;font-size:11px;
    text-transform:uppercase;letter-spacing:.5px;color:var(--mut);margin-bottom:2px}
  .aud__h2{font-size:20px}
}

/* ── ПАСПОРТ КАРТОЧКИ (22.10.2026, структура КАПИТАНа) ──────────────────────
   В начале — домен (в шапке), снимок 1920 и рядом снимок смартфона, контекст
   (тип, цель, аудитория, география, действие) и средний балл кружком, как процент
   заполнения. Кадры выровнены по ОДНОЙ высоте --psph: ширину каждый берёт по своей
   пропорции, поэтому монитор широкий, телефон узкий столбик, обрезки нет. */
.psp{margin:16px 0 10px}
.psp__top{display:grid;grid-template-columns:minmax(0,1fr) 232px;gap:16px;align-items:stretch}
/* Кадры в паспорте — ШТОРКА «до и после» (22.10.2026, вторая правка КАПИТАНа:
   «я просил сделать именно шторкой, как до и после»).
   Каждый кадр — две картинки в одном боксе: снизу версия для слабовидящих, сверху
   обычный вид, обрезанный по линии --x. Ползунок — прозрачный нативный range во всю
   площадь кадра: он ловит мышь, палец и стрелки, поэтому свой drag не нужен.
   Высота ряда --psph считается от ШИРИНЫ панели через container query: в ряду три
   кадра (1.7778 + 0.75 + 0.4616 = 2.9894 по ширине к высоте) плюс два зазора.
   Так ряд не вылезает ни на 1120, ни на 768, ни на телефоне.
   Потолок высоты поднят 266 -> 360 (22.10.2026) после переноса среднего балла в
   блок оценок: правая колонка паспорта (232px) исчезла, ряд кадров стал шире и
   при старом потолке оставлял справа пустое поле ~260px — та же «серая дыра»,
   которую КАПИТАН браковал в блоке контекста. Теперь ряд заполняет панель. */
.psp__shots{display:flex;flex-direction:column;gap:9px;min-width:0;position:relative;
  container-type:inline-size}
.psp__row{--psph:clamp(104px, calc((100cqw - 24px)/2.9894), 360px);
  display:flex;gap:12px;align-items:flex-start;min-width:0}
.psp__f{margin:0;flex:0 1 auto;min-width:0;position:relative}
.psp__f--1920{flex:0 1 auto}
.psp__f--768,.psp__f--390{flex:0 0 auto}
/* обычный снимок без пары (режима на сайте нет) — как раньше */
.psp__f>a{display:block;position:relative;border:1px solid var(--line);border-radius:12px;
  overflow:hidden;background:#fff;box-shadow:0 1px 3px rgba(20,23,28,.07);line-height:0}
.psp__f>a:hover{border-color:#bcc2b9;box-shadow:0 4px 16px rgba(20,23,28,.13)}
.psp__f>a>img{display:block;height:var(--psph);width:auto;max-width:100%;border-radius:11px}

/* сцена шторки: размер задаёт высота ряда, ширину — реальная пропорция кадра */
.psp__stage{position:relative;height:var(--psph);border:1px solid var(--line);
  border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 1px 3px rgba(20,23,28,.07);
  line-height:0}
.psp__f--1920 .psp__stage{aspect-ratio:16/9}
.psp__f--768 .psp__stage{aspect-ratio:768/1024}
.psp__f--390 .psp__stage{aspect-ratio:390/844}
.psp__stage:hover{border-color:#bcc2b9;box-shadow:0 4px 16px rgba(20,23,28,.13)}
.psp__lay{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:top center;display:block;user-select:none;-webkit-user-drag:none}
/* сверху обычный вид, слева от линии; линия --x идёт от левого края */
.psp__lay--n{clip-path:inset(0 calc(100% - var(--x)) 0 0)}
/* шторка-ПРОВЕРКА (22.10.2026, КАПИТАН: «мне кажется шторку всё равно надо оставить,
   просто под шторкой должен быть скрин, что версии для слабовидящих мы не нашли»).
   Слои: снимок страницы -> тёмная вуаль с вердиктом -> тот же снимок чистым сверху.
   Ползунок показывает: слева страница как есть, справа она же и заключение по ней.
   Вуаль лежит МЕЖДУ слоями, поэтому при --x:50 видно ровно половину приговора и
   половину страницы — сравнение честное, а не «два одинаковых кадра». */
.psp__lay--b{z-index:0}
.psp__lay--n{z-index:2}
.psp__veil{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:7px;padding:6% 5%;box-sizing:border-box;
  text-align:center;background:rgba(12,16,20,.84);color:#fff;line-height:1.25}
.psp__veil .psp__ico{width:clamp(20px,32%,48px);height:auto;aspect-ratio:1/1;
  stroke-width:1.7;color:#fff}
.psp__ico--no .psp__ico-x{stroke-width:2.3}
.psp__veil b{font-size:13.5px;font-weight:700;letter-spacing:.2px}
.psp__veil i{font-style:normal;font-size:10.5px;font-weight:500;color:#c3ccd6;max-width:22ch}
.psp__f--768 .psp__veil b{font-size:11.5px}
.psp__f--768 .psp__veil i{display:none}
.psp__f--768 .psp__veil .psp__ico{width:20px;height:20px}
.psp__f--390 .psp__veil{gap:4px;padding:4%}
.psp__f--390 .psp__veil b{font-size:9.5px;letter-spacing:0}
.psp__f--390 .psp__veil i{display:none}
.psp__f--390 .psp__veil .psp__ico{width:clamp(14px,26%,26px)}
/* бейдж «искали и не нашли» — тот же глаз, но красный и перечёркнутый */
.psp__tag--nu{background:rgba(200,53,46,.92)}
.psp__hint--nu{color:#d3810a}
.psp__hint--nu b{color:#7a4f0e}
/* линия-разделитель с ручкой: только рисунок, события ловит ползунок */
.psp__div{position:absolute;top:0;bottom:0;left:var(--x);width:2px;margin-left:-1px;
  background:rgba(255,255,255,.92);box-shadow:0 0 0 1px rgba(20,23,28,.22),0 0 10px rgba(20,23,28,.28);
  pointer-events:none;z-index:3}
.psp__div i{position:absolute;top:50%;left:50%;width:26px;height:26px;margin:-13px 0 0 -13px;
  border-radius:50%;background:#fff;box-shadow:0 1px 5px rgba(20,23,28,.35)}
.psp__div i::before,.psp__div i::after{content:"";position:absolute;top:50%;width:0;height:0;
  border:4px solid transparent}
.psp__div i::before{left:4px;margin-top:-4px;border-right-color:#5a6270}
.psp__div i::after{right:4px;margin-top:-4px;border-left-color:#5a6270}
.psp__f--768 .psp__div i,.psp__f--390 .psp__div i{width:22px;height:22px;margin:-11px 0 0 -11px}
/* подписи сторон: что слева, что справа — без них шторка непонятна */
/* Бейджи кадра (22.10.2026, третья правка КАПИТАНа): «разрешение это и есть
   нормальный вид, а справа значок с глазиком для слабовидящих; бейдж обычного вида
   убрать, на его место бейдж с разрешением, справа поменять на глазик и стилистически
   выровнять». Поэтому слева — плашка с РАЗРЕШЕНИЕМ (она же метка обычного вида),
   справа — ГЛАЗ (версия для слабовидящих).
   Выравнивание держится на одном классе .psp__tag: одна высота, один радиус, один фон,
   один отступ от кромки, одна линия по вертикали. Отличается только содержимое —
   текст или иконка, поэтому ширина у левой плашки своя (по цифрам), у правой ровный
   квадрат. */
.psp__tag{position:absolute;top:7px;display:flex;align-items:center;justify-content:center;
  height:24px;min-width:24px;border-radius:7px;z-index:4;pointer-events:none;
  box-sizing:border-box;background:rgba(20,23,28,.72);color:#fff;line-height:1}
.psp__tag--dim{left:7px;padding:0 7px}
.psp__tag--va{right:7px;width:24px;padding:0}
.psp__dimv{display:block;white-space:nowrap;font-size:11.5px;font-weight:600;
  letter-spacing:.4px;font-variant-numeric:tabular-nums}
.psp__ico{display:block;width:15px;height:15px;fill:none;stroke:currentColor;
  stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.psp__hint{margin:0;font-size:12px;line-height:1.5;color:var(--mut);max-width:78ch}
.psp__hint b{color:#3d444d;font-weight:600}
.psp__f--768 .psp__tag{height:22px;min-width:22px;top:6px;border-radius:6px}
.psp__f--768 .psp__tag--dim{left:6px;padding:0 6px}
.psp__f--768 .psp__tag--va{right:6px;width:22px}
.psp__f--768 .psp__ico{width:14px;height:14px}
.psp__f--768 .psp__dimv{font-size:10.5px;letter-spacing:.3px}
.psp__f--390 .psp__tag{height:20px;min-width:20px;top:5px;border-radius:6px}
.psp__f--390 .psp__tag--dim{left:5px;padding:0 5px}
.psp__f--390 .psp__tag--va{right:5px;width:20px}
.psp__f--390 .psp__ico{width:13px;height:13px}
.psp__f--390 .psp__dimv{font-size:10px;letter-spacing:.2px}
/* ползунок прозрачный, лежит поверх всего: тянется мышью, пальцем, стрелками */
.psp__rng{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;
  cursor:ew-resize;z-index:5;-webkit-appearance:none;appearance:none;background:none}
.psp__rng::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:100%}
.psp__rng::-moz-range-thumb{width:26px;height:100%;border:0}
.psp__curt:focus-within .psp__stage{outline:2px solid var(--ok);outline-offset:2px}

/* средний балл: кольцо = доля от 10, цифра внутри, слова-вердикта нет */
/* Кольцо + цифра — в своём боксе, подпись под ним. Высота не фиксирована:
   раньше подпись выпадала из 150px-бокса и налезала на карточки (22.10.2026). */
.psp__avg{display:flex;flex-direction:column;align-items:center;width:150px;flex:0 0 auto}
.psp__disc{position:relative;width:150px;height:150px;flex:0 0 auto}
.psp__disc svg{display:block;width:150px;height:150px;transform:rotate(-90deg)}
.psp__tr{fill:none;stroke:#e3ebe6;stroke-width:9}
.psp__pr{fill:none;stroke-width:9;stroke-linecap:round}
.psp__avg--ok .psp__pr{stroke:var(--sc-ok-v)}
.psp__avg--mid .psp__pr{stroke:var(--sc-mid-v)}
.psp__avg--bad .psp__pr{stroke:var(--sc-bad-v)}
.psp__num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;line-height:1;padding-top:16px}
/* цифра в кольце должна стоять по центру КРУГА, а не группы «цифра+подпись»:
   подпись «из 10» тянет колонку вниз и цифра уезжала вверх на 8,3px (замер),
   поэтому у колонки верхний отступ = высоте подписи с зазором. */
.psp__num b{font-size:42px;line-height:1.06;font-weight:800;letter-spacing:-.035em;color:var(--ink);
  font-variant-numeric:tabular-nums}
.psp__avg--ok .psp__num b{color:var(--sc-ok)}
.psp__avg--mid .psp__num b{color:var(--sc-mid)}
.psp__avg--bad .psp__num b{color:var(--sc-bad)}
.psp__num span{font-size:11.5px;color:var(--mut);margin-top:5px;letter-spacing:.2px}
.psp__cap{margin:8px 0 0;font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--mut)}

/* ── 11 НАПРАВЛЕНИЙ КАРТОЧКАМИ ──────────────────────────────────────────────
   21.10 стояли строки-шкалы (760px на 11 штук); 22.10 — сетка карточек:
   название сверху, балл справа крупно, полоса и комментарий под ним. */
.aud__cards{list-style:none;margin:20px 0 0;padding:0;
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.aud__c{display:flex;flex-direction:column;gap:9px;min-height:118px;border:1px solid var(--line);
  border-radius:12px;background:#fff;padding:13px 15px 14px;min-width:0}
.aud__chd{display:flex;align-items:baseline;gap:8px}
.aud__cn{flex:0 0 auto;font-size:11px;font-weight:800;color:#a8aeb5;
  font-variant-numeric:tabular-nums;letter-spacing:.4px}
.aud__ct{flex:1 1 auto;font-size:14px;font-weight:650;line-height:1.3;color:#1b2027;min-width:0}
.aud__cv{flex:0 0 auto;font-size:22px;font-weight:800;line-height:1;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;color:#5c6570}
/* цвет «не применимо» задан один раз — в блоке контраста темы v2; здесь только кегль */
.aud__cv--na{font-size:16px}
.aud__cb{display:block;height:6px;border-radius:99px;background:var(--track);overflow:hidden;
  color:#9aa2aa}
.aud__cb i{display:block;height:100%;border-radius:99px;background:currentColor}
.aud__cb--na{background:repeating-linear-gradient(90deg,var(--track) 0 6px,#f4f8f5 6px 12px)}
.aud__cw{margin:0;font-size:13px;line-height:1.5;color:#3c444d;flex:1 1 auto}
.aud__c--ok .aud__cv,.aud__c--ok .aud__cb{color:var(--sc-ok)}
.aud__c--ok .aud__cb i{background:var(--sc-ok-v)}.aud__c--mid .aud__cb i{background:var(--sc-mid-v)}.aud__c--bad .aud__cb i{background:var(--sc-bad-v)}
.aud__c--mid .aud__cv,.aud__c--mid .aud__cb{color:var(--sc-mid)}
.aud__c--bad .aud__cv,.aud__c--bad .aud__cb{color:var(--sc-bad)}
.aud__c--na{background:#fcfcfa}
/* неполный последний ряд: карточка тянется на оставшиеся колонки,
   иначе справа остаётся дыра в две трети ширины */
.aud__cards>.aud__c:last-child:nth-child(3n+2){grid-column:span 2}

.aud__ck{flex:0 0 auto;width:18px;height:18px;border-radius:50%;background:var(--sc-ok);
  color:#fff;font-size:11px;line-height:18px;text-align:center;font-weight:700;margin-top:1px}

/* 22.10.2026 КАПИТАН: «"Что сделано хорошо" — надо так же плашки сделать, как в
   секции выше, такими же по размеру». Это ТА ЖЕ карточка .aud__c (та же сетка,
   тот же min-height 118px), только зелёная и с галочкой вместо балла. */
.aud__cards--good{margin-top:20px}
.aud__c--good{flex-direction:row;gap:10px;align-items:flex-start;background:#f3fbf7;
  border-color:#c9ecda}
.aud__c--good .aud__cw{color:#14503a;font-size:13.5px;line-height:1.5;font-weight:500}
.aud__c--good .aud__ck{margin-top:2px}
/* шесть плашек — ровно два ряда по три: последняя не растягивается на полстроки */
.aud__cards--good>.aud__c:last-child:nth-child(3n+2){grid-column:auto}

/* проблемы и нормы — ТАБЛИЦЕЙ. Обе таблицы аудита делят ОДНУ поверхность:
   шапка, зебра, вертикальные разделители, кромка уровня, подсветка строки,
   ритм высоты, ширина колонки «Уровень».
   22.10.2026 КАПИТАН: «"Проблемы и уязвимости" и "Нормы и требования" таблицы
   выглядят слегка по-разному, может надо сделать чтобы выглядели одинаково?»
   Замер до правки: шапка #f4f5f1 против #eef0e8, зебры нет против #f3f6ec,
   разделителей колонок 0 против 1px, кромки уровня 0 против 3px. Теперь это
   общие правила на .aud__tbl; «--law» и «--pr» отвечают только за ширины колонок
   и типографику своего содержимого. */
.aud__tbl{width:100%;border-collapse:collapse;font-size:13px;table-layout:fixed}
.aud__tbl th{background:#eef0e8;text-align:left;padding:9px 12px;font-size:11px;
  text-transform:uppercase;letter-spacing:.5px;color:var(--mut);font-weight:700;
  border-bottom:1px solid #cfd2c7}
.aud__tbl td{padding:10px 12px;border-top:1px solid var(--line);vertical-align:top;
  line-height:1.45;color:#2a3038;overflow-wrap:anywhere}
/* ритм: одна высота строки на обе таблицы — иначе таблица идёт зубцами */
.aud__tbl tbody tr{height:62px}
.aud__tbl tbody tr:first-child td{border-top:0}
/* зебра + подсветка строки под курсором: строки одного веса читаются как стена */
.aud__tbl tbody tr:nth-child(even) td{background:#f3f6ec}
.aud__tbl tbody tr:hover td{background:#f2f9f5}
/* кромка уровня: цветная линия слева видна раньше, чем прочитан бейдж */
.aud__tbl td:first-child{border-left:3px solid transparent}
/* тонкие вертикальные разделители: без них соседние колонки сливаются
   в одну длинную строку */
.aud__tbl tbody td+td{border-left:1px solid #ecefe4}
.aud__tbl tr.lw-row--crit td:first-child{border-left-color:var(--sc-bad)}
.aud__tbl tr.lw-row--mid td:first-child{border-left-color:var(--sc-mid)}
.aud__tbl tr.lw-row--rec td:first-child{border-left-color:var(--sc-ok)}
/* Колонка «Уровень» одной ширины в обеих таблицах.
   22.10.2026: замер поймал, что бейдж «Рекомендация» (97 px) не влезал в
   прежние 108 px и торчал за правую кромку клетки (scrollWidth-cell=1), а в
   таблице норм та же колонка была 96 px. Считаем по содержимому:
   3 (кромка) + 12 + бейдж 97 + 12 = 124. */
.aud__tbl th:nth-child(1),.aud__tbl td:nth-child(1){width:124px}
/* «Проблемы и уязвимости»: ширины по длине содержимого (макс. длина текста
   «Проблема» 174 знака, «Почему важно» 131, «Как исправить» 105, «Где найдено» 50). */
/* 22.10.2026 КАПИТАН: «и ты забыл расценить "Проблемы и уязвимости"» — у таблицы
   проблем появилась ШЕСТАЯ колонка «Стоимость работ», как у норм. Ширины
   пересчитаны на шесть колонок, и заданы у ВСЕХ пяти процентных: иначе последняя
   заберёт остаток и сожмётся в щель (эту ошибку уже ловили на таблице норм).
   25+13+21+16+12.5 = 87.5%, плюс 124px на «Уровень» ≈ 100%. */
/* 22.10.2026 КАПИТАН: «почему нельзя сделать в таком же формате, такими же
   шрифтами (размер) в таблице выше?» — таблица проблем приведена к виду таблицы
   норм: колонки «Где найдено» и «Почему важно» слиты в одну клетку «Что это
   значит» тем же приёмом, что у норм (lw__mi — что означает, lw__seen — «На
   сайте:»), поэтому и шрифты те же: 12.5px / 12px. Колонок стало ПЯТЬ.
   Замер браузером поймал: при сумме 83.5% таблица в fixed-layout раздаёт
   остаток поровну, и колонка «Уровень» разъехалась до 178px против 124px у
   норм. Сумма процентов должна давать ровно 100% вместе с 124px на «Уровень»
   (124 + 88.5% от 1078 = 1078), как у таблицы норм: 26+29+21+12.5 = 88.5%. */
.aud__tbl--pr th:nth-child(2),.aud__tbl--pr td:nth-child(2){width:26%}
.aud__tbl--pr th:nth-child(3),.aud__tbl--pr td:nth-child(3){width:29%}
.aud__tbl--pr th:nth-child(4),.aud__tbl--pr td:nth-child(4){width:21%}
.aud__tbl--pr th:nth-child(5),.aud__tbl--pr td:nth-child(5){width:12.5%}
/* «Нормы и требования»: ПЯТЬ колонок — уровень · что требуют · норма
   с текстом · что это значит · ответственность.
   22.10.2026 КАПИТАН: «мы писали в таком виде "118н, Прил.1, п.1, абз.1 /
   «место нахождения…» / Что это значит: адрес, по которому клиника реально
   находится" — и это понятно людям, надо адаптировать таблицу под эту
   понятность, не стесняйся добавить колонку, подравнять ширины».
   Ширины — по длине содержимого: текст нормы самый широкий, пояснение (медиана
   76) среднее, санкция — остаток. */
/* 22.10.2026 КАПИТАН: «давай пока ты таблицу приведешь в порядок, сейчас ты
   накосячил там» — замер поймал: после добавления шестой колонки «Ответственность»
   сжалась до 81 px (было 205+) и ТЕКСТ ВЫЛЕЗАЛ ИЗ КЛЕТКИ во всех 11 строках
   (over=11), потому что «5 000–10 000 ₽» стоит с white-space:nowrap. Ширины
   пересчитаны на 6 колонок: 124px + 17+21+21+17+12.5 = 100%. */
.aud__tbl--law th:nth-child(2),.aud__tbl--law td:nth-child(2){width:14%}
.aud__tbl--law th:nth-child(3),.aud__tbl--law td:nth-child(3){width:26%}
.aud__tbl--law th:nth-child(4),.aud__tbl--law td:nth-child(4){width:24%}
.aud__tbl--law th:nth-child(5),.aud__tbl--law td:nth-child(5){width:13%}
/* норма: номер акта тёмным, место в акте тише — глаз цепляется за «118н» */
.aud__tbl--law td:nth-child(3) a{text-decoration:none;border-bottom:1px solid #dfe3de;
  padding-bottom:1px;color:#2a3038;font-size:12.5px;line-height:1.7}
.aud__tbl--law td:nth-child(3) a:hover{border-bottom-color:var(--sc-ok)}
.aud__tbl--law .lw__act{font-weight:700;color:var(--ink)}
.aud__tbl--law .lw__pp{color:var(--mut)}
/* текст нормы внутри таблицы — обычная информация колонки, не цитата:
   без линейки слева, без кавычек, без раскрывашки (КАПИТАН 22.10.2026:
   «нет смысла в раскрывашке, просто выводить полностью, а цитату убери,
   просто как инфу в колонке»). Кегль на полпункта меньше основного — это
   подтверждение требования, а не главный текст строки. */
.aud__tbl--law .lw__q{margin-top:4px;padding:0;border-left:0;font-size:12px;
  line-height:1.55;color:#414739;max-width:none}
/* пояснение «что это значит» — тем же кеглем, что санкция: две обычные колонки */
.aud__tbl--law .lw__mi,.aud__tbl--pr .lw__mi{font-size:12.5px;line-height:1.55;color:#2f353b}
/* 22.10.2026: вторая половина клетки «Что это значит» — ФАКТ по этому сайту,
   а не пояснение нормы (КАПИТАН: «"Что это значит" — шаблон на пункт, а не на
   карточку»). Пояснение — обычным цветом, факт — тише и с подписью «На сайте»,
   чтобы строку было видно и она не спорила с законом. */
.aud__tbl--law .lw__seen,.aud__tbl--pr .lw__seen{display:block;margin-top:5px;font-size:12px;line-height:1.5;
  color:#4d545c}
.aud__tbl--law .lw__seen b,.aud__tbl--pr .lw__seen b{color:#6d757d;font-weight:600}
/* 22.10.2026: плашка «возможные нарушения» открывает таблицу норм — в ней
   должны остаться только строки своего уровня. Раньше это делали списки
   нижнего блока, теперь их нет, поэтому фильтр работает по строкам. */
body[data-fil]:not([data-fil="viol"]):not([data-fil="ask"]) .grp--law tr.lw-row{display:none}
body[data-fil="viol"] .grp--law .lw-row--mid,
body[data-fil="ask"] .grp--law .lw-row--crit{display:none}
/* компактные строки «проверено / не применимо / не удалось» — без цитат и без
   штрафов: это не проблемы, а факт замера. В таблицу норм они не попадают. */
.lw--plain .lw__i{padding:7px 0}
.lw--plain .lw__w{font-weight:500}
.lw--plain .lw__n{font-size:11.5px}
/* ответственность: статья КоАП тихой строкой, санкция и сумма — ниже */
.aud__tbl--law .lw__art{display:block;font-size:11.5px;letter-spacing:.1px;
  color:var(--mut);line-height:1.5}
/* 28.10.2026: «за что» — расшифровка состава статьи (КАПИТАН: «сам текст карточки
   не раскрывает, почему именно такая квалификация подходит каждому случаю»).
   Печатается под номером статьи, тише санкции: это пояснение, а не сумма. */
.aud__tbl--law .lw__fw{display:block;font-size:11.5px;line-height:1.45;
  color:var(--mut);margin-top:1px}
.aud__tbl--law .lw__pen{display:block;margin-top:2px;font-size:13px;line-height:1.5;
  color:#2a3038}
.aud__tbl--law .lw__sum{font-weight:700;color:#8f1c18;white-space:nowrap;
  font-variant-numeric:tabular-nums}
/* 22.10.2026. ШЕСТАЯ колонка «Стоимость работ» (КАПИТАН: «может быть прямо
   в таблице после штрафа поставить стоимость работ по исправлению?»).
   Цена — «от», на первой строке работы; на повторах стоит «входит», чтобы
   сумма видимых цен РАВНЯЛАСЬ итогу (это проверяют ворота T40). */
.aud__tbl--law th:nth-child(6),.aud__tbl--law td:nth-child(6){width:12.5%}
/* 22.10.2026: те же три правила работают и в таблице проблем — вид клетки
   стоимости обязан совпадать в обеих таблицах, иначе они снова разъедутся. */
.aud__tbl--law .lw__cost,.aud__tbl--pr .lw__cost{display:block;font-size:13.5px;
  font-weight:700;color:#1f4d46;white-space:nowrap;font-variant-numeric:tabular-nums}
.aud__tbl--law .lw__work,.aud__tbl--pr .lw__work{display:block;margin-top:2px;
  font-size:11.5px;line-height:1.4;color:var(--mut)}
/* у проблем в одной строке бывает ДВЕ работы (слайдер + лицензия): вторая
   отделяется тонкой линией, чтобы цены не слиплись в одну */
.aud__tbl--pr .lw__cost+.lw__work+.lw__cost{margin-top:6px;padding-top:5px;
  border-top:1px solid var(--line)}
/* итог под таблицей: сумма + сноска (дословно от КАПИТАНа) */
.lw__tot{margin:12px 0 0;font-size:13.5px;line-height:1.6;color:#2a3038}
.lw__tot b{font-variant-numeric:tabular-nums}
.lw__totn{color:var(--mut);font-size:12.5px}
.aud__lv{display:inline-block;font-size:11px;font-weight:700;padding:2px 9px;
  border-radius:999px;white-space:nowrap}
.aud__lv--crit{background:#fbf0ef;color:#8d1f1b}
.aud__lv--mid{background:#fdf6e9;color:#7a4f0e}
.aud__lv--rec{background:#eef3f2;color:#215852}
.aud__dash{color:#b6bcc3}

@media (max-width:960px){
  /* 22.10.2026: здесь жило отдельное «планшетное» сужение колонки «Уровень»
     до 84 px — только у таблицы норм. Оно и было одной из причин, по которым две
     таблицы аудита выглядели по-разному, и оно же резало бейдж «Критично»
     (3 кромка + 12 + 70 + 12 = 97 > 84). Сужение убрано: от 960 и уже обе
     таблицы идут карточками с одинаковой кромкой и бейджем. */
  .aud__cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .aud__cards>.aud__c:last-child:nth-child(3n+2){grid-column:auto}
  .aud__cards>.aud__c:last-child:nth-child(odd){grid-column:span 2}
  .psp__top{grid-template-columns:1fr}
  .psp__avg{width:112px}
  .psp__disc{width:112px;height:112px}
  .psp__disc svg{width:112px;height:112px}
  .psp__num b{font-size:32px}
  .psp__cap{margin:6px 0 0}
  .psp__row{--psph:clamp(104px, calc((100cqw - 24px)/2.9894), 300px)}
}
@media (max-width:700px){
  /* на телефоне кадры остаются В РЯД: сравнение «монитор против смартфона»
     работает только когда они рядом, а не друг под другом (22.10.2026) */
  /* на телефоне три кадра в ряд превратились бы в три ногтя, поэтому первый
     ряд — монитор во всю ширину, второй — планшет и смартфон рядом (22.10.2026) */
  .psp__row{--psph:0;gap:8px;flex-wrap:wrap;align-items:flex-start}
  /* монитор во всю ширину, под ним пара «планшет + смартфон» */
  .psp__f--1920{flex:0 0 100%}
  .psp__f--1920 .psp__stage{height:auto;width:100%}
  .psp__f--768,.psp__f--390{flex:0 0 auto}
  .psp__f--768 .psp__stage,.psp__f--390 .psp__stage{height:196px}
  /* кадр 390 на телефоне — 91 px шириной: полное «390×844» съедало бы кромку,
     поэтому в плашке остаётся ширина, высота живёт в title и aria-label */
  .psp__dimh{display:none}
  .psp__f>a>img{height:auto;width:auto;max-width:100%}
  .psp__f--1920>a>img{width:100%;height:auto}
  .psp__f--768>a>img,.psp__f--390>a>img{height:196px;width:auto}
  .aud__cards{grid-template-columns:1fr;gap:9px}
  .aud__cards>.aud__c:last-child:nth-child(odd){grid-column:auto}
  .aud__c{padding:11px 13px 12px;gap:7px}
  .aud__tbl--pr th,.aud__tbl--law th{display:none}
  .aud__tbl,.aud__tbl tbody,.aud__tbl tr,.aud__tbl td{display:block;width:auto}
  /* Ширины колонок заданы правилами «.aud__tbl--pr td:nth-child(n)» — они
     специфичнее этого блока и на телефоне оставляли ячейкам 27%/17%/22%
     ширины. Замер 22.10.2026 после наполнения колонок: «Проблема» 94px,
     «Где найдено» 59px при 147 знаках текста — карточка превращалась в
     узкую колонку на треть экрана. Поэтому сбрасываем явно. */
  .aud__tbl--pr td,.aud__tbl--law td{width:auto !important}
  .aud__tbl tr{border:1px solid var(--line);border-radius:11px;margin-bottom:9px;
    background:#fff;padding:4px 0}
  /* кромка уровня живёт и в карточном режиме — одинаково для проблем и норм */
  .aud__tbl tr.lw-row--crit{border-left:3px solid var(--sc-bad)}
  .aud__tbl tr.lw-row--mid{border-left:3px solid var(--sc-mid)}
  .aud__tbl tr.lw-row--rec{border-left:3px solid var(--sc-ok)}
  .aud__tbl tbody tr:nth-child(even) td{background:#fff}
  /* в карточке высоту строки не держим: 62 px — это ритм таблицы, а не карточки
     (замер 22.10.2026: на 390 строка «Проблемы» сжималась до 62 px и содержимое
     вылезало за её рамку) */
  .aud__tbl tbody tr{height:auto}
  .aud__tbl td{border-top:0;padding:6px 13px}
  .aud__tbl tbody td+td{border-left:0}
  .aud__tbl td[data-l]::before{content:attr(data-l);display:block;font-size:11px;
    text-transform:uppercase;letter-spacing:.5px;color:var(--mut);margin-bottom:2px}
  .aud__tw{overflow:visible;border:0;border-radius:0}
  /* ---- закон на телефоне: карточкой в две строки ---- */
  .aud__tbl--law tbody tr{height:auto}
  .aud__tbl--law tbody tr:nth-child(even) td{background:#fff}
  .aud__tbl--law tbody td+td{border-left:0}
  .aud__tbl--law td:first-child{border-left:0}
  .aud__tbl--law tr{border-left:3px solid transparent}
  .aud__tbl--law tr.lw-row--crit{border-left-color:var(--sc-bad)}
  .aud__tbl--law tr.lw-row--mid{border-left-color:var(--sc-mid)}
  .aud__tbl--law .lw__art{display:inline;font-size:11.5px;margin-right:4px}
  .aud__tbl--law .lw__pen{display:block;margin-top:1px}
  /* текст нормы на телефоне виден целиком: раскрывашек больше нет, скрывать
     нечего (22.10.2026). Кегль тот же — читается как обычная строка колонки. */
  /* карточка закона на телефоне: бейдж уровня и суть — одной строкой, норма и
     санкция — ниже. Было 4 столбика с подписями = 200 px на запись (замер
     22.10.2026: 11 строк растягивались на 2 422 px). */
  .aud__tbl--law tbody tr{display:grid;grid-template-columns:auto 1fr;
    gap:1px 8px;padding:9px 12px 10px;border-radius:11px}
  .aud__tbl--law td{padding:0;background:none !important}
  .aud__tbl--law td[data-l="Уровень"]{grid-column:1;grid-row:1;align-self:center}
  .aud__tbl--law td[data-l="Что требуют"]{grid-column:2;grid-row:1;font-weight:600;
    font-size:13.5px;align-self:center}
  .aud__tbl--law td[data-l="Норма"]{grid-column:1/-1;grid-row:2;padding-top:3px}
  .aud__tbl--law td[data-l="Что это значит"]{grid-column:1/-1;grid-row:3;
    padding-top:4px}
  .aud__tbl--law td[data-l="Ответственность"]{grid-column:1/-1;grid-row:4;
    padding-top:4px}
  .aud__tbl--law td[data-l="Уровень"]::before,
  .aud__tbl--law td[data-l="Что требуют"]::before,
  .aud__tbl--law td[data-l="Норма"]::before,
  .aud__tbl--law td[data-l="Что это значит"]::before,
  .aud__tbl--law td[data-l="Ответственность"]::before{display:none}
}

/* ---- закон на ПЛАНШЕТЕ (701–900): карточкой, как на телефоне ----
   Замер 22.10.2026 сразу после того, как норма стала выводиться целиком
   (КАПИТАН: «нет смысла в раскрывашке, выводить полностью»): на 768 колонка
   «Норма» сжималась до 196 px, текст нормы занимал 11 строк, а одна строка
   таблицы вырастала до 477 px — почти в половину экрана. Пять колонок на такой
   ширине норму не держат: сумма фиксированных 84px + процентов оставляет тексту
   меньше трети. Карточный режим отдаёт норме всю ширину строки (≈700 px). */
@media (min-width:701px) and (max-width:960px){
  /* 22.10.2026: карточным режимом пользуются ОБЕ таблицы аудита. Раньше он был
     только у норм (норма не влезала в 196 px), а «Проблемы» сжимались в пять
     колонок по 101–109 px — замер: строка вырастала до 266 px, а таблицы двух
     секций выглядели как разные сайты. */
  .aud__tbl th{display:none}
  .aud__tbl,.aud__tbl tbody,.aud__tbl tr,.aud__tbl td{display:block;width:auto}
  .aud__tbl td{width:auto !important}
  .aud__tbl tbody tr{height:auto;display:grid;grid-template-columns:auto 1fr;
    gap:1px 10px;padding:8px 13px 9px;border-radius:11px;border:1px solid var(--line);
    border-left:3px solid transparent;margin-bottom:7px;background:#fff}
  .aud__tbl tbody tr:nth-child(even) td{background:#fff}
  .aud__tbl tr.lw-row--crit{border-left-color:var(--sc-bad)}
  .aud__tbl tr.lw-row--mid{border-left-color:var(--sc-mid)}
  .aud__tbl tr.lw-row--rec{border-left-color:var(--sc-ok)}
  .aud__tbl td{padding:0;background:none !important;border:0 !important}
  .aud__tbl td[data-l="Уровень"]{grid-column:1;grid-row:1;align-self:center}
  .aud__tbl td[data-l="Что требуют"],
  .aud__tbl td[data-l="Проблема"]{grid-column:2;grid-row:1;font-weight:600;
    font-size:14px;align-self:center}
  .aud__tbl td[data-l="Норма"],
  .aud__tbl td[data-l="Где найдено"]{grid-column:1/-1;grid-row:2;padding-top:5px}
  .aud__tbl td[data-l="Что это значит"],
  .aud__tbl td[data-l="Почему важно"]{grid-column:1/-1;grid-row:3;padding-top:5px}
  .aud__tbl td[data-l="Ответственность"],
  .aud__tbl td[data-l="Как исправить"]{grid-column:1/-1;grid-row:4;padding-top:5px}
  .aud__tbl td[data-l]::before{content:attr(data-l);display:block;font-size:11px;
    text-transform:uppercase;letter-spacing:.5px;color:var(--mut);margin-bottom:2px}
  .aud__tbl td[data-l="Уровень"]::before,
  .aud__tbl td[data-l="Что требуют"]::before,
  .aud__tbl td[data-l="Проблема"]::before{display:none}
  .aud__tbl--law .lw__art{display:inline;font-size:11.5px;margin-right:4px}
  .aud__tbl--law .lw__pen{display:block;margin-top:1px}
  .aud__tbl--law .lw__q{font-size:12.5px}
  .aud__tw{overflow:visible;border:0;border-radius:0}
}

/* печать: карточка уходит клинике в PDF — снимаем липкое и режем по секциям */
@media print{
  html{scroll-behavior:auto}
  .top,.cta{display:none !important}
  .aud__h{break-after:avoid;page-break-after:avoid}
  .aud__tw{break-inside:avoid;page-break-inside:avoid}
  .aud__c,.aud__tbl tr,.psp__f{break-inside:avoid}
  .psp__rng,.psp__div,.psp__tag--va{display:none !important}
  /* в PDF к клинике уходит ОБЫЧНЫЙ вид целиком: шторка печатается без обрезки */
  .psp__lay--n{clip-path:none !important}
  .psp__lay--va{display:none !important}
  a[href^="#"]{text-decoration:none;color:inherit}
}

/* ── ФОРМА ОБРАТНОЙ СВЯЗИ ПЕРЕД ПОДВАЛОМ (22.10.2026, КАПИТАН: «разработать форму
   обратной связи, она должна быть перед подвалом») ─────────────────────────────
   Спокойная полоса на тонированном фоне: это последнее, что читают на странице,
   и она не должна перебивать карточку. Две колонки на десктопе (слева — что
   человек получит, справа — поля), на 900px и уже — одна колонка, форма первой
   после заголовка. */
.lf{margin:40px 0 0;padding:34px 0 38px;background:var(--bg);border-top:1px solid var(--line)}
.lf__h{margin:0 0 18px;font-size:23px;line-height:1.25;font-weight:700;letter-spacing:.1px}
.lf__grid{display:grid;grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr);gap:22px 44px;align-items:start}
.lf__txt p{margin:0 0 12px;color:#2a3038;font-size:14.5px;line-height:1.6;max-width:460px}
.lf__txt b{font-weight:700}
.lf__list{margin:14px 0 14px;padding:0 0 0 0;list-style:none;max-width:460px}
.lf__list li{position:relative;padding:0 0 9px 20px;font-size:13.5px;line-height:1.55;color:#4a525c}
.lf__list li:before{content:"";position:absolute;left:3px;top:8px;width:6px;height:6px;border-radius:50%;background:var(--acc);opacity:.55}
.lf__alt{margin:0!important;font-size:13px;color:var(--mut)}
.lf__alt a{color:var(--acc)}
.lf__f{display:grid;gap:12px}
.lf__row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lf__lbl{display:block;font-size:12.5px;color:#5c6570;font-weight:600;letter-spacing:.2px}
.lf__lbl input,.lf__lbl textarea{margin-top:5px;width:100%;font:inherit;font-size:14.5px;font-weight:400;
  color:var(--ink);background:#fff;border:1px solid #d8dad3;border-radius:9px;padding:10px 12px;
  transition:border-color .15s,box-shadow .15s}
.lf__lbl textarea{resize:vertical;min-height:74px;line-height:1.5}
.lf__lbl input:focus,.lf__lbl textarea:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 3px rgba(31,95,91,.12)}
.lf__lbl input::placeholder,.lf__lbl textarea::placeholder{color:#a2a8ae}
.lf__consent{display:flex;gap:9px;align-items:flex-start;font-size:12.5px;line-height:1.5;color:#4a525c;max-width:none}
.lf__consent input{margin:2px 0 0;width:16px;height:16px;flex:0 0 auto;accent-color:var(--acc)}
.lf__consent a{color:var(--acc)}
.lf__act{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:2px}
.lf__btn{font:inherit;font-size:15px;font-weight:600;color:#fff;background:var(--acc);border:0;
  border-radius:9px;padding:11px 26px;cursor:pointer;transition:background .15s}
.lf__btn:hover{background:#174b47}
.lf__btn:disabled{opacity:.65;cursor:default}
.lf__note{font-size:12px;line-height:1.45;color:var(--mut);max-width:none}
/* 24.10.2026 КАПИТАН: «это тоже можно писать одной строкой». Замер до фикса:
   текст подписи 316 px при max-width:300 — не хватало 16 px, отсюда перенос
   «ответить.» на вторую строку, хотя в строке кнопки было 133 px свободных. */
.lf__res{margin:8px 0 0;font-size:13.5px;line-height:1.5;min-height:0}
.lf__res.ok{color:var(--ok);font-weight:600}
.lf__res.bad{color:var(--bad)}
/* honeypot: поле есть в разметке (боты его видят), человек — нет */
.lf__hp{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;overflow:hidden}
@media(max-width:900px){
  .lf{padding:28px 0 30px;margin-top:32px}
  .lf__grid{grid-template-columns:1fr;gap:18px}
  .lf__h{font-size:20px}
  .lf__txt p,.lf__list{max-width:none}
}
@media(max-width:560px){
  .lf__row{grid-template-columns:1fr}
  .lf__btn{width:100%}
  /* 22.10.2026: на телефоне подпись под кнопкой была 12px и читалась как сноска —
     подняли до 13px (это единственное объяснение, почему нужен телефон) */
  .lf__note{font-size:13px;max-width:none}
  .lf__consent{font-size:13px}
}

/* 22.10.2026 КАПИТАН: «пустая белая полоса между блоками».
   Замер до фикса: 128 px белого между оговоркой и формой — 28 px нижнего отступа
   .phead + 60 px padding-bottom у main + 40 px margin-top у .lf. Фон у секций
   #f7f7f4, у body белый — любой зазор между ними читается как белая полоса.
   Правила стоят в конце файла, поэтому перекрывают и медиазапрос .lf (стр. 1428). */
main.main--lead{padding-bottom:0}
main.main--lead > .phead{margin-bottom:0}
main.main--lead + .lf{margin-top:0}
section.lf{margin-top:0}

/* ── «Живой осмотр сайта» (22.10.2026) ───────────────────────────────────────
   Отдельный слой наблюдения: страницу открывал и читал человек (Perplexity),
   это впечатление, а не замер кода. Слева подпись пункта, справа текст.
   На узком экране — колонкой: подпись сверху, текст под ней.
   ВАЖНО: разметку этого блока собирает scripts/medstat_pplx_render.py
   (build.py: PPLX.block(host)), а не шаблон — поэтому аудит 24.10.2026, который
   искал классы только в base.html/about.html/medstat_build.py, ошибочно счёл
   .plx* мёртвыми. Классы живые: medstat_qa.py проверяет их в готовой странице.
   Разметка: <section class="grp grp--plx"><div class="plx">…plx__row… */
.grp--plx{margin-top:26px}
.grp--plx h2 .mini{font-weight:400}
.plx{border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}
.plx__row{display:grid;grid-template-columns:186px minmax(0,1fr);gap:16px;
  padding:14px 18px;border-bottom:1px solid #f1f0ec}
.plx__row:last-child{border-bottom:0}
.plx__l{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);
  font-weight:700;line-height:1.5;padding-top:2px}
.plx__v{min-width:0}
.plx__p{margin:0;font-size:15px;line-height:1.6;color:#2f3338;max-width:86ch;text-wrap:pretty}
.plx__p+.plx__p{margin-top:8px}
.plx__ul{margin:0;padding:0 0 0 18px;font-size:15px;line-height:1.6;color:#2f3338}
.plx__ul li{margin:3px 0}
.plx__ul li::marker{color:#b9b9b2}
/* пункт «что слабо» — не тревожная плашка, но глаз должен за него зацепиться */
.plx__row--weak{background:#fdfaf6}
.plx__row--weak .plx__l{color:var(--ask)}
@media (max-width:720px){
  .plx__row{grid-template-columns:1fr;gap:4px;padding:12px 14px}
  .plx__l{padding-top:0}
}

/* ─── Блок «Полный редизайн» перед формой связи (22.10.2026) ─────────────────── */
/* 28.10.2026 КАПИТАН: «надо слегка отступ между этих добавить» — зелёная полоса
   «Полный редизайн» упиралась в последнюю строку карточки вплотную: на карточках
   без блока соседей зазор был 0 px, с блоком — 10 px. Даю воздух, линия остаётся
   границей полосы, а не подчёркиванием ссылки. */
main.main--lead + .rdz{margin-top:30px}
.rdz{margin:40px 0 0;padding:34px 0 38px;background:#f4f7f5;border-top:1px solid var(--line)}
.rdz__h{margin:0 0 10px;font-size:23px;line-height:1.25;font-weight:700;letter-spacing:.1px}
.rdz__lead{margin:0 0 22px;font-size:14.5px;line-height:1.6;color:#2a3038;max-width:740px}
.rdz__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.rdz__c{display:block;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;
  text-decoration:none;color:inherit;transition:box-shadow .18s,transform .18s}
.rdz__c:hover{box-shadow:0 8px 24px rgba(20,23,28,.10);transform:translateY(-2px)}
.rdz__ph{display:block;aspect-ratio:760/475;background:#e9eeec;overflow:hidden}
.rdz__ph img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.rdz__nm{display:block;padding:12px 13px 0;font-size:14.5px;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.rdz__ci{display:block;padding:3px 13px 13px;font-size:12.5px;color:var(--mut)}
.rdz__body{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr);gap:22px 44px;
  margin:26px 0 0;align-items:start}
.rdz__list{margin:0;padding:0;list-style:none}
.rdz__list li{position:relative;padding:0 0 10px 20px;font-size:13.5px;line-height:1.55;color:#3c434c}
.rdz__list li:before{content:"";position:absolute;left:3px;top:8px;width:6px;height:6px;
  border-radius:50%;background:var(--acc);opacity:.55}
.rdz__price{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.rdz__sum{margin:0 0 6px;font-size:19px;line-height:1.3}
.rdz__sum b{font-weight:700}
.rdz__var{margin:0 0 8px;font-size:12.5px;line-height:1.5;color:#4a525c}
.rdz__note{margin:0 0 14px;font-size:12.5px;line-height:1.5;color:var(--mut)}
.rdz__btn{display:inline-block;padding:11px 18px;border-radius:9px;background:var(--acc);color:#fff;
  font-size:14.5px;font-weight:600;text-decoration:none}
.rdz__btn:hover{background:#174b47}
@media(max-width:820px){.rdz__grid{grid-template-columns:1fr 1fr}.rdz__body{grid-template-columns:1fr}}
@media(max-width:560px){.rdz__grid{grid-template-columns:1fr}}

/* ── 23.10.2026. ГЛАВНАЯ: КРЕСТ В ЛОГОТИПЕ, ПЛАШКИ ВМЕСТО ТАБЛИЦЫ ──────────
   КАПИТАН: «там где логотип, можно добавить красный крест как значок медицины»,
   «продписать комплексный аудит сайтов клиник», «таблицу с сайтами переделай в
   плашки, используй скрин главной страницы, и бейдж с оценкой». */
/* 23.10.2026 КАПИТАН: «в логотипе сделай так, чтобы текст не вылезал по высоте за
   размер крестика». Замер до правки: крест 27px, текст 38,5px (на 390px — 63,8px в три
   строки). Теперь высота текстового блока = высоте креста: 17*1.05 + 2 + 10*1.05 = 30,4
   при кресте 32px. На узких экранах подпись уходит (она дублирует h1), остаётся «МедСтат». */
/* Раскладка .logo (row + центр + gap:10px) задана ОДИН раз — строкой 17.
   Здесь стоял дубль `.logo{flex-direction:row;align-items:center;gap:10px}`,
   который молча перебивал базовое правило; убран 24.10.2026, вид не изменился. */
.logo .logo__mark{display:block;flex:0 0 auto;line-height:0;font-size:0;text-transform:none;letter-spacing:0}
.logo .logo__mark svg{display:block;width:32px;height:32px}
.logo .logo__txt{display:flex;flex-direction:column;justify-content:center;gap:2px;line-height:1.05}
.logo .logo__txt b{font-size:17px;line-height:1.05;letter-spacing:.2px}
.logo .logo__txt span{font-size:10px;line-height:1.05;color:var(--mut);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}
@media(max-width:560px){
 .logo{gap:8px}
 .logo .logo__mark svg{width:26px;height:26px}
 .logo .logo__txt{gap:0}
 .logo .logo__txt b{font-size:16px}
 .logo .logo__txt span{display:none}
}

.cats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:14px 0 0}
.cat{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
 border-radius:12px;overflow:hidden;text-decoration:none;color:var(--ink);transition:box-shadow .15s,border-color .15s}
.cat:hover{border-color:#c9c9c1;box-shadow:0 6px 18px rgba(0,0,0,.07)}
.cat__shot{display:block;position:relative;aspect-ratio:16/10;background:#f2f2ec;overflow:hidden}
.cat__shot img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.cat__ph{display:block;width:100%;height:100%;background:
 repeating-linear-gradient(135deg,#f4f4ef 0 10px,#efefe9 10px 20px)}
/* 23.10.2026 КАПИТАН: «бейдж с оценкой перенести на белую полоску, где название,
   в формате как на карточке, с кружком». Кольцо как в карточке (дуга = доля балла
   из 10), только компактное: 40 px вместо 128, цифра внутри. */
.cat__sc{position:relative;flex:0 0 auto;width:36px;height:36px;display:grid;place-items:center;
 color:var(--sc-mid);
 /* 23.10.2026 КАПИТАН: «на плашке сайта оценку ровно поставь». Раньше кольцо
    висело на верхнем крае полоски (margin-top:-10px подтягивал его к первой
    строке названия): сверху до кольца оставалось 2 px, снизу — 42 px, и оно
    читалось как «съехавшее вверх». Теперь кольцо стоит РОВНО по центру белой
    полоски: полоска — flex с align-items:center, отступы сверху и снизу равные
    (11 px), кольцо ничем не подтянуто. */
 margin-top:0}
.cat__sc svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.cat__sc b{position:relative;font-size:12.5px;font-weight:700;line-height:1}
/* Цвет оценки — ровно те же переменные и те же пороги, что в кольце карточки
   (.psp__avg--ok/--mid/--bad): балл 5,4 в карточке и в плашке одного цвета. */
.cat__sc--ok{color:var(--sc-ok)}.cat__sc--mid{color:var(--sc-mid)}.cat__sc--bad{color:var(--sc-bad)}.cat__sc--n{color:var(--sc-mid)}
/* дуга кольца — ярким цветом шкалы, цифра внутри — читаемым (см. :root) */
.cat__sc--ok svg{color:var(--sc-ok-v)}.cat__sc--mid svg{color:var(--sc-mid-v)}.cat__sc--bad svg{color:var(--sc-bad-v)}.cat__sc--n svg{color:var(--track)}
.cat__b{padding:11px 11px 11px;display:flex;align-items:center;gap:9px;
 /* Полоска дотягивается до низа плашки (flex:1), поэтому в одном ряду они одной
    высоты даже если название у соседа длиннее в две строки. Вместе с
    align-items:center это даёт ровно одну линию колец по всему ряду. */
 flex:1 1 auto}
.cat__tx{min-width:0;flex:1 1 auto;display:flex;flex-direction:column;gap:3px}
.cat__n{font-size:13.5px;line-height:1.25}
.cat__d{font-size:11.5px;color:var(--mut);overflow-wrap:anywhere}
.cat__m{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--mut);margin-top:1px}
/* 27.10.2026: метка «новый в каталоге» на плашке главной. Нейтральный тон,
   потому что это не оценка сайта, а факт: карточки не было в каталоге 26.10. */
.cat__new{flex:0 0 auto;padding:1px 6px;border-radius:999px;background:#eef0e8;color:#4c5a3c;
 font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:lowercase}

/* 4 в ряд — только на широком экране; уже 1100 — 3, на телефоне 2 */
@media(max-width:1100px){.cats{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}}
@media(max-width:720px){.cats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .cat__b{padding:8px 9px 9px;gap:7px}.cat__n{font-size:13px}.cat__d{font-size:11px}
 .cat__m{font-size:11px}.cat__sc{width:32px;height:32px;margin-top:0}.cat__sc b{font-size:11px}
 /* 23.10.2026: на 390 кнопка заявки не растягивалась и выглядела «куцей» рядом с
    кнопкой аудита на всю ширину — прижимаем обе к полной ширине. */
 .cat__n{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 .cat__m{flex-wrap:wrap;gap:2px 6px}}

/* ── Нижний воздух у каталога на главной (23.10.2026) ───────────────────────
   Замер до правки: низ подписи «Показаны 20 последних аудитов…» = 2166,4 px,
   верх следующей секции .lf = 2166,4 px — зазор 0, подпись упиралась в бордюр.
   Причина: main.main--lead{padding-bottom:0} (правка от 22.10 против белой
   полосы), а у самой секции каталога вертикальных отступов нет вовсе.
   Даю свой нижний отступ секции — 56 px как у прочих секций (32+26). */
.homelist{padding-bottom:56px}
@media(max-width:720px){.homelist{padding-bottom:40px}}

/* ── Меню в шапке: пять пунктов, последний выделен (23.10.2026) ───────────────
   КАПИТАН: «сделай в меню "О проекте", "Методика аудита", "Каталог сайтов",
   "Поиск по каталогу", "Связаться с нами" последний пункт выдели».
   Было два пункта текстом в строку («Каталог», «Поиск сайта») без оформления.
   Стало: пункты-кнопки, у последнего — заливка цветом проекта (--acc), белым
   текстом и лёгкой тенью, чтобы он читался как действие, а не как ссылка.
   Старые правила .tnav a{margin-left:18px} перекрыты ниже (файл читается сверху
   вниз), сама разметка пунктов — templates/medstat/base.html. */
.tnav{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:2px}
.tnav a{margin-left:0;text-decoration:none;font-size:14px;line-height:1;padding:9px 10px;
 border-radius:9px;color:var(--ink);white-space:nowrap;transition:background .15s,color .15s}
.tnav a:hover{background:#f3f3ee;color:var(--acc)}
.tnav a.tnav__cta{background:var(--acc);color:#fff;font-weight:600;padding:10px 14px;
 /* заливка читается как край кнопки, а не как отступ пункта: при gap:2px кнопка
    прилипала к «Поиск по каталогу». Нужен честный зазор. */
 margin-left:10px;
 box-shadow:0 2px 8px rgba(31,95,91,.22)}
.tnav a.tnav__cta:hover{background:#174a47;color:#fff}
@media(max-width:1040px){.tnav a{font-size:13px;padding:8px 8px}.tnav a.tnav__cta{padding:9px 11px}}
/* уже 860 — меню уходит на свою строку и листается вбок, а не сжимается в кашу */
@media(max-width:860px){
 /* на планшете «Где размещается» и «Как трактуем» получали по 95px — три слова
    в столбик по 10 знаков. На узком экране они уходят, как и в каталоге. */
 .tbl--mm .hide-s{display:none}
 .tbl--mm th:nth-child(1),.tbl--mm td:nth-child(1){width:30%}
 .tbl--mm th:nth-child(2),.tbl--mm td:nth-child(2){width:70%}
 /* 27.10.2026 (КАПИТАН: «проверь методику, нет ли таких же косяков»). Замер:
    в методике 195 ячеек несли class="hide-s" — на узком экране вместе с
    «Где размещается» и «Как трактуем» с методики исчезал вердикт, ради которого
    её и читают. Теперь строка методики раскладывается карточкой, как таблицы
    норм в карточке клиники: подпись колонки мелким капсом над значением.
    Та же раскладка для таблицы техники (там пряталась «Группа»). */
 .tbl--stk{table-layout:auto;display:block}
 .tbl--stk thead{position:absolute;width:1px;height:1px;overflow:hidden;
   clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
 .tbl--stk tbody{display:block}
 .tbl--stk tbody tr{display:block;border:1px solid var(--line);border-radius:11px;
   margin:0 0 10px;padding:3px 0;background:#fff}
 .tbl--stk th,.tbl--stk td{display:block;width:auto !important;border:0;
   padding:7px 13px;overflow-wrap:anywhere}
 .tbl--stk td+td{border-top:1px solid #f0f2ea}
 .tbl--stk tbody tr:nth-child(even) td{background:none}
 .tbl--stk td[data-l]::before{content:attr(data-l);display:block;margin:0 0 3px;
   font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--mut);
   font-weight:700;line-height:1.3}
 .tbl--stk td[data-l="Пункт"]::before{display:none}
 /* Вижн по телефону: «внутри карточки между подписью и значением слишком
    большой отступ, карточки становятся очень длинными». Короткие поля —
    вердикт, место и группа — держим ОДНОЙ строкой с подписью (подпись мелким
    капсом в строку, а не блоком сверху): 4 поля в карточке вместо 4 этажей. */
 .tbl--stk td{padding-top:6px;padding-bottom:6px}
 .tbl--stk td[data-l]::before{margin:0 0 2px}
 .tbl--stk td[data-l="Как трактуем"],.tbl--stk td[data-l="Где размещается"],
 .tbl--stk td[data-l="Группа"]{padding-top:3px;padding-bottom:3px;font-size:12.5px;
   line-height:1.45}
 .tbl--stk td[data-l="Как трактуем"]::before,.tbl--stk td[data-l="Где размещается"]::before,
 .tbl--stk td[data-l="Группа"]::before{display:inline;margin:0 5px 0 0;font-size:11px}
}
/* 24.10.2026 (КАПИТАН: «поиск прилип»). Замер по шести пунктам меню:
   нужная ширина 746 px, а на 900 px экране под меню оставалось 650 — строка
   переносилась: пять пунктов в одну строку, кнопка «Связаться с нами» во вторую.
   Порог «меню уходит на свою строку» поднят с 860 до 900 px ровно по этому замеру,
   а в полосе 861–1000 у логотипа скрыта подпись: с ней под меню остаётся 618 px
   и подпись «КОМПЛЕКСНЫЙ АУДИТ МЕДСАЙТОВ» выдавливает пункты в перенос. */
@media(min-width:861px) and (max-width:1160px){
 .logo .logo__txt span{display:none}
}
@media(max-width:900px){
 .topi{height:auto;flex-wrap:wrap;padding:9px 0 7px;row-gap:6px}
 .tnav{order:3;flex:1 1 100%;justify-content:flex-start;flex-wrap:nowrap;gap:2px;
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 .tnav::-webkit-scrollbar{height:0;display:none}
 .tnav a{font-size:13px;padding:7px 9px}
 .tnav a.tnav__cta{padding:7px 11px}
}
/* На телефоне пять пунктов в одну строку не влезают (замер: 583 px при 390 px
   экрана) — горизонтальная прокрутка прятала выделенный «Связаться с нами» за
   краем. Поэтому уже 560 px меню переносится на две строки и видно целиком. */
@media(max-width:560px){
 .tnav{flex-wrap:wrap;overflow:visible;row-gap:3px}
 .tnav a{font-size:12.5px;padding:6px 8px}
 .tnav a.tnav__cta{padding:6px 10px}
}
/* Пункты меню ведут на якоря главной (#catalog, #check, #lead). Шапка липкая
   (64 px, на телефоне ~100 px) и закрывала бы заголовок блока — поэтому целям
   даём отступ прокрутки. */
#catalog,#check,#lead{scroll-margin-top:76px}
@media(max-width:560px){#catalog,#check,#lead{scroll-margin-top:112px}}

/* ── ПОЛНЫЙ СПИСОК КАТАЛОГА (23.10.2026) ──────────────────────────────────────
   КАПИТАН: «В каталог сайтов выведи мне все сайты из каталога, буду тыкать
   карточки и проверять чего ты там понаделал». Витрина плашек осталась на 20 —
   это картинки; под ней лежит весь каталог строками, каждая строка — ссылка на
   карточку. В две колонки на широком экране: 644 строки в один столбец дают
   полотно в 26 тысяч пикселей, в два — вдвое короче и всё ещё читаемо. */
.acr__cnt{font-size:12.5px;font-weight:600;color:var(--mut);background:#f1f1ea;
 border:1px solid var(--line);border-radius:20px;padding:1px 9px}
.allcat{margin:12px 0 0;border:1px solid var(--line);border-radius:12px;overflow:hidden;
 background:#fff;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.acr{display:grid;grid-template-columns:minmax(0,1fr) auto 36px;align-items:center;gap:10px;
 padding:8px 12px;min-height:38px;text-decoration:none;color:var(--ink);
 border-bottom:1px solid #efefea;transition:background .12s}
.acr:hover{background:#f7faf8}
/* 27.10.2026: замер на телефоне 390 показал, что название клиники обрезалось
   многоточием на 100 px («Клиника Доктора Север…»), хотя справа до края строки
   оставалось пустое место — колонка домена (до 210 px) отжимала колонку названия.
   В каталоге человек ищет клинику ПО НАЗВАНИЮ, домен вторичен.
   Стало: название до двух строк, домен уступает ему ширину и на телефоне уезжает
   на вторую строку, оценка остаётся справа по центру. */
.acr__n{font-size:13.5px;line-height:1.28;overflow:hidden;display:-webkit-box;
 -webkit-line-clamp:2;-webkit-box-orient:vertical}
/* 28.10.2026 (КАПИТАН: «таблица с сайтами кривой стала, что-то произошло с адресами»):
   правка 27.10 убрала white-space:nowrap у домена и поставила overflow-wrap:anywhere
   + max-width:44%. В grid-колонке `auto` ширина считается по min-content, а с anywhere
   min-content = ОДНА БУКВА: замер 1440 показал домен шириной 27 px и высотой 53 px,
   т.е. «newlife40.ru» вытянулся столбиком по буквам, строки выросли 38 -> 70 px,
   справа пустота. Возвращено nowrap+ellipsis (домены тут до 71 знака, хватает 210 px).
   На телефоне (<=560) перенос разрешён заново, но там ширина колонки задана
   (minmax(0,1fr)), поэтому min-content ничего не сжимает. */
.acr__d{font-size:11.5px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;
 white-space:nowrap;max-width:210px;min-width:0}
.acr__sc{font-size:12.5px;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.acr__sc{white-space:nowrap}
/* маркер: яркая точка слева от цифры — цвет виден даже когда сама цифра тёмная */
.acr__sc::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;
 margin-right:6px;vertical-align:1px;background:var(--track)}
.acr__sc--ok::before{background:var(--sc-ok-v)}.acr__sc--mid::before{background:var(--sc-mid-v)}
.acr__sc--bad::before{background:var(--sc-bad-v)}.acr__sc--n::before{background:var(--track)}
/* легенда шкалы под заголовком каталога: что означают три цвета */
.sclegend{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px;margin:2px 0 12px;
 font-size:12.5px;color:var(--mut)}
.sclegend span{display:inline-flex;align-items:center;gap:6px}
.sclegend__i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--track)}
.sclegend__i--ok{background:var(--sc-ok-v)}.sclegend__i--mid{background:var(--sc-mid-v)}
.sclegend__i--bad{background:var(--sc-bad-v)}
.sclegend__n{color:#8b938c}
.acr__sc--ok{color:var(--sc-ok)}.acr__sc--mid{color:var(--sc-mid)}
.acr__sc--bad{color:var(--sc-bad)}.acr__sc--n{color:#b9bdb7;font-weight:400}
@media(max-width:860px){.allcat{grid-template-columns:minmax(0,1fr)}
 .acr__d{max-width:170px}}
/* телефон: домен НЕ отжимает название — уезжает под него, оценка справа по центру */
@media(max-width:560px){
 .acr{grid-template-columns:minmax(0,1fr) 34px;grid-template-areas:"n sc" "d sc";
  row-gap:1px;padding:9px 12px}
 .acr__n{grid-area:n}
 .acr__d{grid-area:d;max-width:none;white-space:normal;overflow-wrap:anywhere}
 .acr__sc{grid-area:sc}}
/* ПОСТРАНИЧНЫЙ ВЫВОД КАТАЛОГА (23.10.2026, КАПИТАН: «только сделай вывод постраничный»).
   Кнопки страниц стоят под списком, тем же составом, что и строки: слева направо
   ‹ 1 2 … 16 ›. Цифры — кнопки, а не ссылки: страница не меняет адрес, чтобы не
   ломать якоря, а клик всё равно работает и с клавиатуры (это <button>). */
.pg{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px;margin:18px auto 0;max-width:820px}
.pg[hidden]{display:none}
.pg__i{min-width:34px;height:34px;padding:0 9px;border:1px solid var(--line);background:#fff;
 border-radius:9px;font:inherit;font-size:13.5px;line-height:1;color:var(--ink);cursor:pointer;
 font-variant-numeric:tabular-nums;transition:background .12s,border-color .12s}
.pg__i:hover:not([disabled]){background:#f2f6f4;border-color:#c8d6d0}
.pg__i[disabled]{opacity:.45;cursor:default}
.pg__i--cur{background:var(--acc);border-color:var(--acc);color:#fff;font-weight:600}
.pg__i--cur:hover{background:var(--acc)}
.pg__g{color:var(--mut);padding:0 2px}
.pg__c{margin-left:6px;font-size:12.5px;color:var(--mut);font-variant-numeric:tabular-nums;text-align:center}
@media(max-width:560px){.pg__i{min-width:31px;height:31px;padding:0 7px;font-size:13px}
 .pg__c{flex-basis:100%;margin:2px 0 0}}
/* Группа «не проверяем»: те же строки, но приглушённые — это не оценка, а объяснение. */
.acr--skip .acr__n{color:var(--mut)}
.acr--skip:hover{background:#fbfbf7}

/* ── ТЕКСТОВЫЕ СТРАНИЦЫ: О проекте / Политика / «Как мы считаем» (23.10.2026) ──
   КАПИТАН: «в отступах накосячил». Замер до правки (1440):
     • текст внутри плашки стоял на 199 px, а заголовок страницы и лид — на 180:
       сдвиг 19 px (border-left 3 + padding-left 16) — ось чтения ломалась;
     • строка 1044 px при шрифте 14 px — это ~130 знаков, читать невозможно;
     • плашка кончалась на 1214, а секция «Связаться с нами» начиналась на 1214 —
       зазор 0 px, скруглённые нижние углы упирались в серую полосу;
     • расстояния h2 сверху и снизу были одинаковы (17,43) — разделы сливались;
     • .disc b превращал любую жирную фразу внутри абзаца в КАПС 13 px
       (на методике так стояло 30 фраз: «СКОЛЬКО СТРАНИЦ СМОТРИМ.»).
   Стало: текст на оси заголовка (180 = 180), ширина чтения 760 px как у лида,
   воздух 44 px до следующей секции, у разделов свой отступ сверху.
   margin-left:-19px компенсирует border 3 + padding-left 16 → текст встаёт
   ровно на ось; на узких экранах компенсация не нужна и снята. */
.disc--doc{margin-top:24px;margin-bottom:44px;padding:22px 18px 22px 16px;max-width:none}
/* 23.10.2026 (вечер): вынос рамки на 19px влево УБРАН совсем. Замер: карточка вставала
   на x=161 при левом крае контентной колонки 180 — то есть рамка торчала за ширину
   контента, хотя текст внутри был на оси. КАПИТАН: «уехало за ширину контента».
   Правильно: рамка карточки стоит ровно по колонке (x = 180), текст внутри с отступом. */
@media(min-width:1200px){.disc--doc{margin-left:0}}
.disc--doc p{font-size:15px;line-height:1.62;margin:0 0 11px}
.disc--doc p:last-child{margin-bottom:0}
.disc--doc h2{font-size:19px;line-height:1.3;margin:26px 0 9px;color:var(--ink)}
.disc--doc h2:first-child{margin-top:0}
/* жирная фраза внутри абзаца — это выделение, а не надзаголовок */
.disc--doc b{font-size:inherit;text-transform:none;letter-spacing:normal;color:inherit;font-weight:700}
@media(max-width:860px){.disc--doc{max-width:none}}
@media(max-width:720px){.disc--doc{margin-top:20px;margin-bottom:32px;padding:16px 14px 16px 14px}
 .disc--doc h2{margin:20px 0 7px;font-size:17.5px}
 .disc--doc p{font-size:14.5px;line-height:1.58}}

/* ═══ СТРАНИЦА МЕТОДИКИ (23.10.2026) ══════════════════════════════════════════
   КАПИТАН: «я бы на твоём месте тоже пересмотрел, сейчас не очень удачно свёрстана».
   Замеры ДО правки, браузер 1440×900:
     · зазор «конец таблицы → заголовок группы» = 20px, у h2 браузерные поля 19,9/19,9
       — 22 группы слипались в одно полотно, страница 15 155px без единого якоря;
     · абзацы 759–760px при 15–16px = 85–89 знаков в строке (норма 60–80);
     · у таблицы не липла шапка: на 39-й строке уже не помнишь, что за колонка.
   На 390px: колонка «Норма и цитата» = 118px → 12 знаков в строке, строка таблицы
   до 883px высоты, страница 34 839px, и 4px горизонтального выезда (слово в .mini
   не переносилось).
   Что сделано: ритм секций, оглавление, липкая шапка таблицы, колонки по смыслу,
   мера строки, перенос длинных слов. */
.met h2{margin:44px 0 14px;font-size:22px;line-height:1.25;padding-bottom:10px;
  border-bottom:1px solid var(--line);scroll-margin-top:88px}
.met h2:first-child{margin-top:0}
.met > .disc--doc{margin-bottom:36px}

/* оглавление: 22 группы на 15 тысяч пикселей без навигации — это не страница, а список */
.met .mtoc{margin:0 0 36px;padding:18px 20px 16px;background:var(--bg);
  border:1px solid var(--line);border-radius:12px}
.met .mtoc p{margin:0 0 12px;font-size:11.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--mut)}
.met .mtoc ol{margin:0;padding:0;list-style:none;columns:3;column-gap:32px}
.met .mtoc li{margin:0 0 7px;break-inside:avoid;font-size:14.5px;line-height:1.35;
  display:grid;grid-template-columns:24px minmax(0,1fr);column-gap:9px;align-items:center}
/* 23.10.2026: номер — квадрат 24×24 у всех пунктов один в один, надпись по центру его высоты */
.met .mtoc .n{display:flex;align-items:center;justify-content:center;
  width:24px;height:24px;box-sizing:border-box;background:#fff;border:1px solid var(--line);
  border-radius:7px;color:var(--mut);font-size:11.5px;line-height:1;font-variant-numeric:tabular-nums;
  text-align:center;padding:0;min-width:0;white-space:nowrap;justify-self:start}
.met .mtoc a{color:var(--ink);text-decoration:none;border-bottom:1px solid transparent}
.met .mtoc a:hover{border-bottom-color:var(--line)}
.met .mtoc .all{margin:12px 0 0;padding-top:12px;border-top:1px solid var(--line);
  font-size:13.5px;color:var(--mut)}
.met .mtoc .all a{color:var(--acc)}

/* таблица методики: ширина колонок по смыслу, а не поровну */
.tbl--mm{table-layout:fixed}
.tbl--mm th:nth-child(1),.tbl--mm td:nth-child(1){width:20%}
.tbl--mm th:nth-child(2),.tbl--mm td:nth-child(2){width:54%}
.tbl--mm th:nth-child(3),.tbl--mm td:nth-child(3){width:13%}
.tbl--mm th:nth-child(4),.tbl--mm td:nth-child(4){width:13%}
.tbl--mm td{overflow-wrap:anywhere}
.tbl--mm tbody tr:last-child td{border-bottom:1px solid var(--line)}

/* шапка таблицы липнет под шапкой сайта: на 39-й строке видно, что за колонка */
@media(min-width:861px){
 .met thead th{position:sticky;top:64px;z-index:2;background:#fff;
   box-shadow:inset 0 -1px 0 var(--line)}
}

@media(max-width:860px){
 /* мера строки: 759px при 15px — это 85–89 знаков, читать приходится с поводком */
 .met .mtoc ol{columns:2}
}
@media(max-width:720px){
 .met h2{margin:34px 0 12px;font-size:19px;padding-bottom:8px;scroll-margin-top:112px}
 /* плашка не прилипает к краю экрана: было -17px при паддинге 20 → 3px от края */
 .met .disc--doc{margin-left:0;margin-right:0}
 .met .mtoc{padding:14px 15px;margin-bottom:28px}
 .met .mtoc ol{columns:2;column-gap:18px}
 .met .mtoc li{font-size:12.5px;margin:0 0 4px;grid-template-columns:22px minmax(0,1fr);column-gap:7px;align-items:center}
 .met .mtoc .n{font-size:11px;width:22px;height:22px;border-radius:6px}
 .met .mtoc li .mini{font-size:11px}
 .met .mtoc{background:transparent;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0}
 .tbl--mm{table-layout:fixed}
 .tbl--mm th:nth-child(1),.tbl--mm td:nth-child(1){width:36%}
 .tbl--mm th:nth-child(2),.tbl--mm td:nth-child(2){width:64%}
 .tbl--mm th{font-size:11px;padding:8px 7px;letter-spacing:.3px}
 .tbl--mm td{padding:9px 7px;font-size:13.5px;line-height:1.5}
 .tbl--mm td .mini{font-size:12px;line-height:1.45}
}
@media(max-width:400px){
 .tbl--mm th:nth-child(1),.tbl--mm td:nth-child(1){width:40%}
 .tbl--mm th:nth-child(2),.tbl--mm td:nth-child(2){width:60%}
}

/* ── ПЕРЕХОД В КАТАЛОГ (23.10.2026) ────────────────────────────────────────────
   КАПИТАН: «все сайты каталога на странице "Каталог сайтов", на главной не надо
   весь каталог». Вместо 272 КБ списка на главной — одна видимая строка-переход на
   /catalog.html, иначе человек, привыкший искать каталог на главной, решит, что
   каталог пропал. Стрелка — часть ссылки, не отдельный значок. */
.moreall{margin:22px 0 0;text-align:center}
.moreall__a{display:inline-flex;align-items:center;gap:9px;padding:12px 22px;
  border:1px solid var(--acc);border-radius:10px;color:var(--acc);background:#fff;
  font-weight:600;font-size:15px;text-decoration:none;transition:background .15s,color .15s}
.moreall__a:hover,.moreall__a:focus-visible{background:var(--acc);color:#fff;border-color:var(--acc)}
@media(max-width:560px){.moreall__a{display:flex;justify-content:center;padding:13px 18px}}
/* Страница каталога: тот же ритм секций, что у главной, и запас снизу, чтобы
   последняя строка списка не прилипала к серой полосе формы. */
.catlist{padding-bottom:56px}
@media(max-width:720px){.catlist{padding-bottom:40px}}
.phead--cat{padding:24px 0 28px;margin-bottom:24px}
.phead--cat .lead{margin-bottom:14px}

/* ============================================================================
   ТЕМА v2 — 23.10.2026, «тёплая бумага, глубокий хвойный акцент».
   КАПИТАН: «сделай на свой вкус, но бекап сохрани».
   Правило блока: меняем только ЦВЕТ, ТЕНЬ, РАДИУС, НАЧЕРТАНИЕ и ПЕРЕХОДЫ.
   Ни одного изменения раскладки (display/grid/width/padding сеток) — поэтому
   сетка не может поехать, а откат = удалить этот блок (бэкап до темы:
   var/medstat_archive/style_v2_20261023/medstat.css.pre_v2).
   Что здесь решается по делу, а не «на глаз»:
   1) три статус-цвета были 3,0–3,5:1 при норме 4,5 → затемнены до 5,5–6,3:1;
   2) служебные подписи 11–12px (#a8aeb5, #8b939c = 2,2–3,0:1) → 4,9:1;
   3) жёсткие рамки заменены одной тенью и одним радиусом — поверхности
      читаются как слои, а не как таблица из админки;
   4) шапка — стекло на волосяной линии (была глухая белая полоса).

   ПОЧЕМУ ЭТОТ БЛОК ПЕРЕБИВАЕТ ПРАВИЛА ВЫШЕ (проверено аудитом 24.10.2026,
   var/medstat_css_audit.md, раздел 4): ниже сознательно объявлены заново те же
   селекторы, что уже есть в файле. Это НЕ дубли по недосмотру: тема v2 правит
   только цвет/тень/радиус/переход, и держать их в одном месте дешевле, чем
   размазывать по базовым блокам (откат = удалить блок целиком). Пары:
     .top (11 vs 1949), .phead (18 vs 1945), .tnav a (16/964/1721 vs 1952),
     .tnav a.tnav__cta + :hover (1724/1726 vs 1958/1961),
     .check (136 vs 1966), .tbl th (158 vs 1974),
     .acr (1767) и .acr:hover (1770), .acr__cnt (1763), .acr__sc--n (1775),
     .aud__cn (1147), .about--foot .about__connote (112),
     .lf__row (1523), .lf__lbl input/textarea (1525), .lf__act (1534),
     .met h2 (1844) и .met h2 в @media (1887), .tbl--mm td в @media (1900).
   Правила правятся здесь; базовые записи не удалять — это откат.
   ============================================================================ */
html{-webkit-text-size-adjust:100%}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  font-feature-settings:"kern" 1,"liga" 1,"calt" 1}
h1,h2,h3,.sec{letter-spacing:-.012em}
.phead h1{font-weight:750}
.phead{background:linear-gradient(180deg,#f8f9f4 0%,var(--bg) 100%)}
.lead{font-size:16.5px;line-height:1.6}

/* --- шапка: стекло, волосяная линия, мягкая тень ---------------------------------- */
.top{background:rgba(255,255,255,.9);backdrop-filter:saturate(1.5) blur(10px);
  -webkit-backdrop-filter:saturate(1.5) blur(10px);border-bottom:1px solid rgba(20,30,25,.09);
  box-shadow:0 6px 18px -16px rgba(20,30,25,.45)}
.tnav a{color:#2b333c;transition:color .15s}
.tnav a:hover,.tnav a:focus-visible{color:var(--acc)}
/* знак: цвет ТЕМЫ --acc (#1a5c55), а не отдельный «фирменный алый». 24.10.2026 КАПИТАН:
   «а вот сейчас обновился, но в шапке то он не красный»; после разбора знак, фавикон и
   meta theme-color сведены к одному источнику — вон тому правилу ниже. Фавикон
   (scripts/medstat_favicon.py) читает цвет ИМЕННО отсюда, поэтому менять цвет знака
   можно только здесь. Отдельного «фирменного алого» в теме нет: в CSS его не было ни в
   одном правиле, только в этом устаревшем комментарии (снят проверкой 24.10.2026). */
.logo__mark svg rect{fill:var(--acc)}
.logo__txt b,.logo b{letter-spacing:.15px}
.tnav a.tnav__cta{border-radius:9px;
  box-shadow:0 1px 2px rgba(20,30,25,.16),inset 0 1px 0 rgba(255,255,255,.13);
  transition:background .16s,transform .12s,box-shadow .16s}
.tnav a.tnav__cta:hover{background:#14473f;transform:translateY(-1px);
  box-shadow:0 8px 18px -10px rgba(16,60,52,.6),inset 0 1px 0 rgba(255,255,255,.13)}

/* --- поверхности: один радиус, одна тень ------------------------------------------ */
.n,.about,.check,.disc,.cres.on,.sug{border-radius:12px;box-shadow:var(--sh1)}
.check{border-radius:14px}
.n--f{cursor:pointer;transition:box-shadow .18s,transform .18s,border-color .18s}
.n--f:hover{transform:translateY(-1px);box-shadow:var(--sh2)}
.n b,.acr__sc,.about__meta span{font-variant-numeric:tabular-nums}
.acr{transition:background .14s}
.acr:hover{background:#f5faf7}

/* --- таблицы: шапка на плотной подложке, воздух вместо линий ----------------------- */
.tbl th{background:#fafbf6;border-bottom:1px solid #e6e8df}
.tbl td{border-bottom-color:#eef0e8}
.tbl tbody tr:hover td{background:#fbfcf7}

/* --- ссылки и фокус ---------------------------------------------------------------- */
a{text-decoration-thickness:.06em;text-underline-offset:.18em}
p a,li a,.mini a{text-decoration-color:rgba(26,92,85,.38)}
p a:hover,li a:hover,.mini a:hover{text-decoration-color:currentColor}
.cres a,.mini--ask a{color:var(--acc)}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

/* --- кнопки и поля ------------------------------------------------------------------ */
.cform button,.lf__btn{border-radius:9px;box-shadow:0 1px 2px rgba(20,30,25,.16);
  transition:background .16s,transform .12s,box-shadow .16s}
.cform button:hover:not([disabled]),.lf__btn:hover{transform:translateY(-1px);background:#14473f;
  box-shadow:0 8px 18px -10px rgba(16,60,52,.6)}
.cform input,.lf__f input,.lf__f textarea{border-radius:9px;border-color:#d7dad3;
  transition:border-color .16s,box-shadow .16s}
.cform input:focus,.lf__f input:focus,.lf__f textarea:focus{border-color:var(--acc);outline:0;
  box-shadow:0 0 0 3px rgba(26,92,85,.14)}
.cform input::placeholder,.lf__f input::placeholder,.lf__f textarea::placeholder{color:#8d949c}

/* --- контраст: служебные подписи, которые не проходили WCAG ------------------------ */
.aud__cn{color:#6c7480}
.about--foot .about__connote{color:#6b7480}
.aud__cv--na{color:#767f89}
.acr__sc--n{color:#8a9184}
.acr__cnt{color:#4f5964;background:#eceee6}
.foot .mini{color:#57616b}
/* зебра строк: текст «На сайте» на тонированной полосе #f3f6ec давал 4,28:1 —
   чуть ниже нормы; тон подписи на пол-шага темнее, полоса остаётся мягкой */
.aud__tbl--law .lw__seen b,.aud__tbl--pr .lw__seen b{color:#5d656e}
/* ═══ РИТМ МЕТОДИКИ v2 — 23.10.2026, по замечанию КАПИТАНА ════════════════════
   КАПИТАН: «здесь проблема с отступами, слепил местами».
   Замеры ДО (живая страница, Chromium 1440×900 / 390×844):
     · заголовок страницы → оглавление = 0 px. Причина: правило 22.10
       main.main--lead > .phead{margin-bottom:0} писалось под главную, а здесь
       съело весь воздух под шапкой — оглавление начиналось от самой линии;
     · заголовок группы → таблица = 14 px (15 раз на странице): h2 приклеен
       к шапке таблицы и читается как подпись к первой строке;
     · последняя таблица → блок «Связаться с нами» = 0 px (main + .lf{margin-top:0});
     · 13 абзацев «Как мы считаем»: зазор 18 px при межстрочном 24,3 — простыня;
     · ячейка таблицы: название пункта и код (org.name) слиплись — <br> без зазора,
       вертикальные поля 9 px при межстрочном 22,5;
     · поля формы: 12 px между полями, подпись к полю 5 px;
     · h1 → лид = 12 px.
   Что сделано: воздух под шапкой и перед формой, h2→таблица 20/16 px,
   абзацы 20 px, ячейки 12 px и код отдельной строкой, поля формы 16 px. */

/* воздух под шапкой страницы: правило 22.10 писалась под главную, здесь оно вредно */
main.main--lead > .phead + .met{margin-top:34px}
main.main--lead > .met{padding-bottom:52px}
.phead:has(+ .met) h1{margin-bottom:16px}

/* заголовок группы и таблица — два блока, а не один */
.met h2{margin:48px 0 20px}
.met h2:first-child{margin-top:0}

/* абзацы читаются по отдельности: зазор соизмерим с межстрочным */
.met .disc--doc{padding:26px 22px 26px 20px}
.met .disc--doc p{margin:0 0 20px}
.met > p.lead{margin:0 0 24px}
.met > p.lead + table.tbl{margin-top:20px}

/* 24.10.2026 (КАПИТАН: «секцию сделать по ширине контента»). Раньше абзацы раздела
   «Скорость, вёрстка, движок и так далее» жили в колонке 680px, а таблица под ними —
   во всю ширину контента 1080: правый край рвался ступенькой. Класс lead--wide ставится
   только этим абзацам (tech_metodika), остальная методика не тронута. */
.met > p.lead--wide{max-width:none}

/* таблицы: сначала общий класс, потом методика — иначе .tbl--m перебивает padding */
.tbl--m th{padding:10px 12px}
.tbl--m td{padding:11px 12px}
.tbl--mm td{padding:12px 12px 12px 10px}
.tbl--mm td b{display:block;margin-bottom:3px;line-height:1.42}
.tbl--mm td .mini{display:inline-block;font-size:12px;line-height:1.35;
  letter-spacing:.2px;color:var(--mut)}
.tbl--mm td br{display:none}

/* форма: поля не липнут друг к другу (зазор задаёт grid, не margin) */
form.lf__f{gap:16px}
.lf__row{gap:12px 14px}
.lf__lbl input,.lf__lbl textarea{margin-top:7px}
.lf__consent{margin-top:4px}
.lf__act{margin-top:6px}

@media(max-width:720px){
  main.main--lead > .phead + .met{margin-top:24px}
  main.main--lead > .met{padding-bottom:36px}
  .met h2{margin:36px 0 16px}
  .met .disc--doc{padding:20px 16px}
  .met .disc--doc p{margin:0 0 18px}
  .met > p.lead{margin:0 0 20px}
  .tbl--m td{padding:10px 8px}
  .tbl--mm td{padding:11px 8px}
  form.lf__f{gap:15px}
  .lf__row{gap:11px}
}

/* SEO-перелинковка карточек (24.10.2026): «Ещё в каталоге» — 8 ссылок на соседние
   карточки. Блок лёгкий: две колонки на узком, четыре на широком. */
.rel{margin:26px auto 8px}
.rel .sec{font-size:18px;margin:0 0 10px}
.rel__l{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px 20px}
.rel__l li{min-width:0}
.rel__l a{display:block;padding:7px 10px;border:1px solid rgba(26,92,85,.16);border-radius:8px;
  color:inherit;text-decoration:none;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rel__l a:hover,.rel__l a:focus-visible{border-color:#1a5c55;background:rgba(26,92,85,.06)}
.rel__all{margin:12px 0 0;font-size:14px}
@media (max-width:900px){.rel__l{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.rel__l{grid-template-columns:1fr}}

/* «Клиники, расположенные рядом» (24.10.2026, идея КАПИТАНА): соседи по адресу
   с расстоянием и оценкой — честная перелинковка вместо случайных доменов. */
.near{margin:34px auto 10px}
.near .sec{margin:0 0 6px}
.near__lead{margin:0 0 14px;color:var(--mut);font-size:14.5px;max-width:74ch}
.near__l{list-style:none;padding:0;margin:0;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.near__a{display:grid;grid-template-columns:1fr auto;gap:2px 14px;align-items:center;
  padding:12px 14px;border:1px solid rgba(26,92,85,.16);border-radius:10px;
  color:inherit;text-decoration:none;background:#fff;box-shadow:var(--sh1);height:100%}
.near__a:hover,.near__a:focus-visible{border-color:var(--acc);background:rgba(26,92,85,.045)}
.near__n{font-weight:600;font-size:15px;line-height:1.3;min-width:0}
.near__ad{grid-column:1;font-size:13px;color:var(--mut);line-height:1.35}
.near__sc{grid-row:1/span 2;grid-column:2;display:flex;flex-direction:column;
  align-items:center;justify-content:center;min-width:52px;font-size:13px;line-height:1.1}
.near__sc b{font-size:18px;font-weight:700}
.near__sc i{font-size:11px;font-style:normal;color:var(--mut);margin-top:2px}
.near__sc--ok{color:var(--sc-ok)}
.near__sc--mid{color:var(--sc-mid)}
.near__sc--bad{color:var(--sc-bad)}
.near__sc--na{color:var(--mut);font-size:12px}
.near__all{margin:12px 0 0;font-size:14px}
@media (max-width:760px){.near__l{grid-template-columns:1fr}}
/* Хлебные крошки (24.10.2026, SEO): структура видна и человеку, и поиску. */
.crumbs{font-size:13px;color:#5a6b68;padding:14px 0 8px}
.crumbs .wrap{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.crumbs a{color:#1a5c55;text-decoration:none;border-bottom:1px solid rgba(26,92,85,.28)}
.crumbs a:hover{border-bottom-color:#1a5c55}
.crumbs__s{opacity:.5}
.crumbs span[aria-current]{color:#3c4a48}

/* ── РАЗДЕЛ «ЧТО МЕНЯЕТСЯ В ЗАКОНАХ» (24.10.2026) ─────────────────────────────
   КАПИТАН: «нужен новостной раздел, в котором будут публиковаться законы и изменения
   в них». Стиль тот же, что у карточек: бумажный фон, тонкие линейки, акцент #1a5c55.
   Список — не «новости», а публикации: слева дата, справа вид акта и название. */
.lmeta{margin:10px 0 0;color:var(--mut);font-size:14.5px}
.lwrap{max-width:1120px}
/* 24.10.2026 (КАПИТАН: «весь этот раздел сделай по ширине контента, на всем сайте
   по ширине, а тут ты что-то чудишь»): было 980 — раздел законов единственный на
   сайте стоял уже остальных страниц (1120, внутренний блок 1080). Теперь как все.
   Замер пробником scripts/medstat_width_probe.py: 1440 → колонка 1120, блок 1080. */
.lfilter{display:flex;flex-wrap:wrap;row-gap:16px;column-gap:10px;align-items:center;margin:0 0 18px}
/* 24.10.2026: колонка раздела стала 1120 (как весь сайт), и поле поиска с чипами
   начали влезать в одну строку — поиск при этом сжимался до 345 px (было 420 до
   правки 17.10, которую КАПИТАН просил на всю ширину). Поэтому поле занимает
   свою строку целиком, чипы идут под ним с зазором 16 px. */
.lfilter input[type=search]{flex:1 1 100%;min-width:200px;padding:11px 13px;border:1px solid var(--line);
  border-radius:9px;font:15px/1.3 inherit;color:var(--ink);background:#fff}
.lfilter input[type=search]:focus{outline:2px solid rgba(26,92,85,.35);outline-offset:1px}
.lchips{display:flex;flex-wrap:wrap;gap:6px}
.lchip{font:13.5px/1 inherit;padding:8px 11px;border:1px solid var(--line);border-radius:999px;
  background:#fff;color:#2b333c;cursor:pointer}
a.lchip{display:inline-block;text-decoration:none;color:inherit}
.lchip span{margin-left:6px;color:var(--mut);font-size:12px}
.lchip:hover{border-color:rgba(26,92,85,.45)}
.lchip--on{background:var(--acc);border-color:var(--acc);color:#fff}
.lchip--on span{color:rgba(255,255,255,.75)}
.lmonth{font-size:13.5px;text-transform:uppercase;letter-spacing:.09em;color:#6f7a72;
  margin:22px 0 9px;padding-bottom:5px;border-bottom:1px solid var(--line)}
.llist{display:flex;flex-direction:column;gap:8px}
.law{display:grid;grid-template-columns:96px 1fr;gap:14px;padding:13px 16px;border:1px solid #dfe2d7;
  border-radius:11px;background:#fff;box-shadow:var(--sh1);transition:border-color .15s,box-shadow .15s}
.law:hover{border-color:#c7cdbe;box-shadow:var(--sh2)}
.law time{font-variant-numeric:tabular-nums;color:var(--mut);font-size:13.5px;padding-top:2px}
.law__kind{margin:0 0 4px;font-size:12.5px;color:var(--mut);text-transform:none}
.law h3{margin:0;font-size:16.5px;line-height:1.35;font-weight:600}
.law h3 a{color:var(--ink);text-decoration:none}
.law h3 a:hover{color:var(--acc);text-decoration:underline;text-underline-offset:2px}
.lawtag{display:inline-block;margin:8px 6px 0 0;font-size:12px;padding:3px 8px;border-radius:6px;
  background:#f1f4ef;color:#3c4a48}
.lawtag--site{background:#e7f0ee;color:#14514b}
.lnone{padding:18px 0 8px;color:var(--mut)}
.lhow{margin:38px 0 0;padding-top:22px;border-top:1px solid var(--line)}
.lhow h2{font-size:19px;margin:0 0 10px}
.lhow ul{margin:10px 0 12px;padding-left:20px}
.lhow li{margin:6px 0}
.lback{margin:0 0 6px;font-size:14px}
.lback a{text-decoration:none;border-bottom:1px solid rgba(26,92,85,.28)}
.ltbl{width:100%;border-collapse:collapse;margin:0 0 18px}
.ltbl th,.ltbl td{text-align:left;vertical-align:top;padding:9px 12px;border-bottom:1px solid var(--line);font-size:15px}
.ltbl th{width:38%;color:var(--mut);font-weight:500}
.lbtn{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 20px}
.lgo{display:inline-block;padding:11px 15px;border-radius:9px;background:var(--acc);color:#fff;
  text-decoration:none;font-weight:600;font-size:14.5px}
.lgo:hover{background:#174a47;color:#fff}
.lgo--ghost{background:#fff;color:var(--acc);border:1px solid rgba(26,92,85,.45)}
.lgo--ghost:hover{background:#f2f6f4;color:var(--acc)}
.llinks{margin:8px 0 10px;padding-left:20px}
.llinks li{margin:5px 0}
@media (max-width:600px){
  .law{grid-template-columns:1fr;gap:6px}
  .law time{order:-1;font-size:13px}
  .ltbl th{width:45%}
}
/* второй список раздела законов — «изменения в медицине, не про сайт» */
.lmore{margin:34px 0 0}
.lsep{display:flex;align-items:baseline;flex-wrap:wrap;gap:10px;font-size:20px;margin:0 0 8px;
  padding-top:22px;border-top:1px solid var(--line)}
.lsep span{font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;color:#8a5a00;
  background:#fbf3e2;border:1px solid #f0e2c4;border-radius:999px;padding:3px 9px;font-weight:500}

/* Первый экран раздела законов — компактный (24.10.2026, КАПИТАН: «визуально тоже
   некрасиво, зачем такие большие h1 в хиро»). Заголовок в этом разделе мельче общего
   .phead h1 (30px). Ширина — 1120, как у остальных страниц сайта (24.10.2026:
   раздел был 980 и выбивался из сетки). */
.phead--laws,.phead--doc{padding:20px 0 22px;margin-bottom:22px}
.phead--laws .wrap,.phead--doc .wrap{max-width:1120px}
.phead--laws h1,.phead--doc h1{font-size:23px;line-height:1.25;margin:4px 0 10px;max-width:none}
.phead--laws .lead{max-width:760px;font-size:14.5px;line-height:1.6;margin-bottom:0}
.phead--doc .lead{margin-bottom:0;font-size:14.5px}
.phead--laws .lmeta{font-size:13.5px;margin-top:8px}
.phead--doc h1{font-weight:700}
/* таблица реквизитов акта: строки плотнее, подпись слева уже */
.disc--doc{padding:18px 20px}
.ltbl th,.ltbl td{padding:7px 10px;font-size:14.5px;line-height:1.45}
.ltbl th{width:34%}
.lbtn{margin:2px 0 16px}
.lwrap h2{font-size:17px;margin:18px 0 8px}
@media (max-width:700px){
  .phead--laws,.phead--doc{padding:16px 0 18px;margin-bottom:18px}
  .phead--laws h1,.phead--doc h1{font-size:20px;line-height:1.3}
  .phead--laws .lead,.phead--doc .lead{font-size:14px}
  .ltbl th,.ltbl td{padding:6px 8px;font-size:14px}
}
/* Полное официальное название акта — раскрывающийся блок под реквизитами.
   24.10.2026 (КАПИТАН: «зачем такие большие h1»): названия актов бывают по 600-700
   знаков, в h1 это стена из 15 строк. В h1 — по границе слова 110 знаков, полное
   название целиком здесь: ничего не потеряно, первый экран читается. */
.lfull{margin:0 0 16px;border:1px solid var(--line);border-radius:9px;background:#fbfcf8}
.lfull summary{cursor:pointer;padding:9px 13px;font-size:13.5px;color:var(--acc);font-weight:600;
  list-style:none;display:flex;align-items:center;gap:7px}
.lfull summary::-webkit-details-marker{display:none}
.lfull summary::before{content:"＋";font-weight:700;color:var(--mut)}
.lfull[open] summary::before{content:"－"}
.lfull summary:hover{background:#f2f6f4;border-radius:9px}
.lfull p{margin:0;padding:2px 13px 11px;font-size:14px;line-height:1.55;color:var(--ink)}
.lfull[open] summary{border-bottom:1px solid var(--line);border-radius:9px 9px 0 0}

/* ── зазор под шапкой раздела «Правовые акты» — 24.10.2026 ───────────────────
   КАПИТАН: «тут поиск прилип, проверь все отступы». Замер живой страницы
   (Chromium 1440×900 и 390×844): .phead--laws → .lwrap = 0 px, то есть поле
   поиска начиналось от самой линии шапки. На остальных страницах сайта тот же
   стык — 20–34 px.
   Причина: правило 22.10 `main.main--lead > .phead{margin-bottom:0}` писалось
   под главную; на методике его компенсировали (main.main--lead > .phead + .met),
   а разделу законов компенсацию не дали. Специфичность (0,2,1) перебивала
   `.phead--laws{margin-bottom:22px}` (0,1,0).
   Проверено после фикса: 1440 → 22 px, 390 → 18 px. Перемерены все 45 карточек
   актов и 5 остальных страниц (102 замера) — там 20–34 px, ничего не поехало. */
main.main--lead > .phead--laws{margin-bottom:22px}
@media (max-width:700px){
  main.main--lead > .phead--laws{margin-bottom:18px}
}

/* ── зазор «контент → Связаться» в разделе «Правовые акты» — 24.10.2026 ──────
   КАПИТАН: «отступ больше между контентом и связаться, за образец как наверху
   контента можешь взять».
   Замер живой страницы (Chromium 1440×900 и 390×844) до правки: конец контента →
   линия блока «Связаться с нами» = 12 px на обеих ширинах. Это margin-bottom 12 px
   у UL.lbase внутри .lhow: он схлопывался через .lwrap и main наружу и был ВСЕМ
   зазором — своей рамки у стыка не было (section.lf{margin-top:0}, правило 22.10
   про «белую полосу»). Сверху контента в этом же разделе зазор 22 px
   (.phead--laws → .lwrap), на телефоне 18 px — оттуда и взят образец.
   Стало: 22 px на десктопе, 18 px на ≤700 px.
   27.10.2026: образец сверху поднялся до 30/20 (правило про воздух под полосой
   .phead), поэтому низ тоже поднят до 30/20 — иначе раздел актов остался бы
   единственным местом, где низ не равен верху.
   Механика: это margin-top у .lf, а НЕ padding-bottom у main. Первая попытка была
   с padding-bottom — замер пробной сборки дал 34 px: padding отменяет схлопывание
   margin'а ребёнка (12 px), и он прибавился к 22. margin-top соседнего блока с этим
   12 px схлопывается — max(22, 12) = 22, ровно как сверху раздела.
   Правило ключуется на :has(> .phead--laws), то есть только раздел актов; прочие
   страницы не тронуты (замер после правки: catalog 0, metodika 0, about 44,
   карточка акта 44 — как было). Браузер без :has просто не применит правило —
   останется прежний вид, ничего не сломается.
   Проверка: scripts/medstat_footgap_probe.py. */
main.main--lead:has(> .phead--laws) + .lf{margin-top:30px}
@media (max-width:700px){
  main.main--lead:has(> .phead--laws) + .lf{margin-top:20px}
}

/* 24.10.2026 (КАПИТАН): вместо снимка сайта-заглушки/закрытого сайта — плашка
   с причиной. Показывать «скриншот» заглушки хостинга нельзя: это не вид клиники. */
.deadfig{margin:18px 0 22px;padding:0;border:1px solid var(--line,#e5e7eb);border-radius:14px;
  overflow:hidden;background:#0f172a}
.deadfig img{display:block;width:100%;height:auto}
.deadfig figcaption{padding:10px 14px;font-size:13px;line-height:1.4;color:#94a3b8;background:#0f172a}

/* ИСТОРИЯ ПРОВЕРОК (24.10.2026). КАПИТАН: «было столько ошибок, это исправили».
   Строка «что изменилось с прошлого замера» — рядом с блоком «О проверке».
   Спокойная рамка слева, без акцентного цвета: это не замечание и не нарушение,
   а факт динамики. */
.hist{margin-top:14px;padding:10px 14px;border-left:3px solid #9bb7a1;border-radius:6px;
  background:#f7faf7;font-size:13.5px;line-height:1.55;color:#2a3038}
.hist .mini{color:var(--mut,#6b7280)}
.hist b{color:#1f6b34}

/* ДОСТУПНОСТЬ САЙТА (25.10.2026, КАПИТАН): зелёный Online / красный Offline.
   Точка + подпись, без рамки — чтобы не спорить с бейджем оценки рядом. */
.onl{display:inline-flex;align-items:center;gap:.34em;margin-left:.45em;
  font-size:.72em;font-weight:600;letter-spacing:.01em;text-transform:none;
  vertical-align:middle;white-space:nowrap}
.onl i{width:.62em;height:.62em;border-radius:50%;flex:0 0 auto;display:block}
.onl--on{color:#12805c}
.onl--on i{background:#17a06f;box-shadow:0 0 0 .16em rgba(23,160,111,.16)}
.onl--off{color:#c0392b}
.onl--off i{background:#e04a3a;box-shadow:0 0 0 .16em rgba(224,74,58,.16)}
.onl__why{display:block;font-size:.62em;font-weight:400;color:#8a8f98;margin-top:.15em}
.cat__d .onl{font-size:.68em;margin-left:.3em}

/* ── СТАТЬИ (27.10.2026) ───────────────────────────────────────────────────────
   КАПИТАН: «нам бы поразмещать статьи про наш сервис… это коммерческие запросы».
   Генератор — scripts/medstat_articles.py, шаблон общий (base.html), здесь только
   типографика разбора: текст читается как документ, а не как карточка каталога. */
.art{max-width:none}
.art p,.art li{font-size:15.5px;line-height:1.66;color:var(--ink)}
.art h2{font-size:21px;line-height:1.3;margin:30px 0 10px}
.art h2:first-of-type{margin-top:18px}
.art ul,.art ol{padding-left:22px;margin:0 0 15px}
.art li{margin:0 0 8px}
.art code{background:var(--bg);border:1px solid var(--line);padding:1px 5px;border-radius:4px;font-size:13.5px}
.art__meta{font-size:12.5px;color:var(--mut);margin:0 0 16px;letter-spacing:.2px}
.art__quote{margin:14px 0 16px;padding:13px 16px;border-left:3px solid var(--acc);
  background:var(--bg);font-size:14.5px;line-height:1.6;color:var(--ink);max-width:none}
.art__quote span{display:block;margin-top:8px;font-size:12.5px;color:var(--mut)}
.art__note{margin:16px 0;padding:13px 15px;border:1px solid #e8dfc6;background:#fbf7ea;
  border-radius:10px;font-size:14.5px;line-height:1.6}
.art__note--warn{border-color:#f0cfcb;background:#fdf1ef}
/* Оглавление и «Читайте также» в статьях (28.10.2026). Оба блока — навигация, а не
   текст: тише основного содержимого по цвету, но не мельче 14px — по замеру контраста
   в статьях уже ловили 11,5px серым (4,4:1, ниже нормы). Ширина 720, как у .art__counts:
   на 1080 строка выходит 120 знаков, глаз теряет начало. */
.art__toc{margin:18px 0 26px;padding:12px 18px 14px;border:1px solid var(--line);
  border-radius:12px;background:var(--bg);max-width:720px}
.art__toc b,.art__rel b{display:block;font-size:11px;font-weight:700;letter-spacing:.6px;
  text-transform:uppercase;color:#5b635a;margin:0 0 8px}
.art__toc ol{margin:0;padding:0 0 0 20px;font-size:14px;line-height:1.45}
.art__toc li{margin:5px 0}
.art__toc a{color:#22282f;text-decoration:none;border-bottom:1px solid rgba(26,92,85,.3)}
.art__toc a:hover{color:var(--acc);border-bottom-color:var(--acc)}
.art__rel{margin:28px 0 0;padding:14px 0 0;border-top:1px solid var(--line);max-width:none}
.art__rel a{display:block;padding:9px 0;border-bottom:1px solid #f0f2ea;font-size:14.5px;
  line-height:1.4;color:var(--acc);text-decoration:none}
.art__rel a:last-child{border-bottom:0}
.art__rel a:hover{text-decoration:underline}
@media(max-width:720px){.art__toc,.art__rel{max-width:none}
  .art__toc{padding:12px 14px 12px}.art__toc ol{font-size:15px}}
.art__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(288px,1fr));
  gap:14px;margin:8px 0 10px;max-width:none}
.art__card{display:block;padding:16px 16px 18px;border:1px solid var(--line);border-radius:12px;
  background:#fff;text-decoration:none;color:var(--ink);transition:box-shadow .15s,border-color .15s}
.art__card:hover{border-color:var(--acc);box-shadow:var(--sh2)}
.art__card b{display:block;font-size:15.5px;line-height:1.32;margin:8px 0 6px}
.art__d{display:block;font-size:13.5px;line-height:1.5;color:var(--mut)}
.art__tag{display:inline-block;font-size:11px;text-transform:uppercase;letter-spacing:.6px;
  color:var(--acc);background:rgba(26,92,85,.08);padding:3px 8px;border-radius:6px}
@media(max-width:720px){.art h2{font-size:19px}.art p,.art li{font-size:15px}
  .art__grid{grid-template-columns:1fr}}
/* ── СПРАВОЧНЫЕ БЛОКИ В СТАТЬЯХ: ЗАПИСИ, А НЕ ТАБЛИЦА (27.10.2026, третий заход)
   КАПИТАН трижды: «таблица громоздкая и пустая», «думай ещё». Что было заме-
   рено до правки: строка зафиксирована height:62px (воздух даже там, где текст
   в одну фразу), в колонках до 480–697 px пустоты (ширины давала авто-расклад-
   ка), и четыре слоя графики разом — рамка обёртки, залитая шапка, вертикаль-
   ные линии между колонками и зебра по чётным строкам.
   Главное: НИ ОДИН из этих блоков не таблица. Таблица нужна, когда значения
   сравнивают по колонкам (год к году, регион к региону). Здесь каждая строка —
   самостоятельная запись: норма → нарушение → сумма; орган → что смотрит → по
   какому документу; объект → кто читает → что содержит. Поэтому вместо сетки
   записи: метка мелким капсом, текст обычным, акцент (сумма, доля, вывод)
   справа в ровную вертикаль. Разделяет записи ОДНА тонкая линия, других линий
   нет. Высота записи — по тексту, пустых полос не бывает. */
.art__recs{margin:18px 0 24px;padding:0;max-width:780px}
/* 27.10.2026: блок не тянется на всю ширину статьи (1080) — на такой ширине
   строка текста выходила 1052 px, это ~120 знаков в строке, глаз теряет
   начало. 780 даёт текстовой колонке ~620 px (75–85 знаков) — норма чтения,
   и сумма справа остаётся в пределах одного взгляда. */
.art__rec{display:grid;grid-template-columns:minmax(0,1fr) auto;
  column-gap:34px;row-gap:2px;padding:11px 0;border-top:1px solid #e6e8de;
  align-items:start}
.art__rec:first-child{border-top:0;padding-top:2px}
.art__rec-k{grid-column:1;font-size:11px;font-weight:700;text-transform:uppercase;
  letter-spacing:.5px;color:#59636e;line-height:1.35}
.art__rec-t{grid-column:1;font-size:14px;line-height:1.5;color:#22282f;
  overflow-wrap:anywhere}
/* 27.10.2026 (зрение на статье про штрафы: «мелкий серый текст, сливается с фоном»):
   замер контраста по WCAG — строка «Документ …» была 11,5px цветом #6f776e на белом
   (4,4:1, ниже нормы 4,5 для обычного текста), а слово-метка «Документ» внутри неё —
   #9aa094, это 2,6:1, то есть почти невидимо. Стало 12,5px и #5b635a (5,9:1),
   метка — #6a7268 (4,6:1): иерархия сохранена, читается без прищура. */
.art__rec-m{grid-column:1;margin-top:2px;font-size:12.5px;line-height:1.45;color:#5b635a}
/* 28.10.2026 (КАПИТАН: «тут явно слепил в одну строчку ответ, читается плохо»):
   в записи с ДВУМЯ подписями («Для кого» + «Заменяет карту») оба span шли инлайном,
   и замер показывал их на одной строке (y=1112 у обоих): «Для кого: Посетитель
   Заменяет карту: Нет. Меню есть на любом сайте…» слипалось в одну фразу.
   Каждая подпись — отдельной строкой. */
.art__rec-m span{display:block}
.art__rec-m span + span{margin-top:2px}
.art__rec-m b{color:#6a7268;font-weight:500}
.art__rec-a{grid-column:2;grid-row:1 / span 2;align-self:start;min-width:132px;
  text-align:right;font-size:15px;font-weight:800;line-height:1.35;
  font-variant-numeric:tabular-nums;color:#151b22;white-space:nowrap}
.art__rec-a--bad{color:var(--bad)}
/* 28.10.2026 (КАПИТАН про блок «Три уровня соответствия»: «формат заголовка не такой
   как на других таблицах, не хорошо читается»). Причина была двойная и обе — мои:
   1) в вызове стояло accent=0 при lead=0, то есть одна и та же колонка печаталась
      дважды — мелким капсом слева и крупно справа («A ... A»), это читалось как мусор;
   2) у блока не было шапки колонок, тогда как у соседнего рейтинга («Что показывает
      аудит») она есть — в одном материале два разных языка для одной и той же вещи.
   Теперь шапка та же, что у рейтинга (.art__rank-h): 11px, капс, линия-волосок. */
.art__rec-h{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:34px;
  padding:0 0 8px;border-bottom:1px solid #cfd2c7;
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;
  color:#59636e;line-height:1.35}
.art__rec-h span:last-child{text-align:right}
.art__rec-h + .art__rec{border-top:0;padding-top:2px}
/* метка отдельной левой колонкой — только для коротких меток (A / AA / AAA, «п. 1»),
   длинную в 72px не втиснуть, ей остаётся вариант «капсом над текстом» */
.art__recs--cols .art__rec{grid-template-columns:72px minmax(0,1fr) auto}
.art__recs--cols .art__rec-k{grid-column:1;font-size:15px;font-weight:800;
  text-transform:none;letter-spacing:0;line-height:1.5;color:#151b22}
.art__recs--cols .art__rec-t{grid-column:2}
.art__recs--cols .art__rec-m{grid-column:2}
.art__recs--cols .art__rec-a{grid-column:3}
.art__rec-hk{grid-column:1}
.art__rec-ht{grid-column:2}
.art__rec-h:has(.art__rec-hk){grid-template-columns:72px minmax(0,1fr) auto}
@media(max-width:720px){
  .art__rec-h{grid-template-columns:minmax(0,1fr) auto;column-gap:12px}
  .art__rec-h:has(.art__rec-hk){grid-template-columns:52px minmax(0,1fr);column-gap:12px}
  .art__recs--cols .art__rec{grid-template-columns:52px minmax(0,1fr);column-gap:12px}
  .art__recs--cols .art__rec-k{font-size:14px}
}
.art__rec-a .art__pb{display:block;width:88px;margin:5px 0 0 auto}
@media(max-width:720px){
  .art__rec{grid-template-columns:minmax(0,1fr);column-gap:0;padding:11px 0}
  .art__rec-a{grid-column:1;grid-row:auto;text-align:left;min-width:0;margin-top:5px}
  .art__rec-a .art__pb{margin:5px 0 0 0;width:100%;max-width:180px}
}
.art__pb{display:inline-block;width:72px;height:6px;border-radius:3px;
  background:var(--track);margin:0 9px 0 0;overflow:hidden;vertical-align:1px}
.art__pb i{display:block;height:100%;border-radius:3px;background:var(--acc);
  opacity:.75}
.art__pv{font-variant-numeric:tabular-nums;font-weight:700;color:#2a3038}

/* 27.10.2026 (КАПИТАН: «здесь такая же ситуация, таблица, но пустая»):
   рейтинг «пункт → доля» таблицей держал текст у левого края, а процент — у
   правого: между ними до 700 px пустоты, строка распадалась на две. Первым
   шагом поставил точки-выноски — но 27.10.2026 КАПИТАН сказал: «возможно,
   точки надо убрать, просто таблицу в этом случае не растягивать на всю
   ширину». Так и сделано: блок сужен до 560 px (длинное название 316 px +
   полоска 120 + процент 44 + зазоры влезают с запасом), точек нет, строка
   читается как одна фраза «название — полоска — 100%». Полоски по-прежнему на
   одной оси: сравнивать длиной можно. 28.10.2026 (КАПИТАН: «без рамки было бы
   гармоничнее, в тексте встроено»): рамка, белый фон, радиус и внутренние
   отступы сняты — блок стоит по кромке текста статьи (x=180 при колонке 1080),
   разделители строк и линия под шапкой остались, они и держат ось. */
.art__rank{margin:16px 0 22px;padding:0;border:0;background:transparent;max-width:780px}
.art__rank-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding:0 0 8px;border-bottom:1px solid #cfd2c7;font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.5px;color:var(--mut)}
.art__rank ul{list-style:none;margin:0;padding:0}
.art__rank li{display:flex;align-items:center;gap:10px;padding:8px 0;
  border-bottom:1px solid #f0f2ea;font-size:13.5px;line-height:1.4}
.art__rank li:last-child{border-bottom:0}
.art__rank-t{flex:0 1 auto;min-width:0;color:#2a3038}
.art__rank .art__pb{width:180px;flex:0 0 180px;margin:0 0 0 auto}
.art__rank .art__pv{flex:0 0 44px;text-align:right}
@media(max-width:720px){
  .art__rank{padding:0;margin:14px 0 18px;max-width:none}
  .art__rank-h{display:none}
  .art__rank li{flex-wrap:wrap;gap:6px 10px;padding:9px 0}
  .art__rank-t{flex:1 1 100%}
  .art__rank .art__pb{width:auto;flex:1 1 auto;margin:0}
  .art__rank .art__pv{flex:0 0 auto}
}

/* Плотный список «название — число» вместо таблицы из двух колонок
   (та же жалоба КАПИТАНа). 27.10.2026: точки-выноски убраны, блок сужен —
   «просто таблицу не растягивать на всю ширину». Число стоит сразу за
   названием через margin-left:auto в границах СВОЕЙ колонки, поэтому цифры
   всё ещё выровнены по правому краю колонки, а пустоты между словом и числом
   было 400 px — стало втрое меньше. На телефоне — одна колонка. */
.art__counts{list-style:none;margin:16px 0 22px;padding:18px 20px;
  border:1px solid var(--line);border-radius:12px;background:#fff;
  max-width:720px;
  display:grid;grid-template-columns:repeat(var(--cols,2),minmax(0,1fr));
  column-gap:34px;row-gap:2px}
.art__counts li{display:flex;align-items:baseline;gap:8px;padding:7px 0;
  border-bottom:1px solid #f0f2ea;font-size:14px;line-height:1.35}
.art__counts li:last-child,.art__counts li:nth-last-child(2){border-bottom:0}
.art__cnt-t{color:#2a3038}
.art__cnt-n{font-variant-numeric:tabular-nums;font-weight:700;color:var(--acc);
  margin-left:auto}

@media(max-width:720px){
  .art__pb{width:64px}
  .art__counts{grid-template-columns:minmax(0,1fr);padding:14px 16px;
    column-gap:0}
  .art__counts li{padding:8px 0;font-size:14.5px}
  .art__counts li:last-child{border-bottom:0}
}

/* ── ВИТРИНА СТАТЕЙ (27.10.2026, КАПИТАН: «оформи нормально») ────────────────
   Проверка виженом показала: шесть одинаковых серых плиток, ноль дат и цифр,
   огромная дыра между заголовком и сеткой. Здесь: строка фактов в шапке,
   обложка первой статьи с крупной цифрой, у остальных — KPI каталога,
   время чтения и стрелка, которая едет при наведении. */
.astat{display:flex;flex-wrap:wrap;gap:12px 36px;list-style:none;margin:20px 0 2px;padding:0}
.astat li{display:flex;flex-direction:column;gap:3px;min-width:0;position:relative}
.astat li+li{padding-left:24px;border-left:1px solid var(--line)}
.astat b{font-size:17px;line-height:1.15;color:var(--ink);font-weight:700;letter-spacing:-.1px}
.astat span{font-size:12px;color:var(--mut);line-height:1.35;max-width:236px}
.astat li:first-child b{color:var(--acc)}
.statyi .disc--doc{margin-top:0}
.art__grid--mag{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin:0 0 8px}
/* пять карточек после обложки: 2+2+2 в первом ряду и 3+3 во втором —
   ни одной пустой клетки в последнем ряду (было 3 и 2 с дырой справа) */
.art__grid--mag>*:nth-child(-n+3){grid-column:span 2}
.art__grid--mag>*:nth-child(n+4){grid-column:span 3}
.acard{display:flex;flex-direction:column;padding:18px 18px 16px;border:1px solid var(--line);
  border-radius:14px;background:#fff;text-decoration:none;color:var(--ink);
  transition:box-shadow .15s,border-color .15s,transform .15s}
.acard:hover{border-color:var(--acc);box-shadow:var(--sh2);transform:translateY(-1px)}
.acard__top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 11px}
.acard .art__tag{color:#0f4b45;background:rgba(26,92,85,.13);font-weight:600;font-size:11px;padding:3px 8px}
.acard__read{font-size:11.5px;color:var(--mut);white-space:nowrap;letter-spacing:.2px}
.acard__t{display:block;font-size:17px;line-height:1.3;font-weight:700;margin:0 0 9px;
  letter-spacing:-.2px;color:#16221f}
.acard__d{display:block;font-size:13.5px;line-height:1.52;color:var(--mut);margin:0 0 12px}
.acard__kpi{display:block;margin:auto 0 0;padding:9px 0 0;border-top:1px dashed var(--line);
  font-size:12.5px;color:var(--mut);line-height:1.4;min-height:44px}
.acard__kpi b{color:var(--acc);font-size:14.5px;margin-right:5px;font-weight:700}
.acard__go{display:block;margin:10px 0 0;font-size:13.5px;font-weight:700;color:var(--acc)}
.acard__go i{font-style:normal;display:inline-block;transition:transform .15s}
.acard:hover .acard__go i{transform:translateX(3px)}
.acard--lead{display:grid;grid-template-columns:minmax(0,1fr) 176px;gap:30px;align-items:stretch;
  padding:24px 24px 22px;margin:0 0 18px;background:linear-gradient(180deg,#fff,#f6f8f3)}
.acard--lead .acard__t{font-size:22px;line-height:1.26;margin:0 0 10px}
.acard--lead .acard__d{font-size:14.5px;line-height:1.55;margin:0 0 14px;max-width:640px}
.acard--lead .acard__go{font-size:14px}
.acard__fig{display:flex;flex-direction:column;gap:4px;justify-content:center;padding:14px 12px 15px;border-radius:12px;
  border:1px solid rgba(26,92,85,.18);background:rgba(26,92,85,.05);text-align:center}
.acard__fig:before{content:'цифра из каталога';font-size:11px;letter-spacing:.5px;
  text-transform:uppercase;color:#5d6b66;margin:0 0 6px}
.acard__fig b{font-size:34px;line-height:1;color:var(--acc);font-weight:700;letter-spacing:-1.2px}
.acard__fig span{font-size:12px;color:var(--mut);line-height:1.35}
@media(max-width:860px){.acard--lead{grid-template-columns:1fr;gap:16px}}
@media(max-width:1000px){.art__grid--mag{grid-template-columns:repeat(2,minmax(0,1fr))}
  .art__grid--mag>*:nth-child(n){grid-column:auto}}
@media(max-width:720px){
  .astat{gap:12px 0;flex-direction:column}
  .astat li+li{padding-left:0;border-left:0;padding-top:12px;border-top:1px solid var(--line)}
  .astat span{max-width:none}
  .art__grid--mag{grid-template-columns:1fr;gap:12px}
  .acard,.acard--lead{padding:16px}
  .acard__d{line-height:1.58}
  .acard__kpi{min-height:0}
  .acard__go{padding:10px 0 0}
  .acard--lead .acard__t{font-size:18.5px}
  .acard__fig{flex-direction:row;align-items:baseline;justify-content:center;gap:9px;padding:13px}
  .acard__fig b{font-size:26px;letter-spacing:-.6px}
}

/* ── Отступ под полосой .phead (27.10.2026) ───────────────────────────────────
   КАПИТАН: «ты системно к хиро прилепляешь контент». Замер браузером до фикса
   (1440 px): /statyi.html и все 6 статей — 0 px между полосой .phead и первой
   строкой текста. Причина: main.main--lead > .phead{margin-bottom:0} (22.10)
   писалось под главную, а компенсацию добавили только точечно (metodika 34 px,
   about/privacy 24, правовые акты 22). Итог — воздух под полосой зависел от
   страницы: от 0 до 34 px.
   Теперь правило одно для всего сайта: 30 px на десктопе, 20 px на телефоне.
   .met (методика) исключён — там свои 34 px, замер и обоснование 22.10. */
main.main--lead > .phead + .wrap:not(.met){margin-top:30px}
@media(max-width:720px){
  main.main--lead > .phead + .wrap:not(.met){margin-top:20px}
}

/* ── Воздух до формы «Связаться с нами» в разделе статей (27.10.2026) ────────
   КАПИТАН: «чуть отступ может больше до секции Связаться, как думаешь?».
   Замер живой страницы до правки (Chromium 1440×900 / 390×844): конец текста →
   линия блока «Связаться» = 16 px в шести статьях и 8 px на индексе, и это был
   всего лишь хвостовой margin последнего абзаца — своей рамки у стыка не было.
   Стало: 34 px на десктопе, 24 px на ≤720 px. Соседние страницы для сравнения:
   о проекте и политика 44, правовые акты 22, методика 0.
   Механика: margin-bottom на контейнере + обнулённый margin последнего
   элемента. Без обнуления зазор плавает (8…16 px) в зависимости от того, чем
   кончается текст: абзацем, врезкой или таблицей. margin, а не padding — иначе
   замер (scripts/medstat_footgap_probe.py) видит край бокса и показывает 0. */
main.main--lead > .wrap.artwrap,
main.main--lead > .wrap.statyi{margin-bottom:34px}
main.main--lead > .wrap.artwrap > .art > *:last-child,
main.main--lead > .wrap.statyi > *:last-child{margin-bottom:0}
@media(max-width:720px){
  main.main--lead > .wrap.artwrap,
  main.main--lead > .wrap.statyi{margin-bottom:24px}
}

/* 28.10.2026 (SEO): кнопки лежали ВНУТРИ <h1> — поисковик читал заголовок карточки
   как «Dnclinic PDF для печати dnclinic.ru ↗». Теперь h1 = только название клиники,
   а кнопка PDF стоит рядом в строке .h1row (вид не меняется: та же строка, тот же
   отступ 14px и та же высота кнопки = высоте букв названия). */
/* 28.10.2026: расстояние между элементами строки — через gap, а не margin-left у
   кнопки. При margin-left кнопка, перенесённая на новую строку (узкий экран или
   длинное название), вставала с отступом 14 px от левой кромки — кнопка «висела»
   правее названия. Замер: 768 px, dentalray.ru — x кнопки 34 против x названия 20. */
.h1row{display:flex;align-items:center;flex-wrap:wrap;gap:2px 14px;margin:6px 0 12px}
.h1row h1{margin:0}
.h1row .pdfbtn{margin-left:0;margin-bottom:2px}
.h1row .lic{margin:0 0 2px 0}
.h1row .lic--own{margin:6px 0 0}
/* .lic--own больше не нужен: блок лицензии всегда своей строкой (28.10.2026) */
/* 28.10.2026 (КАПИТАН, вариант D): паспорт строкой ПОД названием — домен, статус,
   кнопка PDF в правом краю. Категорию из шапки убрали: «медицинская организация» —
   утверждение о статусе, который мы как раз проверяем; профиль сайта выдаётся ниже
   как результат аудита (блок «Тип сайта / Цель / Аудитория»). */
.h1meta{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px;margin:2px 0 14px}
.h1meta .dom{margin:0}
.h1meta .pdfbtn{margin-left:auto}
/* 30.10.2026: у карточки стало две кнопки — «PDF для печати» и «Лист для
   исполнителя» (КАПИТАН: «с карточки нельзя?»). Держим их группой справа:
   одна auto-отбивка на группу, иначе браузер делит свободное место между
   двумя auto-полями и кнопки разъезжаются по всей ширине. */
.h1meta .h1btns{display:flex;align-items:center;gap:10px;margin-left:auto;flex-wrap:wrap}
.h1meta .h1btns .pdfbtn{margin-left:0}
.licwrap{display:flex;flex-wrap:wrap;align-items:flex-start;margin:0 0 14px}
.licwrap .lic{margin:0}
@media(max-width:720px){
  .h1meta .h1btns{margin-left:0;gap:8px}
  .h1meta .pdfbtn{margin-left:0}
}

/* ===== БЛОК ЛИЦЕНЗИИ — под названием клиники, ВСЕГДА развёрнут (28.10.2026) =====
   КАПИТАН: «место плашке справа от названия клиники, это её главная характеристика,
   которая относит её к клиникам» + «не надо плашку сворачивать».
   Развёрнутая выписка из реестра занимает всю ширину, поэтому блок стоит своей полосой
   под строкой «домен · Online · PDF для печати»: строка-шапка (щит, слово ЛИЦЕНЗИЯ,
   номер, состояние) и сразу под ней выписка. Клика нет — данные видны всегда.
   Цвет говорит ровно одно: зелёный — реестр Росздравнадзора подтвердил; жёлтый —
   известно только по словам сайта / ещё не сверяли / сайт не открылся; красный —
   подтвердить нечем (ни номера лицензии, ни ИНН, ни ОГРН). */
.lic{display:block;width:100%;max-width:100%;border:1px solid var(--line);
  border-radius:12px;background:#fff;padding:10px 14px;margin:0;
  font-size:13px;line-height:1.35;color:var(--ink)}
/* Строка-шапка плашки. 28.10.2026, КАПИТАН: «Лицензия / подтвердить не удалось…
   относительно друг друга неровно по высоте». Дело было в выравнивании по ЦЕНТРУ
   боксов: у слова ЛИЦЕНЗИЯ бокс 14.2 px (кегль 10.5), у статуса 17.55 px (кегль 13),
   центры совпадали, а буквы — нет; в Windows-шрифтах (Segoe UI) расхождение базовых
   линий доходило до 1.3 px, и строка читалась как «одно выше другого».
   Теперь выравнивание по БАЗОВОЙ линии (align-items:baseline), кегль подписи поднят
   до 11.5 px, а иконка выведена из этого правила (align-self:center) — она не тянет
   базовую линию вниз. Проверка: probe-элемент на базовой линии у .lic__k и .lic__st
   обязан дать diff = 0.00 при любом шрифте. */
.lic__s{display:flex;align-items:baseline;gap:2px 8px;flex-wrap:wrap}
.lic svg{width:15px;height:15px;flex:0 0 auto;align-self:center}
.lic__k{font-size:11.5px;line-height:1.2;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--mut)}
.lic__n{font-weight:700;font-variant-numeric:tabular-nums}
.lic__st{color:var(--mut)}
.lic--ok{border-color:rgba(12,127,85,.38);background:#f2f9f5}
.lic--ok svg,.lic--ok .lic__k{color:#0c7f55}
.lic--ask{border-color:rgba(158,95,8,.32);background:#fdf7ec}
.lic--ask svg,.lic--ask .lic__k{color:var(--ask)}
.lic--bad{border-color:rgba(193,52,45,.38);background:#fdf3f2}
.lic--bad svg,.lic--bad .lic__k{color:var(--bad)}
.lic--bad .lic__st{color:#8f2b25}
.lic__b{margin:9px 0 0;font-size:13px;line-height:1.5;max-width:820px}
/* .lic--exp — «развёрнут всегда» (28.10.2026). Класс ставит и сборка, и переходник
   scripts/medstat_lic_expand.py на карточках прошлых сборок, поэтому он должен быть
   описан ЯВНО, а не наследоваться от .lic: 13:00 карточки уже несли lic--exp, а
   опубликованный CSS остался от 12:50 с пилюлей (.lic{display:inline-flex;
   border-radius:999px}) — и рамка превратилась в капсулу 1080×111 со скруглением
   999px. Ширина 1080 выходила не из flex, а из .lic__b{width:100%} (процент
   разрешался против контейнера). Теперь состояние описано здесь и не зависит от
   того, какая из двух правок .lic применилась. */
.lic--exp{display:block;width:100%;max-width:100%;border-radius:12px;padding:10px 14px;
  margin:0;font-size:13px;line-height:1.35}
.lic--exp>.lic__s{display:flex;align-items:baseline;gap:2px 8px;flex-wrap:wrap}
.lic__dl{display:grid;grid-template-columns:186px minmax(0,1fr);gap:3px 16px;margin:0 0 8px}
.lic__dl dt{color:var(--mut);font-size:12px}
.lic__dl dd{margin:0;overflow-wrap:anywhere}
.lic__ul{list-style:none;margin:0;padding:0}
.lic__ul li{position:relative;padding-left:12px;margin:0 0 3px}
.lic__ul li::before{content:"";position:absolute;left:0;top:.62em;width:4px;height:4px;
  border-radius:50%;background:#8fa8a2}
.lic__note{margin:6px 0 4px;font-size:12.5px;color:var(--mut)}
.lic__note--warn{color:#8f2b25}
.lic__mini{margin:4px 0 0;font-size:12px;color:var(--mut)}
.lic__src{margin:6px 0 0;font-size:12px;color:var(--mut)}
.lic__ul li.mini{color:var(--mut)}
/* совместимость с карточками прошлых сборок: там плашка была свёрнутой (<details>).
   Переходник scripts/medstat_lic_expand.py переделывает их в развёрнутый блок;
   до тех пор шапка свёрнутой плашки ведёт себя как обычный текст, без «ручки». */
details.lic>summary{list-style:none;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
details.lic>summary::-webkit-details-marker{display:none}
.lic__x{display:none}
.lic__cap{display:none}
@media(max-width:720px){
  .lic{padding:8px 12px;font-size:12.5px}
  .lic__k{font-size:10.5px;letter-spacing:.45px}
  .lic--exp>.lic__s,.lic__s{row-gap:4px}
  .lic__dl{grid-template-columns:minmax(0,1fr);gap:0 0}
  .lic__dl dt{margin-top:5px}
}
@media print{
  .lic{break-inside:avoid}
  details.lic{display:block}
}


/* ===== схемы статей (sch) ===== */

/* 28.10.2026: схемы в статьях — на CSS, не SVG-картинкой (текст ищется/копируется,
   числа берутся из данных, на 320px остаётся одна колонка).
   Вёрстка 2-я итерация: КАПИТАН сказал «в векторе было аккуратнее» — и был прав:
   замер показал, что все квадраты схемы 2 стояли в ОДИН столбец (uniqueDotX = 1),
   потому что repeat(auto-fill,11px) в колонке с auto-шириной сжимался до одной
   колонки. Теперь шаг квадратов жёсткий (repeat(9,24px)) — как в векторе, все ряды
   выровнены по колонкам; числа стоят в своей колонке (в векторе они плавали),
   подвал карточки схемы 1 держится на одной линии у всех трёх колонок. */
.sch{margin:26px 0 30px;max-width:900px}
/* 28.10.2026 (КАПИТАН): внешняя рамка схеме не нужна ни в одном варианте.
   У схемы 1 колонки сами карточки (рамка давала рамку-в-рамке), у схемы 2 строки
   уже разделены линиями и зеброй — рамка была третьим слоем ограждения.
   Контейнер оставлен как пустая обёртка: он держит общий ритм и служит якорем для
   проверок, но без границы, фона и внутреннего отступа — поэтому текст схемы
   начинается ровно на кромке колонки статьи (x = абзаца), а не с отступом в 22px. */
.sch__frame{border:0;background:transparent;padding:0;box-shadow:none;border-radius:0}
.sch__h{font-size:19px;font-weight:700;line-height:1.25;margin:0 0 6px;letter-spacing:-.2px}
.sch .sch__sub{color:var(--mut);font-size:14px;line-height:1.5;margin:0 0 18px;max-width:680px}
.sch figcaption{color:var(--mut);font-size:13px;line-height:1.5;margin:12px 2px 0;max-width:860px}
/* ---------- схема 1: три колонки, единые линии ---------- */
.sch__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.sch__col{position:relative;display:grid;grid-template-rows:auto auto auto auto auto 1fr auto;
  border:1px solid var(--line);border-radius:12px;background:var(--bg);
  padding:20px 18px 16px;overflow:hidden}
.sch__col::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--acc)}
.sch__col--b::before{background:#5f7fa8}
.sch__col--c::before{background:var(--ask)}
.sch__t{font-size:17.5px;font-weight:700;line-height:1.2;margin:2px 0 4px;letter-spacing:-.1px}
.sch__who{font-size:11.5px;color:var(--mut);text-transform:uppercase;letter-spacing:.6px;
  line-height:1.35;margin:0 0 14px;min-height:2.7em}
.sch__lbl{font-size:11px;font-weight:700;color:var(--acc);text-transform:uppercase;
  letter-spacing:.9px;margin:0 0 6px}
.sch__col--b .sch__lbl{color:#4a6a92}
.sch__col--c .sch__lbl{color:var(--ask)}
.sch .sch__q{font-size:14.5px;margin:0 0 14px;line-height:1.45;min-height:4.35em}
.sch .sch__pts{list-style:none;margin:0 0 14px;padding:0;font-size:13.5px;color:var(--mut)}
.sch .sch__pts li{position:relative;padding-left:15px;margin:0 0 5px;line-height:1.4}
.sch .sch__pts li:last-child{margin-bottom:0}
.sch .sch__pts li::before{content:"";position:absolute;left:1px;top:.52em;width:6px;height:6px;
  border-radius:50%;background:#c3cbc4}
.sch__basis{margin-top:auto;font-size:12.5px;line-height:1.4;padding-top:12px;
  border-top:1px solid var(--line);font-weight:600;min-height:calc(3*1.4em + 12px)}
.sch__basis--yes{color:var(--bad)}
.sch__basis--mid{color:var(--ask)}
.sch__basis--no{color:var(--mut);font-weight:400}
/* ---------- схема 2: строки групп, жёсткая сетка квадратов ---------- */
.sch__legend{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0 0 12px;
  font-size:12.5px;color:var(--mut)}
.sch__lg{display:inline-flex;align-items:center;gap:7px}
.sch__sw{width:13px;height:13px;border-radius:3px;background:#7fa39c;display:inline-block;flex:0 0 auto}
.sch__sw--core{background:var(--acc)}
.sch .sch__grp{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.sch .sch__row{display:grid;
  grid-template-columns:196px 216px 40px minmax(0,1fr);
  align-items:center;gap:0 18px;padding:9px 10px 9px 0;
  border-bottom:1px solid var(--line);border-radius:0}
.sch .sch__row:nth-child(odd){background:#fafbf8}
.sch .sch__row:last-child{border-bottom:0}
.sch__gn{font-size:14.5px;line-height:1.3;color:var(--ink)}
.sch__dots{display:grid;grid-template-columns:repeat(9,20px);grid-auto-rows:20px;gap:4px;
  align-items:center}
.sch__dots i{width:20px;height:20px;border-radius:4px;background:#7fa39c;display:block}
.sch__dots--core i{background:var(--acc)}
.sch__gc{font-size:13px;font-weight:700;color:var(--mut);text-align:right;
  font-variant-numeric:tabular-nums;padding-left:4px}
.sch__ex{font-size:13px;color:var(--mut);line-height:1.4}
@media (max-width:820px){
  .sch__cols{grid-template-columns:1fr;gap:12px}
  .sch__who{min-height:0;margin-bottom:12px}
  .sch .sch__q{min-height:0}
  .sch .sch__row{grid-template-columns:minmax(0,1fr) 34px;gap:4px 10px;padding:11px 0}
  /* 28.10.2026: на телефоне квадрат = пункт, а не «резиновая плашка». Было
     repeat(9,minmax(0,1fr)) + i{width:100%}: группа с 1 пунктом растягивала квадрат
     на 37px — прямоугольник, и «1 пункт» читался как «широкая полоса». Теперь размер
     задан (22px), сетка auto-fill: лишние места справа остаются пустыми. */
  .sch__dots{grid-column:1/-1;grid-template-columns:repeat(auto-fill,26px);grid-auto-rows:26px;gap:5px}
  .sch__dots i{width:26px;height:26px}
  .sch__ex{grid-column:1/-1;padding-top:2px}
  .sch__gc{grid-column:2;grid-row:1}
}
@media (max-width:430px){
  .sch__h{font-size:17.5px}
  .sch .sch__row{grid-template-columns:minmax(0,1fr) 28px}
  .sch__dots i{border-radius:3px}
}

/* ── «Что с этим делать» (31.10.2026, КАПИТАН) ──────────────────────────────
   Развилка стоит ТОЛЬКО на карточке, перед блоком редизайна: два способа —
   отдать своему подрядчику (лист для исполнителя) или поручить нам. С листа
   для исполнителя она убрана: там всё для подрядчика, а не для продажи. */
main.main--lead + .nxt{margin-top:30px}
.nxt{margin:0;padding:30px 0 34px;background:#fff;border-top:1px solid var(--line)}
.nxt__h{margin:0 0 8px;font-size:23px;line-height:1.25;font-weight:700;letter-spacing:.1px}
.nxt__lead{margin:0 0 20px;font-size:14.5px;line-height:1.6;color:#2a3038;max-width:760px}
.nxt__grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.nxt__c{position:relative;background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:18px 20px 20px;display:flex;flex-direction:column}
.nxt__n{width:24px;height:24px;border-radius:50%;background:var(--acc);color:#fff;
  font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 0 10px}
.nxt__t{margin:0 0 7px;font-size:16.5px;line-height:1.3;font-weight:700}
.nxt__p{margin:0 0 14px;font-size:13.5px;line-height:1.6;color:#3c434c}
.nxt__btn{margin-top:auto;align-self:stretch;display:block;box-sizing:border-box;text-align:center;
  padding:10px 16px;border-radius:9px;
  background:var(--acc);color:#fff;font-size:13.5px;font-weight:600;text-decoration:none;line-height:1.3;
  border:1px solid var(--acc)}
/* 01.11.2026 (КАПИТАН): «кнопку "Обсудить" по длине сделай как и справа про
   Техническое задание, а то теряется, техническое задание нам наименее важно,
   а кнопка больше выглядит». Было align-self:flex-start + inline-block — ширина
   по тексту, поэтому правая («Техническое задание на доработку сайта») всегда
   выходила длиннее левой. Теперь обе тянутся на всю колонку карточки: ширина
   равная независимо от длины подписи, акцент задаётся заливкой, а не размером. */
.nxt__btn:hover{background:#174b47;color:#fff}
.nxt__btn--ghost{background:#fff;color:var(--acc);border:1px solid var(--acc)}
.nxt__btn--ghost:hover{background:#eef4f2;color:var(--acc)}
.nxt__ext{margin-left:6px;font-size:12px;opacity:.85}
/* обе кнопки равной высоты: на телефоне подпись ТЗ занимает две строки, а
   «Обсудить работы» — одну; без выравнивания правая снова выглядит весомее. */
@media(max-width:700px){.nxt__btn{display:flex;align-items:center;justify-content:center;min-height:56px}}
/* 31.10.2026: цена у второго способа («Поручить нам») — КАПИТАН: «а где форма
   поручить нам, писать стоимость» */
.nxt__price{margin:0 0 14px;padding:9px 12px;background:#f4f7f6;border-left:3px solid var(--acc);
  font-size:13.5px;line-height:1.55;color:#2a3038}
.nxt__price b{font-size:15px;white-space:nowrap}
.nxt__price span{display:block;margin-top:3px;font-size:12.5px;color:#5d6a66}
@media(max-width:700px){.nxt__grid{grid-template-columns:1fr}}

/* ══ БУРГЕР В ШАПКЕ НА ТЕЛЕФОНЕ (29.10.2026) ══════════════════════════════════════
   КАПИТАН: «меню на телефоне надо в бургер скручивать». Замер ДО, 390×844: шапка
   101 px, липкая, меню в три ряда — 12% экрана на каждом экране прокрутки
   (карточка = 27 экранов). ПОСЛЕ: одна строка 59 px, меню за кнопкой 44×44.
   Блок стоит В КОНЦЕ файла намеренно: перебивает правила ≤900 и ≤560 по порядку,
   а не по specificity — иначе трёхрядный перенос возвращается.
   Правка №2 того же дня: (1) пункт меню 44 px — палец, было 37; (2) открытая
   панель absolute: в потоке она растягивала липкую шапку до 346 px и сдвигала
   страницу под меню. */
.tburger{display:none;flex:0 0 auto;flex-direction:column;justify-content:center;gap:5px;
 width:44px;height:44px;padding:0 11px;margin-left:auto;border:1px solid var(--line);
 border-radius:9px;background:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent}
.tburger span{display:block;height:2px;border-radius:2px;background:#2b333c;
 transition:transform .18s,opacity .14s}
.tburger:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.tburger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.tburger[aria-expanded="true"] span:nth-child(2){opacity:0}
.tburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:900px){
 .topi{min-height:0;height:auto;padding:8px 0;flex-wrap:wrap;row-gap:0;gap:10px;
  justify-content:flex-start}
 .tburger{display:flex}
 .tnav{display:none;order:3;flex:1 1 100%;flex-direction:column;align-items:stretch;
  justify-content:flex-start;flex-wrap:nowrap;overflow:visible;gap:0;padding:6px 0 2px}
 .tnav.open{display:flex;position:absolute;left:0;right:0;top:100%;background:#fff;
  border-top:1px solid var(--line);padding:10px 20px 14px;
  box-shadow:0 18px 30px -18px rgba(20,30,25,.5);max-height:calc(100vh - 62px);
  overflow-y:auto}
 .tnav a{margin:0;font-size:15px;line-height:1.2;padding:13px 10px;border-radius:8px}
 .tnav a.tnav__cta{font-size:15px;line-height:1.2;padding:13px 14px;text-align:center;
  margin-top:8px}
}
@media(max-width:560px){
 .topi{padding:7px 0}
 .tnav a{font-size:14.5px;line-height:1.25;padding:13px 8px}
 .tnav a.tnav__cta{font-size:14.5px;line-height:1.25;padding:13px 12px}
}
/* якоря (#check/#lead/#catalog) на телефоне: шапка теперь 59, а не 101 px —
   отступ прокрутки уменьшаем ровно на разницу, иначе заголовок уезжает вверх. */
@media(max-width:560px){#catalog,#check,#lead{scroll-margin-top:72px}}

/* 29.10.2026: таблица «Пункты экранных замеров» (методика) — 3 колонки без раскладки:
   «Группа» 113px при 7 символах, «Как трактуем» 761px. */
.tbl--mm3{table-layout:fixed}
.tbl--mm3 th:nth-child(1),.tbl--mm3 td:nth-child(1){width:34%}
.tbl--mm3 th:nth-child(2),.tbl--mm3 td:nth-child(2){width:13%}
.tbl--mm3 th:nth-child(3),.tbl--mm3 td:nth-child(3){width:53%}
.tbl--mm3 td{overflow-wrap:anywhere}

/* 30.10.2026: кадры «до/после» в статьях (разбор пунктов доступности).
   Раньше в статьях не было ни одного кадра — теперь доказательство стоит рядом с текстом:
   две колонки одинаковой ширины, подпись над снимком, одна линия между. */
.art__pair{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:16px 0 6px}
.art__pf{margin:0;min-width:0}
.art__pf-t{display:block;font-size:11px;letter-spacing:.6px;text-transform:uppercase;
  color:var(--mut);margin-bottom:6px}
.art__pf img{width:100%;height:auto;display:block;border:1px solid var(--line);
  border-radius:8px;background:#fafafa}
.art__cap{font-size:12.5px;color:var(--mut);margin:0 0 18px;line-height:1.45}
@media (max-width:640px){.art__pair{grid-template-columns:1fr;gap:10px}}
