/* vln rev 3aed99ab */

/* ======================================================================
   vln — скин издания. Брейкпоинты 1180 / 900 / 620 / 430.
   ====================================================================== */
:root{
  --vln-bumaga:#FAF6F2; --vln-list:#FFFFFF; --vln-grafit:#191411;
  --vln-poluton:#6B5F58; --vln-kant:#DED2C8; --vln-akcent:#8A1F3F;
  --vln-metka:#C2853A; --vln-temno:#241A20;
  /* метка годится для линеек и плашек, но как ТЕКСТ по бумаге даёт 3.13 —
     ниже порога 4.5. Текстовый вариант того же цвета: 5.6 по --vln-list */
  --vln-metka-t:#8A5A18;
  --vln-antikva:"Liberation Serif","DejaVu Serif",serif;
  --vln-grotesk:"Liberation Sans","DejaVu Sans",sans-serif;
  --vln-polosa:1300px; --vln-pole:28px; --vln-shag:34px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--vln-bumaga);color:var(--vln-grafit);
  font:400 17.5px/1.72 var(--vln-antikva);
  overflow-x:hidden;word-wrap:break-word}
img,iframe,video,svg{max-width:100%;height:auto}
img{display:block}
a{color:var(--vln-akcent);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4,h5,h6{font-family:var(--vln-antikva);font-weight:700;
  line-height:1.16;margin:0 0 .5em;letter-spacing:-.012em}
p{margin:0 0 1.05em}
hr{border:0;border-top:1px solid var(--vln-kant);margin:var(--vln-shag) 0}
table{border-collapse:collapse}
:focus-visible{outline:2px solid var(--vln-akcent);outline-offset:2px}

/* --- полоса и дорожки ------------------------------------------------ */
.vln-band{max-width:var(--vln-polosa);margin:0 auto;padding:0 var(--vln-pole)}
.vln-grid{display:grid;grid-template-columns:300px 1fr 1fr 1fr;gap:var(--vln-shag)}
.vln-grid--right{grid-template-columns:1fr 1fr 1fr 300px}
/* ⚠ Ребёнок грид-колонки по умолчанию min-width:auto: одно длинное слово или
   широкая таблица распирают колонку, и документ становится шире вьюпорта. */
.vln-grid>*,.vln-grid--right>*,.vln-two>*,.vln-three>*,.vln-four>*{min-width:0}
.vln-grid>.vln-rail{grid-column:span 1}
.vln-grid>.vln-wide{grid-column:span 3}
.vln-two{display:grid;grid-template-columns:1fr 1fr;gap:var(--vln-shag)}
.vln-three{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--vln-shag)}
.vln-four{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(var(--vln-shag) - 8px)}

/* --- шапка: вертикальный штамп --------------------------------------- */
.vln-top{border-bottom:2px solid var(--vln-grafit);background:var(--vln-list)}
.vln-top__in{display:grid;grid-template-columns:96px 1fr;
  max-width:var(--vln-polosa);margin:0 auto;padding:0 var(--vln-pole)}
.vln-stamp{border-right:1px solid var(--vln-kant);display:flex;
  align-items:center;justify-content:center;padding:22px 0}
.vln-stamp__name{writing-mode:vertical-rl;transform:rotate(180deg);
  font-family:var(--vln-antikva);font-weight:700;font-size:27px;
  letter-spacing:.02em;color:var(--vln-grafit);white-space:nowrap;
  text-decoration:none;display:block}
.vln-stamp__name:hover{color:var(--vln-akcent);text-decoration:none}
.vln-stamp__sub{writing-mode:vertical-rl;transform:rotate(180deg);
  font-family:var(--vln-grotesk);font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--vln-metka-t);margin-right:7px;white-space:nowrap}
.vln-head{display:flex;flex-direction:column;justify-content:center;padding-left:26px}
.vln-head__line{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap;
  padding:15px 0 11px;border-bottom:1px solid var(--vln-kant);
  font-family:var(--vln-grotesk);font-size:11.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--vln-poluton)}
.vln-head__line a{color:var(--vln-poluton)}
.vln-head__line a:hover{color:var(--vln-akcent)}
.vln-head__line .vln-sep{flex:1}
.vln-nav{display:flex;gap:26px;flex-wrap:wrap;padding:14px 0 16px}
.vln-nav a{font-family:var(--vln-antikva);font-size:19px;color:var(--vln-grafit);
  padding-bottom:3px;border-bottom:2px solid transparent}
