/* Hallmark · ОСНОВА (hallmark-main) = вариант C «Синее поле» + плотные таблицы и каталог из A · база: tokens · theme: custom · vibe: "заводской паспорт, шильдик, сухая точность"
 * paper: oklch(98.6% 0.005 275) · accent: oklch(55.4% 0.185 21) (= красный эмблемы #C83341)
 * brand surface: oklch(35.3% 0.075 275) (= синий эмблемы #303762)
 * display: Fira Sans Condensed 700 · body: Onest 400 · mono: IBM Plex Mono 500
 * axes: light / display-condensed-bold / warm
 * Контраст (WCAG 2.1): ink/paper 17:1 · muted/paper 6.6:1 · on-brand/brand 10.4:1 · paper/accent 5.0:1
 * Запрет: красный текст на синем (2.2:1) — accent на brand-поверхности не используется.
 */
@font-face{font-family:"Onest";src:url(/assets/fonts/onest-cyrillic-400-normal.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";src:url(/assets/fonts/onest-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2122,U+2212}
@font-face{font-family:"Onest";src:url(/assets/fonts/onest-cyrillic-600-normal.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";src:url(/assets/fonts/onest-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2122,U+2212}
@font-face{font-family:"Fira Sans Condensed";src:url(/assets/fonts/fira-sans-condensed-cyrillic-700-normal.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Fira Sans Condensed";src:url(/assets/fonts/fira-sans-condensed-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2122,U+2212}
@font-face{font-family:"IBM Plex Mono";src:url(/assets/fonts/ibm-plex-mono-cyrillic-500-normal.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"IBM Plex Mono";src:url(/assets/fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+20BD,U+2122,U+2212}
:root{
  /* поверхности — холодные, тонированные к синему эмблемы (hue 275) */
  --color-paper:   oklch(98.6% 0.005 275);
  --color-paper-2: oklch(96%   0.010 275);
  --color-paper-3: oklch(93%   0.014 275);
  --color-rule:    oklch(83%   0.016 275);
  --color-rule-2:  oklch(90%   0.010 275);
  --color-field-line: oklch(58% 0.020 275);   /* граница полей ≥ 3:1 */

  /* текст */
  --color-ink:     oklch(21% 0.035 275);
  --color-ink-2:   oklch(33% 0.032 275);   /* аудит З6: бегущий текст плотнее (было 38 %) */
  --color-muted:   oklch(47% 0.022 275);

  /* синий эмблемы — поверхность «шильдика» и подвала, не акцент */
  --color-brand:        oklch(35.3% 0.075 275);
  --color-brand-2:      oklch(29%   0.065 275);
  --color-on-brand:     oklch(97%   0.010 275);
  --color-on-brand-2:   oklch(80%   0.030 275);
  --color-brand-rule:   oklch(46%   0.060 275);

  /* красный эмблемы — только действие */
  --color-accent:       oklch(55.4% 0.185 21);
  --color-accent-press: oklch(49%   0.175 21);
  --color-accent-ink:   oklch(98.6% 0.005 275);
  --color-focus:        oklch(55%   0.200 21);
  --color-focus-on-brand: oklch(88% 0.070 275);

  --color-error:   oklch(47% 0.170 28);
  --color-success: oklch(48% 0.110 155);

  /* шрифты */
  --font-display: "Fira Sans Condensed", "Onest", system-ui, sans-serif;
  --font-body:    "Onest", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, Menlo, monospace;

  /* шкала — 5 размеров на страницу */
  --text-xs:   0.8125rem;  /* подписи данных — не мельче 13 px (аудит З1) */
  --text-sm:   0.875rem;
  --text-base: 1.0625rem;
  --text-lg:   1.25rem;
  --text-2xl:  clamp(1.625rem, 1.2rem + 1.4vw, 2.25rem);
  --text-display: clamp(2.5rem, 1.6rem + 3.6vw, 4.5rem);
  --text-display-s: clamp(2.125rem, 1.5rem + 2.4vw, 3.5rem);  /* заголовок героя длиннее 50 знаков (аудит К1) */

  /* 4-pt шкала */
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 4.5rem;
  --space-4xl: 6rem;

  --rule-hair: 1px;
  --rule-bold: 2px;
  --radius-sm: 2px;
  --radius-md: 4px;

  --page-max: 75rem;
  --page-gutter: clamp(1rem, 4vw, 3rem);
  --control-h: 3rem;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in: cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long: 420ms;
}

/* ════════════════════════════════════════════════════════════════════════════════
   Тема «hallmark» для болванки 30 блоков. Источник — lab/03-directions/hallmark (tokens.css + hallmark.css):
   Workbench · N1b · Ft5 · F3 таблица-спецификация · шильдик результата на синем эмблемы · красный только для действия.
   Исправлено по lab/08-qa/REPORT.md: без overflow-x:clip на html/body; коды, сроки и URL переносятся
   (overflow-wrap:anywhere, без nowrap на данных); меню закрывается после перехода (theme.js).
   ════════════════════════════════════════════════════════════════════════════════ */

/* мост для служебного слоя chrome.css (.sbx, подписи, .need) — он ждёт переменные сайта */
:root{--body:var(--font-body);--mono:var(--font-mono);--ink:var(--color-ink);--ink-2:var(--color-ink-2);--bg:var(--color-paper);--line:var(--color-rule);--soft:var(--color-paper-2)}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:4.5rem}
body{margin:0;background:var(--color-paper);color:var(--color-ink);font:400 var(--text-base)/1.6 var(--font-body);font-kerning:normal;overflow-wrap:break-word}
img{max-width:100%;height:auto;display:block}
a{color:var(--color-ink);text-decoration-color:var(--color-rule);text-underline-offset:0.2em;text-decoration-thickness:1px}
a:hover{text-decoration-color:currentColor}
:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}
.wrap{max-width:var(--page-max);margin-inline:auto;padding-inline:var(--page-gutter)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:var(--space-md);top:var(--space-md);background:var(--color-paper);color:var(--color-ink);padding:var(--space-xs) var(--space-sm);z-index:40}

h1,h2,h3{font-family:var(--font-display);font-weight:700;font-style:normal;line-height:1.05;letter-spacing:-0.01em;margin:0;overflow-wrap:anywhere;min-width:0;text-wrap:balance}
h1{font-size:var(--text-display)}
h2{font-size:var(--text-2xl);margin-bottom:var(--space-lg)}
p{margin:0 0 var(--space-md)}
.muted{color:var(--color-muted)}
.small{font-size:var(--text-sm)}
/* данные (коды регламентов, цены) — моно; переносятся, а не обрезаются (QA: «длинный код наезжает и обрезается») */
.code{font-family:var(--font-mono);font-weight:500;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.lede{font-size:var(--text-lg);line-height:1.5;color:var(--color-ink-2);max-width:52ch;margin:0}
/* ссылки, адреса и длинные строки в тексте не вылезают за экран (QA: «URL в FAQ обрезан») */
p,li,dd,td,th,summary,legend,.need{overflow-wrap:anywhere}

/* ── Кнопки: 8 состояний ─────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);min-height:var(--control-h);padding:0 var(--space-lg);
  border:var(--rule-hair) solid transparent;border-radius:var(--radius-sm);background:var(--color-accent);color:var(--color-accent-ink);
  font:600 var(--text-base)/1.15 var(--font-body);text-align:center;text-decoration:none;cursor:pointer;
  transition:background-color var(--dur-micro) var(--ease-out),transform var(--dur-micro) var(--ease-out),border-color var(--dur-micro) var(--ease-out)}
@media (hover:hover){.btn:hover{background:var(--color-accent-press);color:var(--color-accent-ink)}}
.btn:active{transform:translateY(1px);background:var(--color-accent-press)}
.btn:focus-visible{outline:2px solid var(--color-ink);outline-offset:2px}
.btn:disabled,.btn[aria-disabled="true"]{opacity:0.5;cursor:not-allowed}
.btn--sm{min-height:2.5rem;padding:0 var(--space-md);font-size:var(--text-sm);white-space:nowrap}
/* вторичная — не красная: чернильная рамка (красный остаётся только для главного действия) */
.btn-line{background:transparent;color:var(--color-ink);border-color:var(--color-ink)}
@media (hover:hover){.btn-line:hover{background:var(--color-paper-3);color:var(--color-ink)}}
.btn-line:active{background:var(--color-paper-3)}
.btn-line:disabled{opacity:0.45}
.lead.is-loading .btn[type="submit"]{cursor:progress}
.lead.is-loading .btn[type="submit"]::after{content:"";width:0.9em;height:0.9em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin 700ms linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── N1b: знак + 4 раздела + действие ─────────────── */
.nav{background:var(--color-paper-3);border-top:var(--space-2xs) solid var(--color-brand);position:relative;z-index:15}
.nav__inner{max-width:var(--page-max);margin-inline:auto;padding-inline:var(--page-gutter);min-height:4.5rem;display:flex;align-items:center;gap:var(--space-lg)}
.brand{display:flex;align-items:center;gap:var(--space-sm);text-decoration:none;color:var(--color-ink);flex:0 1 auto;min-width:0}
.brand img{width:2.75rem;height:auto;flex:0 0 auto}
.brand span{font:600 0.8125rem/1.2 var(--font-body);letter-spacing:0.01em}
.nav__center{display:none;gap:var(--space-2xs);margin-inline:auto}
.nav__link{padding:var(--space-xs) var(--space-sm);font-size:var(--text-sm);color:var(--color-ink-2);text-decoration:none;white-space:nowrap;border-radius:var(--radius-sm)}
@media (hover:hover){.nav__link:hover{background:var(--color-paper-2);color:var(--color-ink)}}
.nav__link:active,.nav__sheet a:active{background:var(--color-paper-2)}
.nav__cta{display:none}
.nav__menu{margin-left:auto;position:relative;flex:0 0 auto}
.nav__menu summary{list-style:none;cursor:pointer;min-height:2.75rem;display:flex;align-items:center;padding:0 var(--space-sm);
  border:var(--rule-hair) solid var(--color-field-line);border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:600}
.nav__menu summary::-webkit-details-marker{display:none}
.nav__menu[open] summary{background:var(--color-paper)}
.nav__sheet{position:absolute;right:0;top:calc(100% + var(--space-xs));z-index:25;width:max-content;min-width:15rem;max-width:calc(100vw - 2 * var(--page-gutter));
  background:var(--color-paper);border:var(--rule-hair) solid var(--color-rule);padding:var(--space-xs);display:grid}
.nav__sheet a{padding:var(--space-sm);text-decoration:none}
@media (min-width:40rem){.nav__cta{display:inline-flex}.nav__menu{margin-left:0}}
@media (min-width:62rem){.nav__center{display:flex}.nav__menu{display:none}.nav__cta{margin-left:0}}
@media (min-width:40rem) and (max-width:61.99rem){.nav__cta{margin-left:auto}}
/* аудит К2: на телефоне шапка 56 px вместо 76 — под служебной панелью болванки она съедала первый экран */
@media (max-width:39.99rem){
  .nav{border-top-width:3px}
  .nav__inner{min-height:3.5rem;gap:var(--space-sm)}
  .brand{gap:var(--space-xs)}
  .brand img{width:2rem}
  .brand span{font-size:var(--text-xs);line-height:1.15;letter-spacing:0}
  .nav__menu summary{min-height:2.5rem;padding:0 var(--space-sm)}
}

/* ── Ритм блоков болванки ─────────────────────────── */
main.wrap{padding-bottom:var(--space-2xl)}
main .blk{margin-block:var(--space-3xl)}
main .blk:first-of-type{margin-top:var(--space-2xl)}
main .blk h2 + .sub{margin-top:calc(-1 * var(--space-sm));margin-bottom:var(--space-lg);max-width:65ch}
.libh{font-size:var(--text-2xl);margin:var(--space-2xl) 0 var(--space-sm)}
.libh + .lede{max-width:65ch}
@media (max-width:39.99rem){
  main .blk{margin-block:var(--space-2xl) var(--space-3xl)}
  .libh{margin-top:var(--space-lg)}
  .libh + .lede{font-size:var(--text-base)}
}

/* ── Первый экран (B01–B03) = Workbench-bench ─────── */
.hero{display:grid;gap:var(--space-lg);padding-block:var(--space-md) 0}
.hero h1{max-width:20ch}
#B01 .hero h1{font-size:var(--text-display-s);max-width:none}
.hero .row{display:flex;flex-wrap:wrap;gap:var(--space-sm)}
.facts{display:flex;flex-wrap:wrap;gap:var(--space-xs) var(--space-xl);margin:0;padding:var(--space-md) 0 0;list-style:none;font-size:var(--text-sm);color:var(--color-ink-2);border-top:var(--rule-hair) solid var(--color-rule)}
@media (min-width:60rem){
  .hero{grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--space-2xl);align-items:end}
  .hero h1{grid-column:1;max-width:none}
  .hero .lede{grid-column:2}
  .hero > :not(h1):not(.lede){grid-column:1 / -1}
  /* аудит К1: длинные заголовки B01 и B02 — во всю ширину (2 строки вместо 5 и 3); у B01 кнопки и лид — строкой ниже, 7/5 */
  #B01 .hero h1,#B02 .hero h1{grid-column:1 / -1;max-width:none}
  #B02 .hero .lede{grid-column:1;max-width:60ch}
  #B01 .hero .lede{grid-row:2}
  #B01 .hero .row{grid-column:1;grid-row:2;align-self:end}
}

/* Подбор (B02): инструмент + шильдик результата на синем эмблемы */
.plate{border-top:var(--space-2xs) solid var(--color-brand);background:var(--color-paper-2);padding:var(--space-lg) var(--space-lg) 0;margin-top:var(--space-sm)}
.plate > label{display:block;font-weight:600;margin-bottom:var(--space-xs)}
.plate-row{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-xs)}
@media (min-width:40rem){.plate-row{grid-template-columns:minmax(0,1fr) auto}}
.plate input,.lead input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),.lead textarea,.subscribe input{
  width:100%;min-height:var(--control-h);padding:0 var(--space-md);border:var(--rule-hair) solid var(--color-field-line);border-radius:var(--radius-sm);
  background:var(--color-paper);color:var(--color-ink);font:400 var(--text-base)/1.3 var(--font-body);outline:2px solid transparent;outline-offset:1px}
.plate input{min-height:3.5rem;font-size:var(--text-lg)}
.lead textarea{padding-block:var(--space-sm);resize:vertical;min-height:7rem}
.plate input::placeholder,.lead input::placeholder,.lead textarea::placeholder,.subscribe input::placeholder{color:var(--color-muted)}
.plate input:focus,.lead input:focus,.lead textarea:focus,.subscribe input:focus{outline:2px solid var(--color-focus);outline-offset:1px;border-color:var(--color-ink-2)}
.plate input:disabled,.lead input:disabled,.subscribe input:disabled{opacity:0.55;cursor:not-allowed}
.plate-row .btn{min-height:3.5rem;padding-inline:var(--space-xl)}
.hints{margin:var(--space-sm) 0 0;font-size:var(--text-sm);color:var(--color-muted);display:flex;flex-wrap:wrap;gap:var(--space-2xs) var(--space-sm);align-items:baseline}
.hints button{background:none;border:0;padding:var(--space-2xs) 0;font:inherit;color:var(--color-ink);cursor:pointer;text-decoration:underline dotted;text-underline-offset:0.25em;white-space:nowrap}
@media (hover:hover){.hints button:hover{color:var(--color-accent-press)}}
.hints button:active{color:var(--color-accent-press)}
/* dl из пар dt/dd без обёрток: на широком экране — 4 ячейки шильдика (поток по колонкам), на узком — пары столбиком */
.plate-out{margin:var(--space-lg) calc(-1 * var(--space-lg)) 0;display:grid;grid-template-columns:minmax(0,1fr);background:var(--color-brand);color:var(--color-on-brand)}
.plate-out dt,.plate-out dd{padding-inline:var(--space-lg)}
.plate-out dt{font:500 var(--text-xs)/1 var(--font-mono);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-on-brand-2);padding-top:var(--space-md);padding-bottom:var(--space-xs);border-top:var(--rule-hair) solid var(--color-brand-rule)}
.plate-out dt:first-child{border-top:0}
.plate-out dd{margin:0;padding-bottom:var(--space-md);font-size:var(--text-base);line-height:1.35;min-height:1.35em}
.plate-out dd.code{font-size:var(--text-lg)}
@media (min-width:48rem){
  .plate-out{grid-template-columns:minmax(0,1.1fr) minmax(0,1.6fr) minmax(0,0.8fr) minmax(0,0.8fr);grid-template-rows:auto 1fr;grid-auto-flow:column}
  .plate-out dt{border-top:0}
  .plate-out dd{min-height:5rem}
  .plate-out dt:not(:first-child),.plate-out dd:not(:nth-child(2)){border-left:var(--rule-hair) solid var(--color-brand-rule)}
}
[data-plate]:not(.has-result) .plate-out dd{color:var(--color-on-brand-2)}
.is-new .plate-out dd{animation:fade var(--dur-long) var(--ease-out)}
@keyframes fade{from{opacity:0}to{opacity:1}}

/* ── B04 полоса «стоимость / срок» — строка спецификации под жирной линейкой ─ */
.pbar{display:grid;grid-template-columns:minmax(0,1fr);border-top:var(--rule-bold) solid var(--color-ink);margin-bottom:var(--space-md)}
.pbar > div{display:flex;flex-direction:column;gap:var(--space-2xs);padding:var(--space-md) 0;border-bottom:var(--rule-hair) solid var(--color-rule);min-width:0}
.pbar b{font:700 var(--text-2xl)/1.1 var(--font-display)}
.pbar b.code{font-variant-numeric:tabular-nums}
.pbar .muted{font-size:var(--text-sm)}
.k{font:500 var(--text-xs)/1.2 var(--font-mono);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-muted)}
@media (min-width:40rem){.pbar{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--space-xl)}}
@media (min-width:62rem){
  .pbar{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:0}
  .pbar > div{padding-inline:var(--space-lg);border-bottom:0;border-left:var(--rule-hair) solid var(--color-rule)}
  .pbar > div:first-child{padding-left:0;border-left:0}
}

/* ── Строки-ссылки вместо карточек (язык «.routes» прототипа): B05, B08, B09, B22 ─ */
.svcs,.kinds,.grid,.kb{display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--space-2xl);border-bottom:var(--rule-hair) solid var(--color-rule)}
@media (min-width:56rem){.svcs,.kinds,.grid,.kb{grid-template-columns:repeat(2,minmax(0,1fr))}}
.svc,.kind,.card,.kb a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-2xs) var(--space-md);align-items:baseline;padding:var(--space-md) var(--space-xs);
  border-top:var(--rule-hair) solid var(--color-rule);text-decoration:none;color:var(--color-ink);align-content:start;transition:background-color var(--dur-short) var(--ease-out)}
