/* cx.css — стили новостей, статьи и «Вопросов» «Чертёж» (шаг 5, 26.09.2026).
   Вынесены из общего styles.css при выкате №5 (26.09.2026): общий файл грузится на каждой странице,
   и эти ~60 КБ, нужные только ленте, статье и «Вопросам», уронили Lighthouse страниц инструментов.
   Статика подключает /cx.css после /style.css (CX_HEAD в cx-motion.js, копия — generate-pages.js),
   React (живая новость, NewsArticlePage.jsx) — тем же /cx.css обычной ссылкой <link>, не импортом:
   импорт дал бы второй CSS-файл сборки, а его предзагрузку получила бы каждая страница. */

/* ══════════════════════════════════════════════════════════════════════════
   Новости и «Вопросы» «Чертёж» (шаг 5, 26.09.2026) — утверждённый макет
   internal-docs/redesign-concepts-2026-09-23/step5/. Разметка —
   src/content-v2/ (cx-kit, news-hub-view, news-article-view, faq-view),
   движение — cx-motion.js. Пространства: .cx-* (общее), .nf-* (лента),
   .na-* (статья), .fq-* («Вопросы»). Цвета только --c-*: синь — размеры,
   прогресс и фокус; янтарь — одна кнопка действия. Состояние «до показа»
   держит контраст (прозрачность .85, сдвиг), при «меньше движения» его нет.
   ══════════════════════════════════════════════════════════════════════════ */
/* body{overflow-x:hidden} делает body контейнером прокрутки — липкие полосы не липнут; clip — нет (html уже clip) */
body.cx-page { overflow-x: clip; }
body.cx-page { --cx-w: min(1136px, 100vw - 64px); --cx-nav: 58px; --cx-ease: cubic-bezier(.22, .61, .36, 1); --cx-spring: cubic-bezier(.2, .9, .28, 1.08); }
body.cx-page.id .dp__main { width: var(--cx-w); max-width: none; margin: 0 auto; padding: 8px 0 96px; }
body.cx-page .breadcrumbs { width: var(--cx-w); }
html.cx-navless body.cx-page { --cx-nav: 0px; }
@media (max-width: 720px) { body.cx-page { --cx-w: calc(100vw - 40px); } }
body.cx-page .dp__main :where(h1, h2, h3, p, ul, ol, figure) { margin: 0; }
body.cx-page .dp__main :where(ul, ol) { padding: 0; list-style: none; }
body.cx-page .dp__main :where(a) { color: inherit; text-decoration: none; }
.cx-ic { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cx-lbl { font-family: var(--id-mono); font-size: 11.5px; font-weight: 500; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; color: var(--c-t2); }
.cx-lbl b { font-weight: 500; color: var(--c-t1); }
.cx-flag { width: 18px; height: 13px; flex: none; border-radius: 2px; box-shadow: 0 0 0 1px var(--c-edge); object-fit: cover; }
.cx-h1 { font-family: var(--id-sans); font-size: 44px; font-weight: 600; line-height: 1.08; letter-spacing: -.02em; color: var(--c-t1); text-wrap: balance; }
.cx-lead { margin-top: 14px !important; max-width: 34em; font-size: 18px; line-height: 1.5; color: var(--c-t2); text-wrap: pretty; }
@media (max-width: 720px) {
  .cx-h1 { font-size: 30px; line-height: 1.12; }
  .cx-lead { font-size: 16px; margin-top: 12px !important; }
}
.cx-onl { display: none !important; }
html.cx-on .cx-onl { display: revert !important; }
html.cx-on .cx-find.cx-onl, html.cx-on .nf-often.cx-onl, html.cx-on .nf-more.cx-onl { display: flex !important; }

/* кнопки: янтарная (одна на экран) и спокойная */
.cx-btn { height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 0 24px 0 20px; border: 1px solid var(--c-action-edge); border-radius: 13px; background: var(--c-action); color: var(--c-on-action) !important; font-family: var(--id-sans); font-size: 16px; font-weight: 600; letter-spacing: -.01em; white-space: nowrap; cursor: pointer; transition: transform .2s var(--cx-spring), box-shadow .2s var(--cx-ease); }
.cx-btn:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(42, 29, 5, .16); }
.cx-btn--line { height: 48px; background: var(--c-surface); border-color: var(--c-edge-2); color: var(--c-t1) !important; font-size: 15.5px; font-weight: 500; }
.cx-btn--line:hover { border-color: var(--c-t1); box-shadow: none; }
.cx-btn--line .cx-lbl { letter-spacing: .02em; }
.cx-btn:focus-visible { outline: 2px solid var(--c-measure); outline-offset: 3px; }

/* поиск */
.cx-find { position: relative; align-items: center; max-width: 520px; height: 50px; margin-top: 22px; border: 1px solid var(--c-edge-2); border-radius: 13px; background: var(--c-surface); transition: border-color .2s var(--cx-ease); }
.cx-find:focus-within { border-color: var(--c-t1); }
.cx-find > .cx-ic { position: absolute; left: 15px; color: var(--c-t2); }
.cx-find input { width: 100%; height: 100%; padding: 0 46px; border: 0; border-radius: 13px; background: none; outline: none; font: inherit; font-size: 16px; color: var(--c-t1); }
.cx-find input::placeholder { color: var(--c-t2); opacity: 1; }
.cx-find input::-webkit-search-cancel-button { display: none; }
.cx-find__x { position: absolute; right: 5px; width: 40px; height: 40px; display: none; place-items: center; border: 0; border-radius: 10px; background: none; color: var(--c-t2); cursor: pointer; }
.cx-find.has-q .cx-find__x { display: grid; }
.cx-find__x:hover { color: var(--c-t1); }

/* чипы; каретка — тёмная подложка переезжает к выбранному */
.cx-chips { position: relative; display: flex; flex-wrap: wrap; gap: 6px; }
.cx-chips__ink { position: absolute; left: 0; top: 0; z-index: 0; border-radius: 999px; background: var(--c-t1); pointer-events: none; transition: transform .38s var(--cx-ease), width .38s var(--cx-ease), opacity .2s var(--cx-ease); }
.cx-chip { position: relative; z-index: 1; height: 38px; display: inline-flex; align-items: center; gap: 7px; padding: 0 14px; border: 1px solid var(--c-edge-2); border-radius: 999px; background: var(--c-surface); font: inherit; font-size: 14.5px; font-weight: 500; color: var(--c-t1); white-space: nowrap; cursor: pointer; transition: color .25s var(--cx-ease), border-color .2s var(--cx-ease), background-color .2s var(--cx-ease); }
.cx-chip:hover { border-color: var(--c-t1); }
.cx-chip:focus-visible { outline: 2px solid var(--c-measure); outline-offset: 2px; }
.cx-chip__n { font-family: var(--id-mono); font-size: 12px; font-weight: 500; color: var(--c-t2); transition: color .25s var(--cx-ease); }
/* выбранная — своя тёмная подложка (текст читается и без каретки); каретка доезжает, подложка
   проявляется под конец её хода, уходит сразу — движение остаётся за кареткой */
.cx-chip[aria-pressed="true"] { background: var(--c-t1); border-color: var(--c-t1); color: #fff; transition: color .25s var(--cx-ease), border-color 0s linear .3s, background-color 0s linear .3s; }
.cx-chip[aria-pressed="true"] .cx-chip__n { color: rgba(255, 255, 255, .78); }
.cx-chip--sm { height: 34px; padding: 0 12px 0 10px; font-size: 13.5px; gap: 6px; }
.cx-seg { display: inline-flex; flex: none; padding: 3px; border: 1px solid var(--c-edge-2); border-radius: 11px; background: var(--c-surface); }
.cx-seg button { height: 32px; padding: 0 12px; border: 0; border-radius: 8px; background: none; cursor: pointer; font: inherit; font-size: 14px; font-weight: 500; color: var(--c-t2); transition: background-color .25s var(--cx-ease), color .25s var(--cx-ease); }
.cx-seg button[aria-pressed="true"] { background: var(--c-t1); color: #fff; }
.cx-seg button:not([aria-pressed="true"]):hover { color: var(--c-t1); }
.cx-seg button:focus-visible { outline: 2px solid var(--c-measure); outline-offset: 2px; }

/* размер синим — измерение; рамка-значок в пропорциях формата */
.cx-sz { display: inline-flex; align-items: center; gap: 5px; font-family: var(--id-mono); font-size: 12.5px; font-weight: 500; letter-spacing: .01em; color: var(--c-measure); white-space: nowrap; font-variant-numeric: tabular-nums; }
.cx-sz__f { width: 14px; height: 14px; flex: none; overflow: visible; }
.cx-sz__f rect { fill: var(--c-measure-soft); stroke: var(--c-measure); stroke-width: 1.1; }

/* заголовок раздела: черта туши вычерчивается */
.cx-sec { position: relative; display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-top: 14px; margin-bottom: 6px; }
.cx-sec::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1.5px; background: var(--c-t1); transform-origin: 0 50%; }
.cx-sec > :is(h2, h3) { font-family: var(--id-sans); font-size: 24px; font-weight: 600; line-height: 1.2; letter-spacing: -.015em; color: var(--c-t1); }
.cx-sec__n { display: block; margin-bottom: 8px; font-family: var(--id-mono); font-size: 12px; font-weight: 500; letter-spacing: .04em; color: var(--c-t2); }
.cx-sec .cx-lbl { white-space: nowrap; }
@media (max-width: 720px) { .cx-sec > :is(h2, h3) { font-size: 21px; } }

/* надпись над заголовком материала */
.cx-kick { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 13.5px; color: var(--c-t2); }
.cx-kick .cx-lbl { color: var(--c-t2); }
.cx-kick .cx-lbl--news { display: inline-flex; align-items: center; gap: 6px; color: var(--c-t1); }
.cx-kick .cx-lbl--news::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--c-t1); }
.cx-kick__sep { width: 3px; height: 3px; border-radius: 50%; background: var(--c-t4); }
.cx-kick__c { display: inline-flex; align-items: center; gap: 6px; }
.cx-kick__more { font-family: var(--id-mono); font-size: 12px; }