.vln-nav a:hover{text-decoration:none;border-bottom-color:var(--vln-akcent);
  color:var(--vln-akcent)}
.vln-nav a.is-here{border-bottom-color:var(--vln-metka)}
.vln-burger,.vln-burger__box{display:none}

/* --- контурная панель с врезанным ярлыком ---------------------------- */
.vln-panel{border:1px solid var(--vln-kant);background:var(--vln-list);
  padding:calc(var(--vln-shag) + 8px) var(--vln-shag) var(--vln-shag);
  position:relative;margin:0 0 var(--vln-shag)}
.vln-panel__tab{position:absolute;top:-1px;left:-1px;
  background:var(--vln-temno);color:#fff;font-family:var(--vln-grotesk);
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  padding:7px 20px 7px 16px;
  clip-path:polygon(0 0,100% 0,calc(100% - 13px) 100%,0 100%)}
.vln-panel__tab a{color:#fff}
.vln-panel__more{float:right;font-family:var(--vln-grotesk);font-size:11.5px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--vln-poluton)}
.vln-panel__more:hover{color:var(--vln-akcent);text-decoration:none}
.vln-panel__h{font-size:15px;font-family:var(--vln-grotesk);font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;margin:0 0 20px;
  padding-bottom:11px;border-bottom:1px solid var(--vln-kant);overflow:hidden}

/* --- карточки -------------------------------------------------------- */
.vln-card{display:block;color:inherit}
.vln-card:hover{text-decoration:none}
/* ⚠ Кадр, рубрика и заголовок — это <span>, и без display:block они остаются
   строчными: высота карточки считается по одному кадру, а описание вылезает за её
   коробку и накладывается на заголовок следующей секции (gate_overlap, 15 наложений
   на главной). В `--sm` того же не было только потому, что там дети — ячейки сетки. */
.vln-card__ph,.vln-card>.vln-kick,.vln-card__t{display:block}
.vln-card__ph{position:relative;overflow:hidden;background:var(--vln-kant);
  aspect-ratio:3/2;margin-bottom:12px}
.vln-card__ph img{width:100%;height:100%;object-fit:cover;
  transition:transform .35s ease}
.vln-card:hover .vln-card__ph img{transform:scale(1.04)}
.vln-kick{font-family:var(--vln-grotesk);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--vln-akcent);display:block;margin-bottom:7px}
.vln-card__t{font-size:20px;line-height:1.26;margin:0 0 8px;font-weight:700}
.vln-card:hover .vln-card__t{color:var(--vln-akcent)}
.vln-card__d{font-size:15.5px;line-height:1.6;color:var(--vln-poluton);margin:0}
.vln-card--lead .vln-card__t{font-size:33px;line-height:1.14}
.vln-card--lead .vln-card__d{font-size:19px;font-style:italic}
/* ⚠ У карточки четыре ребёнка: кадр, рубрика, заголовок, описание. В сетке
   «92px 1fr» без областей заголовок уезжает во ВТОРОЙ ряд первой колонки — то есть
   в колонку кадра шириной 92 px — и печатается столбиком по слову в строку (R21).
   Кадр занимает всю левую колонку, текст идёт одной лентой справа. */
.vln-card--sm{display:grid;grid-template-columns:92px 1fr;gap:4px 14px;
  grid-template-areas:"ph kick" "ph t" "ph d";align-content:start;
  padding:14px 0;border-top:1px solid var(--vln-kant)}
.vln-card--sm>.vln-card__ph{grid-area:ph}
.vln-card--sm>.vln-kick{grid-area:kick}
.vln-card--sm>.vln-card__t{grid-area:t}
.vln-card--sm>.vln-card__d{grid-area:d}
.vln-card--sm .vln-card__ph{margin:0;aspect-ratio:1/1}
.vln-card--sm .vln-card__t{font-size:16px;line-height:1.32;margin:0}
.vln-card--txt{padding:12px 0;border-top:1px solid var(--vln-kant);display:block}
.vln-card--txt .vln-card__t{font-size:17px;line-height:1.35;margin:0;font-weight:400}
.vln-card--txt:hover .vln-card__t{color:var(--vln-akcent)}
.vln-feed{list-style:none;margin:0;padding:0}
.vln-feed>li{margin:0}

/* --- статья ---------------------------------------------------------- */
.vln-art{display:grid;grid-template-columns:720px 220px;gap:52px;
  justify-content:center;padding:var(--vln-shag) 0 0}