.svc > *,.kind > *,.card > *,.kb a > *{grid-column:1;min-width:0}
.svc b,.kind b,.card b,.kb a b{font:700 var(--text-lg)/1.2 var(--font-display)}
.svc .muted,.kind .muted,.card span,.kb a .muted{font-size:var(--text-sm);color:var(--color-muted)}
.svc .code,.kind .code{font-size:var(--text-sm);color:var(--color-ink-2)}
/* цена в строке услуги — в правой колонке, как в таблице цен */
.svc .pr{grid-column:2;grid-row:1 / span 3;align-self:center;text-align:right;font:600 var(--text-base)/1.3 var(--font-body);font-variant-numeric:tabular-nums;color:var(--color-ink);white-space:nowrap}
.card::after,.kb a::after,.kind::after{content:"→";grid-column:2;grid-row:1;color:var(--color-muted);transition:transform var(--dur-short) var(--ease-out)}
.kind .code{order:-1}
@media (hover:hover){
  .svc:hover,.kind:hover,.card:hover,.kb a:hover{background:var(--color-paper-2)}
  .card:hover::after,.kb a:hover::after,.kind:hover::after{transform:translateX(3px);color:var(--color-ink)}
}
.svc:active,.kind:active,.card:active,.kb a:active{background:var(--color-paper-3)}
.svc:focus-visible,.kind:focus-visible,.card:focus-visible,.kb a:focus-visible{outline-offset:-2px}

/* ── B06 матрица — F3 таблица-спецификация ─────────── */
.tw{overflow-x:auto}
.mx{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.mx th{font:500 var(--text-xs)/1.2 var(--font-mono);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-muted);text-align:left;padding:0 var(--space-sm) var(--space-sm);border-bottom:var(--rule-bold) solid var(--color-ink)}
.mx th:nth-child(n+3),.mx td.num{text-align:right}
.mx td{padding:var(--space-md) var(--space-sm);border-bottom:var(--rule-hair) solid var(--color-rule);vertical-align:baseline}
.mx td.code{color:var(--color-ink-2);font-size:0.95em;min-width:9ch}
.mx td.num{font-weight:600}
.mx td small{display:block;font:400 var(--text-sm)/1.4 var(--font-body);color:var(--color-muted)}
@media (hover:hover){.mx tbody tr:hover{background:var(--color-paper-2)}}
/* < 640 px: строки «код / название / декларация | сертификат»; подписи колонок — из шапки таблицы */
@media (max-width:39.99rem){
  .mx thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .mx,.mx tbody{display:block}
  .mx tbody{border-top:var(--rule-bold) solid var(--color-ink)}
  .mx tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-2xs) var(--space-md);padding:var(--space-md) 0;border-bottom:var(--rule-hair) solid var(--color-rule)}
  .mx td{padding:0;border:0;min-width:0}
  .mx td.code,.mx td:nth-child(2){grid-column:1 / -1}
  .mx td:nth-child(2){font-weight:600;margin-bottom:var(--space-xs)}
  .mx td.num{text-align:left}
  .mx td.num::before{display:block;font:500 var(--text-xs)/1.4 var(--font-mono);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-muted)}
  .mx td:nth-child(3)::before{content:"Декларация"}
  .mx td:nth-child(4)::before{content:"Сертификат"}
}

/* ── B07 лестница документов — три колонки-«вердикта» ─ */
.tiers{display:grid;grid-template-columns:minmax(0,1fr);border-top:var(--rule-bold) solid var(--color-ink)}
.tier{display:flex;flex-direction:column;gap:var(--space-2xs);padding:var(--space-lg) 0;border-bottom:var(--rule-hair) solid var(--color-rule);min-width:0}
.tier b{font:700 var(--text-2xl)/1.1 var(--font-display);font-variant-numeric:tabular-nums}
.tier .muted{font-size:var(--text-sm)}
.tier p{margin:var(--space-sm) 0 0;color:var(--color-ink-2)}
@media (min-width:56rem){
  .tiers{grid-template-columns:repeat(3,minmax(0,1fr))}
  .tier{padding-inline:var(--space-lg);border-bottom:0;border-left:var(--rule-hair) solid var(--color-rule)}
  .tier:first-child{padding-left:0;border-left:0}
}

/* ── B10 этапы, B21 лестница «что дальше» — счётчики шрифтом заголовков ─ */
.steps,.ladder{list-style:none;margin:0;padding:0;counter-reset:s;display:grid;grid-template-columns:minmax(0,1fr);border-top:var(--rule-bold) solid var(--color-ink)}
.steps li,.ladder li{counter-increment:s;display:grid;grid-template-columns:2rem minmax(0,1fr);column-gap:var(--space-sm);row-gap:var(--space-2xs);padding:var(--space-md) 0;border-bottom:var(--rule-hair) solid var(--color-rule);align-content:start}
.steps li::before,.ladder li::before{content:counter(s);grid-row:1 / span 2;font:700 var(--text-lg)/1.3 var(--font-display);color:var(--color-muted)}
.steps b,.ladder b{font-weight:600;line-height:1.3}
.steps span,.ladder span{color:var(--color-ink-2);font-size:var(--text-sm)}
@media (min-width:56rem){
  .steps{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ladder{grid-template-columns:repeat(5,minmax(0,1fr))}
  .steps li,.ladder li{grid-template-columns:minmax(0,1fr);padding:var(--space-md) var(--space-lg) var(--space-md) 0;border-bottom:0}
  .steps li + li,.ladder li + li{padding-left:var(--space-lg);border-left:var(--rule-hair) solid var(--color-rule)}
  .steps li::before,.ladder li::before{grid-row:auto;font-size:var(--text-2xl);line-height:1;margin-bottom:var(--space-xs)}
  .ladder li:not(:last-child)::before{content:counter(s) " →"}
}

/* ── B11 схема в iframe ─ аудит К3: без волосяной рамки, под жирной линейкой как таблицы темы;
   бумагу схемы theme.js после загрузки заменяет на бумагу темы (тот же origin, файл схемы не меняется) ─ */
.tw:has(> .diag){border-top:var(--rule-bold) solid var(--color-ink);background:var(--color-paper)}
.diag{width:100%;min-width:60rem;height:700px;border:0;display:block;background:var(--color-paper)}
/* аудит З7: на узком экране схема шире окна — говорим об этом, а не обрезаем молча */
@media (max-width:61.99rem){
  .tw:has(> .diag)::before{content:"Схема шире экрана — листайте вбок →";display:block;position:sticky;left:0;width:max-content;max-width:calc(100vw - 2 * var(--page-gutter));
    padding:var(--space-xs) 0;font-size:var(--text-sm);color:var(--color-muted)}
}

/* ── B12 квиз: вопросы-строки, ответ — шильдик на синем эмблемы ─ */
.quiz{display:grid;grid-template-columns:minmax(0,1fr);border-top:var(--rule-bold) solid var(--color-ink)}
.quiz fieldset{margin:0;padding:var(--space-md) 0;border:0;border-bottom:var(--rule-hair) solid var(--color-rule);display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-xs) var(--space-md);min-width:0}
.quiz legend{float:left;padding:0;margin-right:auto;font-weight:600;max-width:100%}
.quiz label{display:inline-flex;align-items:center;gap:var(--space-xs);min-height:2.75rem;padding:0 var(--space-md);border:var(--rule-hair) solid var(--color-field-line);border-radius:var(--radius-sm);cursor:pointer;font-size:var(--text-sm);background:var(--color-paper)}
.quiz label:has(input:checked){border-color:var(--color-ink);box-shadow:inset 0 0 0 1px var(--color-ink);font-weight:600}
@media (hover:hover){.quiz label:hover{background:var(--color-paper-2)}}
@media (max-width:39.99rem){.quiz legend{flex:1 1 100%;margin-right:0}}
.quiz input{accent-color:var(--color-accent);width:1rem;height:1rem;margin:0}
.quiz-out{background:var(--color-brand);color:var(--color-on-brand);padding:var(--space-md) var(--space-lg);margin-top:var(--space-lg)}
.quiz-out b{display:block;font:700 var(--text-lg)/1.25 var(--font-display)}
.quiz-out p{margin:var(--space-2xs) 0 0}
.quiz-out .muted{color:var(--color-on-brand-2)}
.quiz-out p:empty{display:none}
@media (min-width:56rem){
  .quiz{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--space-2xl)}
  .quiz-out{grid-column:1 / -1}
}
.quiz + .small{margin-top:var(--space-md)}

/* ── Формы заявки (B13, B27) — бланк прототипа ─ */
.lead{background:var(--color-paper-2);padding:var(--space-lg);display:grid;gap:var(--space-md);max-width:40rem}
.lead,.lead .field{grid-template-columns:minmax(0,1fr)}
.lead .field{display:grid;gap:var(--space-2xs);min-width:0}
.lead .field > label{font-weight:600;font-size:var(--text-sm)}
.lead .field .small{font-size:var(--text-sm)}
.lead input[type="file"]{width:100%;min-width:0;font:400 var(--text-sm) var(--font-body);color:var(--color-muted);max-width:100%}
/* согласие: текст и ссылка — одна строка с переносом, галочка слева (не flex: иначе «на» и ссылка расходятся в колонки) */
.lead label.small{display:block;position:relative;padding-left:1.75rem;font-size:var(--text-sm);line-height:1.5;color:var(--color-ink-2);font-weight:400;cursor:pointer}
.lead label.small input{position:absolute;left:0;top:0.1rem;accent-color:var(--color-accent);width:1.125rem;height:1.125rem;margin:0}
.lead .btn{width:100%}
.form-msg{min-height:1lh;margin:0;font-size:var(--text-sm)}
.lead.is-err .form-msg{color:var(--color-error)}
.lead.is-err .form-msg::before{content:"⚠ "}
.lead.is-ok .form-msg{color:var(--color-success)}
.lead.is-ok .form-msg::before{content:"✓ "}
@media (min-width:40rem){.lead .btn{width:auto;justify-self:start}}
/* аудит З3: B13 — заголовок и пояснение слева, бланк справа (как B27), а не бланк 40rem с пустой половиной */
@media (min-width:60rem){
  .blk:has(> .lead){display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-rows:auto 1fr;column-gap:var(--space-2xl)}
  .blk:has(> .lead) > h2,.blk:has(> .lead) > .sub{grid-column:1}
  .blk:has(> .lead) > .sub{align-self:start}
  .blk:has(> .lead) > .lead{grid-column:2;grid-row:1 / span 2;max-width:none}
  .blk:has(> .lead) > .lead .btn{width:100%}
  .blk:has(> .lead) > .need{grid-column:1 / -1}
}
/* B27: заголовок слева, бланк справа (как посадочная прототипа) */
.cta2{display:grid;gap:var(--space-lg);border-top:var(--space-2xs) solid var(--color-brand);padding-top:var(--space-xl)}
.cta2 h2{margin:0;max-width:24ch}
.cta2 > p{margin:0}
@media (min-width:60rem){
  .cta2{grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-rows:auto 1fr;column-gap:var(--space-2xl)}
  .cta2 h2{grid-column:1;grid-row:1}
  .cta2 > p{grid-column:1;grid-row:2;align-self:start}
  .cta2 .lead{grid-column:2;grid-row:1 / span 2;max-width:none}
  .cta2 .lead .btn{width:100%}
}

/* ── B14 проверка до оплаты, B16 договор — «.checks» прототипа ─ */
.chks{display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--space-xl);border-top:var(--rule-bold) solid var(--color-ink)}
.chk{display:flex;flex-direction:column;gap:var(--space-2xs);padding:var(--space-md) 0;border-bottom:var(--rule-hair) solid var(--color-rule);min-width:0}
.chk b{font-weight:600}
.chk span{color:var(--color-ink-2)}
@media (min-width:48rem){.chks{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ticks{list-style:none;margin:0;padding:0;border-top:var(--rule-bold) solid var(--color-ink);max-width:52rem}
.ticks li{display:grid;grid-template-columns:1.5rem minmax(0,1fr);gap:var(--space-xs);padding:var(--space-sm) 0;border-bottom:var(--rule-hair) solid var(--color-rule)}
.ticks li::before{content:"✓";font-weight:600;color:var(--color-ink-2)}
.ticks li > .need{grid-column:2;justify-self:start}
/* аудит З3: списки на всю ширину сетки, а не 52rem с пустой правой половиной */
@media (min-width:56rem){.ticks{max-width:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--space-2xl)}}

/* ── Заглушки «нужны данные» (B15, B17, B18, B19, B24, B29, B30) — пунктир, без выдуманного содержания ─ */
.ph{border:var(--rule-hair) dashed var(--color-field-line);padding:var(--space-md) var(--space-lg)}
.ph-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-xs) var(--space-md);padding:var(--space-sm) 0;border-top:var(--rule-hair) solid var(--color-rule);color:var(--color-ink-2)}
.ph-row .code{color:var(--color-muted)}
.files{display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--space-xl);border-top:var(--rule-bold) solid var(--color-ink)}
@media (min-width:48rem){.files{grid-template-columns:repeat(3,minmax(0,1fr))}}
.file{display:flex;align-items:baseline;gap:var(--space-sm);padding:var(--space-sm) 0;border-bottom:var(--rule-hair) solid var(--color-rule);color:var(--color-ink-2)}
.file::before{content:"PDF";font:500 var(--text-xs)/1 var(--font-mono);letter-spacing:0.06em;color:var(--color-muted);border:var(--rule-hair) solid var(--color-rule);padding:var(--space-2xs) var(--space-xs);border-radius:var(--radius-sm);flex:0 0 auto}
.expert{display:flex;gap:var(--space-lg);align-items:center;flex-wrap:wrap}
.expert > div:last-child{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-2xs);min-width:0;flex:1 1 14rem}
.expert b{font:700 var(--text-lg)/1.2 var(--font-display)}
.ava{width:5.5rem;aspect-ratio:1;border:var(--rule-hair) dashed var(--color-field-line);background:var(--color-paper-2);border-radius:var(--radius-sm);flex:0 0 auto}
.revs{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}
.rev{border-left:var(--rule-bold) solid var(--color-rule);padding:var(--space-2xs) 0 var(--space-2xs) var(--space-lg)}
.rev p{margin:0 0 var(--space-xs);font:700 var(--text-lg)/1.3 var(--font-display);color:var(--color-ink-2)}
.rev .muted{font-size:var(--text-sm)}
@media (min-width:48rem){.revs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.stats{display:grid;grid-template-columns:minmax(0,1fr);border-top:var(--rule-bold) solid var(--color-ink)}
.stats > div{display:flex;flex-direction:column;padding:var(--space-md) 0;border-bottom:var(--rule-hair) solid var(--color-rule)}
.stats b{font:700 var(--text-display)/1 var(--font-display);color:var(--color-muted)}
@media (min-width:48rem){
  .stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .stats > div{padding-inline:var(--space-lg);border-bottom:0;border-left:var(--rule-hair) solid var(--color-rule)}
  .stats > div:first-child{padding-left:0;border-left:0}
}
.logos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-sm)}
.logos span{height:3.5rem;border:var(--rule-hair) dashed var(--color-field-line);background:var(--color-paper-2);border-radius:var(--radius-sm)}
@media (min-width:40rem){.logos{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:62rem){.logos{grid-template-columns:repeat(6,minmax(0,1fr))}}
.subscribe{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-xs);max-width:34rem}
@media (min-width:40rem){.subscribe{grid-template-columns:minmax(0,1fr) auto}}