/* строка ленты */
.cx-row { position: relative; display: grid; grid-template-columns: 76px minmax(0, 1fr) 216px; column-gap: 28px; padding: 22px 0; border-top: 1px solid var(--c-edge-2); }
.nf-list > .cx-row:first-child, .na-more > .cx-row:first-child { border-top: 0; }
.cx-row__date { padding-top: 2px; font-family: var(--id-mono); font-size: 13px; font-weight: 500; color: var(--c-t2); font-variant-numeric: tabular-nums; }
.cx-row__date b { display: block; margin-bottom: 4px; font-size: 22px; font-weight: 500; line-height: 1; letter-spacing: -.01em; color: var(--c-t1); }
/* разделитель даты («23.09.2026») — в тексте, не на экране: число стоит над остатком */
.cx-row__sep { display: none; }
.cx-row--same .cx-row__date time { visibility: hidden; }
.cx-row__body { min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.cx-row__t { font-family: var(--id-sans); font-size: 19px; font-weight: 600; line-height: 1.3; letter-spacing: -.014em; color: var(--c-t1); text-wrap: pretty; }
.cx-row__t a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.cx-row__t a:focus-visible { outline: none; }
.cx-row:has(.cx-row__t a:focus-visible) { outline: 2px solid var(--c-measure); outline-offset: 4px; border-radius: 8px; }
.cx-row__d { font-size: 15px; line-height: 1.5; color: var(--c-t2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-wrap: pretty; }
.cx-row__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-family: var(--id-mono); font-size: 12px; color: var(--c-t2); }
.cx-row__src { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--id-sans); font-size: 12.5px; }
.cx-row__img { position: relative; width: 216px; aspect-ratio: 16 / 9; border-radius: 10px; overflow: hidden; background: #E9E7E1; align-self: start; }
.cx-row__img.cx-dev img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--cx-ease), filter 1s var(--cx-ease), opacity 1s var(--cx-ease); }
.cx-row__img--none, .cx-row__img--dwg { display: grid; place-items: center; background: var(--c-surface); box-shadow: inset 0 0 0 1px var(--c-edge-2); color: var(--c-t4); }
.cx-row__img--none svg { width: 34%; height: auto; }
.cx-row__img--dwg svg { width: 100%; height: 100%; }
.cx-row__noflag { position: absolute; right: 8px; bottom: 8px; width: 22px; height: 16px; border-radius: 2px; box-shadow: 0 0 0 1px var(--c-edge); }
.cx-row mark { background: rgba(16, 18, 20, .07); color: inherit; box-shadow: inset 0 -1.5px 0 var(--c-t1); border-radius: 2px; }
@media (hover: hover) {
  .cx-row:hover .cx-row__t a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
  .cx-row:hover .cx-row__img img { transform: scale(1.035); }
}
@media (max-width: 900px) { .cx-row { grid-template-columns: 64px minmax(0, 1fr) 168px; column-gap: 20px; } .cx-row__img { width: 168px; } }
@media (max-width: 720px) {
  .cx-row { grid-template-columns: minmax(0, 1fr) 92px; column-gap: 14px; padding: 18px 0; }
  .cx-row__date { display: none; }
  .cx-row__img { width: 92px; aspect-ratio: 1; }
  .cx-row__t { font-size: 16.5px; }
  .cx-row__d { display: none; }
  .cx-kick { font-size: 12.5px; }
}