.vln-art--wide{grid-template-columns:minmax(0,980px);justify-content:center}
.vln-art__body{min-width:0}
.vln-crumbs{font-family:var(--vln-grotesk);font-size:11.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--vln-poluton);margin:0 0 16px}
.vln-crumbs a{color:var(--vln-poluton)}
.vln-h1{font-size:44px;line-height:1.1;margin:0 0 18px}
.vln-lead{font-size:28px;line-height:1.42;font-style:italic;
  color:var(--vln-poluton);margin:0 0 26px}
.vln-meta{display:flex;gap:18px;flex-wrap:wrap;font-family:var(--vln-grotesk);
  font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--vln-poluton);padding:13px 0;border-top:1px solid var(--vln-grafit);
  border-bottom:1px solid var(--vln-kant);margin:0 0 var(--vln-shag)}
.vln-art__body h2{font-size:29px;margin:1.5em 0 .5em;padding-top:.42em;
  border-top:1px solid var(--vln-kant)}
.vln-art__body h3{font-size:22px;margin:1.35em 0 .45em}
.vln-art__body h4,.vln-art__body h5,.vln-art__body h6{font-size:18.5px;margin:1.2em 0 .4em}
.vln-art__body ul,.vln-art__body ol{margin:0 0 1.15em;padding-left:1.25em}
.vln-art__body li{margin:0 0 .42em}
.vln-art__body blockquote{margin:1.4em 0;padding:4px 0 4px 22px;
  border-left:3px solid var(--vln-metka);font-style:italic;font-size:20px;
  color:var(--vln-poluton)}
.vln-art__body figure{margin:1.5em 0}
.vln-art__body figcaption,.vln-cap{font-family:var(--vln-grotesk);font-size:12.5px;
  line-height:1.5;color:var(--vln-poluton);margin-top:9px;
  padding-left:11px;border-left:2px solid var(--vln-metka)}
.vln-marg{font-family:var(--vln-grotesk);font-size:13px;line-height:1.55;
  color:var(--vln-poluton)}
.vln-marg__t{font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--vln-grafit);padding-bottom:8px;margin-bottom:12px;
  border-bottom:1px solid var(--vln-grafit);font-weight:700}
.vln-marg ul{list-style:none;margin:0;padding:0}
.vln-marg li{padding:9px 0;border-bottom:1px solid var(--vln-kant)}
.vln-marg a{color:var(--vln-grafit)}
.vln-marg a:hover{color:var(--vln-akcent)}

/* --- лента автопостинга (ЭТАП 12 п.16) -------------------------------
   Разметку анонса приносит РОБОТ и только он: сразу за `<!-- BLOG -->`
   ложится `<div style='margin-bottom: 20px;'><h4><a>…</a></h4><p>…</p></div>`.
   Своих классов там не будет никогда, поэтому оформление берётся от
   контейнера по детям, а инлайновый margin-bottom перебивается.
   ⛔ Прятать пустую ленту через `:empty` нельзя: сборщик кладёт маркер
   отдельной строкой, внутри два текстовых узла из пробелов — `:empty`
   ложен и полоса рисуется. Проверка идёт по детям-ЭЛЕМЕНТАМ.
   ⛔ Заголовка («Свежее») у ленты нет по замыслу: до первой публикации
   это была бы подпись над пустотой. */
.vln-feed-slot{display:block;margin:0 0 var(--vln-shag)}
.vln-feed-slot:not(:has(>div)){display:none}
.vln-feed-slot>div{margin-bottom:0!important;padding:17px 0;
  border-top:1px solid var(--vln-kant)}
.vln-feed-slot>div:first-of-type{border-top:2px solid var(--vln-grafit)}
.vln-feed-slot>div>h4{font-size:22px;line-height:1.26;margin:0 0 6px}
.vln-feed-slot>div>h4>a{color:var(--vln-grafit)}
.vln-feed-slot>div>h4>a:hover{color:var(--vln-akcent)}
.vln-feed-slot>div>p{margin:0;font-size:17px;line-height:1.56;
  color:var(--vln-poluton)}

/* --- голый html робота (ЭТАП 12 п.16) --------------------------------
   `%CONTENT_1%` кладётся в тело статьи КАК ЕСТЬ: обёрток сборщика
   (.vln-tscroll, разрезанные списки, details) у неё не будет, и ни один
   гейт скина её не видит — в момент приёмки таких статей ноль.
   Поэтому защита висит на самом контейнере прозы.
   ⛔ Контейнер запросов — ОБЁРТКА, а не таблица: у таблицы с
   width:max-content containment запрещает брать ширину у содержимого.
   ⛔ `max-width:100%` рядом с `100cqi` обязателен: 100cqi — ширина обёртки
   по рамке, видимая часть таблицы — её content box, разница и есть провал. */