/* ── B20 типовые задачи — статьи под жирной линейкой ─ */
.cases{display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--space-2xl);border-top:var(--rule-bold) solid var(--color-ink)}
.case{display:flex;flex-direction:column;gap:var(--space-xs);padding:var(--space-lg) 0;border-bottom:var(--rule-hair) solid var(--color-rule);min-width:0}
.case b{font:700 var(--text-lg)/1.2 var(--font-display)}
.case p{margin:0;color:var(--color-ink-2);max-width:60ch}
.case a{align-self:flex-start;font-weight:600;font-size:var(--text-sm);text-decoration-color:var(--color-ink)}
.case a::after{content:" →"}
@media (min-width:56rem){.cases{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ── B23 «важно сейчас» — дата как бирка-шильдик ─ */
.alert{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-md);background:var(--color-paper-3);padding:var(--space-lg);border-left:var(--space-2xs) solid var(--color-brand)}
.alert b{font:700 var(--text-lg)/1.2 var(--font-display)}
.alert p{margin:var(--space-xs) 0 0;color:var(--color-ink-2);max-width:65ch}
.date{justify-self:start;align-self:start;font:500 var(--text-sm)/1.2 var(--font-mono);letter-spacing:0.04em;background:var(--color-brand);color:var(--color-on-brand);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);white-space:nowrap}
@media (min-width:48rem){.alert{grid-template-columns:auto minmax(0,1fr);gap:var(--space-lg)}}

/* ── B25 метка эксперта ─ */
.stamp{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--space-xs);margin:0;padding:var(--space-sm) 0;border-block:var(--rule-hair) solid var(--color-rule);font:500 var(--text-sm)/1.4 var(--font-mono);color:var(--color-muted)}
.stamp .need{margin:0}

/* ── B26 частые вопросы — «.faq» прототипа (details прямо в блоке) ─ */
.blk > details{border-bottom:var(--rule-hair) solid var(--color-rule);max-width:52rem}
.blk > h2 + details{border-top:var(--rule-bold) solid var(--color-ink)}
.blk > details summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-md);padding:var(--space-md) 0;font-weight:600}
.blk > details summary::-webkit-details-marker{display:none}
.blk > details summary::after{content:"+";font:400 var(--text-lg)/1 var(--font-body);color:var(--color-muted)}
.blk > details[open] summary::after{content:"−"}
@media (hover:hover){.blk > details summary:hover{color:var(--color-ink-2)}}
.blk > details p{margin:0;padding:0 0 var(--space-md);color:var(--color-ink-2);max-width:65ch}

/* ── B28 реквизиты ─ */
.req{display:flex;flex-direction:column;gap:var(--space-2xs);border-top:var(--rule-bold) solid var(--color-ink);padding-top:var(--space-md);color:var(--color-ink-2)}
.req b{font:700 var(--text-lg)/1.2 var(--font-display);color:var(--color-ink)}
.req span:first-of-type{font-family:var(--font-mono);font-weight:500;font-size:var(--text-sm);font-variant-numeric:tabular-nums}

/* ── Ft5 Statement ───────────────────────────────── */
.foot{background:var(--color-brand-2);color:var(--color-on-brand);margin-top:var(--space-3xl)}
.foot a{color:var(--color-on-brand);text-decoration-color:var(--color-brand-rule);white-space:nowrap}
.foot :focus-visible{outline-color:var(--color-focus-on-brand)}
.foot__in{padding-block:var(--space-3xl) var(--space-xl);display:grid;gap:var(--space-2xl)}
.foot__line{font:700 var(--text-2xl)/1.15 var(--font-display);max-width:40ch;margin:0;color:var(--color-on-brand);text-wrap:balance}
.foot__meta{display:grid;gap:var(--space-lg);padding-top:var(--space-lg);border-top:var(--rule-hair) solid var(--color-brand-rule);font-size:var(--text-sm);color:var(--color-on-brand-2)}
.foot__brand{display:flex;align-items:center;gap:var(--space-sm);color:var(--color-on-brand);font-weight:600;line-height:1.25}
.foot__brand img{width:2.75rem;flex:0 0 auto}
.foot__req{margin:0}
@media (min-width:56rem){.foot__meta{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--space-2xl)}.foot__req{text-align:right}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:1ms!important;animation-duration:150ms!important}
  .lead.is-loading .btn[type="submit"]::after{animation:none}
  .btn:active{transform:none}
  .card:hover::after,.kb a:hover::after,.kind:hover::after{transform:none}
}

/* ════════════════════════════════════════════════════════════════════════════════
   ВАРИАНТ C · «Синее поле» — смелее бренд: синие поля секций во всю ширину, эмблема крупнее.
   База — тема hallmark целиком (выше, без изменений); ниже — только то, что отличает вариант.
   Синие поля сделаны переопределением токенов внутри секции: те же компоненты, другая поверхность.
   Красный на синем не используется (2.2:1) — главная кнопка на синем поле белая с синим текстом.
   ════════════════════════════════════════════════════════════════════════════════ */
:root{
  --color-band-field-line: oklch(72% 0.040 275);
  --color-band-press:      oklch(90% 0.025 275);
  --color-edge:            oklch(55.4% 0.185 21);  /* красная кромка шапки и подвала (= акцент; отдельно, т. к. в синих зонах акцент переопределён) */
}
/* шапка — синяя, эмблема (вариант для тёмного фона, /assets/napb-emblem-inverse.svg) 64 px */
.nav{background:var(--color-brand-2);border-top:0;border-bottom:var(--space-2xs) solid var(--color-edge)}
.nav__inner{min-height:5.5rem}
.brand,.nav__link{color:var(--color-on-brand)}
.brand img{width:4rem}
.brand span{font-size:var(--text-sm)}
@media (hover:hover){.nav__link:hover{background:var(--color-brand);color:var(--color-on-brand)}}
.nav__link:active{background:var(--color-brand)}
.nav :focus-visible{outline-color:var(--color-focus-on-brand)}
.nav__menu summary{color:var(--color-on-brand);border-color:var(--color-band-field-line)}
.nav__menu[open] summary{background:var(--color-brand)}
@media (max-width:39.99rem){
  .nav__inner{min-height:3.75rem}
  .brand img{width:2.75rem}
  .brand span{font-size:var(--text-xs)}
}
/* заголовки секций — синим эмблемы, жирные линейки — синие и толще */
h2{color:var(--color-brand)}
.pbar,.tiers,.chks,.ticks,.files,.cases,.quiz,.mx th,.blk > h2 + details,.req,.steps,.ladder{border-top-color:var(--color-brand)}
.pbar,.tiers,.chks,.ticks,.files,.cases,.quiz,.blk > h2 + details,.req{border-top-width:3px}
.mx th{border-bottom-color:var(--color-brand);border-bottom-width:3px}

/* синие поля: B01 (первый экран), B10 (этапы), B21 (что дальше), B27 (финальная заявка) */
#B01,#B10,#B21,#B27{
  --color-ink: var(--color-on-brand);
  --color-ink-2: var(--color-on-brand);
  --color-muted: var(--color-on-brand-2);
  --color-rule: var(--color-brand-rule);
  --color-paper-2: var(--color-brand-2);
  --color-field-line: var(--color-band-field-line);
  --color-accent: var(--color-on-brand);
  --color-accent-press: var(--color-band-press);
  --color-accent-ink: var(--color-brand);
  --color-focus: var(--color-focus-on-brand);
  background:var(--color-brand);color:var(--color-ink);
  /* поле во всю ширину окна: border-image с выносом по горизонтали — не создаёт прокрутки и не режет подпись блока сверху */
  border-image:linear-gradient(var(--color-brand),var(--color-brand)) fill 0 / 0 / 0 100vmax;
  padding-block:var(--space-3xl)}
#B01 h2,#B10 h2,#B21 h2,#B27 h2{color:var(--color-on-brand)}
#B01 .btn:focus-visible,#B27 .btn:focus-visible{outline-color:var(--color-focus-on-brand)}
#B01 .btn-line{border-color:var(--color-on-brand);color:var(--color-on-brand)}
@media (hover:hover){#B01 .btn-line:hover{background:var(--color-brand-2);color:var(--color-on-brand)}}
#B01 a:not(.btn),#B21 a:not(.btn){color:var(--color-on-brand)}
.steps,.ladder{border-top-color:var(--color-on-brand)}
#B10 .steps li::before,#B21 .ladder li::before{color:var(--color-on-brand)}
/* первый блок после шапки — без зазора, поле продолжает шапку */
main .blk#B01:first-of-type{margin-top:var(--space-3xl)}
/* крупной эмблемы на первом экране нет (решение владельца 28.10): эмблема только в шапке рядом с полным названием.
   Первый экран — одна колонка: заголовок во всю ширину, под ним лид (до 60 знаков), кнопки, факты.
   Правая часть остаётся свободной под будущий визуал или форму захвата (проработка первого экрана — отдельно). */
@media (min-width:60rem){
  #B01 .hero .lede,#B01 .hero .row{grid-column:1 / -1;grid-row:auto;max-width:60ch}
  #B01 .hero .row{align-self:start}
}
/* бланк заявки на синем поле — светлый лист (токены бумаги возвращаются внутри бланка) */
#B27 .lead{
  --color-ink: oklch(21% 0.035 275);
  --color-ink-2: oklch(33% 0.032 275);
  --color-muted: oklch(47% 0.022 275);
  --color-rule: oklch(83% 0.016 275);
  --color-paper-2: oklch(96% 0.010 275);
  --color-field-line: oklch(58% 0.020 275);
  --color-accent: oklch(55.4% 0.185 21);
  --color-accent-press: oklch(49% 0.175 21);
  --color-accent-ink: oklch(98.6% 0.005 275);
  --color-focus: oklch(55% 0.200 21);
  --color-error: oklch(47% 0.170 28);
  --color-success: oklch(48% 0.110 155);
  background:var(--color-paper-2);color:var(--color-ink)}
#B27 .lead .btn:focus-visible{outline-color:var(--color-ink)}
#B27 .cta2{border-top-color:var(--color-on-brand)}
/* подвал продолжает синий — отделён красной кромкой, как шапка */
.foot{border-top:var(--space-2xs) solid var(--color-edge)}
/* главная кнопка в синей шапке — тоже белая (красный на синем не используется) */
.nav{--color-accent:var(--color-on-brand);--color-accent-press:var(--color-band-press);--color-accent-ink:var(--color-brand-2)}
.nav .btn:focus-visible{outline-color:var(--color-focus-on-brand)}

/* ════════════════════════════════════════════════════════════════════════════════
   ОСНОВА · плотность из варианта A «Пульт» — только таблицы, каталог, матрицы и списки.
   Шкала шрифта, шапка, первый экран и ритм между блоками остаются от C.
   ════════════════════════════════════════════════════════════════════════════════ */
/* каталог услуг B05, виды оборудования B09, карточки и справочник — строки ниже, три колонки от 75rem */
.svc,.kind,.card,.kb a{padding:var(--space-sm) var(--space-xs)}
.svc b,.kind b,.card b,.kb a b{font-size:var(--text-base)}
@media (min-width:75rem){.svcs,.kinds,.grid,.kb{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--space-xl)}}
/* таблица цен B06 и матрицы: плотные строки, зебра для чтения по строке, срок в одной строке с ценой */
.mx td{padding:var(--space-xs) var(--space-sm)}
.mx tbody tr:nth-child(even){background:var(--color-paper-2)}
.mx td small{display:inline;margin-left:var(--space-xs)}
@media (max-width:39.99rem){.mx td small{display:block;margin-left:0}}
/* шильдик подбора — ячейки ниже, код регламента крупнее */
.plate{padding:var(--space-md) var(--space-md) 0}
.plate-out{margin-inline:calc(-1 * var(--space-md))}
.plate-out dt,.plate-out dd{padding-inline:var(--space-md)}
@media (min-width:48rem){.plate-out dd{min-height:3.5rem}}
.plate-out dd.code{font-size:var(--text-2xl);line-height:1.1}
/* полоса цен, лестница, этапы — компактнее */
.pbar > div,.tier{padding-block:var(--space-sm)}
.steps li,.ladder li{padding-block:var(--space-sm)}
/* проверка до оплаты и типовые задачи — 4 колонки на широком */
@media (min-width:75rem){.chks{grid-template-columns:repeat(4,minmax(0,1fr))}}
.chk{padding-block:var(--space-sm)}
@media (min-width:75rem){.cases{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--space-xl)}}
.case{padding-block:var(--space-md)}
/* квиз и FAQ — строки ниже */
.quiz fieldset{padding-block:var(--space-xs)}
.quiz label{min-height:2.5rem}
.blk > details summary{padding-block:var(--space-sm)}

/* ════════════════════════════════════════════════════════════════════════════════
   ОСНОВА · главная кнопка — вариант 1 со страницы выбора (sandbox/buttons.html):
   красный эмблемы #C83341, белый текст 5,24:1. На синем красный сливается (2,17:1 на #303762, 2,89:1 на #1E2346),
   поэтому на синих полях и в шапке — белое кольцо 2 px (кольцо/фон 11,4:1). Форма «ступенька»: тёмная полоса снизу,
   стрелка справа, подъём на 1 px при наведении, вдавливание при нажатии.
   Токены --btn-* переопределяются по зонам; страница выбора меняет только их.
   ════════════════════════════════════════════════════════════════════════════════ */
:root{
  --btn-bg:#C83341; --btn-bg-hover:#B32B38; --btn-ink:#FFFFFF; --btn-step:#9E2531;
  --btn-ring-w:1px;  /* толщина белого кольца — по просьбе владельца тоньше (было 2 px) */
  --btn-ring:transparent;  /* кольцо снаружи: белое на синем у красной; тёмное на белом у светлых цветов (страница выбора) */
  --btn-radius:var(--radius-md);
  --btn-drop:oklch(21% 0.035 275 / 0.28);
  --btn-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h10.5M8.5 3.5 13 8l-4.5 4.5' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E");
  --dur-btn:160ms;
}
/* синие поля и синяя шапка — красная кнопка с белым кольцом */
#B01,#B10,#B21,#B27,.nav{--btn-ring:#FFFFFF;--btn-drop:oklch(12% 0.03 275 / 0.45)}
/* светлый бланк на синем поле B27 — снова бумага, кольцо не нужно */
#B27 .lead{--btn-ring:transparent;--btn-drop:oklch(21% 0.035 275 / 0.28)}

.btn:not(.btn-line){position:relative;background:var(--btn-bg);color:var(--btn-ink);border-color:transparent;border-radius:var(--btn-radius);
  padding-inline:var(--space-lg) calc(var(--space-lg) - 0.125rem);
  box-shadow:inset 0 -3px 0 var(--btn-step),0 0 0 var(--btn-ring-w) var(--btn-ring),0 1px 2px var(--btn-drop);
  transition:background-color var(--dur-btn) var(--ease-out),transform var(--dur-btn) var(--ease-out),box-shadow var(--dur-btn) var(--ease-out)}
.btn:not(.btn-line)::after{content:"";flex:none;width:1em;height:1em;background:currentColor;
  -webkit-mask:var(--btn-arrow) center / contain no-repeat;mask:var(--btn-arrow) center / contain no-repeat;
  transition:transform var(--dur-btn) var(--ease-out)}