/* обложка «сканом»: синяя линия сверху вниз, за ней снимок из серого становится цветным */
.cx-scan { position: relative; overflow: hidden; border-radius: 16px; background: #E9E7E1; isolation: isolate; }
.cx-scan img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cx-scan__a { filter: grayscale(1) contrast(.92) brightness(1.1); }
.cx-scan__line { position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--c-measure); box-shadow: 0 0 22px 7px rgba(45, 91, 216, .28); opacity: 0; pointer-events: none; }
.cx-js .cx-scan:not(.is-in) .cx-scan__b { clip-path: inset(0 0 100% 0); }
.cx-js .cx-scan.is-in .cx-scan__b { animation: cx-scan-reveal 1.25s cubic-bezier(.45, .05, .3, 1) .2s both; }
.cx-js .cx-scan.is-in .cx-scan__line { animation: cx-scan-line 1.25s cubic-bezier(.45, .05, .3, 1) .2s both; }
@keyframes cx-scan-reveal { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes cx-scan-line { 0% { top: 0; opacity: 1; } 92% { opacity: 1; } 100% { top: 100%; opacity: 0; } }

/* проявка миниатюр: из серого и размытого — в цвет */
.cx-js .cx-dev:not(.is-in) img { filter: grayscale(1) blur(3px) brightness(1.12); opacity: .55; }

/* появление при прокрутке: текст не гаснет (контраст держится), только сдвиг */
.cx-js [data-rv]:not(.is-in) { opacity: .85; transform: translateY(8px); }
.cx-js [data-rv] { transition: opacity .5s var(--cx-ease), transform .5s var(--cx-ease); transition-delay: var(--d, 0s); }
.cx-js .cx-sec:not(.is-in)::before { transform: scaleX(0); }
.cx-js .cx-sec::before { transition: transform .7s var(--cx-ease); }

/* вычерчивание рамки (книга стиля 12.1): рамка 0,55 с; размеры 0,5 с после 0,2 с; подписи после 0,55 с */
.cx-js .cx-dwg:not(.is-in) :is(.fdw__frame, .fdw__dim, .fdw__ext, .fdw__tick) { stroke-dasharray: 1; stroke-dashoffset: 1; }
.cx-js .cx-dwg:not(.is-in) :is(.fdw__lab, .fdw__lab2, .fdw__band, .fdw__ghost-g, .fdw__spec-g) { opacity: 0; }
.cx-js .cx-dwg.is-in .fdw__frame { stroke-dasharray: 1; animation: cx-draw .55s var(--cx-ease) var(--dd, 0s) both; }
.cx-js .cx-dwg.is-in :is(.fdw__dim, .fdw__ext, .fdw__tick) { stroke-dasharray: 1; animation: cx-draw .5s var(--cx-ease) calc(.2s + var(--dd, 0s)) both; }
.cx-js .cx-dwg.is-in :is(.fdw__lab, .fdw__lab2) { animation: cx-fade .35s var(--cx-ease) calc(.55s + var(--dd, 0s)) both; }
.cx-js .cx-dwg.is-in .fdw__band { animation: cx-fade .35s var(--cx-ease) calc(.45s + var(--dd, 0s)) both; }
.cx-js .cx-dwg.is-in :is(.fdw__spec-g, .fdw__ghost-g) { animation: cx-fade .45s var(--cx-ease) calc(.12s + var(--dd, 0s)) both; }
@keyframes cx-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes cx-fade { from { opacity: 0; } to { opacity: 1; } }

/* печать «Проверено» ложится (движение — cx-motion.js, как stamp-motion.js главной) */
.cx-stamp { position: absolute; width: 104px; height: 104px; color: var(--c-measure); transform: rotate(-12deg); opacity: .9; pointer-events: none; }
.cx-stamp svg { width: 100%; height: 100%; mix-blend-mode: multiply; }
.cx-stamp__shadow, .cx-stamp__ripple { position: absolute; inset: 0; border-radius: 50%; opacity: 0; }
.cx-stamp__shadow { background: radial-gradient(closest-side, rgba(16, 18, 20, .28), transparent); }
.cx-stamp__ripple { box-shadow: 0 0 0 2px var(--c-measure); }
.cx-stamp__ink { position: absolute; inset: 0; }
.cx-js .cx-stamp:not(.is-in) .cx-stamp__ink { opacity: 0; }

/* финал: готовое фото в рамке, печать ложится на него; одна янтарная кнопка */
.cx-fin { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; column-gap: 36px; margin-top: 72px; padding: 26px 34px 26px 26px; border: 1.5px solid var(--c-t1); background: var(--c-surface); }
.cx-fin__art { position: relative; width: 148px; }
.cx-fin__art .cx-dwg svg { display: block; width: 100%; height: auto; }
.cx-fin__stamp { right: -40px; bottom: -14px; width: 92px; height: 92px; }
.cx-fin h2 { font-family: var(--id-sans); font-size: 28px; font-weight: 600; line-height: 1.15; letter-spacing: -.02em; color: var(--c-t1); text-wrap: balance; }
.cx-fin p { margin-top: 10px !important; max-width: 36em; font-size: 16px; line-height: 1.5; color: var(--c-t2); }
@media (max-width: 860px) {
  .cx-fin { grid-template-columns: auto minmax(0, 1fr); row-gap: 18px; column-gap: 24px; padding: 22px 20px; }
  .cx-fin .cx-btn { grid-column: 1 / -1; width: 100%; }
}
@media (max-width: 720px) {
  .cx-fin { grid-template-columns: minmax(0, 1fr); margin-top: 52px; }
  .cx-fin__art { width: 124px; }
  .cx-fin__stamp { right: -30px; bottom: -10px; width: 72px; height: 72px; }
  .cx-fin h2 { font-size: 21px; }
  .cx-fin p { font-size: 15px; }
}
.cx-js .is-flash { animation: cx-flash 1.6s var(--cx-ease); }
@keyframes cx-flash { 0%, 30% { background: rgba(16, 18, 20, .06); box-shadow: -12px 0 0 rgba(16, 18, 20, .06), 12px 0 0 rgba(16, 18, 20, .06); } 100% { background: transparent; box-shadow: none; } }

/* ── лента /{lang}/news/ ── */
.nf-hero { display: grid; grid-template-columns: minmax(0, 1fr) 540px; column-gap: 56px; align-items: center; }
.nf-hero--solo { grid-template-columns: minmax(0, 1fr); }
.nf-hero__txt { padding-bottom: 32px; }
.nf-hero__txt .cx-h1 { margin-top: 12px; }
.nf-often { flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 18px; }
.nf-often__row { display: flex; flex-wrap: wrap; gap: 6px; }
.nf-lead { position: relative; display: block; }
.nf-lead__img { position: relative; display: block; }
.nf-lead__img .cx-scan img { transition: transform .6s var(--cx-ease); }
.nf-lead__new { position: absolute; left: 14px; top: 14px; z-index: 3; height: 26px; display: inline-flex; align-items: center; gap: 7px; padding: 0 10px; border-radius: 7px; background: rgba(255, 255, 255, .94); font-family: var(--id-mono); font-size: 11.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--c-t1); box-shadow: 0 1px 0 var(--c-edge); }
.nf-lead__new i { width: 7px; height: 7px; border-radius: 50%; background: var(--c-t1); }
.cx-js .nf-lead__new i { animation: nf-blink 2.4s var(--cx-ease) infinite; }
@keyframes nf-blink { 0%, 60%, 100% { opacity: 1; } 30% { opacity: .25; } }
.nf-lead__body { display: flex; flex-direction: column; gap: 8px; padding-top: 14px; }
.nf-lead__t { font-family: var(--id-sans); font-size: 22px; font-weight: 600; line-height: 1.25; letter-spacing: -.018em; color: var(--c-t1); text-wrap: pretty; }
.nf-lead__t a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.nf-lead__d { font-size: 15px; line-height: 1.5; color: var(--c-t2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@media (hover: hover) {
  .nf-lead:hover .nf-lead__img .cx-scan img { transform: scale(1.03); }
  .nf-lead:hover .nf-lead__t a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
}
.nf-bar { position: sticky; top: var(--cx-nav); z-index: 30; margin-top: 34px; padding: 12px 0 10px; background: rgba(245, 245, 243, .95); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-bottom: 1px solid transparent; transition: border-color .2s var(--cx-ease), top .25s cubic-bezier(.32, .72, .18, 1); }
.nf-bar[hidden] { display: none; }
.nf-bar.is-stuck { border-bottom-color: var(--c-edge); }
.nf-bar__row { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 8px; }
.nf-bar__res { margin: 0; }
.nf-cn { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s var(--cx-ease); }
.nf-cn.is-open { grid-template-rows: 1fr; }
.nf-cn > div { overflow: hidden; }
.nf-bar__cty { flex-wrap: nowrap; overflow-x: auto; padding: 8px 2px 2px; margin: 0 -2px; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 92%, transparent); mask-image: linear-gradient(90deg, #000 92%, transparent); }
.nf-bar__cty::-webkit-scrollbar { display: none; }
.nf-bar__cty .cx-chip { height: 34px; font-size: 13.5px; padding: 0 12px; }
.nf-stream { padding-top: 8px; transition: opacity .16s var(--cx-ease); }
.nf-stream.is-swap { opacity: 0; }
.nf-mon { padding-top: 34px; }
.nf-mon .cx-sec { margin-bottom: 0; }
.nf-mon .cx-sec > h2 { font-family: var(--id-mono); font-size: 15px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }
.nf-more { flex-direction: column; align-items: center; gap: 14px; padding-top: 28px; }
.nf-empty { padding: 40px 0; }
.nf-empty p { margin-bottom: 14px !important; font-size: 17px; color: var(--c-t2); }
.nf-pager .news-pager { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 36px; padding-top: 16px; border-top: 1.5px solid var(--c-t1); }
.nf-pager .news-pager__status { margin: 0; font-family: var(--id-mono); font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--c-t2); }
.nf-pager .news-pager__row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; flex: 1; }
.nf-pager .news-pager__list { display: flex; flex-wrap: wrap; gap: 4px; }
.nf-pager .news-pager__num { min-width: 40px; height: 40px; display: inline-grid; place-items: center; padding: 0 10px; border-radius: 10px; font-family: var(--id-mono); font-size: 14px; font-weight: 500; color: var(--c-t1); transition: background-color .2s var(--cx-ease); }
.nf-pager a.news-pager__num:hover { background: var(--c-surface); box-shadow: inset 0 0 0 1px var(--c-edge-2); }
.nf-pager .news-pager__num[aria-current="page"] { background: var(--c-t1); color: #fff; }
.nf-pager .news-pager__gap { min-width: 24px; display: inline-grid; place-items: center; color: var(--c-t2); }
.nf-pager .news-pager__link { height: 44px; display: inline-flex; align-items: center; padding: 0 16px; border: 1px solid var(--c-edge-2); border-radius: 13px; background: var(--c-surface); font-size: 15px; font-weight: 500; color: var(--c-t1); transition: border-color .2s var(--cx-ease); }
.nf-pager .news-pager__link:hover { border-color: var(--c-t1); }
.nf-pager .news-pager__link--next { margin-left: auto; }
.nf-pop { padding-top: 56px; }
.nf-pop__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; padding-top: 18px; }
.nf-card { position: relative; display: flex; flex-direction: column; gap: 9px; }
.nf-card__img { display: block; aspect-ratio: 16 / 9; border-radius: 10px; overflow: hidden; background: #E9E7E1; }
.nf-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--cx-ease), filter 1s var(--cx-ease), opacity 1s var(--cx-ease); }
.nf-card__t { margin-top: 6px !important; font-family: var(--id-sans); font-size: 15.5px; font-weight: 600; line-height: 1.35; letter-spacing: -.01em; color: var(--c-t1); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.nf-card__t a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
@media (hover: hover) { .nf-card:hover .nf-card__img img { transform: scale(1.035); } .nf-card:hover .nf-card__t a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; } }
@media (max-width: 1080px) { .nf-hero { grid-template-columns: minmax(0, 1fr) 420px; column-gap: 36px; } .nf-pop__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) { .nf-hero { grid-template-columns: minmax(0, 1fr); row-gap: 26px; } .nf-hero__txt { padding-bottom: 0; } }
@media (max-width: 720px) {
  .nf-often { margin-top: 14px; }
  .nf-often > .cx-lbl { display: none; }
  .nf-often__row { flex-wrap: nowrap; overflow-x: auto; min-width: 0; margin: 0 -20px; padding: 0 20px 2px; scrollbar-width: none; }
  .nf-often__row::-webkit-scrollbar { display: none; }
  .nf-often__row .cx-chip { flex: none; }
  .nf-bar { margin-top: 22px; padding-top: 10px; }
  .nf-bar__reg { flex-wrap: nowrap; overflow-x: auto; margin: 0 -20px; padding: 0 20px 2px; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
  .nf-bar__reg::-webkit-scrollbar { display: none; }
  .nf-bar__reg .cx-chip { flex: none; }
  .nf-bar__row { flex-wrap: wrap; gap: 8px; }
  .nf-bar.is-stuck .nf-bar__row { display: none; }
  .nf-lead__t { font-size: 19px; }
  .nf-pop__grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .nf-card { flex-direction: row; gap: 14px; padding: 14px 0; border-top: 1px solid var(--c-edge-2); }
  .nf-card__img { width: 92px; flex: none; aspect-ratio: 1; }
  .nf-pager .news-pager__link--next { margin-left: 0; }
}

/* ── статья /{lang}/news/{slug}/ ── */
.na-head { display: grid; grid-template-columns: minmax(0, 1fr) 340px; column-gap: 56px; align-items: start; }
.na-h { padding-top: 6px; }
.na-h .cx-kick { font-size: 14px; }
.na-h .cx-h1 { margin-top: 12px; font-size: 38px; line-height: 1.12; }
.na-lead { margin-top: 16px !important; max-width: 40em; font-size: 18px; line-height: 1.55; color: var(--c-t1); text-wrap: pretty; }
.na-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 14px !important; font-family: var(--id-mono); font-size: 12.5px; color: var(--c-t2); }
.na-meta a { border-bottom: 1px solid var(--c-edge-2); }
.na-meta a:hover { color: var(--c-t1); border-color: var(--c-t1); }
.na-offer-wrap { padding-top: 6px; }
.na-offer { padding: 16px 16px 18px; background: var(--c-surface); border: 1px solid var(--c-edge-2); border-radius: 14px; box-shadow: 0 18px 44px rgba(16, 18, 20, .08); }
.na-offer__h { display: flex; align-items: center; gap: 8px; margin-top: 2px !important; font-size: 15.5px; font-weight: 600; color: var(--c-t1); }
.na-offer__h .cx-sz { margin-left: auto; font-size: 12px; }
.na-offer__dwg { margin: 6px -4px 2px; }
.na-offer__dwg svg { display: block; width: 100%; height: auto; max-height: 230px; }
.na-offer__go { width: 100%; margin-top: 12px; }
.na-offer__free { margin-top: 10px !important; font-size: 13px; line-height: 1.4; color: var(--c-t2); text-align: center; }
/* планшет: первый экран в столбик — карточка на всю ширину раскладывается в строку: чертёж слева */
@media (min-width: 700px) and (max-width: 1080px) {
  .na-offer:not(.na-offer--mini) { display: grid; grid-template-columns: 240px minmax(0, 1fr); grid-template-rows: 1fr auto auto auto auto 1fr; column-gap: 32px; padding: 18px 24px; }
  .na-offer:not(.na-offer--mini) > * { grid-column: 2; }
  .na-offer:not(.na-offer--mini) > .na-offer__dwg { grid-column: 1; grid-row: 1 / -1; align-self: center; margin: 0; }
  .na-offer:not(.na-offer--mini) > .cx-lbl { grid-row: 2; }
  .na-offer:not(.na-offer--mini) > .na-offer__h { grid-row: 3; }
  .na-offer:not(.na-offer--mini) > .na-offer__go { grid-row: 4; max-width: 360px; }
  .na-offer:not(.na-offer--mini) > .na-offer__free { grid-row: 5; text-align: left; }
}
.na-offer--mini { box-shadow: none; padding: 14px 14px 16px; }
.na-offer--mini .na-offer__go { height: 46px; font-size: 15px; }
.na-cover { grid-column: 1 / -1; margin-top: 32px !important; }
.na-tocm { display: none; }
.na-grid { display: grid; grid-template-columns: minmax(0, 720px) 300px; justify-content: space-between; column-gap: 64px; padding-top: 44px; }
.na-rail { position: relative; }
.na-rail__in { position: sticky; top: calc(var(--cx-nav) + 30px); display: flex; flex-direction: column; gap: 22px; transition: top .25s cubic-bezier(.32, .72, .18, 1); }
/* главное: пункты с номерами в две колонки */
.na-pts { margin-bottom: 40px; }
.na-pts__h { display: flex; align-items: baseline; justify-content: space-between; padding-top: 12px; border-top: 1.5px solid var(--c-t1); }
.na-pts__h h2 { letter-spacing: .06em; }
.na-pts ol { counter-reset: na-pt; columns: 2; column-gap: 40px; }
.na-pts li { counter-increment: na-pt; display: grid; grid-template-columns: 40px minmax(0, 1fr); padding: 13px 0; border-bottom: 1px solid var(--c-edge-2); font-size: 16px; line-height: 1.5; break-inside: avoid; }
.na-pts li::before { content: counter(na-pt, decimal-leading-zero); padding-top: 3px; font-family: var(--id-mono); font-size: 12px; font-weight: 500; color: var(--c-t2); }
/* текст статьи */
.na-prose { counter-reset: na-h; font-size: 18px; line-height: 1.65; color: var(--c-t1); }
.na-prose p { margin: 0 0 18px !important; text-wrap: pretty; }
.na-prose h2 { counter-increment: na-h; margin: 56px 0 16px !important; font-family: var(--id-sans); font-size: 27px; font-weight: 600; line-height: 1.2; letter-spacing: -.018em; color: var(--c-t1); text-wrap: balance; scroll-margin-top: 96px; }
.na-prose h2::before { content: counter(na-h, decimal-leading-zero); display: block; margin-bottom: 8px; font-family: var(--id-mono); font-size: 12px; font-weight: 500; letter-spacing: .04em; color: var(--c-t2); }
.na-prose h3 { margin: 30px 0 10px !important; font-family: var(--id-sans); font-size: 20px; font-weight: 600; line-height: 1.3; color: var(--c-t1); }
.na-prose a { color: var(--c-t1); border-bottom: 1px solid rgba(16, 18, 20, .35); transition: border-color .2s var(--cx-ease); }
.na-prose a:hover { border-color: var(--c-t1); }
.na-prose strong { font-weight: 600; }
.na-prose ul { margin: 0 0 20px !important; }
.na-prose ul li { position: relative; padding-left: 24px; margin-bottom: 9px; }
.na-prose ul li::before { content: ""; position: absolute; left: 2px; top: .8em; width: 11px; height: 1.5px; background: var(--c-t1); }
.na-prose ol { counter-reset: na-ol; margin: 0 0 20px !important; }
.na-prose ol li { counter-increment: na-ol; position: relative; padding-left: 40px; margin-bottom: 12px; }
.na-prose ol li::before { content: counter(na-ol, decimal-leading-zero); position: absolute; left: 0; top: .2em; font-family: var(--id-mono); font-size: 12.5px; font-weight: 500; color: var(--c-t2); }
.na-prose blockquote { margin: 0 0 20px; padding: 4px 0 4px 20px; border-left: 3px solid var(--c-t1); color: var(--c-t2); }
.na-prose dl { margin: 0 0 20px; }
.na-prose dt { font-weight: 600; margin-top: 10px; }
.na-prose dd { margin: 4px 0 0; color: var(--c-t2); }
.na-answer { margin: 0 0 8px; padding: 18px 22px 4px; background: var(--c-surface); border: 1px solid var(--c-edge-2); border-left: 3px solid var(--c-t1); }
.na-answer h2 { margin: 0 0 8px !important; font-size: 11.5px !important; letter-spacing: .06em !important; counter-increment: none; font-family: var(--id-mono) !important; font-weight: 500 !important; color: var(--c-t2) !important; }
.na-answer h2::before { display: none !important; }
.na-answer p { font-size: 18px; }
.na-tbl { margin: 8px 0 26px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.na-tbl:focus-visible { outline: 2px solid var(--c-measure); outline-offset: 3px; border-radius: 4px; }
.na-prose table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 15px; line-height: 1.45; }
.na-prose th { padding: 0 14px 10px 0; border-bottom: 1.5px solid var(--c-t1); text-align: left; vertical-align: bottom; font-family: var(--id-mono); font-size: 11px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--c-t2); }
.na-prose td { padding: 12px 14px 12px 0; border-bottom: 1px solid var(--c-edge-2); vertical-align: top; }
.na-prose td:first-child { font-weight: 600; }
.na-sz { font-family: var(--id-mono); font-size: .9em; font-weight: 500; color: var(--c-measure); white-space: nowrap; font-variant-numeric: tabular-nums; }
/* документы статьи в одном масштабе */
.na-same { margin: 10px 0 34px !important; padding: 18px 20px 16px; background: var(--c-surface); border: 1px solid var(--c-edge-2); border-radius: 14px; }
.na-same__row { display: flex; align-items: flex-end; justify-content: space-around; gap: 10px; padding-top: 10px; }
.na-same__it { flex: 0 1 auto; display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 0; }
.na-same__it svg { display: block; width: 100%; height: auto; max-width: 190px; }
.na-same__cap { display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; font-size: 13.5px; color: var(--c-t2); }
.na-same__name { display: inline-flex; align-items: center; gap: 6px; color: var(--c-t1); font-weight: 600; font-size: 14.5px; }
.na-same__doc a { border-bottom: 1px solid var(--c-edge-2); }
.na-same__doc a:hover { border-color: var(--c-t1); }
/* вопросы статьи */
.na-faq, .na-src { padding-top: 56px; scroll-margin-top: 96px; }
.na-qa__row { border-bottom: 1px solid var(--c-edge-2); }
.na-qa__row > summary { position: relative; display: flex; align-items: flex-start; gap: 16px; padding: 18px 44px 18px 0; cursor: pointer; list-style: none; font-size: 17.5px; font-weight: 600; line-height: 1.35; letter-spacing: -.012em; color: var(--c-t1); }
.na-qa__row > summary::-webkit-details-marker { display: none; }
.na-qa__row > summary:hover .na-qa__q { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.na-qa__row > summary:focus-visible { outline: 2px solid var(--c-measure); outline-offset: 2px; }
.na-qa__n { flex: none; min-width: 26px; padding-top: 3px; font-family: var(--id-mono); font-size: 12px; font-weight: 500; color: var(--c-t2); }
.na-qa__mk { position: absolute; right: 4px; top: 22px; width: 18px; height: 18px; }
.na-qa__mk::before, .na-qa__mk::after { content: ""; position: absolute; left: 2px; right: 2px; top: 8.25px; height: 1.5px; background: var(--c-t1); border-radius: 1px; transition: transform .35s var(--cx-ease); }
.na-qa__mk::after { transform: rotate(90deg); }
.na-qa__row[open] .na-qa__mk::after { transform: rotate(0deg); }
.na-qa__a { padding: 0 44px 22px 42px; font-size: 16.5px; line-height: 1.62; color: var(--c-t2); }
.cx-js .na-qa__row[open] .na-qa__a { animation: na-develop .42s var(--cx-ease) both; }
@keyframes na-develop { from { opacity: 0; transform: translateY(-4px); filter: blur(1.5px); } to { opacity: 1; transform: none; filter: none; } }
/* источники одним нумерованным списком */
.na-refs { counter-reset: na-rf; }
.na-refs li { counter-increment: na-rf; display: grid; grid-template-columns: 40px minmax(0, 1fr); padding: 13px 0; border-bottom: 1px solid var(--c-edge-2); font-size: 15.5px; line-height: 1.45; color: var(--c-t1); }
.na-refs li::before { content: "[" counter(na-rf) "]"; padding-top: 2px; font-family: var(--id-mono); font-size: 12.5px; color: var(--c-t2); }
.na-refs a { display: inline-flex; align-items: center; gap: 6px; margin-top: 3px; font-family: var(--id-mono); font-size: 12.5px; color: var(--c-t2); border-bottom: 1px solid var(--c-edge-2); }
.na-refs a:hover { color: var(--c-t1); border-color: var(--c-t1); }
.na-refs a .cx-ic { width: 13px; height: 13px; }
.na-refs small { display: block; margin-top: 2px; font-family: var(--id-mono); font-size: 11.5px; color: var(--c-t2); }
/* автор — тихо, в конце статьи */
.na-about { display: flex; align-items: flex-start; gap: 14px; margin-top: 44px; padding-top: 18px; border-top: 1px solid var(--c-edge-2); font-size: 14.5px; line-height: 1.55; color: var(--c-t2); scroll-margin-top: 96px; }
.na-about b { font-weight: 600; color: var(--c-t1); }
.na-about a { border-bottom: 1px solid var(--c-edge-2); }
.na-about a:hover { border-color: var(--c-t1); }
.na-about__av { width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--c-surface); box-shadow: inset 0 0 0 1px var(--c-edge-2); color: var(--c-t1); }
.na-about__av svg { width: 20px; height: 20px; }
/* оглавление: синяя размерная линия растёт по мере чтения */
.na-toc { position: relative; padding: 0 0 26px 26px; }
.na-toc > .cx-lbl { display: block; margin-bottom: 10px; }
.na-toc ol { display: flex; flex-direction: column; gap: 2px; }
.na-toc a { display: grid; grid-template-columns: 24px minmax(0, 1fr); padding: 4px 0; font-size: 13.5px; line-height: 1.32; color: var(--c-t2); transition: color .2s var(--cx-ease); }
.na-toc a span { font-family: var(--id-mono); font-size: 11.5px; padding-top: 1px; }
.na-toc a:hover, .na-toc a.is-on { color: var(--c-t1); }
.na-toc a.is-on { font-weight: 600; }
.na-toc__line { position: absolute; left: 6px; top: 30px; bottom: 34px; width: 1px; background: rgba(45, 91, 216, .22); }
.na-toc__line i { position: absolute; left: -.5px; top: 0; width: 2px; height: calc(var(--p, 0) * 100%); background: var(--c-measure); transition: height .15s linear; }
.na-toc__line::before, .na-toc__line::after { content: ""; position: absolute; left: -4px; width: 9px; height: 1.3px; background: var(--c-measure); transform: rotate(-45deg); }
.na-toc__line::before { top: 0; }
.na-toc__line::after { bottom: 0; }
.na-toc__pct { position: absolute; left: 0; bottom: 0; font-family: var(--id-mono); font-size: 11px; color: var(--c-measure); font-variant-numeric: tabular-nums; }
/* ещё по теме */
.na-more-wrap { padding-top: 64px; }
.na-more__all { font-family: var(--id-mono); font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; border-bottom: 1px solid var(--c-edge-2); }
.na-more__all:hover { color: var(--c-t1); border-color: var(--c-t1); }
@media (max-width: 1080px) {
  .na-head { display: flex; flex-direction: column; align-items: stretch; }
  .na-h { order: 1; }
  .na-cover { order: 2; margin-top: 22px !important; }
  .na-offer-wrap { order: 3; margin-top: 18px; padding-top: 0; }
  .na-tocm { order: 4; }
  .na-grid { grid-template-columns: minmax(0, 1fr); }
  .na-rail { display: none; }
  .na-tocm { display: block; margin-top: 24px; border-top: 1.5px solid var(--c-t1); border-bottom: 1px solid var(--c-edge-2); }
  .na-tocm summary { display: flex; justify-content: space-between; align-items: center; padding: 14px 0; cursor: pointer; list-style: none; }
  .na-tocm summary::-webkit-details-marker { display: none; }
  .na-tocm ol { padding: 0 0 12px !important; }
  .na-tocm a { display: grid; grid-template-columns: 30px 1fr; padding: 7px 0; font-size: 15px; color: var(--c-t1); }
  .na-tocm a span { font-family: var(--id-mono); font-size: 12px; color: var(--c-t2); }
}
@media (max-width: 720px) {
  .na-h .cx-h1 { font-size: 28px; }
  .na-lead { font-size: 17px; }
  .na-pts ol { columns: 1; }
  .na-prose { font-size: 17px; }
  .na-prose h2 { font-size: 22px; margin-top: 44px !important; }
  .na-answer { padding: 14px 16px 2px; }
  .na-answer p { font-size: 17px; }
  .na-same { padding: 14px 10px; }
  .na-same__row { gap: 4px; }
  .na-same__name .cx-flag, .na-same__doc { display: none; }
  .na-same__name { font-size: 12px; }
  .na-qa__row > summary { font-size: 16.5px; padding: 16px 36px 16px 0; gap: 10px; }
  .na-qa__a { padding: 0 0 20px 36px; font-size: 15.5px; }
}