.vln-art__body{container-type:inline-size;overflow-wrap:break-word}
.vln-art__body a{overflow-wrap:anywhere}
/* `:not(.tablepress)` из образца правила здесь не нужен и снят: донор не на
   WordPress, класса tablepress на сайте нет ни одного — валидатор объявлял его
   мёртвым классом скина. */
.vln-art__body>table{display:block;width:max-content;
  max-width:100%;overflow-x:auto;--vln-tb:1px}
/* ⛔ `width:100cqi` — ширина ОБЁРТКИ прозы по её content box, а видимая часть
   таблицы уже на её собственную рамку: у `table` в скине `border:1px`, и при
   `box-sizing:border-box` подпись выходила на 2 px шире видимого (гейт
   `gate_tpl.js`: «подпись 358 при видимых 356», «720 при 718»). Рамка вычитается
   переменной, чтобы связь с `table{border:…}` была видна в коде, а не на глаз.
   `max-width:100%` тут инертен — проценты ребёнка считаются от ПРОКРУЧИВАЕМОЙ
   ширины таблицы, — но оставлен как страховка на случай, если рамку уберут. */
.vln-art__body>table>caption{caption-side:top;text-align:left;
  position:sticky;left:0;width:calc(100cqi - var(--vln-tb) * 2);max-width:100%;
  font-family:var(--vln-grotesk);font-size:12.5px;color:var(--vln-poluton);
  padding-bottom:8px}
.vln-art__body>pre{max-width:100%;overflow-x:auto;margin:1.4em 0;
  padding:15px 17px;background:var(--vln-list);
  border-left:3px solid var(--vln-kant);font-size:15px;line-height:1.55}
.vln-art__body code{font-family:ui-monospace,"DejaVu Sans Mono",monospace;
  font-size:.9em;background:var(--vln-list);padding:1px 5px;
  border:1px solid var(--vln-kant)}
.vln-art__body pre code{background:none;border:0;padding:0;font-size:inherit}
.vln-art__body cite{font-style:italic;color:var(--vln-poluton)}
.vln-art__body dl{margin:0 0 1.15em}
.vln-art__body dt{font-weight:700;margin-top:.7em}
.vln-art__body dd{margin:0 0 0 1.25em;color:var(--vln-poluton)}

/* --- своё оглавление, свёрнутое (§11) -------------------------------- */
.vln-toc{border:1px solid var(--vln-kant);background:var(--vln-bumaga);
  margin:0 0 var(--vln-shag)}
.vln-toc>summary{cursor:pointer;padding:13px 18px;font-family:var(--vln-grotesk);
  font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;font-weight:700;
  list-style:none}
.vln-toc>summary::-webkit-details-marker{display:none}
.vln-toc>summary::after{content:"+";float:right;font-size:15px;line-height:1}
.vln-toc[open]>summary::after{content:"–"}
.vln-toc ol{margin:0;padding:0 22px 16px 38px;font-size:16px}
.vln-toc li{margin:0 0 .35em}

/* --- таблицы (§8) ---------------------------------------------------- */
/* Рамку и фон держит САМА таблица, обёртка — только прокрутка. Иначе рамка
   стоит по ширине окна, а уехавшая вправо часть таблицы рисуется уже за ней. */
.vln-tw{overflow-x:auto;margin:0 0 var(--vln-shag)}
table{width:100%;font-size:16px;border:1px solid var(--vln-kant);
  background:var(--vln-list)}
/* 16px — пол по gate_padding: при 14px текст ячейки липнет к рамке */
th,td{padding:11px 16px;text-align:left;border-bottom:1px solid var(--vln-kant);
  vertical-align:top}
th{background:var(--vln-temno);color:#fff;font-family:var(--vln-grotesk);
  font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;
  border-bottom:0}
tbody tr:last-child td{border-bottom:0}

/* --- виджеты --------------------------------------------------------- */
/* container-type — чтобы внутренние сетки виджета мерили СВОЮ ширину, а не окно:
   один и тот же виджет стоит и в боковой колонке (~220px), и в теле статьи */
.vln-w{border:1px solid var(--vln-grafit);background:var(--vln-list);
  margin:0 0 var(--vln-shag);container-type:inline-size}