@media (hover:hover){
  .btn:not(.btn-line):hover{background:var(--btn-bg-hover);color:var(--btn-ink);transform:translateY(-1px);
    box-shadow:inset 0 -3px 0 var(--btn-step),0 0 0 var(--btn-ring-w) var(--btn-ring),0 6px 14px -4px var(--btn-drop)}
  .btn:not(.btn-line):hover::after{transform:translateX(2px)}
}
.btn:not(.btn-line):active{background:var(--btn-bg-hover);transform:translateY(1px);
  box-shadow:inset 0 -1px 0 var(--btn-step),0 0 0 var(--btn-ring-w) var(--btn-ring),0 0 0 transparent}
.btn:focus-visible{outline-offset:3px}
#B01 .btn:not(.btn-line):focus-visible,#B10 .btn:not(.btn-line):focus-visible,#B21 .btn:not(.btn-line):focus-visible,.nav .btn:focus-visible{outline-offset:5px}
.btn:not(.btn-line):disabled,.btn:not(.btn-line)[aria-disabled="true"]{opacity:0.5;transform:none;box-shadow:0 0 0 var(--btn-ring-w) var(--btn-ring)}
.btn:not(.btn-line):disabled::after{transform:none}
/* ожидание отправки: стрелка уступает место индикатору */
.lead.is-loading .btn[type="submit"]::after{background:none;-webkit-mask:none;mask:none;transform:none}
.btn--sm:not(.btn-line){padding-inline:var(--space-md) calc(var(--space-md) - 0.125rem)}
/* вторичная на бумаге — тот же радиус, без объёма: главное действие одно */
.btn-line{border-radius:var(--btn-radius)}
@media (prefers-reduced-motion:reduce){
  .btn:not(.btn-line),.btn:not(.btn-line)::after{transition:none}
  .btn:not(.btn-line):hover,.btn:not(.btn-line):active,.btn:not(.btn-line):hover::after{transform:none}
}

/* ════════════════════════════════════════════════════════════════════════════════
   ПОЛОТНО (canvas-hallmark-main.html, блоки B31–B80). Только токены и язык темы:
   бумага + синие поля эмблемы, линейки 3 px синим, моно-подписи .k, красная «ступенька» — только действие.
   Синие поля новых блоков — класс .band (те же переопределения токенов, что у #B01/#B10/#B21/#B27);
   светлый лист на синем — .sheet (токены бумаги возвращаются внутри, как у #B27 .lead).
   ════════════════════════════════════════════════════════════════════════════════ */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* синее поле */
.blk.band{
  --color-ink: var(--color-on-brand); --color-ink-2: var(--color-on-brand); --color-muted: var(--color-on-brand-2);
  --color-rule: var(--color-brand-rule); --color-paper-2: var(--color-brand-2); --color-field-line: var(--color-band-field-line);
  --color-focus: var(--color-focus-on-brand);
  --btn-ring:#FFFFFF; --btn-drop:oklch(12% 0.03 275 / 0.45);
  background:var(--color-brand);color:var(--color-ink);
  border-image:linear-gradient(var(--color-brand),var(--color-brand)) fill 0 / 0 / 0 100vmax;
  padding-block:var(--space-3xl)}
.band h1,.band h2,.band h3{color:var(--color-on-brand)}
.band a:not(.btn){color:var(--color-on-brand)}
.band .btn-line{border-color:var(--color-on-brand);color:var(--color-on-brand)}
@media (hover:hover){.band .btn-line:hover{background:var(--color-brand-2);color:var(--color-on-brand)}}
.band .btn:not(.btn-line):focus-visible{outline-offset:5px}
/* светлый лист: бланк формы, подбор, карточка — бумага внутри синего поля */
.sheet{
  --color-ink: oklch(21% 0.035 275); --color-ink-2: oklch(33% 0.032 275); --color-muted: oklch(47% 0.022 275);
  --color-rule: oklch(83% 0.016 275); --color-paper-2: oklch(96% 0.010 275); --color-field-line: oklch(58% 0.020 275);
  --color-focus: oklch(55% 0.200 21); --color-error: oklch(47% 0.170 28); --color-success: oklch(48% 0.110 155);
  --btn-ring:transparent; --btn-drop:oklch(21% 0.035 275 / 0.28);
  background:var(--color-paper-2);color:var(--color-ink)}
.band .sheet a:not(.btn){color:var(--color-ink)}
.band .sheet .btn-line{border-color:var(--color-ink);color:var(--color-ink)}
.sheet__t{font:700 var(--text-lg)/1.25 var(--font-display);margin:0;color:var(--color-ink)}
.blk h3{font-size:var(--text-lg);line-height:1.2;margin:var(--space-xl) 0 var(--space-sm);color:var(--color-ink)}

/* ── заголовки групп и оглавление ─ */
.ctoc{margin-top:var(--space-xl);background:var(--color-brand);color:var(--color-on-brand);border-top:var(--space-2xs) solid var(--color-edge)}
.ctoc ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr)}
.ctoc a{display:grid;grid-template-columns:2.25rem minmax(0,1fr) auto;gap:var(--space-sm);align-items:baseline;padding:var(--space-sm) var(--space-md);
  color:var(--color-on-brand);text-decoration:none;border-bottom:var(--rule-hair) solid var(--color-brand-rule);transition:background-color var(--dur-short) var(--ease-out)}
.ctoc a .code{color:var(--color-on-brand-2);font-size:var(--text-sm)}
.ctoc a b{font:700 var(--text-base)/1.25 var(--font-display)}
.ctoc a .small{color:var(--color-on-brand-2);white-space:nowrap}
.ctoc :focus-visible{outline-color:var(--color-focus-on-brand);outline-offset:-3px}
@media (hover:hover){.ctoc a:hover{background:var(--color-brand-2)}}
@media (min-width:40rem){.ctoc ol{grid-template-columns:repeat(2,minmax(0,1fr))}.ctoc li:nth-child(odd) a{border-right:var(--rule-hair) solid var(--color-brand-rule)}}
@media (min-width:62rem){.ctoc ol{grid-template-columns:repeat(3,minmax(0,1fr))}.ctoc li a{border-right:var(--rule-hair) solid var(--color-brand-rule)}.ctoc li:nth-child(3n) a{border-right:0}}
.cgrp{scroll-margin-top:var(--space-xl)}
.cg{margin-top:var(--space-4xl);padding-top:var(--space-lg);border-top:var(--space-2xs) solid var(--color-brand);display:grid;gap:var(--space-xs);grid-template-columns:minmax(0,1fr)}
.cg__n{font-size:var(--text-sm);color:var(--color-muted);letter-spacing:0.06em}
.cg__t{font-size:var(--text-display-s);color:var(--color-ink);margin:0}
.cg__d{margin:0;color:var(--color-ink-2);max-width:65ch}
.cg__ids{margin:0;font-size:var(--text-xs);color:var(--color-muted);line-height:1.8}
.cg__ids a{color:var(--color-ink-2)}
@media (min-width:62rem){.cg{grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--space-2xl)}.cg__n,.cg__t{grid-column:1}.cg__d{grid-column:2;grid-row:2}.cg__ids{grid-column:1 / -1}}

/* ── общие раскладки ─ */
.cx2,.cxh--split{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-xl)}
@media (min-width:60rem){.cx2,.cxh--split{grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--space-2xl);align-items:start}}
.cx2__a > :last-child{margin-bottom:0}
.cxh__main{display:grid;gap:var(--space-lg);align-content:start;min-width:0}
.cxh h1{font-size:var(--text-display-s)}
.cxh .k,.cxh__main .k{margin:0}
.band .k{color:var(--color-on-brand-2)}
.cxh .row,.blk .row{display:flex;flex-wrap:wrap;gap:var(--space-sm);align-items:center}
.cxh--wide{display:grid;gap:var(--space-lg)}
.cxh--wide h1{max-width:24ch}
.cxh--wide .plate{margin-top:0}
.cxh--split > .lead{max-width:none}
@media (min-width:60rem){.cxh--split > .lead .btn{width:100%}}
.cxcard{display:grid;gap:var(--space-md);align-content:start;background:var(--color-paper-2);border-top:3px solid var(--color-brand);padding:var(--space-lg);min-width:0}
.cxcard > *{margin:0}
.cxcard .btn{justify-self:start}

/* ключ — значение (шильдик данных) */
.kv{margin:0;display:grid;grid-template-columns:minmax(0,1fr);border-top:var(--rule-hair) solid var(--color-rule)}
.kv > div{padding:var(--space-sm) 0;border-bottom:var(--rule-hair) solid var(--color-rule);min-width:0}
.kv dt{font:500 var(--text-xs)/1.3 var(--font-mono);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-muted);margin-bottom:var(--space-2xs)}
.kv dd{margin:0}
.kv dd.code{font-size:var(--text-lg)}
@media (min-width:40rem){.kv--4{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--space-xl)}}
@media (min-width:75rem){.kv--4{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* списки */
.ticks--1{display:block!important;max-width:none}
.ticks--1 li{padding-block:var(--space-xs)}
.cxcard .ticks{border-top-width:var(--rule-hair);border-top-color:var(--color-rule)}
.nlist{list-style:none;margin:0;padding:0;counter-reset:n;border-top:3px solid var(--color-brand)}
.band .nlist{border-top-color:var(--color-on-brand)}
.nlist li{counter-increment:n;display:grid;grid-template-columns:2rem minmax(0,1fr);gap:var(--space-xs);padding:var(--space-xs) 0;border-bottom:var(--rule-hair) solid var(--color-rule)}
.nlist li::before{content:counter(n,decimal-leading-zero);font:500 var(--text-sm)/1.6 var(--font-mono);color:var(--color-muted)}

/* текстовая кнопка */
.tlink{display:inline-flex;align-items:center;gap:var(--space-2xs);background:none;border:0;padding:var(--space-2xs) 0;font:600 var(--text-sm)/1.4 var(--font-body);color:var(--color-ink);
  text-decoration:underline;text-decoration-color:var(--color-rule);text-underline-offset:0.25em;cursor:pointer;justify-self:start}
@media (hover:hover){.tlink:hover{text-decoration-color:currentColor}}
a.tlink::after{content:"→";transition:transform var(--dur-short) var(--ease-out)}
@media (hover:hover){a.tlink:hover::after{transform:translateX(3px)}}

/* карточки выбора (радио и флажки) */
.opts{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-xs)}
@media (min-width:40rem){.opts--2,.opts--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:62rem){.opts--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.opt{position:relative;display:grid;grid-template-columns:1.25rem minmax(0,1fr);gap:var(--space-sm);align-items:start;padding:var(--space-sm) var(--space-md);
  background:var(--color-paper);border:var(--rule-hair) solid var(--color-field-line);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--dur-micro) var(--ease-out),box-shadow var(--dur-micro) var(--ease-out)}
.opt input{margin:0.2rem 0 0;width:1.05rem;height:1.05rem;accent-color:var(--color-accent)}
.opt b{display:block;font-weight:600;line-height:1.3}
.opt small{display:block;font-size:var(--text-sm);line-height:1.4;color:var(--color-muted);margin-top:var(--space-2xs)}
.opt:has(input:checked){border-color:var(--color-brand);box-shadow:inset 0 0 0 1px var(--color-brand);background:var(--color-paper)}
.opt:has(input:focus-visible){outline:2px solid var(--color-focus);outline-offset:2px}
@media (hover:hover){.opt:hover{border-color:var(--color-ink-2)}}
.opt--chk:has(input:not(:checked)) b{text-decoration:line-through;text-decoration-color:var(--color-muted);color:var(--color-muted)}
.opts-f{border:0;margin:0;padding:0;min-width:0}
.opts-f legend{padding:0;margin-bottom:var(--space-xs)}

/* формы полотна: шире, строки полей, форма без бланка */
.lead--wide{max-width:none}
.lead--bare{background:none;padding:0}
.lead__row{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-md);align-items:end}
@media (min-width:48rem){.lead__row{grid-template-columns:repeat(2,minmax(0,1fr))}}
.lead__row > .field:last-child{align-content:end}
.lead fieldset{border:0;margin:0;padding:0;display:grid;gap:var(--space-md);min-width:0}
.lead fieldset legend{padding:0;margin-bottom:var(--space-xs)}
.lead .hints{margin-top:calc(-1 * var(--space-xs))}
.lead .need{justify-self:start}
.ms__dots{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-xs);counter-reset:d}
.ms__dots li{counter-increment:d;padding-top:var(--space-xs);border-top:3px solid var(--color-rule);font-size:var(--text-sm);color:var(--color-muted)}
.ms__dots li::before{content:counter(d) ". ";font-family:var(--font-mono)}
.ms__dots li.is-on{border-top-color:var(--color-brand);color:var(--color-ink);font-weight:600}
.ms__row{display:flex;flex-wrap:wrap;gap:var(--space-sm)}
.ms__row .btn{width:auto;flex:1 1 auto}
/* таблица позиций */
.rows{width:100%;border-collapse:collapse}
.rows th{font:500 var(--text-xs)/1.2 var(--font-mono);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-muted);text-align:left;padding:0 var(--space-xs) var(--space-xs) 0}
.rows td{padding:0 var(--space-xs) var(--space-xs) 0;min-width:9rem}
.rows td:last-child{padding-right:0}
.drop{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-md);align-items:center;padding:var(--space-md);border:var(--rule-hair) dashed var(--color-field-line);border-radius:var(--radius-md);background:var(--color-paper);position:relative}
.drop > span:nth-child(2){display:grid}
.drop input,.lead .drop input:disabled{position:absolute;inset:0;opacity:0;cursor:not-allowed}
.drop__ic{font:500 var(--text-xs)/1 var(--font-mono);letter-spacing:0.06em;color:var(--color-muted);border:var(--rule-hair) solid var(--color-rule);padding:var(--space-xs);border-radius:var(--radius-sm)}
/* чек-лист-превью (B40) */
.clps{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-md)}
@media (min-width:48rem){.clps{grid-template-columns:repeat(3,minmax(0,1fr))}}
.clp{border-top:3px solid var(--color-on-brand);padding-top:var(--space-sm)}
.clp b{font:700 var(--text-base)/1.25 var(--font-display)}
.clp ul{margin:var(--space-xs) 0 0;padding-left:1.1em;font-size:var(--text-sm);color:var(--color-ink-2)}
.clp li{margin-bottom:var(--space-2xs)}
/* липкая боковая колонка (B41) */
.stk{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-2xl)}
.stk__a h3:first-of-type{margin-top:0}
@media (min-width:62rem){.stk{grid-template-columns:minmax(0,8fr) minmax(0,4fr);align-items:start}.stk__b{position:sticky;top:4.5rem}}
.faq details{border-bottom:var(--rule-hair) solid var(--color-rule)}
.faq details:first-child{border-top:3px solid var(--color-brand)}
.faq summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-md);padding:var(--space-sm) 0;font-weight:600}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--color-muted)}
.faq details[open] summary::after{content:"−"}
.faq details p{margin:0;padding:0 0 var(--space-md);color:var(--color-ink-2);max-width:65ch}
/* телефон-макет и нижняя панель (B42) */
.phone{justify-self:center;width:min(19rem,100%);aspect-ratio:9 / 17;border:var(--rule-bold) solid var(--color-ink);border-radius:1.75rem;padding:0.6rem;background:var(--color-paper-3)}
.phone__scr{position:relative;height:100%;overflow:hidden;border-radius:1.25rem;background:var(--color-paper);display:flex;flex-direction:column;gap:0.55rem;padding:0 0.9rem}
.phone__bar{display:block;height:2.4rem;margin:0 -0.9rem;background:var(--color-brand-2);border-bottom:3px solid var(--color-edge)}
.phone__h{display:block;height:1.1rem;width:80%;background:var(--color-ink);border-radius:2px;margin-top:0.4rem}
.phone__l{display:block;height:0.5rem;background:var(--color-rule);border-radius:2px}
.phone__l--s{width:60%}
.phone__card{display:block;height:5rem;background:var(--color-paper-2);border-top:3px solid var(--color-brand)}
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);
  padding:var(--space-xs) var(--page-gutter) calc(var(--space-xs) + env(safe-area-inset-bottom,0px));background:var(--color-brand-2);color:var(--color-on-brand);
  border-top:3px solid var(--color-edge);--btn-ring:#FFFFFF;--btn-drop:oklch(12% 0.03 275 / 0.45)}
.mbar__p{display:grid;line-height:1.2;min-width:0}
.mbar__p b{font:700 var(--text-lg)/1.1 var(--font-display);white-space:nowrap}
.mbar__p small{font-size:var(--text-xs);color:var(--color-on-brand-2)}
.mbar .btn{flex:0 0 auto}
.mbar--demo{position:absolute;padding:0.45rem 0.6rem;gap:0.4rem}
.mbar--demo .mbar__p b{font-size:var(--text-base)}
.mbar--demo .btn{min-height:2.25rem;font-size:var(--text-xs);padding-inline:0.6rem 0.5rem;pointer-events:none}
@media (min-width:48rem){.mbar:not(.mbar--demo){display:none}}