/* ── «Вопросы» /{lang}/faq/ ── */
.fq-hero { display: grid; grid-template-columns: minmax(0, 1fr) 560px; column-gap: 40px; align-items: center; }
.fq-hero__txt .cx-h1 { margin-top: 12px; }
.fq-also { max-width: 520px; margin-top: 20px; }
.fq-also ul { margin-top: 6px !important; border-top: 1px solid var(--c-edge-2); }
.fq-also a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 2px; border-bottom: 1px solid var(--c-edge-2); font-size: 15.5px; font-weight: 500; color: var(--c-t1); transition: padding .25s var(--cx-ease); }
.fq-also a .cx-ic { width: 18px; height: 18px; color: var(--c-t2); transition: transform .25s var(--cx-spring), color .2s var(--cx-ease); }
.fq-also a:hover { padding-left: 6px; }
.fq-also a:hover .cx-ic { transform: translateX(3px); color: var(--c-t1); }
/* фото с ответами-выносками */
.fq-map { position: relative; width: 100%; max-width: 560px; margin: 0 0 0 auto; --map-w: 560; --tg-x: 54; --tg-w: 230; }
.fq-map__stage { position: relative; }
.fq-map__crop { overflow: hidden; }
.fq-map__svg { display: block; width: 100%; height: auto; overflow: visible; }
.fq-map__frame { fill: none; stroke: rgba(16, 18, 20, .24); stroke-width: 1; }
.fq-map__scanline { fill: var(--c-measure); }
.fq-map__dim { stroke: var(--c-measure); stroke-width: 1; fill: none; }
.fq-map__ext { stroke: var(--c-measure); stroke-width: .75; stroke-opacity: .5; }
.fq-map__tick { stroke: var(--c-measure); stroke-width: 1.3; stroke-linecap: round; }
.fq-map__lab { fill: var(--c-measure); font-family: var(--id-mono); font-size: 12px; font-weight: 500; letter-spacing: .02em; }
.fq-map__lead { fill: none; stroke: var(--c-t1); stroke-opacity: .45; stroke-width: 1; transition: stroke-opacity .2s var(--cx-ease); }
.fq-map__halo { fill: none; stroke: #fff; stroke-opacity: .8; stroke-width: 3.4; }
.fq-map__dot { transform-box: fill-box; transform-origin: center; }
.fq-map__dot circle { fill: var(--c-t1); stroke: #fff; stroke-width: 1.6; transition: r .25s var(--cx-spring); }
.fq-map__dot text { display: none; fill: #fff; font-family: var(--id-mono); font-size: 11px; font-weight: 600; }
.fq-map[data-on] .fq-map__lead { stroke-opacity: .18; }
.fq-map[data-on="1"] .fq-map__l1, .fq-map[data-on="2"] .fq-map__l2, .fq-map[data-on="3"] .fq-map__l3, .fq-map[data-on="4"] .fq-map__l4, .fq-map[data-on="5"] .fq-map__l5 { stroke-opacity: 1; }
.fq-map[data-on="1"] .fq-map__d1 circle, .fq-map[data-on="2"] .fq-map__d2 circle, .fq-map[data-on="3"] .fq-map__d3 circle, .fq-map[data-on="4"] .fq-map__d4 circle, .fq-map[data-on="5"] .fq-map__d5 circle { r: 6.5px; }
.fq-map__list { position: absolute; inset: 0; pointer-events: none; }
.fq-map__it { position: absolute; left: 57%; top: calc(var(--y) / 440 * 100%); max-width: 43%; transform: translateY(-50%); pointer-events: auto; }
.fq-map__it a { display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: baseline; padding: 6px 8px; margin: -6px -8px; border-radius: 10px; transition: background-color .2s var(--cx-ease); }
.fq-map__n { display: none; grid-row: 1 / 3; align-self: center; width: 22px; height: 22px; place-items: center; border-radius: 50%; background: var(--c-t1); color: #fff; font-family: var(--id-mono); font-size: 11.5px; font-weight: 600; }
.fq-map__q { grid-column: 1 / -1; justify-self: start; font-size: 15.5px; font-weight: 600; letter-spacing: -.01em; color: var(--c-t1); border-bottom: 1px solid var(--c-edge-2); transition: border-color .2s var(--cx-ease); }
.fq-map__a { grid-column: 1 / -1; font-size: 13.5px; line-height: 1.4; color: var(--c-t2); }
.fq-map__it a:hover { background: rgba(255, 255, 255, .75); }
.fq-map__it a:hover .fq-map__q, .fq-map__it a:focus-visible .fq-map__q { border-color: var(--c-t1); }
.fq-map__tg { position: absolute; left: calc(var(--tg-x) / var(--map-w) * 100%); top: calc(356 / 440 * 100%); width: calc(var(--tg-w) / var(--map-w) * 100%); gap: 4px; }
html.cx-on .fq-map__tg.cx-onl { display: flex !important; }
.fq-map__tg button { flex: 1; height: 30px; border: 1px solid var(--c-edge-2); border-radius: 8px; background: var(--c-surface); cursor: pointer; font-family: var(--id-mono); font-size: 11px; font-weight: 500; letter-spacing: .05em; text-transform: uppercase; color: var(--c-t2); transition: background-color .2s var(--cx-ease), color .2s var(--cx-ease); }
.fq-map__tg button:hover { color: var(--c-t1); border-color: var(--c-t1); }
.fq-map__tg button[aria-pressed="true"] { background: var(--c-t1); border-color: var(--c-t1); color: #fff; }
/* движение первого экрана: скан по селфи, вычерчивание, выноски по очереди */
.cx-js .fq-map:not(.is-play) .fq-map__pass { clip-path: inset(0 0 100% 0); }
.cx-js .fq-map.is-play .fq-map__pass { clip-path: inset(0 0 0 0); transition: clip-path 1s cubic-bezier(.45, .05, .3, 1) .3s; }
.cx-js .fq-map__scan { opacity: 0; }
.cx-js .fq-map.is-play .fq-map__scan { animation: fq-scan 1s cubic-bezier(.45, .05, .3, 1) .3s both; }
@keyframes fq-scan { 0% { opacity: 1; transform: translateY(0); } 92% { opacity: 1; } 100% { opacity: 0; transform: translateY(var(--scan-h)); } }
.cx-js .fq-map:not(.is-play) :is(.fq-map__dim, .fq-map__ext, .fq-map__tick, .fq-map__lead, .fq-map__halo) { stroke-dasharray: 1; stroke-dashoffset: 1; }
.cx-js .fq-map:not(.is-play) :is(.fq-map__lab, .fq-map__dot) { opacity: 0; }
.cx-js .fq-map:not(.is-play) .fq-map__it { opacity: .85; transform: translate(-6px, -50%); }
.cx-js .fq-map.is-play :is(.fq-map__dim, .fq-map__ext, .fq-map__tick) { stroke-dasharray: 1; animation: cx-draw .5s var(--cx-ease) 1.25s both; }
.cx-js .fq-map.is-play .fq-map__lab { animation: cx-fade .35s var(--cx-ease) 1.6s both; }
.cx-js .fq-map.is-play :is(.fq-map__lead, .fq-map__halo) { stroke-dasharray: 1; animation: cx-draw .38s var(--cx-ease) calc(1.55s + var(--i) * .13s) both; }
.cx-js .fq-map.is-play .fq-map__dot { animation: fq-pop .35s var(--cx-spring) calc(1.5s + var(--i) * .13s) both; }
.cx-js .fq-map.is-play .fq-map__it { transition: opacity .35s var(--cx-ease), transform .35s var(--cx-ease); transition-delay: calc(1.7s + var(--i) * .13s); }
@keyframes fq-pop { from { opacity: 0; transform: scale(.4); } to { opacity: 1; transform: none; } }
/* темы слева, ответы справа */
.fq-body { display: grid; grid-template-columns: 232px minmax(0, 1fr); column-gap: 56px; padding-top: 48px; }
.fq-nav { position: sticky; top: calc(var(--cx-nav) + 30px); align-self: start; transition: top .25s cubic-bezier(.32, .72, .18, 1); }
.fq-nav > .cx-lbl { display: block; margin: 0 0 10px 12px; }
.fq-nav ol { position: relative; display: flex; flex-direction: column; gap: 2px; }
.fq-nav__bar { position: absolute; left: 0; top: 0; width: 2px; height: 40px; border-radius: 2px; background: var(--c-t1); transition: transform .38s var(--cx-ease), height .38s var(--cx-ease); }
.fq-nav a { display: grid; grid-template-columns: 22px 22px minmax(0, 1fr) auto; align-items: center; gap: 8px; min-height: 40px; padding: 8px 10px 8px 12px; border-radius: 0 10px 10px 0; font-size: 15px; line-height: 1.3; color: var(--c-t2); transition: color .2s var(--cx-ease), background-color .2s var(--cx-ease); }
.fq-nav a .cx-ic { width: 19px; height: 19px; }
.fq-nav a > span:first-child { font-family: var(--id-mono); font-size: 11.5px; }
.fq-nav a:hover { color: var(--c-t1); }
.fq-nav a.is-on { color: var(--c-t1); font-weight: 600; background: var(--c-surface); }
.fq-t { scroll-margin-top: calc(var(--cx-nav) + 36px); }
.fq-t + .fq-t { padding-top: 40px; }
.fq-t .cx-sec > h2 { display: flex; align-items: center; gap: 12px; }
.fq-t .cx-sec > h2 .cx-ic { width: 22px; height: 22px; }
.fq-t .cx-sec__n { display: inline; margin: 0; font-size: 13px; }
/* ответ открыт: номер, вопрос и текст, справа рисунок */
.fq-q { display: grid; grid-template-columns: 34px minmax(0, 1fr) 256px; column-gap: 24px; align-items: start; padding: 22px 0 24px; border-bottom: 1px solid var(--c-edge-2); scroll-margin-top: calc(var(--cx-nav) + 40px); }
.fq-q--text { grid-template-columns: 34px minmax(0, 1fr); }
.fq-q--text .fq-q__a { max-width: 44em; }
.fq-q--below { grid-template-columns: 34px minmax(0, 1fr); }
.fq-q--below .fq-q__vis { grid-column: 2; padding-top: 18px; }
.fq-q__n { padding-top: 4px; font-family: var(--id-mono); font-size: 12px; font-weight: 500; color: var(--c-t2); }
.fq-q__q { font-family: var(--id-sans); font-size: 19px; font-weight: 600; line-height: 1.3; letter-spacing: -.014em; color: var(--c-t1); text-wrap: balance; }
.fq-q__a { margin-top: 8px !important; font-size: 16.5px; line-height: 1.6; color: var(--c-t2); }
.fq-q__a a { color: var(--c-t1); border-bottom: 1px solid var(--c-edge-2); }
.fq-q__a a:hover { border-color: var(--c-t1); }
.fq-q__a strong { color: var(--c-t1); font-weight: 600; }
.fq-q mark { background: rgba(16, 18, 20, .07); color: inherit; box-shadow: inset 0 -1.5px 0 var(--c-t1); border-radius: 2px; }
.fq-q__vis { position: relative; padding-top: 4px; }
.fq-empty { display: none; padding: 28px 0; font-size: 17px; color: var(--c-t2); }
.fq-list.is-empty .fq-empty { display: block; }
/* карточка подробного разбора */
.fq-gd { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; align-items: center; gap: 14px; max-width: 560px; margin-top: 14px; padding: 10px 12px 10px 10px; background: var(--c-surface); border: 1px solid var(--c-edge-2); border-radius: 12px; transition: border-color .2s var(--cx-ease); }
.fq-gd__img { display: block; width: 96px; aspect-ratio: 16 / 9; border-radius: 7px; overflow: hidden; background: #E9E7E1; }
.fq-gd__img img { width: 100%; height: 100%; object-fit: cover; transition: filter 1s var(--cx-ease), opacity 1s var(--cx-ease); }
.fq-gd__t { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fq-gd__t .cx-lbl { font-size: 10.5px; }
.fq-gd__t b { font-size: 14.5px; font-weight: 600; line-height: 1.3; color: var(--c-t1); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fq-gd .cx-ic { width: 18px; height: 18px; color: var(--c-t2); transition: transform .25s var(--cx-spring), color .2s var(--cx-ease); }
.fq-gd:hover { border-color: var(--c-t1); }
.fq-gd:hover .cx-ic { transform: translateX(3px); color: var(--c-t1); }
.fq-q--below .fq-gd { margin-top: 16px; }
/* пиктограммы «так / не так» книги стиля */
.fq-pk { display: flex; gap: 10px; }
.fq-pk figure { display: flex; flex-direction: column; gap: 6px; width: 120px; margin: 0; }
.fq-pk img { width: 120px; height: auto; border-radius: 6px; box-shadow: 0 0 0 1px var(--c-edge); }
.fq-pk figcaption { font-size: 12.5px; line-height: 1.3; color: var(--c-t2); }
.fq-pk--3 figure { width: 80px; }
.fq-pk--3 img { width: 80px; }
.fq-pk--wide figure { width: auto; }
.fq-pk--wide img { width: 252px; }
/* шесть документов главной в одном масштабе */
.fq-p6 { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; padding: 14px 16px 12px; background: var(--c-surface); border: 1px solid var(--c-edge-2); border-radius: 14px; }
.fq-p6__it { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; text-align: center; }
.fq-p6__it .cx-dwg svg { display: block; width: 100%; height: auto; }
.fq-p6__name { display: block; max-width: 124px; font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--c-t1); }
.fq-p6__name .cx-flag { display: inline-block; vertical-align: -2px; margin-right: 2px; }
.fq-p6__it .cx-sz { font-size: 11.5px; }
.fq-p6__it:hover .fq-p6__name { text-decoration: underline; text-underline-offset: 3px; }
/* правила селфи: «так», наведение — «не так» */
.fq-rules { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.fq-rule { position: relative; display: flex; flex-direction: column; gap: 5px; padding: 10px 10px 12px; background: var(--c-surface); border: 1px solid var(--c-edge-2); border-radius: 14px; cursor: default; transition: transform .3s var(--cx-spring), box-shadow .3s var(--cx-ease); }
.fq-rule:focus-visible { outline: 2px solid var(--c-measure); outline-offset: 3px; }
.fq-rule__pic { position: relative; display: block; aspect-ratio: 140 / 180; margin-bottom: 4px; border-radius: 8px; overflow: hidden; }
.fq-rule__pic img { position: absolute; inset: 0; width: 100%; height: 100%; transition: opacity .35s var(--cx-ease), transform .45s var(--cx-spring); }
.fq-rule__net { opacity: 0; transform: rotate(-4deg) scale(.96); }
.fq-rule b { font-size: 14px; line-height: 1.3; color: var(--c-t1); }
.fq-rule > span:last-child { font-size: 12.5px; line-height: 1.4; color: var(--c-t2); }
@media (hover: hover) { .fq-rule:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(16, 18, 20, .1); } }
.fq-rule:is(:hover, :focus-visible, .is-flip) .fq-rule__net { opacity: 1; transform: none; }
.fq-rule:is(:hover, :focus-visible, .is-flip) .fq-rule__da { opacity: 0; transform: rotate(3deg) scale(.96); }
.cx-js .fq-q:not(.is-in) .fq-rule { opacity: .85; transform: translateY(10px); }
.cx-js .fq-q.is-in .fq-rule { animation: fq-rule-in .5s var(--cx-spring) calc(.2s + var(--d)) both; }
@keyframes fq-rule-in { from { opacity: .85; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.fq-rules__hint { margin-top: 10px !important; font-size: 13px; color: var(--c-t2); }
/* селфи → готовое фото */
.fq-ba { display: flex; align-items: center; gap: 8px; }
.fq-ba__it { display: flex; flex-direction: column; gap: 6px; width: 104px; margin: 0; }
.fq-ba__it:last-child { margin-left: 16px; }
.fq-ba__ph { position: relative; display: block; aspect-ratio: 3 / 4; border-radius: 8px; overflow: hidden; box-shadow: 0 0 0 1px var(--c-edge); }
.fq-ba__ph img { width: 100%; height: 100%; object-fit: cover; }
.fq-ba__ph--doc { border-radius: 2px; overflow: visible; }
.fq-ba__ph--doc img { border-radius: 2px; }
.fq-ba__w, .fq-ba__h { position: absolute; font-style: normal; font-family: var(--id-mono); font-size: 10px; font-weight: 500; color: var(--c-measure); white-space: nowrap; }
.fq-ba__w { left: 0; right: 0; top: -15px; padding-bottom: 2px; border-bottom: 1px solid var(--c-measure); text-align: center; line-height: 1; }
.fq-ba__h { left: -15px; top: 50%; transform: translate(-50%, -50%) rotate(-90deg); }
.fq-ba figcaption { font-size: 12.5px; color: var(--c-t2); }
.fq-ba__arr { padding-bottom: 22px; color: var(--c-t2); }
.fq-ba__arr .cx-ic { width: 18px; height: 18px; }
.cx-js .fq-q:not(.is-in) .fq-ba__ph--doc img { clip-path: inset(0 0 100% 0); }
.cx-js .fq-q.is-in .fq-ba__ph--doc img { animation: cx-scan-reveal 1s cubic-bezier(.45, .05, .3, 1) .45s both; }
/* цена */
.fq-price { display: grid; grid-template-columns: 1fr 1fr; border: 1.5px solid var(--c-t1); background: var(--c-surface); }
.fq-price > div { padding: 12px 14px; }
.fq-price > div + div { border-left: 1px solid var(--c-edge-2); }
.fq-price b { display: block; margin-top: 2px; font-size: 22px; letter-spacing: -.02em; color: var(--c-t1); }
.fq-price small { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.35; color: var(--c-t2); }
/* сроки размерными линиями */
.fq-tl { display: block; width: 100%; height: auto; overflow: visible; }
.fq-tl__dim { stroke: var(--c-measure); stroke-width: 1.2; fill: none; }
.fq-tl__tick { stroke: var(--c-measure); stroke-width: 1.3; stroke-linecap: round; }
.fq-tl__lab { fill: var(--c-measure); font-family: var(--id-mono); font-size: 12px; font-weight: 500; }
.fq-tl__cap { fill: var(--c-t2); font-family: var(--id-sans); font-size: 12.5px; }
.cx-js .fq-q:not(.is-in) :is(.fq-tl__dim, .fq-tl__tick) { stroke-dasharray: 1; stroke-dashoffset: 1; }
.cx-js .fq-q:not(.is-in) .fq-tl__lab { opacity: 0; }
.cx-js .fq-q.is-in :is(.fq-tl__dim, .fq-tl__tick) { stroke-dasharray: 1; animation: cx-draw .6s var(--cx-ease) calc(.25s + var(--i, 0) * .15s) both; }
.cx-js .fq-q.is-in .fq-tl__lab { animation: cx-fade .3s var(--cx-ease) .7s both; }
/* лист печати */
.fq-sheet { display: block; width: 100%; max-width: 230px; height: auto; }
.fq-sheet__paper { fill: #fff; stroke: rgba(16, 18, 20, .24); }
.fq-sheet__cut { fill: none; stroke: var(--c-t4); stroke-dasharray: 2 3; }
.fq-sheet__lab { fill: var(--c-measure); font-family: var(--id-mono); font-size: 11px; font-weight: 500; }
.cx-js .fq-q:not(.is-in) .fq-sheet image { opacity: 0; }
.cx-js .fq-q.is-in .fq-sheet image { animation: cx-fade .3s var(--cx-ease) calc(.2s + var(--i) * .09s) both; }
/* «не нашли ответ?»: тушь, узор «Толпа» книги стиля, живой знак */
.fq-ask { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 20px; margin-top: 56px; padding: 24px 26px; background: var(--c-t1); border-radius: 14px; color: #F5F5F3; }
.fq-ask::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: url(/brand/tolpa.svg) 0 0 / 300px auto repeat; filter: invert(1); mix-blend-mode: lighten; opacity: .8; -webkit-mask-image: linear-gradient(100deg, transparent 30%, #000 95%); mask-image: linear-gradient(100deg, transparent 30%, #000 95%); }
.fq-ask__mark { width: 64px; height: 64px; filter: invert(1); }
.fq-ask h2 { font-family: var(--id-sans); font-size: 21px; font-weight: 600; color: #fff; }
.fq-ask p { margin-top: 4px !important; font-size: 15px; line-height: 1.5; color: rgba(245, 245, 243, .82); }
.fq-ask p a { color: #fff; border-bottom: 1px solid rgba(245, 245, 243, .45); }
.fq-ask p a:hover { border-color: #fff; }
.fq-ask__btn { height: 48px; display: inline-flex; align-items: center; gap: 9px; padding: 0 18px; border: 1px solid rgba(245, 245, 243, .4); border-radius: 13px; color: #fff; font-size: 15.5px; font-weight: 600; transition: border-color .2s var(--cx-ease), background-color .2s var(--cx-ease); }
.fq-ask__btn .cx-ic { width: 18px; height: 18px; }
.fq-ask__btn:hover { border-color: #fff; background: rgba(255, 255, 255, .06); }
@media (max-width: 1080px) {
  .fq-hero { grid-template-columns: minmax(0, 1fr) 440px; column-gap: 28px; }
  .fq-body { grid-template-columns: minmax(0, 1fr); }
  .fq-nav { position: sticky; top: var(--cx-nav); z-index: 20; margin: 0 calc((100vw - var(--cx-w)) / -2); padding: 10px calc((100vw - var(--cx-w)) / 2); background: rgba(245, 245, 243, .95); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-bottom: 1px solid var(--c-edge); }
  .fq-nav > .cx-lbl, .fq-nav__bar { display: none; }
  .fq-nav ol { flex-direction: row; overflow-x: auto; gap: 6px; scrollbar-width: none; }
  .fq-nav ol::-webkit-scrollbar { display: none; }
  .fq-nav a { display: inline-flex; min-height: 36px; padding: 0 14px; white-space: nowrap; border-radius: 999px; border: 1px solid var(--c-edge-2); background: var(--c-surface); }
  .fq-nav a .cx-ic, .fq-nav a .cx-chip__n { display: none; }
  .fq-nav a.is-on { background: var(--c-t1); color: #fff; border-color: var(--c-t1); }
  .fq-t:first-of-type { padding-top: 18px; }
}
@media (max-width: 860px) { .fq-hero { grid-template-columns: minmax(0, 1fr); row-gap: 22px; } .fq-map { margin: 0 auto; } .fq-rules { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 720px) {
  .fq-map { --map-w: 318; max-width: 420px; }
  .fq-map__crop { aspect-ratio: 318 / 440; }
  .fq-map__svg { width: calc(560 / 318 * 100%); max-width: none; }
  .fq-map__list { position: static; display: grid; gap: 12px; margin-top: 8px !important; pointer-events: auto; }
  .fq-map__it { position: static; max-width: none; transform: none !important; }
  .cx-js .fq-map:not(.is-play) .fq-map__it { transform: none; }
  .fq-map__it a { grid-template-columns: auto 1fr; margin: 0; padding: 4px 0; }
  .fq-map__n { display: grid; }
  .fq-map__q, .fq-map__a { grid-column: 2; }
  .fq-map__lead, .fq-map__halo { display: none; }
  .fq-map__dot circle { r: 9px; }
  .fq-map__dot text { display: inline; }
  .fq-also { margin-top: 16px; }
  .fq-q, .fq-q--text, .fq-q--below { grid-template-columns: 28px minmax(0, 1fr); row-gap: 14px; padding: 18px 0 20px; }
  .fq-q__vis, .fq-q--below .fq-q__vis { grid-column: 1 / -1; }
  .fq-q__q { font-size: 17px; }
  .fq-q__a { font-size: 15.5px; }
  .fq-p6 { overflow-x: auto; justify-content: flex-start; gap: 16px; margin: 0 -20px; padding: 12px 20px; border-radius: 0; border-left: 0; border-right: 0; scrollbar-width: none; }
  .fq-p6::-webkit-scrollbar { display: none; }
  .fq-p6__it { flex: none; }
  .fq-rules { display: flex; overflow-x: auto; gap: 10px; margin: 0 -20px; padding: 2px 20px 6px; scrollbar-width: none; }
  .fq-rules::-webkit-scrollbar { display: none; }
  .fq-rule { flex: none; width: 152px; }
  .fq-gd { grid-template-columns: 72px minmax(0, 1fr) auto; }
  .fq-gd__img { width: 72px; }
  .fq-ask { grid-template-columns: auto minmax(0, 1fr); padding: 20px; }
  .fq-ask__btn { grid-column: 1 / -1; justify-content: center; }
  .fq-ask__mark { width: 52px; height: 52px; }
}

/* полоса телефона на страницах «Чертёж» — вместо общей липкой пилюли сайта */
body.cx-page .sticky-cta { display: none !important; }
.cx-bar { display: none; }
@media (max-width: 1080px) {
  .cx-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: flex; align-items: center; gap: 12px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: rgba(245, 245, 243, .96); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-top: 1px solid var(--c-edge-2); transform: translateY(110%); transition: transform .35s var(--cx-ease); }
  .cx-bar.is-on { transform: none; }
  .cx-bar__t { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--c-t1); }
  .cx-bar__mk { width: 18px; height: 18px; flex: none; }
  .cx-bar .cx-btn { height: 44px; padding: 0 16px; font-size: 15px; }
}

/* живая новость из панели (React, до сборки) — тот же вид статьи */
.cx-spa { --cx-w: min(1136px, 100vw - 64px); --cx-nav: 58px; --cx-ease: cubic-bezier(.22, .61, .36, 1); --cx-spring: cubic-bezier(.2, .9, .28, 1.08); width: var(--cx-w); margin: 0 auto; padding: 90px 0 96px; }
.cx-spa :where(h1, h2, h3, p, ul, ol, figure) { margin: 0; }
.cx-spa .dp__crumbs { margin-bottom: 18px; font-size: 13.5px; color: var(--c-t2); }
.cx-spa .dp__crumbs a { border-bottom: 1px solid var(--c-edge-2); }
.na-head--solo { grid-template-columns: minmax(0, 1fr); }
.na-grid--solo { grid-template-columns: minmax(0, 760px); }
@media (max-width: 720px) { .cx-spa { --cx-w: calc(100vw - 40px); padding-top: 80px; } }