.vln-w__h{background:var(--vln-grafit);color:#fff;padding:12px 18px;
  font-family:var(--vln-grotesk);font-size:11px;letter-spacing:.15em;
  text-transform:uppercase;font-weight:700}
.vln-w__b{padding:20px 18px}
.vln-w__note{font-family:var(--vln-grotesk);font-size:12px;line-height:1.5;
  color:var(--vln-poluton);padding:0 18px 16px}
/* фототип: переключатель на :checked, без JS */
.vln-ft__r{position:absolute;opacity:0;pointer-events:none}
.vln-ft__tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.vln-ft__tab{cursor:pointer;border:1px solid var(--vln-kant);padding:8px 13px;
  font-family:var(--vln-grotesk);font-size:12px;letter-spacing:.08em;
  min-height:44px;display:flex;align-items:center;line-height:1}
.vln-ft__tab:hover{border-color:var(--vln-akcent);color:var(--vln-akcent)}
.vln-ft__p{display:none}
.vln-ft__r:checked+.vln-ft__p{display:block}
/* Виджет живёт в рельсе 300px: в две колонки «термин / значение» на ответ
   остаётся 132px и он печатается столбиком. Термин идёт строкой над ответом. */
.vln-ft dl{margin:0;display:grid;grid-template-columns:1fr;gap:3px;font-size:16px}
.vln-ft dt+dd{margin-bottom:11px}
.vln-ft dt{font-family:var(--vln-grotesk);font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--vln-poluton);padding-top:4px}
.vln-ft dd{margin:0}
/* календарь ограничений */
.vln-cal{list-style:none;margin:0;padding:0;counter-reset:d}
.vln-cal li{display:grid;grid-template-columns:104px 1fr;gap:18px;
  padding:14px 0;border-top:1px solid var(--vln-kant)}
.vln-cal li:first-child{border-top:0;padding-top:0}
.vln-cal b{font-family:var(--vln-grotesk);font-size:11.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--vln-akcent)}
.vln-cal .no{color:var(--vln-akcent)}
.vln-cal li>div{min-width:0;overflow-wrap:break-word}
/* в узком виджете правая колонка ужимается до ~60px и текст вылезает за кант */
@container (max-width:380px){
  .vln-cal li{grid-template-columns:1fr;gap:5px}
  .vln-gloss dd{overflow-wrap:break-word}
}
/* словарь рубрики */
.vln-gloss{margin:0;font-size:16px}
.vln-gloss dt{font-weight:700;margin-top:13px}
.vln-gloss dt:first-child{margin-top:0}
.vln-gloss dd{margin:2px 0 0;color:var(--vln-poluton)}

/* --- вопрос-ответ (§10, всё раскрыто) -------------------------------- */
.vln-qa-list{margin:0}
.vln-qa{border:1px solid var(--vln-kant);background:var(--vln-list);
  padding:20px 22px;margin:0 0 16px}
.vln-qa__who{font-family:var(--vln-grotesk);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--vln-metka-t);margin-bottom:9px}
.vln-qa__q{font-size:19px;line-height:1.45;font-weight:700;margin-bottom:12px}
.vln-qa__q p{margin:0}
.vln-qa__a{padding-top:12px;border-top:1px solid var(--vln-kant);color:var(--vln-poluton)}
.vln-qa__a p:last-child{margin-bottom:0}
.vln-qa__a::before{content:"Ответ редакции";display:block;
  font-family:var(--vln-grotesk);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--vln-grafit);margin-bottom:7px}

/* --- полоса фактов / ценность ---------------------------------------- */
.vln-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--vln-kant);border:1px solid var(--vln-kant);
  margin:0 0 var(--vln-shag)}
.vln-facts>div{background:var(--vln-list);padding:18px 20px}
.vln-facts b{display:block;font-size:31px;line-height:1.05;color:var(--vln-akcent)}
.vln-facts span{font-family:var(--vln-grotesk);font-size:11.5px;line-height:1.45;
  letter-spacing:.06em;color:var(--vln-poluton);display:block;margin-top:6px}

/* --- подвал ---------------------------------------------------------- */
.vln-foot{background:var(--vln-temno);color:#C8BDB5;margin-top:54px;
  padding:46px 0 30px;font-size:15.5px}