/* ── таблица полотна .ct: шапка-спецификация; на телефоне строка = карточка с подписями из шапки ─ */
.ct{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.ct th{font:500 var(--text-xs)/1.2 var(--font-mono);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-muted);text-align:left;padding:0 var(--space-sm) var(--space-sm);border-bottom:3px solid var(--color-brand);vertical-align:bottom}
.ct td{padding:var(--space-xs) var(--space-sm);border-bottom:var(--rule-hair) solid var(--color-rule);vertical-align:baseline}
.ct tbody tr:nth-child(even):not(.rf){background:var(--color-paper-2)}
.ct td.num,.ct th.num{text-align:right;font-weight:600;white-space:nowrap}
.ct .code{color:var(--color-ink-2)}
.ct td small{display:block;font-size:var(--text-sm);color:var(--color-muted)}
.ct tr.grp th{background:none;color:var(--color-brand);font:700 var(--text-lg)/1.2 var(--font-display);letter-spacing:0;text-transform:none;padding-top:var(--space-lg);border-bottom-width:var(--rule-bold)}
.ct td.act{text-align:right;white-space:nowrap;width:1%}
.ct tr.rf > td{background:var(--color-paper-3);padding:var(--space-md)}
@media (hover:hover){.ct tbody tr:not(.rf):not(.grp):hover{background:var(--color-paper-3)}}
.lead--row{max-width:none;background:none;padding:0;display:grid;gap:var(--space-sm);grid-template-columns:minmax(0,1fr)}
@media (min-width:62rem){.lead--row{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.2fr);align-items:end}.lead--row .form-msg{grid-column:1 / -1}}
.lead--row .field:last-of-type{display:grid;gap:var(--space-xs)}
.lead--row .btn{width:auto;justify-self:start}
@media (max-width:39.99rem){
  .ct thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .ct,.ct tbody,.ct tr,.ct td{display:block}
  .ct tbody{border-top:3px solid var(--color-brand)}
  .ct tr{padding:var(--space-sm) 0;border-bottom:var(--rule-hair) solid var(--color-rule)}
  .ct tbody tr:nth-child(even):not(.rf){background:none}
  .ct td{border:0;padding:var(--space-2xs) 0;display:grid;grid-template-columns:minmax(0,9rem) minmax(0,1fr);gap:var(--space-sm);text-align:left!important;white-space:normal!important}
  .ct td::before{content:attr(data-l);font:500 var(--text-xs)/1.5 var(--font-mono);letter-spacing:0.04em;text-transform:uppercase;color:var(--color-muted)}
  .ct td:first-child{font-weight:600}
  .ct td:not([data-l]){display:block}
  .ct td:not([data-l])::before{content:none}
  .ct td.act{width:auto;padding-top:var(--space-xs)}
  .ct tr.grp th{display:block;padding:var(--space-lg) 0 var(--space-xs)}
  .ct tr.rf > td{padding:var(--space-sm)}
}

/* ── B33 комплект документов: стопка листов ─ */
.dstack-w{margin:0;display:grid;gap:var(--space-sm);min-width:0}
.dstack{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-xs)}
.dsheet{display:grid;gap:var(--space-2xs);padding:var(--space-md);background:var(--color-paper);border:var(--rule-hair) solid var(--color-rule);border-top:3px solid var(--color-brand);
  box-shadow:0 1px 2px oklch(21% 0.035 275 / 0.08),0 8px 20px -12px oklch(21% 0.035 275 / 0.25);min-width:0}
.dsheet__c{font:500 var(--text-xs)/1.2 var(--font-mono);letter-spacing:0.06em;color:var(--color-muted)}
.dsheet b{font:700 var(--text-lg)/1.2 var(--font-display)}
.dsheet__ln{display:none}
.dsheet__s{font-size:var(--text-sm);color:var(--color-ink-2)}
.dsheet__p{font:600 var(--text-sm)/1.3 var(--font-mono);color:var(--color-ink);margin-top:var(--space-2xs)}
@media (min-width:48rem){
  .dstack{display:block;position:relative;height:25rem}
  .dsheet{position:absolute;width:min(20rem,78%);left:calc(var(--i) * 9%);top:calc(var(--i) * 4.25rem);aspect-ratio:auto;min-height:13rem;align-content:start}
  .dsheet__ln{display:grid;gap:0.4rem;margin:var(--space-xs) 0}
  .dsheet__ln i{display:block;height:0.4rem;background:var(--color-paper-3);border-radius:1px}
  .dsheet__ln i:nth-child(2){width:85%}.dsheet__ln i:nth-child(3){width:60%}
  .dsheet:last-child{border-top-color:var(--color-edge)}
  .dsheet:last-child .dsheet__c{color:var(--color-ink)}
}

/* ── B34 старт квиза ─ */
.qstart{margin:0}
.qstart__out{display:block;background:var(--color-brand);color:var(--color-on-brand);padding:var(--space-md);font:700 var(--text-lg)/1.3 var(--font-display)}
.qstart .btn{justify-self:stretch}
@media (min-width:40rem){.qstart .btn{justify-self:start}}
.band .plate-out{background:var(--color-brand-2)}
.blk [hidden],.mbar[hidden]{display:none!important}
.blk:has(> .lead--wide){display:block}
.blk:has(> .lead--wide) > .lead{max-width:none}

/* ── B45 кнопки ─ */
.bk{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}
@media (min-width:62rem){.bk{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:start}}
.bk__p{display:grid;gap:0;border-top:3px solid var(--color-brand);padding-top:var(--space-sm);min-width:0}
.bk__p > .k{margin:0 0 var(--space-xs)}
.bk__p--band{
  --color-ink: var(--color-on-brand); --color-ink-2: var(--color-on-brand); --color-muted: var(--color-on-brand-2);
  --color-rule: var(--color-brand-rule); --color-paper-2: var(--color-brand-2); --color-focus: var(--color-focus-on-brand);
  --btn-ring:#FFFFFF; --btn-drop:oklch(12% 0.03 275 / 0.45);
  background:var(--color-brand);color:var(--color-ink);padding:var(--space-md) var(--space-lg) var(--space-lg);border-top-color:var(--color-edge)}
.bk__p--band .btn-line{border-color:var(--color-on-brand);color:var(--color-on-brand)}
.bk__p--band a:not(.btn){color:var(--color-on-brand)}
.bk__r{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-xs);padding:var(--space-sm) 0;border-bottom:var(--rule-hair) solid var(--color-rule);align-items:center}
@media (min-width:40rem){.bk__r{grid-template-columns:10rem minmax(0,1fr)}}
.bk__v{display:flex;flex-wrap:wrap;gap:var(--space-sm);align-items:center;min-width:0}
.bk__v .tw{flex:1 1 100%}
.bk__v .ct{margin:0}
.bk__m{display:flex;flex-wrap:wrap;gap:var(--space-sm);align-items:center}
.bk__m .need{margin:0}
.mail{font-size:var(--text-lg)}
.btn-ic .ic{width:1.1em;height:1.1em;flex:none}
.btn-price{flex-direction:column;align-items:flex-start;gap:0;padding-block:var(--space-xs) calc(var(--space-xs) + 3px);line-height:1.2}
.btn-price.btn:not(.btn-line){display:inline-grid;grid-template-columns:auto auto;column-gap:var(--space-sm);align-items:center}
.btn-price span{grid-column:1}
.btn-price small{grid-column:1;font:500 var(--text-sm)/1.2 var(--font-mono);opacity:0.9}
.btn-price.btn:not(.btn-line)::after{grid-column:2;grid-row:1 / span 2}
.seg{display:inline-flex;flex-wrap:wrap;border:var(--rule-hair) solid var(--color-ink);border-radius:var(--btn-radius);overflow:hidden}
.seg button{min-height:2.75rem;padding:0 var(--space-md);border:0;border-left:var(--rule-hair) solid var(--color-ink);background:transparent;color:var(--color-ink);font:600 var(--text-sm)/1 var(--font-body);cursor:pointer}
.seg button:first-child{border-left:0}
.seg button[aria-pressed="true"]{background:var(--color-brand);color:var(--color-on-brand)}
@media (hover:hover){.seg button[aria-pressed="false"]:hover{background:var(--color-paper-3)}}
.seg button:focus-visible{outline-offset:-3px}
.bk__st-t{margin:var(--space-xl) 0 var(--space-sm)}
.bk__st{display:flex;flex-wrap:wrap;gap:var(--space-lg) var(--space-xl);align-items:flex-start}
.bk__st .bk__s{display:grid;gap:var(--space-xs);justify-items:start}
/* застывшие состояния для показа (на сайте их дают :hover, :active, :focus-visible) */
.btn.is-hover:not(.btn-line){background:var(--btn-bg-hover);transform:translateY(-1px);box-shadow:inset 0 -3px 0 var(--btn-step),0 0 0 var(--btn-ring-w) var(--btn-ring),0 6px 14px -4px var(--btn-drop)}
.btn.is-hover:not(.btn-line)::after{transform:translateX(2px)}
.btn.is-active:not(.btn-line){background:var(--btn-bg-hover);transform:translateY(1px);box-shadow:inset 0 -1px 0 var(--btn-step),0 0 0 var(--btn-ring-w) var(--btn-ring)}
.btn.is-focus{outline:2px solid var(--color-ink);outline-offset:3px}
.btn.is-loading{cursor:progress}
.btn.is-loading:not(.btn-line)::after{background:none;-webkit-mask:none;mask:none;width:0.9em;height:0.9em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin 700ms linear infinite}

/* ── B47 вкладки и карточки прайса ─ */
.tabs__l{display:flex;flex-wrap:wrap;gap:0;border-bottom:3px solid var(--color-brand);margin-bottom:var(--space-lg)}
.tabs__l button{min-height:2.75rem;padding:0 var(--space-md);border:0;background:none;font:600 var(--text-sm)/1 var(--font-body);color:var(--color-ink-2);cursor:pointer;border-radius:var(--radius-sm) var(--radius-sm) 0 0}
.tabs__l button .muted{font-family:var(--font-mono);font-weight:500}
.tabs__l button[aria-selected="true"]{background:var(--color-brand);color:var(--color-on-brand)}
.tabs__l button[aria-selected="true"] .muted{color:var(--color-on-brand-2)}
@media (hover:hover){.tabs__l button[aria-selected="false"]:hover{background:var(--color-paper-2)}}
.tabs:not(.is-js) [role="tabpanel"] + [role="tabpanel"]{margin-top:var(--space-xl)}
[role="tabpanel"]:focus-visible{outline-offset:4px}
.pcards{display:grid;grid-template-columns:minmax(0,1fr);gap:0 var(--space-xl);border-top:var(--rule-hair) solid var(--color-rule)}
@media (min-width:48rem){.pcards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:75rem){.pcards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.pcard{display:grid;gap:var(--space-2xs);padding:var(--space-md) 0;border-bottom:var(--rule-hair) solid var(--color-rule);align-content:start;min-width:0}
.pcard > .code{font-size:var(--text-xs);color:var(--color-muted)}
.pcard > b{font:700 var(--text-lg)/1.2 var(--font-display)}
.pcard ul{list-style:none;margin:var(--space-xs) 0 0;padding:0}
.pcard li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 var(--space-sm);padding:var(--space-2xs) 0;font-size:var(--text-sm)}
.pcard li b{text-align:right;white-space:nowrap}
.pcard li small{grid-column:1 / -1}

/* ── B48 шкала цен рынка ─ */
.rgs{display:grid;gap:var(--space-xl);border-top:3px solid var(--color-brand);padding-top:var(--space-md);margin-bottom:var(--space-xl)}
.rg__h{display:flex;flex-wrap:wrap;gap:var(--space-2xs) var(--space-md);align-items:baseline;margin-bottom:var(--space-sm)}
.rg__h b{font:700 var(--text-lg)/1.2 var(--font-display)}
.rg__t{position:relative;height:5.25rem;border-bottom:var(--rule-hair) solid var(--color-rule)}
.rg__band{position:absolute;left:var(--a);width:calc(var(--b) - var(--a));top:0.75rem;height:0.75rem;background:var(--color-paper-3);border:var(--rule-hair) solid var(--color-rule)}
.rg__m{position:absolute;left:var(--x);top:0;display:grid;justify-items:start;padding-top:2rem;padding-left:var(--space-xs);border-left:2px solid var(--color-brand);font-size:var(--text-xs);white-space:nowrap}
.rg__m:nth-child(odd){padding-top:2rem}
.rg__m b{font-size:var(--text-sm);color:var(--color-ink)}
.rg__m small{color:var(--color-muted)}
.rg__m:last-child:not(:nth-child(2)){transform:translateX(-100%);border-left:0;border-right:2px solid var(--color-brand);padding-left:0;padding-right:var(--space-xs);justify-items:end}
@media (max-width:39.99rem){.rg__t{height:auto;padding-top:2rem;display:flex;flex-wrap:wrap;gap:var(--space-sm)}.rg__m,.rg__m:last-child:not(:nth-child(2)){position:static;transform:none;padding-top:0;border-left:2px solid var(--color-brand);border-right:0;padding-left:var(--space-xs);padding-right:0;justify-items:start}}

/* ── B49 тарифы ─ */
.tcards{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}
@media (min-width:56rem){.tcards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.tcard{display:grid;gap:var(--space-xs);align-content:start;padding:var(--space-lg);border-top:3px solid var(--color-brand);background:var(--color-paper-2);min-width:0}
.tcard > *{margin:0}
.tcard__p{font:700 var(--text-2xl)/1.1 var(--font-display)}
.tcard .ticks{margin-top:var(--space-xs);border-top:var(--rule-hair) solid var(--color-rule)}
.tcard .btn{justify-self:start;margin-top:var(--space-sm)}
.tcard.is-kit{background:var(--color-brand);color:var(--color-on-brand);border-top-color:var(--color-edge);
  --color-ink: var(--color-on-brand); --color-ink-2: var(--color-on-brand); --color-muted: var(--color-on-brand-2); --color-rule: var(--color-brand-rule); --btn-ring:#FFFFFF}
.tcard.is-kit .k{color:var(--color-on-brand-2)}

/* ── B50 калькулятор ─ */
.calc{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg);border-top:3px solid var(--color-brand);padding-top:var(--space-md)}
@media (min-width:56rem){.calc{grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--space-2xl)}}
.calc__f{display:grid;gap:var(--space-md);align-content:start}
.calc .field{display:grid;gap:var(--space-2xs)}
.calc .field label,.calc legend{font-weight:600;font-size:var(--text-sm)}
.calc select,.calc input[type="number"]{width:100%;min-height:var(--control-h);padding:0 var(--space-md);border:var(--rule-hair) solid var(--color-field-line);border-radius:var(--radius-sm);background:var(--color-paper);color:var(--color-ink);font:400 var(--text-base)/1.3 var(--font-body)}
.calc input[type="number"]{max-width:8rem}
.calc select:focus,.calc input:focus{outline:2px solid var(--color-focus);outline-offset:1px}
.calc__add{border:0;margin:0;padding:0;display:grid;gap:var(--space-xs)}
.calc__add legend{padding:0;margin-bottom:var(--space-xs)}
.calc label.small{display:flex;gap:var(--space-xs);align-items:center;cursor:pointer}
.calc input[type="checkbox"]{accent-color:var(--color-accent);width:1.1rem;height:1.1rem;margin:0}
.calc__o{background:var(--color-brand);color:var(--color-on-brand);padding:var(--space-lg);display:grid;gap:var(--space-xs);align-content:start;--btn-ring:#FFFFFF}
.calc__o .k{color:var(--color-on-brand-2);margin:0}
.calc__sum{font:700 var(--text-display-s)/1 var(--font-display);font-variant-numeric:tabular-nums}
.calc__o p{margin:0;color:var(--color-on-brand-2);min-height:1lh}
.calc__o .btn{justify-self:start;margin-top:var(--space-sm)}

/* ── B51 что входит ─ */
.incs{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}
@media (min-width:56rem){.incs{grid-template-columns:repeat(3,minmax(0,1fr))}}
.inc{border-top:3px solid var(--color-brand);padding-top:var(--space-sm);min-width:0}
.inc.is-free{border-top-color:var(--color-success)}
.inc ul{list-style:none;margin:var(--space-xs) 0 0;padding:0}
.inc li{display:grid;gap:var(--space-2xs);padding:var(--space-xs) 0;border-bottom:var(--rule-hair) solid var(--color-rule)}
.inc li b{font:500 var(--text-sm)/1.3 var(--font-mono);color:var(--color-ink-2)}
.inc li .need{margin:0;justify-self:start}

/* ── таблицы сравнения ─ */
.ct--cmp td:first-child{width:22%;color:var(--color-ink)}
.ct--cmp td{vertical-align:top}
.ct--mx th:not(:first-child),.ct--mx td:not(:first-child){text-align:center}
.mk{font-size:var(--text-lg);color:var(--color-muted);line-height:1}
.mk--y{color:var(--color-brand)}
.mk--o{color:var(--color-brand)}
@media (max-width:39.99rem){.ct--mx td:not(:first-child){text-align:left}}
.blk > .alert{margin-top:var(--space-lg)}
@media (min-width:40rem){.rg__t{height:6.75rem}.rg__m:nth-child(3){padding-top:3.6rem}}

/* ── B57 страница услуги, B58 карточки, B59 программная страница ─ */
.crumbs{color:var(--color-muted);margin:0 0 var(--space-md)}
.crumbs a{color:var(--color-ink-2)}
.tag{display:inline-block;font-size:var(--text-xs);letter-spacing:0.04em;padding:var(--space-2xs) var(--space-xs);background:var(--color-brand);color:var(--color-on-brand);border-radius:var(--radius-sm)}
.pdp__h{font-size:var(--text-display-s);color:var(--color-ink);margin:var(--space-sm) 0 var(--space-md)}
.pdp__top{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-xl);padding-bottom:var(--space-lg);border-bottom:3px solid var(--color-brand)}
@media (min-width:60rem){.pdp__top{grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--space-2xl);align-items:start}}
.pdp__nav{display:flex;flex-wrap:wrap;gap:var(--space-2xs) var(--space-lg);margin-top:var(--space-lg)}
.pdp__nav a{font-weight:600}
.buy{display:grid;gap:var(--space-md);padding:var(--space-lg);border-top:3px solid var(--color-edge)}
.buy__p{font:700 var(--text-display-s)/1 var(--font-display)!important}
.buy .btn{width:100%}
.pdp__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:0 var(--space-2xl)}
@media (min-width:56rem){.pdp__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pdp section{scroll-margin-top:5rem}
.pdp .nlist small{display:inline}
.prods{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-md)}
@media (min-width:40rem){.prods{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:75rem){.prods{grid-template-columns:repeat(4,minmax(0,1fr))}}
.prod{display:grid;gap:var(--space-xs);align-content:start;padding:var(--space-md);background:var(--color-paper-2);border-top:3px solid var(--color-brand);min-width:0}
.prod .tag{justify-self:start}
.prod__t{font:700 var(--text-lg)/1.2 var(--font-display)}
.prod__kv{margin:var(--space-xs) 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-sm);border-top:var(--rule-hair) solid var(--color-rule);padding-top:var(--space-xs)}
.prod__kv dt{font:500 var(--text-xs)/1.3 var(--font-mono);text-transform:uppercase;letter-spacing:0.06em;color:var(--color-muted)}
.prod__kv dd{margin:0;font-weight:600}
.pseo__g{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-xl)}
@media (min-width:60rem){.pseo__g{grid-template-columns:minmax(0,8fr) minmax(0,4fr);align-items:start}}
.answer{font-size:var(--text-lg);line-height:1.55;border-left:3px solid var(--color-brand);padding-left:var(--space-md);max-width:68ch}

/* ── B60 шильдик реквизитов: синяя табличка с заклёпками ─ */
.plateq{background:var(--color-brand);color:var(--color-on-brand);padding:var(--space-md);border-radius:var(--radius-md);max-width:44rem;position:relative;margin-bottom:var(--space-md)}
.plateq::before,.plateq::after{content:"";position:absolute;top:0.6rem;width:0.55rem;height:0.55rem;border-radius:50%;background:var(--color-on-brand-2);box-shadow:0 calc(100% + 0px) 0 transparent}
.plateq::before{left:0.6rem}.plateq::after{right:0.6rem}
.plateq__in{border:var(--rule-hair) solid var(--color-brand-rule);padding:var(--space-md) var(--space-lg)}
.plateq__t{font:700 var(--text-lg)/1.2 var(--font-display);margin:0 0 var(--space-sm);text-transform:uppercase;letter-spacing:0.02em}
.plateq dl{margin:0;display:grid;grid-template-columns:minmax(0,1fr)}
.plateq dl > div{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:var(--space-sm);padding:var(--space-2xs) 0;border-top:var(--rule-hair) solid var(--color-brand-rule)}
.plateq dt{font:500 var(--text-xs)/1.6 var(--font-mono);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-on-brand-2)}
.plateq dd{margin:0;color:var(--color-on-brand)}
.plateq a{color:var(--color-on-brand)}

/* ── B61 чек-лист, B62 возражения ─ */
.cl__out{margin:var(--space-md) 0 0;padding:var(--space-sm) var(--space-md);background:var(--color-paper-3);border-left:3px solid var(--color-brand)}
.cl.is-done .cl__out{border-left-color:var(--color-success);color:var(--color-success)}
.cl .opt:has(input:checked) b{color:var(--color-ink)}
.objs{display:grid;grid-template-columns:minmax(0,1fr);gap:0 var(--space-2xl);border-top:3px solid var(--color-brand)}
@media (min-width:56rem){.objs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.obj{padding:var(--space-md) 0;border-bottom:var(--rule-hair) solid var(--color-rule)}
.obj b{font:700 var(--text-lg)/1.25 var(--font-display);display:block;margin-bottom:var(--space-xs)}
.obj p{margin:0;color:var(--color-ink-2)}

/* ── B63 макет декларации ─ */
.dmk-w{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-xl);margin-bottom:var(--space-sm)}
@media (min-width:56rem){.dmk-w{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}}
.dmk{background:var(--color-paper);border:var(--rule-hair) solid var(--color-rule);border-top:3px solid var(--color-brand);padding:var(--space-lg);box-shadow:0 10px 24px -16px oklch(21% 0.035 275 / 0.35)}
.dmk__t{font:500 var(--text-sm)/1.2 var(--font-mono);letter-spacing:0.08em;text-align:center;margin:0 0 var(--space-md)}
.dmk__f{display:grid;grid-template-columns:1.5rem minmax(0,1fr);gap:0 var(--space-xs);padding:var(--space-xs) 0;border-top:var(--rule-hair) dashed var(--color-rule)}
.dmk__n{grid-row:1 / span 2;width:1.4rem;height:1.4rem;border-radius:50%;background:var(--color-brand);color:var(--color-on-brand);font:500 var(--text-xs)/1.4rem var(--font-mono);text-align:center}
.dmk__v{font-size:var(--text-sm);color:var(--color-muted)}
.dmk__v i{display:block;height:0.5rem;width:70%;margin-top:0.35rem;background:var(--color-paper-3)}
.dmk__l{margin:0;padding:0;list-style:none;counter-reset:f;border-top:3px solid var(--color-brand)}
.dmk__l li{counter-increment:f;display:grid;grid-template-columns:1.9rem minmax(0,1fr);gap:0 var(--space-xs);padding:var(--space-sm) 0;border-bottom:var(--rule-hair) solid var(--color-rule)}
.dmk__l li::before{content:counter(f);grid-row:1 / span 2;width:1.4rem;height:1.4rem;border-radius:50%;background:var(--color-brand);color:var(--color-on-brand);font:500 var(--text-xs)/1.4rem var(--font-mono);text-align:center}
.dmk__l span{color:var(--color-ink-2);font-size:var(--text-sm)}

/* ── B64 таймлайн (шкала 0–10 рабочих дней) ─ */
.gt{border-top:3px solid var(--color-brand);padding-top:var(--space-sm);margin-bottom:var(--space-sm)}
.gt__r{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-2xs);padding:var(--space-sm) 0;border-bottom:var(--rule-hair) solid var(--color-rule)}
@media (min-width:48rem){.gt__r{grid-template-columns:11rem minmax(0,1fr);align-items:center}}
.gt__l{font-weight:600;font-size:var(--text-sm)}
.gt__t{position:relative;height:2.5rem}
.gt__s{position:absolute;top:0;bottom:0;left:calc(var(--a) * 10%);width:calc((var(--b) - var(--a)) * 10%);background:var(--color-brand);color:var(--color-on-brand);display:flex;align-items:center;padding:0 var(--space-xs);font-size:var(--text-xs);overflow:hidden;border-right:2px solid var(--color-paper)}
.gt__s span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gt__s.is-free{background:var(--color-success)}
.gt__s.is-free span{font-size:0}
.gt__s.is-doc{background:var(--color-brand-rule)}
.gt__ticks{height:1.25rem}
.gt__ticks span{position:absolute;left:calc(var(--a) * 10%);font:500 var(--text-xs)/1 var(--font-mono);color:var(--color-muted);transform:translateX(-50%)}
.gt__ticks span:first-child{transform:none}
.gt__ticks span:last-child{transform:translateX(-100%)}
@media (max-width:47.99rem){.gt__r--k .gt__l{display:none}}

/* ── B65 дорожная карта ─ */
.road{list-style:none;margin:0;padding:0;counter-reset:r;display:grid;grid-template-columns:minmax(0,1fr);border-top:3px solid var(--color-brand)}
.road li{counter-increment:r;position:relative;display:grid;gap:var(--space-2xs);padding:var(--space-md) 0 var(--space-md) 2.5rem;border-bottom:var(--rule-hair) solid var(--color-rule)}
.road li::before{content:counter(r);position:absolute;left:0;top:var(--space-md);width:1.75rem;height:1.75rem;border-radius:50%;border:2px solid var(--color-brand);font:700 var(--text-sm)/1.55rem var(--font-display);text-align:center;color:var(--color-brand);background:var(--color-paper)}
.road li.is-gate::before{background:var(--color-edge);border-color:var(--color-edge);color:#fff}
.road b{font-weight:600}
.road span{font-size:var(--text-sm);color:var(--color-ink-2)}
@media (min-width:62rem){
  .road{grid-template-columns:repeat(6,minmax(0,1fr));border-top:0}
  .road li{padding:2.75rem var(--space-md) 0 0;border-bottom:0;border-top:3px solid var(--color-brand)}
  .road li::before{top:-1rem}
  .road li.is-gate{border-top-color:var(--color-edge)}
}

/* ── B66 жизнь документа ─ */
.lf{padding:var(--space-2xl) var(--space-md) var(--space-md);margin-bottom:var(--space-lg);background:var(--color-paper-2);overflow-x:auto}
.lf__t{position:relative;height:5rem;border-top:3px solid var(--color-brand);min-width:36rem;margin-inline:1rem 4rem}
.lf__m{position:absolute;left:var(--x);top:-0.6rem;display:grid;justify-items:start;gap:var(--space-2xs);padding-top:1.6rem;font-size:var(--text-xs);transform:translateX(-0.45rem)}
.lf__m::before{content:"";position:absolute;top:0;left:0;width:0.9rem;height:0.9rem;border-radius:50%;background:var(--color-brand)}
.lf__m.is-ik::before{background:var(--color-paper);border:2px solid var(--color-brand)}
.lf__m.is-new::before{background:var(--color-edge)}
.lf__m.is-new{top:1.5rem}
.lf__m b{font:500 var(--text-xs)/1 var(--font-mono);color:var(--color-muted)}
.lf__m small{color:var(--color-ink-2);max-width:9rem;white-space:normal}
.cal{margin-bottom:var(--space-sm)}
.lf__t{height:6.5rem}
@media (min-width:40rem){.blk > .lead--wide .btn,.blk > .lead--wide .lead__row .btn{width:auto;justify-self:start}}

/* ── B67 схема ЕАЭС ─ */
.eu{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-xl)}
@media (min-width:60rem){.eu{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:start}}
.eu__m{margin:0;display:grid;gap:var(--space-xs)}
.eu__m svg{width:100%;height:auto;display:block;background:var(--color-paper-2);border-top:3px solid var(--color-brand)}
.eu__c{fill:var(--color-brand);stroke:var(--color-paper);stroke-width:3}
.eu__t{fill:var(--color-on-brand);font:700 18px var(--font-display)}
.eu__l{stroke:var(--color-brand-rule);stroke-width:2;fill:none}
.eu__r{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin:var(--space-xs) 0 var(--space-lg)}

/* ── B68 маршрут документа (на синем поле) ─ */
.mt{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);counter-reset:m}
.mt li{counter-increment:m;position:relative;display:grid;gap:var(--space-2xs);padding:0 0 var(--space-lg) 2.5rem;min-width:0}
.mt li::before{content:"";position:absolute;left:0.45rem;top:0.2rem;width:1rem;height:1rem;border-radius:50%;background:var(--color-brand);border:3px solid var(--color-on-brand);z-index:1}
.mt li::after{content:"";position:absolute;left:0.95rem;top:0.6rem;bottom:-0.2rem;width:3px;background:var(--color-on-brand-2)}
.mt li:last-child::after{display:none}
.mt li:last-child::before{background:var(--color-on-brand)}
.mt__who{font-size:var(--text-sm);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-on-brand)}
.mt li > span:last-child{color:var(--color-on-brand-2);font-size:var(--text-sm)}
@media (min-width:62rem){
  .mt{grid-template-columns:repeat(6,minmax(0,1fr))}
  .mt li{padding:2.25rem var(--space-md) 0 0}
  .mt li::before{left:0;top:0}
  .mt li::after{left:1rem;right:0;top:0.6rem;bottom:auto;width:auto;height:3px}
}

/* ── B69 инструменты ─ */
.tools{display:grid;grid-template-columns:minmax(0,1fr);gap:0 var(--space-xl);border-top:3px solid var(--color-brand)}
@media (min-width:48rem){.tools{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:75rem){.tools{grid-template-columns:repeat(3,minmax(0,1fr))}}
.tool{display:grid;gap:var(--space-2xs);padding:var(--space-md) var(--space-xs);border-bottom:var(--rule-hair) solid var(--color-rule);text-decoration:none;color:var(--color-ink);align-content:start}
.tool b{font:700 var(--text-lg)/1.2 var(--font-display)}
.tool.is-soon b{color:var(--color-muted)}
.tool__s{justify-self:start;font:500 var(--text-xs)/1 var(--font-mono);letter-spacing:0.06em;text-transform:uppercase;padding:var(--space-2xs) var(--space-xs);border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-sm);color:var(--color-muted)}
.tool__s.is-on{background:var(--color-brand);border-color:var(--color-brand);color:var(--color-on-brand)}
@media (hover:hover){a.tool:hover{background:var(--color-paper-2)}}

/* ── B70 проверка: форма-шильдик без подбора ─ */
[data-check] .form-msg{margin-top:var(--space-xs)}
[data-check].is-err .form-msg{color:var(--color-error)}
[data-check]:not(.has-result) .plate-out dd{color:var(--color-on-brand-2)}

/* ── B71 класс ОПО ─ */
.opo{border-top:3px solid var(--color-brand);padding-top:var(--space-md);display:grid;gap:var(--space-md)}
.opo__c{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-md)}
.opo__c legend{float:left;margin-right:var(--space-md);font-weight:600}
.seg--r label{display:inline-flex}
.seg--r input{position:absolute;opacity:0;width:1px;height:1px}
.seg--r span{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 var(--space-lg);border-left:var(--rule-hair) solid var(--color-ink);font:700 var(--text-lg)/1 var(--font-display);cursor:pointer}
.seg--r label:first-child span{border-left:0}
.seg--r input:checked + span{background:var(--color-brand);color:var(--color-on-brand)}
.seg--r input:focus-visible + span{outline:2px solid var(--color-focus);outline-offset:-3px}
.opo__l{list-style:none;margin:0;padding:0}
.opo__l li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-md);padding:var(--space-sm) var(--space-sm);border-bottom:var(--rule-hair) solid var(--color-rule);color:var(--color-muted);transition:background-color var(--dur-short) var(--ease-out)}
.opo__l li.is-on{color:var(--color-ink);background:var(--color-paper-2);box-shadow:inset 3px 0 0 var(--color-brand)}
.opo__l li.is-on::before{content:none}
.opo > .small{margin:0}