.vln-foot a{color:#E8DFD8}
.vln-foot a:hover{color:#fff}
.vln-foot__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--vln-shag)}
.vln-foot__h{font-family:var(--vln-grotesk);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:#fff;margin:0 0 14px;padding-bottom:9px;
  border-bottom:1px solid #4A3C42}
.vln-foot ul{list-style:none;margin:0;padding:0}
.vln-foot li{margin:0 0 9px}
.vln-foot__name{font-size:23px;font-weight:700;color:#fff;margin:0 0 10px}
.vln-foot__bottom{margin-top:34px;padding-top:18px;border-top:1px solid #4A3C42;
  display:flex;gap:20px;flex-wrap:wrap;font-family:var(--vln-grotesk);
  font-size:11.5px;letter-spacing:.07em;color:#9C8E88}

/* ======================================================================
   ДОНОРСКИЕ КЛАССЫ — CSS донора снят, поведение описано своими правилами
   (DESIGN-ELEMENTS §15b)
   ====================================================================== */
/* Здесь оставлены ТОЛЬКО те классы донора, что реально встречаются в телах
   после чистки vln_body. Остальные (bootstrap-отступы, карточки штата,
   кнопки-записи) ушли вместе с разметкой: правило без разметки — дефект
   C09.31, а не запас на будущее. */
.container{width:100%;max-width:none;padding:0;margin:0}
.row{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--vln-shag);margin:0 0 1.05em}
.row-40,.row-60{gap:var(--vln-shag)}
[class*="col-"]{min-width:0}
.col-lg-12,.col-xl-12,.col-12,.col-md-10,.col-sm-10,.col-lg-10{grid-column:1/-1}
.text-left,.text-lg-left{text-align:left}
.text-center{text-align:center}
.text-bold{font-weight:700}
.text-java{color:inherit}
.text-subline,.divider-custom,.hr-left-0,.hr-sm-left-2{border-top-color:var(--vln-kant)}
.list,.list-marked{margin:0 0 1.15em;padding-left:1.25em}
.offset-top-30,.section-xs,.section-xl{margin:0;padding:0}
.section-xl{margin-bottom:var(--vln-shag)}
.justify-content-center,.justify-content-xl-end,.justify-content-md-center{}
/* прайс донора — таблица, а не аккордеон: скрипт, который разворачивал строки,
   снят вместе с донорским JS, и все блоки теперь открыты (vln_body.unfold) */
.price-list,.price-list__wrpapper,.price-list__main,.price-list__items{margin:0 0 var(--vln-shag)}
.price-list__main-title,.price-list-items__title{font-family:var(--vln-grotesk);
  font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  background:var(--vln-temno);color:#fff;padding:11px 16px;
  display:grid;grid-template-columns:1fr auto auto;gap:6px 16px;align-items:baseline}
.price-list-block{list-style:none;margin:0 0 var(--vln-shag);padding:0;
  border:1px solid var(--vln-kant);border-top:0;background:var(--vln-list)}
/* три ячейки строки: услуга / объём / цена. Было `1fr auto` — третья ячейка
   сваливалась на вторую строку и печаталась столбиком */
.price-list-block>li{display:grid;grid-template-columns:1fr auto auto;gap:4px 16px;
  padding:10px 16px;border-top:1px solid var(--vln-kant);font-size:16px}
/* ⚠ Без nowrap: в ячейке цены попадается не число, а фраза «Стоимость определяет
   врач после консультации» — и она растягивала лист. Разряды держит &nbsp; */
.price-list-block>li>span:last-child{font-family:var(--vln-grotesk);
  font-weight:700}
/* Строка-примечание курса — один span, и он же :last-child. Без сброса он
   получал `white-space:nowrap` от правила цены и растягивал лист до 888px. */
.price-list-block__caption{grid-template-columns:1fr !important;
  color:var(--vln-poluton);font-size:14.5px}
.price-list-block__caption>span{white-space:normal !important;font-weight:400 !important;
  font-family:var(--vln-antikva)}
/* подпись-состав услуги — во всю ширину заголовка, иначе уезжает четвёртой ячейкой */
.price-list-items__caption{grid-column:1/-1;text-transform:none;letter-spacing:0;
  font-weight:400;font-size:14px;line-height:1.55;font-family:var(--vln-antikva);
  color:#E8DED6;padding:6px 0 0}
/* на тёмной плашке полутон даёт 2.74 — читаемости нет */
.price-list-items__recomenadtion{color:#D9CEC5}
.price-list-items__currency{white-space:nowrap}
/* кнопки донора (§12: не пилюля по умолчанию) */
.btn,.btn-java,.button-primary{
  display:inline-block;font-family:var(--vln-grotesk);font-size:12px;
  letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  padding:13px 22px;min-height:44px;line-height:1.5;border-radius:0;
  border:1px solid var(--vln-grafit);background:transparent;color:var(--vln-grafit)}
.btn:hover,.btn-java:hover{background:var(--vln-grafit);color:#fff;text-decoration:none}
/* таблицы донора */
.table,.table-custom,.table-primary,.table-fixed{width:100%}
.slide,.vln-row{margin:0 0 var(--vln-shag)}
.active{}
noindex{display:contents}

/* ======================================================================
   рабочая область, кадр, подпись с источником
   ====================================================================== */
.vln-main{display:block;padding:0 0 var(--vln-shag)}
.vln-fig{margin:0 0 26px}
.vln-fig img{display:block;width:100%;height:auto;background:var(--vln-bumaga)}
.vln-fig figcaption{padding:10px 0 0;border-top:1px solid var(--vln-kant);margin-top:9px}
.vln-fig--lead{margin:0 0 30px}
.vln-fig--lead figcaption{border-top:2px solid var(--vln-grafit)}
.vln-src{display:block;margin-top:4px;font-size:11.5px;letter-spacing:.03em;
  color:var(--vln-poluton)}
.vln-i{width:1em;height:1em;vertical-align:-.12em;margin-right:.35em;flex:0 0 auto}

/* штамп проверки и подпись редакции */
.vln-upd{font-family:var(--vln-grotesk);font-size:11.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--vln-poluton);margin:0 0 24px;
  padding-bottom:12px;border-bottom:1px solid var(--vln-kant)}
.vln-upd time{color:var(--vln-grafit);font-weight:700}
.vln-sign{margin:34px 0 0;padding:20px 22px;background:var(--vln-bumaga);
  border-left:3px solid var(--vln-akcent);font-size:15.5px;line-height:1.55}
.vln-sign__h{font-family:var(--vln-grotesk);font-size:11px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--vln-poluton);margin:0 0 7px}
.vln-sign__l{margin:0;color:var(--vln-poluton)}
.vln-sign__l a{color:var(--vln-grafit)}

/* карточка встройки вместо мёртвого iframe */
.vln-embed{margin:0 0 20px;padding:15px 18px;border:1px dashed var(--vln-kant);
  background:var(--vln-bumaga);font-family:var(--vln-grotesk);font-size:13.5px}
.vln-embed a{color:var(--vln-akcent)}

/* хабовые тексты и место автопостинга */
.vln-hubtext{font-size:17px;line-height:1.7;max-width:74ch}
.vln-hubtext h2{font-size:25px;margin:26px 0 10px}
/* подпись «чей это текст» над донорским блоком: набор мельче и полутоном,
   чтобы врезка не спорила с собственным лидом страницы */
.vln-hubnote{font-family:var(--vln-grotesk);font-size:14px;line-height:1.55;
  color:var(--vln-poluton);border-left:3px solid var(--vln-metka);
  padding:2px 0 2px 13px;margin:0 0 18px;max-width:74ch}
.vln-hubdonor{font-size:16.5px;line-height:1.65}
.vln-hubdonor h2,.vln-hubdonor h3{font-size:22px;margin:22px 0 9px}
.vln-feed-slot{display:block}
.vln-feed-slot:empty{display:none}

/* вопрос-ответ раскрывается: летний хвост FAQ не должен занимать экран */
details.vln-qa>summary{cursor:pointer;display:flex;align-items:flex-start;
  margin-bottom:0;list-style:none}
details.vln-qa>summary::-webkit-details-marker{display:none}
details.vln-qa[open]>summary{margin-bottom:12px}
details.vln-qa>summary::after{content:"+";margin-left:auto;padding-left:14px;
  font-family:var(--vln-grotesk);font-weight:400;color:var(--vln-poluton)}
details.vln-qa[open]>summary::after{content:"–"}

/* виджеты: у каждого свой опознавательный кант (§0в — три разных виджета) */
.vln-w--fototip .vln-w__h{background:var(--vln-temno)}
.vln-w--spec{border-color:var(--vln-akcent)}
.vln-w--spec .vln-w__h{background:var(--vln-akcent)}
.vln-w--kalendar .vln-w__h{background:var(--vln-grafit)}
.vln-w--kurs{border-color:var(--vln-metka)}
.vln-w--kurs .vln-w__h{background:var(--vln-metka);color:var(--vln-temno)}
.vln-w--slovar{background:var(--vln-bumaga)}

/* ======================================================================
   1180
   ====================================================================== */
@media (max-width:1180px){
  :root{--vln-pole:22px;--vln-shag:26px}
  .vln-grid,.vln-grid--right{grid-template-columns:1fr 1fr 1fr}
  .vln-grid>.vln-rail{grid-column:1/-1}
  .vln-grid>.vln-wide{grid-column:1/-1}
  .vln-art{grid-template-columns:minmax(0,1fr) 210px;gap:34px}
  .vln-h1{font-size:38px}
}
/* ======================================================================
   900 — бургер, рельс уходит вниз
   ====================================================================== */
@media (max-width:900px){
  body{font-size:17px}
  .vln-top__in{grid-template-columns:1fr;padding:0 var(--vln-pole)}
  .vln-stamp{border-right:0;border-bottom:1px solid var(--vln-kant);
    justify-content:flex-start;padding:14px 0}
  .vln-stamp__name{writing-mode:horizontal-tb;transform:none;font-size:24px}
  .vln-stamp__sub{writing-mode:horizontal-tb;transform:none;margin:0 0 0 12px;
    align-self:center}
  .vln-head{padding-left:0}
  .vln-burger{display:flex;align-items:center;gap:10px;cursor:pointer;
    min-height:44px;padding:10px 0;font-family:var(--vln-grotesk);font-size:12px;
    letter-spacing:.14em;text-transform:uppercase;font-weight:700;
    border-bottom:1px solid var(--vln-kant)}
  .vln-burger i{display:block;width:22px;height:2px;background:var(--vln-grafit);
    box-shadow:0 6px 0 var(--vln-grafit),0 -6px 0 var(--vln-grafit)}
  .vln-nav{display:none;flex-direction:column;gap:0;padding:0 0 12px}
  .vln-nav a{padding:13px 0;min-height:44px;display:flex;align-items:center;
    border-bottom:1px solid var(--vln-kant)}
  .vln-burger__box:checked~.vln-nav{display:flex}
  .vln-head__line{font-size:11px;gap:14px}
  .vln-art,.vln-art--wide{grid-template-columns:minmax(0,1fr)}
  .vln-marg{border-top:1px solid var(--vln-grafit);padding-top:20px}
  .vln-h1{font-size:33px}
  .vln-lead{font-size:23px}
  .vln-card--lead .vln-card__t{font-size:27px}
  .vln-foot__grid{grid-template-columns:1fr 1fr}
  .vln-facts{grid-template-columns:1fr 1fr}
}
/* ======================================================================
   620
   ====================================================================== */
@media (max-width:620px){
  :root{--vln-pole:16px;--vln-shag:22px}
  .vln-grid,.vln-grid--right,.vln-two,.vln-three,.vln-four,
  .row,.vln-foot__grid{grid-template-columns:1fr}
  .vln-panel{padding:38px 18px 22px}
  .vln-h1{font-size:28px}
  .vln-lead{font-size:20px}
  .vln-art__body h2{font-size:24px}
  .vln-card--lead .vln-card__t{font-size:24px}
  .vln-cal li{grid-template-columns:1fr;gap:5px}
  .vln-facts{grid-template-columns:1fr}
  /* ⚠ Таблица в 4–5 колонок на 390px не ужимается: либо документ шире вьюпорта,
     либо ячейка сжимается до 140px и печатается столбиком. Прокрутка по
     горизонтали оставляет и ширину ячейки, и полосу набора. */
  .vln-main table{display:block;width:max-content;max-width:100%;overflow-x:auto}
  .price-list-block>li{grid-template-columns:1fr auto}
  .price-list-block>li>span:nth-child(2){grid-column:1;color:var(--vln-poluton);
    font-size:14.5px}
  .price-list__main-title,.price-list-items__title{grid-template-columns:1fr auto}
  .price-list-items__recomenadtion{grid-column:1}
}
/* ======================================================================
   430
   ====================================================================== */
@media (max-width:430px){
  body{font-size:16.5px}
  .vln-h1{font-size:25px}
  .vln-card--sm{grid-template-columns:74px 1fr;gap:11px}
  .vln-card__t{font-size:18px}
  .vln-panel__more{float:none;display:block;margin-top:8px}
  .vln-qa{padding:16px}
  th,td{padding:9px 13px;font-size:15px}   /* 13 > норма 12 на мобилке */
}
@media print{.vln-top,.vln-foot,.vln-marg{display:none}}