/* ── B72 определение, B73 глоссарий, B74 статьи, B75 изменения ─ */
.def{border-top:3px solid var(--color-brand);padding-top:var(--space-md);display:grid;gap:var(--space-md)}
.def > *{margin:0}
.def__a{font-size:var(--text-lg);line-height:1.55;max-width:70ch}
.gl__az{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin:0 0 var(--space-sm);color:var(--color-muted)}
.gl__az span{padding:var(--space-2xs) var(--space-xs);border:var(--rule-hair) solid var(--color-rule);border-radius:var(--radius-sm)}
.gl{margin:0;display:grid;grid-template-columns:minmax(0,1fr);gap:0 var(--space-2xl);border-top:3px solid var(--color-brand)}
@media (min-width:56rem){.gl{grid-template-columns:repeat(2,minmax(0,1fr))}}
.gl > div{padding:var(--space-sm) 0;border-bottom:var(--rule-hair) solid var(--color-rule)}
.gl dt{font:700 var(--text-base)/1.3 var(--font-display);margin-bottom:var(--space-2xs)}
.gl dd{margin:0;color:var(--color-ink-2);font-size:var(--text-sm)}
.arts{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}
@media (min-width:56rem){.arts{grid-template-columns:repeat(3,minmax(0,1fr))}}
.art{display:grid;gap:var(--space-xs);align-content:start;border-top:3px solid var(--color-brand);padding-top:var(--space-md)}
.art .tag{justify-self:start}
.art b{font:700 var(--text-lg)/1.2 var(--font-display)}
.art p{margin:0;color:var(--color-ink-2)}
.art .need{margin:0}
.law{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-xl);border-top:3px solid var(--color-edge);padding-top:var(--space-lg)}
@media (min-width:56rem){.law{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}}
.law__d{display:grid;gap:var(--space-xs);align-content:start;background:var(--color-brand);color:var(--color-on-brand);padding:var(--space-lg)}
.law__d .k{color:var(--color-on-brand-2)}
.law__d > b{font:700 var(--text-display-s)/1 var(--font-display)}
.law__n{font-size:var(--text-sm);color:var(--color-on-brand-2)}
.law__n b{font:700 var(--text-2xl)/1 var(--font-display);color:var(--color-on-brand)}
.law__b{display:grid;gap:var(--space-md);align-content:start}
.law__b > *{margin:0}
.law__b .btn{justify-self:start}
.law__c{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}
@media (min-width:48rem){.law__c{grid-template-columns:repeat(2,minmax(0,1fr))}}
.law__c .k{margin:0 0 var(--space-xs)}

/* ── B76–B80 закрывающие ─ */
.fin{display:grid;gap:var(--space-lg);max-width:60rem}
.fin h2{font-size:var(--text-display-s);margin:0}
.fin--row{max-width:none;grid-template-columns:minmax(0,1fr);align-items:end}
@media (min-width:62rem){.fin--row{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--space-2xl)}}
.fin .k{margin:0 0 var(--space-xs)}
.lead--inline{max-width:none;grid-template-columns:minmax(0,1fr)}
@media (min-width:48rem){.lead--inline{grid-template-columns:repeat(2,minmax(0,1fr));align-items:end}.lead--inline .field:nth-of-type(3),.lead--inline .form-msg{grid-column:1 / -1}.lead--inline .field:nth-of-type(3){display:flex;flex-wrap:wrap;gap:var(--space-md);align-items:center;justify-content:space-between}}
.routes{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}
@media (min-width:56rem){.routes{grid-template-columns:repeat(3,minmax(0,1fr))}}
.route{display:grid;gap:var(--space-xs);align-content:start;border-top:3px solid var(--color-brand);padding-top:var(--space-md)}
.route b{font:700 var(--text-2xl)/1.1 var(--font-display)}
.route .code{color:var(--color-muted);font-size:var(--text-sm)}
.route .btn{justify-self:start;margin-top:var(--space-sm)}
.blk.band--deep{background:var(--color-brand-2);border-image:linear-gradient(var(--color-brand-2),var(--color-brand-2)) fill 0 / 0 / 0 100vmax;border-top:var(--space-2xs) solid var(--color-edge)}
.fst{display:grid;gap:var(--space-xl)}
.fst__l{font:700 var(--text-2xl)/1.15 var(--font-display);max-width:40ch;margin:0;text-wrap:balance}
.fst__c{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-sm)}
@media (min-width:56rem){.fst__c{grid-template-columns:repeat(3,minmax(0,1fr))}}
.fst__c li{border-top:var(--rule-hair) solid var(--color-brand-rule);padding-top:var(--space-sm);color:var(--color-on-brand)}
.fst__c li::before{content:"✓ ";color:var(--color-on-brand-2)}
.fst__r{margin:0;color:var(--color-on-brand-2);padding-top:var(--space-md);border-top:var(--rule-hair) solid var(--color-brand-rule)}
.fmap{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-lg) var(--space-xl)}
@media (min-width:56rem){.fmap{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:75rem){.fmap{grid-template-columns:repeat(8,minmax(0,1fr))}}
.fmap .k{margin:0 0 var(--space-xs);color:var(--color-on-brand-2)}
.fmap ul{list-style:none;margin:0 0 var(--space-md);padding:0;display:grid;gap:var(--space-2xs);font-size:var(--text-sm)}
.fmap a{text-decoration-color:var(--color-brand-rule)}
.fmap__l{margin:var(--space-xl) 0 0;padding-top:var(--space-md);border-top:var(--rule-hair) solid var(--color-brand-rule)}
@media (max-width:39.99rem){.ct td{grid-template-columns:minmax(0,6.5rem) minmax(0,1fr)}}

/* ════════════════════════════════════════════════════════════════════════════════
   ГЛАВНЫЙ ЭКРАН (heroes-hallmark-main.html, heroes/<id>.html) — 8 вариантов первого экрана.
   Экран .hx = шапка темы + .hx__scr на всю высоту окна (минус липкая служебная панель --sbx-h, её ставит heroes.js).
   Только токены темы: бумага, синие поля эмблемы (.hx__scr--band — те же переопределения, что у .blk.band),
   красная «ступенька» с белым кольцом 1 px на синем. Крупной эмблемы нет — она в шапке.
   Служебная полоса .hxs — не дизайн: тёмная, как панель болванки .sbx.
   ════════════════════════════════════════════════════════════════════════════════ */
.hx-page main{display:block}
.hx{min-height:calc(100svh - var(--sbx-h, 0px));display:flex;flex-direction:column;background:var(--color-paper);position:relative}
.hx > .nav{flex:none}
.hx__scr{flex:1 0 auto;display:flex;align-items:center;padding-block:var(--space-2xl)}
.hx__in{width:100%;max-width:var(--page-max);margin-inline:auto;padding-inline:var(--page-gutter)}
.hx [hidden]{display:none!important}
.hx h1{font-size:clamp(2rem, 1.3rem + 2.6vw, 3.5rem);line-height:1.04;max-width:22ch}
.hx .k{margin:0}
.hx .lede{max-width:56ch}
.hx .row{display:flex;flex-wrap:wrap;gap:var(--space-sm);align-items:center}
.hx__facts{margin:0}
.hx__grid{display:grid;gap:var(--space-xl);grid-template-columns:minmax(0,1fr)}
.hx__main{display:grid;gap:var(--space-lg);align-content:center;min-width:0}
@media (min-width:60rem){
  .hx__grid--split{grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--space-2xl);align-items:center}
  .hx__form .btn{width:100%}
}
.hx .lead{max-width:none}
.hx .lead textarea{min-height:4.5rem}
.hx__fsub{margin:calc(-1 * var(--space-xs)) 0 0;color:var(--color-muted)}

/* синее поле экрана и синяя плашка формы — токены как у .blk.band */
.hx__scr--band,.hx-blue{
  --color-ink: var(--color-on-brand); --color-ink-2: var(--color-on-brand); --color-muted: var(--color-on-brand-2);
  --color-rule: var(--color-brand-rule); --color-paper-2: var(--color-brand-2); --color-field-line: var(--color-band-field-line);
  --color-focus: var(--color-focus-on-brand); --color-error: oklch(84% 0.100 28); --color-success: oklch(86% 0.110 155);
  --btn-ring:#FFFFFF; --btn-drop:oklch(12% 0.03 275 / 0.45);
  background:var(--color-brand);color:var(--color-ink)}
.hx__scr--band .btn:not(.btn-line):focus-visible,.hx-blue .btn:not(.btn-line):focus-visible{outline-offset:5px}
.hx-blue a:not(.btn){color:var(--color-on-brand)}
/* лист на синем: токены бумаги возвращаются (класс .sheet темы); у ошибок и успеха — свои тёмные */
.hx .sheet{--color-error: oklch(47% 0.170 28); --color-success: oklch(48% 0.110 155)}
/* пустая строка статуса формы не держит место в сетке (иначе лишний зазор под кнопкой); в дереве доступности остаётся */
.hx .form-msg:empty{position:absolute}

/* служебная полоса между вариантами — не часть дизайна */
.hxs{background:#16191C;color:#D9DDE0;font:400 0.875rem/1.5 var(--font-body);border-top:1px solid #2B3035}
.hxs__in{max-width:var(--page-max);margin-inline:auto;padding:var(--space-md) var(--page-gutter);display:grid;gap:var(--space-xs) var(--space-xl);grid-template-columns:minmax(0,1fr)}
.hxs__n{margin:0;font:500 0.75rem/1.4 var(--font-mono);letter-spacing:0.08em;color:#8C949B}
.hxs__t{margin:0;font:700 1.125rem/1.25 var(--font-display);color:#FFFFFF}
.hxs__i{margin:0;max-width:80ch;color:#C9CED2}
.hxs__m{margin:0;display:grid;gap:var(--space-xs) var(--space-lg);grid-template-columns:minmax(0,1fr)}
.hxs__m dt{font:500 0.6875rem/1.4 var(--font-mono);letter-spacing:0.08em;text-transform:uppercase;color:#8C949B}
.hxs__m dd{margin:0;color:#E6E8EA}
.hxs__m .need{margin:2px 0}
.hxs__go{justify-self:start;display:inline-flex;align-items:center;min-height:2.25rem;padding:0 var(--space-md);border:1px solid #8C949B;border-radius:4px;color:#FFFFFF;text-decoration:none;font-weight:600;white-space:nowrap}
@media (hover:hover){.hxs__go:hover{background:#2B3035}}
.hxs :focus-visible{outline:2px solid #FFFFFF;outline-offset:2px}
@media (min-width:62rem){
  .hxs__in{grid-template-columns:minmax(0,4fr) minmax(0,8fr) auto;align-items:start}
  .hxs__n{grid-column:1 / -1}
  .hxs__t{grid-column:1}.hxs__i{grid-column:2}.hxs__go{grid-column:3;grid-row:2 / span 2}
  .hxs__m{grid-column:1 / 3;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.2fr)}
}
.hxs--intro .hxs__in{padding-block:var(--space-xl)}
.hxs__h{margin:0;font:700 clamp(1.5rem, 1.2rem + 1vw, 2rem)/1.15 var(--font-display);color:#FFFFFF;grid-column:1 / -1}
.hxs--intro .hxs__i{grid-column:1 / -1}
.hxs__toc{grid-column:1 / -1;list-style:none;margin:var(--space-xs) 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));gap:1px;background:#2B3035;border:1px solid #2B3035}
.hxs__toc a{display:flex;gap:var(--space-sm);align-items:baseline;padding:var(--space-sm);background:#16191C;color:#FFFFFF;text-decoration:none;height:100%}
.hxs__toc .code{color:#8C949B;font-size:0.75rem}
@media (hover:hover){.hxs__toc a:hover{background:#2B3035}}

/* ── 1. Форма захвата справа: бланк на синей плашке ─ */
.hx-blue{padding:var(--space-lg);border-top:var(--space-2xs) solid var(--color-edge);display:grid;gap:var(--space-sm);min-width:0}
.hx-blue .lead{background:none;padding:0}
.hx-blue .hx__alt{margin:0;color:var(--color-muted)}

/* ── 2. Подбор во всю ширину ─ */
.hx__grid--wide{gap:var(--space-lg)}
.hx__grid--wide h1{max-width:24ch}
.hx__plate{margin-top:0}
.hx__after .small{max-width:52ch}

/* ── 3. «Набор документов»: стопка листов (схема, не образец) ─ */
.hkit{margin:0;display:grid;gap:var(--space-sm);min-width:0}
.hkit__st{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-xs)}
.hdoc{position:relative;display:grid;gap:var(--space-2xs);padding:var(--space-sm) var(--space-md);background:var(--color-paper);border:var(--rule-hair) solid var(--color-rule);
  border-top:3px solid var(--color-brand);box-shadow:0 1px 2px oklch(21% 0.035 275 / 0.08),0 10px 24px -14px oklch(21% 0.035 275 / 0.35);
  margin-left:calc(var(--i) * 0.5rem);cursor:default;outline-offset:3px;
  transition:transform var(--dur-short) var(--ease-out),box-shadow var(--dur-short) var(--ease-out)}
.hdoc:last-child{border-top-color:var(--color-edge)}
.hdoc__hd{display:flex;justify-content:space-between;gap:var(--space-sm);align-items:baseline}
.hdoc__c{font:500 var(--text-xs)/1.2 var(--font-mono);letter-spacing:0.06em;color:var(--color-ink);padding:0.15rem 0.35rem;border:var(--rule-hair) solid var(--color-rule)}
.hdoc__n{font:500 var(--text-xs)/1 var(--font-mono);color:var(--color-muted)}
.hdoc__t{font:700 var(--text-lg)/1.2 var(--font-display)}
.hdoc__ln{display:none}
.hdoc__more{display:none;gap:var(--space-2xs)}
.hdoc__k{font:500 var(--text-xs)/1.2 var(--font-mono);letter-spacing:0.06em;text-transform:uppercase;color:var(--color-muted)}
.hdoc__s{font-size:var(--text-sm);color:var(--color-ink-2);line-height:1.45}
.hdoc__p{font:500 var(--text-sm)/1.35 var(--font-mono);color:var(--color-ink-2)}
.hdoc__p b{font-weight:600;color:var(--color-ink)}
.hdoc:hover .hdoc__more,.hdoc:focus .hdoc__more,.hdoc:focus-within .hdoc__more{display:grid}
@media (min-width:60rem){
  .hkit{justify-items:end}
  .hkit__st{display:block;position:relative;width:min(100%,27rem);height:31rem}
  .hdoc{position:absolute;margin:0;width:17.5rem;height:24rem;left:calc(var(--i) * 3rem);top:calc(var(--i) * 2.2rem);align-content:start;gap:var(--space-xs);
    padding:var(--space-md);transform:rotate(calc((var(--i) - 3) * 1.2deg));transform-origin:50% 100%;
    clip-path:polygon(0 0,calc(100% - 1.75rem) 0,100% 1.75rem,100% 100%,0 100%)}
  .hdoc::after{content:"";position:absolute;top:-3px;right:0;width:1.75rem;height:calc(1.75rem + 3px);background:linear-gradient(225deg,transparent 50%,var(--color-paper-3) 50%);pointer-events:none}
  .hdoc__ln{display:grid;gap:0.45rem;margin:var(--space-xs) 0 var(--space-sm)}
  .hdoc__ln i{display:block;height:0.4rem;background:var(--color-paper-3);border-radius:1px}
  .hdoc__ln i:nth-child(2){width:88%}.hdoc__ln i:nth-child(3){width:94%}.hdoc__ln i:nth-child(4){width:58%}
  .hdoc__more{display:grid;position:absolute;left:var(--space-md);right:var(--space-md);bottom:var(--space-md);padding-top:var(--space-sm);border-top:var(--rule-hair) solid var(--color-rule)}
  .hdoc:not(:last-child) .hdoc__more{visibility:hidden}
  .hdoc:hover .hdoc__more,.hdoc:focus .hdoc__more,.hdoc:focus-within .hdoc__more{visibility:visible}
  .hdoc:hover,.hdoc:focus,.hdoc:focus-within{z-index:10;transform:translate(-0.75rem,-1.25rem) rotate(0deg);box-shadow:0 2px 4px oklch(21% 0.035 275 / 0.1),0 24px 40px -18px oklch(21% 0.035 275 / 0.5)}
  .hkit figcaption{width:min(100%,27rem)}
}
/* фон-сетка «чертёжа» за стопкой */
@media (min-width:60rem){
  .hx--komplekt .hx__scr{background:
    linear-gradient(90deg,var(--color-paper) 52%,transparent 52%),
    linear-gradient(90deg,var(--color-rule-2) 1px,transparent 1px) 0 0 / 1.5rem 1.5rem,
    linear-gradient(var(--color-rule-2) 1px,transparent 1px) 0 0 / 1.5rem 1.5rem,var(--color-paper)}
}

/* ── 4. Цена в заголовке + квиз-старт ─ */
.hx__price span{display:block;color:var(--color-brand);font-size:1.3em;line-height:1;margin-top:0.1em;white-space:nowrap}
.hx__term{margin:0;font-size:var(--text-sm);color:var(--color-ink-2);margin-top:calc(-1 * var(--space-xs))}
.hq{display:grid;gap:var(--space-md);padding:var(--space-lg);border-top:3px solid var(--color-brand);min-width:0}
.hq__s1{display:grid;gap:var(--space-md)}
.hq .lead{padding:0;background:none}
.hq .btn{justify-self:stretch;width:100%}
.hq__sum{margin:0;padding:var(--space-sm) var(--space-md);background:var(--color-brand);color:var(--color-on-brand);font-size:var(--text-sm);line-height:1.45}
.hq .tlink{justify-self:start}
.hq .qstart__out{font-size:var(--text-base)}

/* ── 5. Две двери ─ */
.hx__grid--doors{gap:var(--space-xl)}
.hx__head{display:grid;gap:var(--space-md)}
@media (min-width:60rem){
  .hx__head{grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:var(--space-2xl);align-items:end}
  .hx__head .k{grid-column:1 / -1}
  .hx__head .lede{margin-bottom:0.4rem}
}
.hdoors{display:grid;gap:var(--space-lg);grid-template-columns:minmax(0,1fr)}
@media (min-width:48rem){.hdoors{grid-template-columns:repeat(2,minmax(0,1fr))}}
.hdoor{position:relative;display:grid;gap:var(--space-md);grid-template-rows:auto auto auto 1fr auto;align-content:start;min-width:0;
  padding:var(--space-lg) calc(var(--space-lg) + 1.5rem) var(--space-lg) var(--space-lg);
  background:var(--color-paper-2);border:var(--rule-bold) solid var(--color-ink);border-top:var(--space-2xs) solid var(--color-brand);border-radius:var(--radius-md) var(--radius-md) 0 0;
  transform-origin:0 50%;transition:transform var(--dur-short) var(--ease-out),box-shadow var(--dur-short) var(--ease-out)}
.hdoor::after{content:"";position:absolute;right:0.75rem;top:50%;width:0.5rem;height:4.5rem;transform:translateY(-50%);border-radius:0.25rem;
  background:linear-gradient(90deg,var(--color-rule),var(--color-paper-3) 60%,var(--color-rule));box-shadow:0 1px 2px oklch(21% 0.035 275 / 0.35)}
.hdoor__no{justify-self:start;font-size:var(--text-xs);letter-spacing:0.08em;padding:0.2rem 0.5rem;border:var(--rule-hair) solid var(--color-ink);color:var(--color-ink)}
.hx .hdoor__t{font-size:var(--text-2xl);margin:0;color:var(--color-ink)}
.hdoor__d{margin:0;color:var(--color-ink-2)}
.hdoor__p{list-style:none;margin:0;padding:0;border-top:var(--rule-bold) solid var(--color-ink);align-self:start}
.hdoor__p li{display:flex;justify-content:space-between;gap:var(--space-sm);align-items:baseline;padding:var(--space-xs) 0;border-bottom:var(--rule-hair) solid var(--color-rule);font-size:var(--text-sm)}
.hdoor__p b{font-size:var(--text-sm);white-space:nowrap;text-align:right}
.hdoor .btn{justify-self:start}
.hdoor--b{
  --color-ink: var(--color-on-brand); --color-ink-2: var(--color-on-brand); --color-muted: var(--color-on-brand-2);
  --color-rule: var(--color-brand-rule); --color-focus: var(--color-focus-on-brand);
  --btn-ring:#FFFFFF; --btn-drop:oklch(12% 0.03 275 / 0.45);
  background:var(--color-brand);color:var(--color-ink);border-color:var(--color-brand-2);border-top-color:var(--color-edge)}
.hdoor--b::after{background:linear-gradient(90deg,var(--color-on-brand-2),var(--color-on-brand) 60%,var(--color-on-brand-2))}
.hdoor--b .btn:not(.btn-line):focus-visible{outline-offset:5px}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .hdoor:hover{transform:perspective(1600px) rotateY(-4deg);box-shadow:14px 18px 36px -22px oklch(21% 0.035 275 / 0.6)}
}

/* ── 6. Проверка документа поставщика ─ */
.hx .lead input.hx__num:not([type="checkbox"]):not([type="radio"]):not([type="file"]){min-height:3.5rem;font:500 var(--text-lg)/1.2 var(--font-mono);letter-spacing:0.02em}
.hx__kv{margin-top:var(--space-xs)}

/* ── 7. Для импортёра: порядок до таможни ─ */
.hroute{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);border-top:3px solid var(--color-ink)}
.hroute li{display:grid;gap:var(--space-2xs);align-content:start;padding:var(--space-sm) var(--space-md) var(--space-sm) 0;border-bottom:var(--rule-hair) solid var(--color-rule)}
.hroute .code{font-size:var(--text-xs);color:var(--color-muted)}
.hroute b{font:700 var(--text-base)/1.25 var(--font-display)}
.hroute small{font-size:var(--text-sm);color:var(--color-muted)}
@media (min-width:40rem){
  .hroute{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hroute li{border-bottom:0;padding-left:var(--space-md);border-left:var(--rule-hair) solid var(--color-rule)}
  .hroute li:first-child{padding-left:0;border-left:0}
}
.hx__drop{padding:var(--space-sm) var(--space-md)}

/* ── 8. Шильдик оборудования: металлическая табличка, поля = подбор ─ */
.npl{
  --st-hi: oklch(95% 0.006 275); --st: oklch(86% 0.012 275); --st-lo: oklch(74% 0.016 275); --engr: oklch(27% 0.035 275);
  --color-ink: var(--engr); --color-ink-2: oklch(33% 0.032 275); --color-muted: oklch(40% 0.025 275); --color-focus: oklch(55% 0.200 21);
  --btn-ring:transparent; --btn-drop:oklch(21% 0.035 275 / 0.35);
  position:relative;padding:1.4rem;border-radius:0.75rem;color:var(--engr);min-width:0;
  background:repeating-linear-gradient(90deg,oklch(100% 0 0 / 0.09) 0 1px,transparent 1px 3px),linear-gradient(160deg,var(--st-hi),var(--st) 45%,var(--st-lo));
  box-shadow:inset 0 1px 0 oklch(100% 0 0 / 0.8),inset 0 -2px 0 oklch(0% 0 0 / 0.18),0 2px 0 oklch(12% 0.03 275 / 0.35),0 28px 50px -24px oklch(12% 0.03 275 / 0.9)}
.npl__rv{position:absolute;width:0.8rem;height:0.8rem;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,oklch(99% 0 0),var(--st-lo) 55%,oklch(52% 0.02 275));box-shadow:0 1px 1px oklch(0% 0 0 / 0.4),inset 0 -1px 1px oklch(0% 0 0 / 0.2)}
.npl__rv:nth-child(1){top:0.5rem;left:0.5rem}.npl__rv:nth-child(2){top:0.5rem;right:0.5rem}
.npl__rv:nth-child(3){bottom:0.5rem;left:0.5rem}.npl__rv:nth-child(4){bottom:0.5rem;right:0.5rem}
.npl__in{border:2px solid oklch(27% 0.035 275 / 0.55);border-radius:0.35rem;padding:var(--space-md) var(--space-lg);
  box-shadow:inset 0 1px 0 oklch(100% 0 0 / 0.55),0 1px 0 oklch(100% 0 0 / 0.55)}
.npl__hd{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-2xs) var(--space-md);align-items:baseline;margin:0 0 var(--space-xs);padding-bottom:var(--space-xs);
  border-bottom:2px solid oklch(27% 0.035 275 / 0.55);box-shadow:0 1px 0 oklch(100% 0 0 / 0.55);
  font:700 var(--text-lg)/1.1 var(--font-display);text-transform:uppercase;letter-spacing:0.08em;text-shadow:0 1px 0 oklch(100% 0 0 / 0.6)}
.npl__hd .code{font-size:var(--text-xs);letter-spacing:0.1em}
.npl__row{display:grid;grid-template-columns:minmax(0,7rem) minmax(0,1fr);gap:var(--space-sm);align-items:baseline;padding:0.6rem 0;
  border-bottom:var(--rule-hair) solid oklch(27% 0.035 275 / 0.3);box-shadow:0 1px 0 oklch(100% 0 0 / 0.45)}
.npl__k{font:500 var(--text-xs)/1.3 var(--font-mono);letter-spacing:0.1em;text-transform:uppercase;text-shadow:0 1px 0 oklch(100% 0 0 / 0.6)}
.npl__v{font-weight:600;line-height:1.3;text-shadow:0 1px 0 oklch(100% 0 0 / 0.65),0 -1px 0 oklch(0% 0 0 / 0.12);overflow-wrap:anywhere}
.npl__v.code{font-size:var(--text-lg)}
.npl:not(.has-result) .npl__v{color:oklch(40% 0.025 275 / 0.7)}
.npl.is-new .npl__v{animation:hx-engrave 700ms var(--ease-out) both}
.npl.is-new .npl__row:nth-of-type(3) .npl__v{animation-delay:80ms}.npl.is-new .npl__row:nth-of-type(4) .npl__v{animation-delay:160ms}.npl.is-new .npl__row:nth-of-type(5) .npl__v{animation-delay:240ms}
@keyframes hx-engrave{from{opacity:0;filter:blur(3px);letter-spacing:0.12em}to{opacity:1;filter:none;letter-spacing:normal}}
.npl__row--in{align-items:center}
.npl input{width:100%;min-width:0;min-height:3rem;padding:0 var(--space-sm);border:0;border-bottom:2px solid var(--engr);border-radius:var(--radius-sm) var(--radius-sm) 0 0;
  background:oklch(98% 0.004 275 / 0.6);box-shadow:inset 0 1px 3px oklch(0% 0 0 / 0.18);color:var(--engr);font:600 var(--text-lg)/1.2 var(--font-body);outline:2px solid transparent;outline-offset:1px}
.npl input::placeholder{color:oklch(40% 0.025 275 / 0.75);font-weight:400}
.npl input:focus{outline:2px solid var(--color-focus);outline-offset:1px}
.npl__go{display:flex;flex-wrap:wrap;gap:var(--space-sm) var(--space-md);align-items:center;margin-top:var(--space-md)}
.npl .hints{margin:0;color:var(--color-muted)}
.npl .hints button{color:var(--engr)}
.hx__note{margin:0;max-width:52ch}

/* ── телефон: действие и поле — на первом экране, подробности (факты, шкалы) — под ним ─ */
@media (max-width:59.99rem){
  .hx__grid--split{gap:var(--space-md)}
  .hx__grid--split > .hx__main{display:contents}
  .hx__grid--split .hx__facts,.hx__kv,.hroute,.hx__note{order:9}
}
@media (max-width:39.99rem){
  .hx__scr{padding-block:var(--space-md) var(--space-xl);align-items:flex-start}
  .hx h1{font-size:clamp(1.75rem, 1.2rem + 3vw, 2.125rem);line-height:1.06}
  .hx .lede{font-size:var(--text-base);line-height:1.45}
  .hx-blue{padding:var(--space-md)}
  .hx-blue .lead{gap:var(--space-sm)}
  .hx--import .lede{order:9}
  .hq{padding:var(--space-md);gap:var(--space-sm)}
  .hq .opts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hq .opt{padding:var(--space-xs) var(--space-sm);grid-template-columns:1.1rem minmax(0,1fr);gap:var(--space-xs)}
  .hq .opt b{font-size:var(--text-sm)}
  .hq .opt small{display:none}
  .hx--cena .lede{order:9}
  .hdoor{padding:var(--space-md) calc(var(--space-md) + 1.25rem) var(--space-md) var(--space-md);gap:var(--space-sm)}
  .hdoor__d{display:none}
  .hx .hdoor__t{font-size:var(--text-lg)}
  .hx__grid--doors{gap:var(--space-md)}
  .npl{padding:1rem}
  .npl__in{padding:var(--space-sm) var(--space-md)}
  .npl__row{grid-template-columns:minmax(0,5.5rem) minmax(0,1fr);padding:0.45rem 0}
  .npl__row--in{grid-template-columns:minmax(0,1fr);gap:var(--space-2xs)}
  .npl__hd{font-size:var(--text-base)}
}
@media (prefers-reduced-motion:reduce){
  .hdoc,.hdoor{transition:none}
  .npl.is-new .npl__v{animation:none}
}

/* ── Доработка вариантов 1 и 2 к A/B-тесту (28.10): сгиб 375×667, ответ подбора, успех в плашке ─ */
/* успех формы прямо в плашке: поля прячем, показываем итог (.hx__ok ставит heroes.js) */
.hx__form.is-done > :not(.hx__ok){display:none}
.hx__ok{display:grid;gap:var(--space-sm);justify-items:start}
.hx__ok:focus{outline:none}
.hx__ok-t{margin:0;display:flex;align-items:center;gap:var(--space-sm);font:700 1.375rem/1.15 var(--font-display);color:var(--color-ink)}
.hx__ok-t::before{content:"";flex:none;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--color-success) no-repeat center / 1rem
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3L13 4.5' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.hx-blue .hx__ok-t::before,.hx__scr--band .hx__ok-t::before{background-color:oklch(48% 0.110 155)}
.hx__ok-d{margin:0;max-width:40ch}
.hx__ok-d b{font-weight:600;overflow-wrap:anywhere}
.hx__ok-n{margin:0;color:var(--color-muted)}
.hx__ok .btn{width:auto}

/* поля формы на синем: бумага поля светлая, значит текст и подсказка — тёмные (было: белый текст на белом поле) */
.hx-blue .lead :is(input,textarea),.hx__scr--band .lead :is(input,textarea){--color-ink: oklch(21% 0.035 275); --color-muted: oklch(47% 0.022 275)}
/* вариант 2: ответ подбора — цена не рвётся посередине, регламент переносится по пробелам */
.hx .plate-out dd.code{overflow-wrap:normal;font-size:clamp(1.125rem, 0.5rem + 1.3vw, 1.625rem);line-height:1.15}
.hx .plate-out [data-out="p"]{white-space:nowrap}
@media (min-width:48rem){.hx .plate-out{grid-template-columns:minmax(0,1.15fr) minmax(0,1.5fr) minmax(0,0.9fr) minmax(0,1.1fr)}}
/* высокий десктоп (1920×1080): экран не выше 56rem — меньше пустых полей сверху и снизу, ниже виден следующий блок */
@media (min-width:60rem){.hx--forma,.hx--podbor{min-height:min(calc(100svh - var(--sbx-h, 0px)), 56rem)}}
/* подсказки подбора на сенсорном экране (планшет) — касание не меньше 44 px */
@media (pointer:coarse){.hx .plate .hints button{min-height:2.75rem}}
/* форма расчёта под подбором (открывает «Получить расчёт») */
.hx__lead{max-width:40rem}
.hx__lead .lead{max-width:none}

@media (max-width:39.99rem){
  /* вариант 1: поле и кнопка формы — до сгиба 667 px; лид и факты — под формой */
  .hx--forma .lede{order:9}
  /* вариант 2: плашка плотнее, подсказки — одна строка-лента кнопок 44 px, ответ — таблица «подпись | значение» */
  .hx .plate{padding:var(--space-md) var(--space-md) 0}
  .hx .plate .hints{flex-wrap:nowrap;white-space:nowrap;overflow-x:auto;align-items:center;gap:var(--space-xs);margin-inline:calc(-1 * var(--space-md));
    padding:0 var(--space-md) 2px;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
  .hx .plate .hints::-webkit-scrollbar{display:none}
  .hx .plate .hints button{min-height:2.75rem;padding:0 var(--space-sm);border:1px solid var(--color-field-line, var(--color-rule));border-radius:4px;background:var(--color-paper);text-decoration:none;flex:none}
  .hx .plate-out{margin:var(--space-md) calc(-1 * var(--space-md)) 0;grid-template-columns:max-content minmax(0,1fr)}
  .hx .plate-out dt,.hx .plate-out dd{border-top:var(--rule-hair) solid var(--color-brand-rule)}
  .hx .plate-out dt{padding:calc(var(--space-sm) + 0.3rem) 0 var(--space-sm) var(--space-md)}
  .hx .plate-out dd{padding:var(--space-sm) var(--space-md) var(--space-sm) var(--space-xs);min-height:0}
  .hx .plate-out dt:first-child,.hx .plate-out dd:nth-child(2){border-top:0}
  .hx .plate-out dd.code{font-size:1.125rem;line-height:1.3}
  .hx__after .btn{width:100%}
}