/* =====================================================================
   КВАНТ — дизайн-система «Engineered Precision»
   Графит + латунь (из логотипа) + сталь. Премиум B2B / industrial.
   ===================================================================== */

:root{
  /* База — графит */
  --c-ink-900:#0E1116; --c-ink-800:#14181E; --c-ink-700:#1E232B; --c-ink-600:#2A3038;
  /* Бумага */
  --c-paper-50:#F6F1E9; --c-paper-100:#EFE7D9; --c-paper-200:#E2D8C7;
  /* Латунь / янтарь (акцент из лого) */
  --c-brass-300:#DCB877; --c-brass-500:#E3A23D; --c-brass-600:#C8472B;
  /* Сталь (из лого) */
  --c-steel-500:#506472; --c-steel-300:#8A97A2;
  /* Текст */
  --c-text-ondark:#ECE7DD; --c-text-onlight:#1A1D22;
  --c-success:#3E7D5A; --c-danger:#B23A2E;

  --c-bg:var(--c-ink-800); --c-fg:var(--c-text-ondark);

  /* Типографика */
  /* Русскоязычный сайт → весь набор с полной кириллицей.
     Manrope (заголовки/текст) + JetBrains Mono (моно-акценты). */
  --f-display:"Manrope",system-ui,sans-serif;
  --f-head:"Manrope",system-ui,sans-serif;
  --f-body:"Manrope",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,monospace;

  /* Сетка */
  --topbar-h:44px;
  --mainrow-h:72px;           /* высота основного ряда шапки */
  --header-h:72px;            /* высота фикс-шапки (моб. — без верхней строки) */
  --container:1280px;
  --s-1:8px; --s-2:16px; --s-3:24px; --s-4:32px; --s-6:48px; --s-8:64px; --s-12:96px; --s-16:128px;
  --r-sm:4px; --r-md:8px; --r-lg:12px;

  --shadow-card:0 10px 30px rgba(8,10,14,.28);
  --shadow-soft:0 6px 18px rgba(8,10,14,.18);

  --ease:cubic-bezier(.2,.6,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur-fast:160ms; --dur:280ms; --dur-slow:560ms;
}

/* ---------------- reset / base ---------------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--c-bg); color:var(--c-fg);
  font-family:var(--f-body); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,video{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:0; background:none; color:inherit; }
h1,h2,h3,h4{ margin:0; font-family:var(--f-head); font-weight:600; line-height:1.1; letter-spacing:-.01em; }
p{ margin:0 0 var(--s-2); }
ul,ol{ margin:0; padding:0; list-style:none; }

.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:24px; }
@media(min-width:768px){ .container{ padding-inline:48px; } }
/* На десктопе шапка выше на верхнюю строку со значками */
@media(min-width:981px){ :root{ --mainrow-h:84px; --header-h:128px; } }
/* Раньше сужал контент до 820px — теперь блоки во всю ширину контейнера, как шапка. */
.narrow{ max-width:var(--container); margin-inline:auto; }
.mono{ font-family:var(--f-mono); font-size:13px; letter-spacing:.1em; text-transform:uppercase; }
.muted{ color:var(--c-steel-300); }
.arrow{ font-style:normal; transition:transform var(--dur) var(--ease); display:inline-block; }

.vh{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link{ position:absolute; left:-9999px; }
.skip-link:focus{ left:16px; top:16px; z-index:200; background:var(--c-brass-500); color:#111; padding:10px 16px; border-radius:var(--r-sm); }

/* ---------------- buttons ---------------- */
.btn{
  --bg:var(--c-brass-500); --fg:#15110A;
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--f-head); font-weight:600; font-size:15px; letter-spacing:.01em;
  padding:14px 24px; border-radius:var(--r-sm); background:var(--bg); color:var(--fg);
  transition:transform var(--dur-fast) var(--ease), box-shadow var(--dur) var(--ease), background var(--dur) var(--ease), color var(--dur) var(--ease);
  will-change:transform; overflow:hidden; white-space:nowrap;
}
.btn:active{ transform:scale(.98); }
.btn--primary{ box-shadow:0 6px 22px rgba(227,162,61,.28); }
.btn--primary:hover{ background:var(--c-brass-300); box-shadow:0 10px 30px rgba(227,162,61,.36); }
.btn--secondary{ --bg:transparent; --fg:var(--c-text-ondark); border:1px solid var(--c-steel-500); }
.btn--secondary:hover{ border-color:var(--c-brass-500); color:var(--c-brass-300); }
.btn--ghost{ --bg:transparent; --fg:var(--c-text-ondark); border:1px solid rgba(236,231,221,.28); }
.btn--ghost:hover{ border-color:var(--c-brass-500); color:var(--c-brass-300); }
.btn--sm{ padding:10px 16px; font-size:14px; }
.btn--lg{ padding:17px 32px; font-size:16px; }
.btn--block{ display:flex; width:100%; }
/* deep-секции тёмные — спец-стили кнопок для светлого фона больше не нужны */

/* ---------------- header ---------------- */
.site-header{ position:fixed; inset:0 0 auto 0; z-index:90; transition:background var(--dur) var(--ease), border-color var(--dur) var(--ease), backdrop-filter var(--dur); border-bottom:1px solid transparent; }
.site-header.is-stuck{ background:rgba(14,17,22,.9); backdrop-filter:blur(16px); border-bottom-color:var(--c-ink-600); }
/* Меню живёт внутри шапки (её stacking-context, z:90). Пока меню открыто, поднимаем
   всю шапку над cookie-баннером (z:110) и прочими fixed-элементами. */
.site-header.is-menu-open{ z-index:140; }

/* ===== верхняя утилитарная строка: статусы доверия (слева) + контакты и соцсети (справа) ===== */
.topbar{ border-bottom:1px solid rgba(236,231,221,.1); background:rgba(14,17,22,.5); }
.site-header.is-stuck .topbar{ background:transparent; border-bottom-color:rgba(236,231,221,.06); }
.topbar__inner{ display:flex; align-items:center; justify-content:space-between; gap:16px 28px; min-height:var(--topbar-h); padding-block:8px; }
.topbar__badges{ display:flex; align-items:center; flex-wrap:nowrap; gap:8px 22px; min-width:0; overflow:hidden; }
.topbar__badge{ display:inline-flex; align-items:center; gap:10px; white-space:nowrap; }
.topbar__badge img{ height:24px; width:auto; max-width:56px; object-fit:contain; flex:none; }
.topbar__badge span{ font-family:var(--f-mono); font-size:11px; letter-spacing:.01em; line-height:1.25; color:var(--c-steel-300); }
/* Бейдж-ссылка: display:contents — анкер не создаёт бокс, img+подпись остаются flex-детьми бейджа
   (раскладка не меняется ни на десктопе, ни в мобильной колонке), но кликабельны. */
.topbar__badge-link{ display:contents; }
.topbar__badge-link img,.topbar__badge-link span{ cursor:pointer; transition:color var(--dur,.2s); }
.topbar__badge-link:hover span{ color:var(--c-text-ondark); }
.topbar__contacts{ display:flex; align-items:center; gap:18px; flex:none; }
.topbar__phone{ font-family:var(--f-head); font-weight:600; font-size:15px; letter-spacing:.01em; color:var(--c-text-ondark); white-space:nowrap; transition:color var(--dur) var(--ease); }
.topbar__phone:hover{ color:var(--c-brass-300); }
.socials{ display:inline-flex; align-items:center; gap:8px; }
.socials--topbar{ padding-left:18px; border-left:1px solid var(--c-ink-600); }
/* Кнопки соцсетей: тёмная плитка с тонкой рамкой + значок в фирменном цвете
   (заметно, но в духе графит+латунь). На наведении плитка заливается фирменным
   цветом, значок белеет. */
.social-link{ display:inline-grid; place-items:center; width:32px; height:32px; flex:none;
  background:transparent; border:1px solid rgba(236,231,221,.14); border-radius:var(--r-sm);
  transition:transform var(--dur) var(--ease),background var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease); }
.social-link svg{ width:18px; height:18px; display:block; }
/* цвет значка по умолчанию */
.social-link--telegram{ color:#3aa9e6; }
.social-link--vk{ color:#4d8dff; }
/* MAX — заливка градиентом задаётся inline на <path> (id уникален на каждый вывод партиала,
   см. socials.php); жёсткая ссылка на общий #kvmaxC убрана, иначе ломалась на мобиле. */
/* наведение: заливка фирменным цветом, значок белеет */
.social-link:hover{ transform:translateY(-1px); color:#fff; border-color:transparent; }
.social-link--telegram:hover{ background:linear-gradient(180deg,#2aabee,#229ed9); }
.social-link--vk:hover{ background:#0077ff; }
.social-link--max:hover{ background:linear-gradient(135deg,#4cf,#53e 66%,#93d); }
.social-link--max:hover svg path{ fill:#fff; }
.social-link:focus-visible{ outline:2px solid var(--c-brass-300); outline-offset:2px; }
/* Топбар: контейнер ограничен 1280px → полезная ширина строки ≈1184px на любом
   широком экране. Считаем по контейнеру (vw−96, но не больше 1184): бейджи (242/335/249,
   +22 гэп) + контакты (телефон 135 + соцсети 125 + 18 = 278) + гэп 28 между группами.
   Бейджи отбрасываются с конца до того, как перестанут влезать; overflow:hidden — страховка. */
@media(max-width:1279px){ .topbar__badge:nth-child(3){ display:none; } } /* 3 бейджа влезают только при контейнере на максимуме (vw≥1280) */
@media(max-width:1000px){ .topbar__badge:nth-child(2){ display:none; } } /* 2 бейджа+контакты требуют 905px → vw≥1001 */
/* На мобиле верхняя строка не прячется, а показывает 3 бейджа доверия колонками
   (логотип + подпись по центру). Контакты убраны (телефон — в меню и нижней панели).
   Высота строки учтена в --header-h ниже, чтобы контент не уходил под фикс-шапку. */
@media(max-width:980px){
  :root{ --header-h:150px; }
  .topbar{ display:block; }
  .topbar__contacts{ display:none; }
  .topbar__inner{ justify-content:center; min-height:0; padding-block:8px; gap:0; }
  .topbar__badges{ width:100%; gap:8px; overflow:visible; justify-content:space-between; align-items:flex-start; }
  .topbar__badge{ display:flex; flex:1 1 0; min-width:0; flex-direction:column; align-items:center; text-align:center; gap:5px; white-space:normal; }
  .topbar__badge:nth-child(2),.topbar__badge:nth-child(3){ display:flex; } /* перебиваем скрытие 2/3 бейджа на узких ширинах (выше) */
  .topbar__badge img{ height:18px; max-width:48px; }
  .topbar__badge span{ font-size:9px; line-height:1.25; letter-spacing:.01em; color:var(--c-steel-300); }
}

/* ===== основной ряд: логотип + навигация + действия ===== */
.site-header__inner{ display:flex; align-items:center; gap:32px; height:var(--mainrow-h); }
.brand{ display:flex; align-items:center; gap:16px; flex:none; }
.brand__logo{ height:38px; width:auto; }
.brand__tag{ color:var(--c-steel-300); font-family:var(--f-mono); font-size:10px; letter-spacing:.18em; line-height:1.2; text-transform:uppercase; white-space:nowrap; padding-left:16px; border-left:1px solid var(--c-ink-600); }
@media(max-width:1240px){ .brand__tag{ display:none; } }

.nav{ margin-inline-start:auto; }
.nav__list{ display:flex; align-items:center; gap:6px; }
.nav__link{ display:inline-flex; align-items:center; gap:7px; font-family:var(--f-head); font-weight:500; font-size:16px; color:var(--c-text-ondark); position:relative; padding:10px 14px; border-radius:var(--r-sm); white-space:nowrap; transition:color var(--dur) var(--ease),background var(--dur) var(--ease); }
.nav__link:hover{ color:var(--c-brass-300); background:rgba(236,231,221,.045); }
.nav__item--drop:hover>.nav__link,.nav__item--drop:focus-within>.nav__link{ color:var(--c-brass-300); background:rgba(236,231,221,.045); }
.nav__caret{ width:7px; height:7px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-1px); opacity:.55; transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease); }
.nav__item--drop:hover .nav__caret,.nav__item--drop:focus-within .nav__caret{ opacity:1; transform:rotate(225deg) translateY(-1px); }

.site-header__actions{ display:flex; align-items:center; gap:16px; flex:none; }

/* ===== единое выпадающее меню: Каталог / Компания / Сервис ===== */
.nav__item--drop{ position:relative; }
.nav-panel{ position:absolute; top:100%; left:0; padding-top:14px; opacity:0; visibility:hidden; transform:translateY(10px);
  transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease),visibility var(--dur); z-index:60; }
.nav__item--drop:hover>.nav-panel,.nav__item--drop:focus-within>.nav-panel{ opacity:1; visibility:visible; transform:none; }
.nav-panel__card{ background:var(--c-ink-900); border:1px solid var(--c-ink-600); border-radius:var(--r-md); box-shadow:var(--shadow-card); padding:10px; }
/* список (Компания / Сервис) */
.nav-panel__list{ display:flex; flex-direction:column; min-width:290px; }
.nav-drop-link{ display:block; padding:12px 14px; border-radius:var(--r-sm); transition:background var(--dur) var(--ease); }
.nav-drop-link:hover{ background:var(--c-ink-700); }
.nav-drop-link__title{ display:block; font-family:var(--f-head); font-weight:600; font-size:15px; color:var(--c-text-ondark); }
.nav-drop-link:hover .nav-drop-link__title{ color:var(--c-brass-300); }
.nav-drop-link__note{ display:block; font-size:12.5px; color:var(--c-steel-300); margin-top:3px; }
/* широкая панель — Каталог */
.nav-panel--wide .nav-panel__card{ width:min(640px,86vw); padding:18px; }
.nav-panel__head{ display:flex; align-items:baseline; justify-content:space-between; gap:20px; margin:2px 4px 14px; padding-bottom:12px; border-bottom:1px solid var(--c-ink-700); }
.nav-panel__eyebrow{ color:var(--c-steel-300); }
.nav-panel__all{ font-family:var(--f-head); font-weight:600; font-size:13px; color:var(--c-brass-300); display:inline-flex; align-items:center; gap:7px; }
.nav-panel__all:hover .arrow{ transform:translateX(5px); }
.nav-panel__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:6px; }
.nav-card{ position:relative; display:flex; flex-direction:column; gap:5px; padding:14px 42px 14px 14px; border-radius:var(--r-sm); border:1px solid transparent; transition:border-color var(--dur),background var(--dur); }
.nav-card:hover{ border-color:var(--c-ink-600); background:var(--c-ink-800); }
.nav-card__title{ font-family:var(--f-head); font-weight:600; font-size:15px; color:var(--c-text-ondark); }
.nav-card:hover .nav-card__title{ color:var(--c-brass-300); }
.nav-card__text{ color:var(--c-steel-300); font-size:12.5px; line-height:1.4; }
.nav-card__go{ position:absolute; right:14px; top:50%; transform:translateY(-50%) translateX(-6px); color:var(--c-brass-500); opacity:0; transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease); }
.nav-card:hover .nav-card__go{ opacity:1; transform:translateY(-50%); }

.burger{ display:none; flex-direction:column; justify-content:center; gap:5px; padding:8px; width:46px; height:46px; border:1px solid var(--c-ink-600); border-radius:var(--r-sm); transition:border-color var(--dur) var(--ease); }
.burger:hover{ border-color:var(--c-brass-500); }
.burger span{ width:24px; height:2px; background:var(--c-text-ondark); border-radius:2px; transition:transform var(--dur) var(--ease), opacity var(--dur) var(--ease); }
.burger.is-active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.burger.is-active span:nth-child(2){ opacity:0; }
.burger.is-active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ---- мобильное меню: полноэкранное модальное окно ---- */
.mobile-menu{ position:fixed; inset:0; z-index:120; }
.mobile-menu[hidden]{ display:none !important; }
.mobile-menu__panel{ position:absolute; inset:0; display:flex; flex-direction:column; background:var(--c-ink-900);
  background-image:linear-gradient(rgba(236,231,221,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(236,231,221,.022) 1px,transparent 1px); background-size:48px 48px;
  opacity:0; transform:translateY(14px); transition:opacity .3s var(--ease),transform .34s cubic-bezier(.4,0,.2,1); }
.mobile-menu.is-open .mobile-menu__panel{ opacity:1; transform:none; }

.mobile-menu__top{ display:flex; align-items:center; justify-content:space-between; flex:none; padding:14px 20px; border-bottom:1px solid var(--c-ink-700); }
.mobile-menu__top .brand__logo{ height:32px; }
.mobile-menu__close{ position:relative; width:46px; height:46px; flex:none; border:1px solid var(--c-ink-600); border-radius:var(--r-sm); transition:border-color var(--dur) var(--ease); }
.mobile-menu__close:hover{ border-color:var(--c-brass-500); }
.mobile-menu__close span{ position:absolute; left:11px; top:22px; width:24px; height:2px; background:var(--c-text-ondark); border-radius:2px; }
.mobile-menu__close span:first-child{ transform:rotate(45deg); }
.mobile-menu__close span:last-child{ transform:rotate(-45deg); }

/* прокручивается только содержимое меню — фон под ним заблокирован (JS: body overflow hidden) */
.mobile-menu__scroll{ flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }

.mnav{ display:flex; flex-direction:column; gap:26px; padding:24px 20px 10px; max-width:560px; margin-inline:auto; }
.mnav__group{ display:flex; flex-direction:column; }
.mnav__head{ display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:12px; }
.mnav__head .mnav__label{ margin-bottom:0; }
.mnav__label{ display:block; color:var(--c-steel-300); font-size:11px; margin-bottom:12px; }
.mnav__all{ font-family:var(--f-head); font-weight:600; font-size:13px; color:var(--c-brass-300); display:inline-flex; align-items:center; gap:7px; flex:none; }
.mnav__all:active .arrow{ transform:translateX(4px); }

/* карточки каталога — как мега-меню на ПК */
.mnav__cards{ display:grid; grid-template-columns:1fr; gap:8px; }
@media(min-width:420px){ .mnav__cards{ grid-template-columns:1fr 1fr; } }
.mnav-card{ position:relative; display:flex; flex-direction:column; gap:5px; padding:14px 34px 14px 14px; border:1px solid var(--c-ink-600); border-radius:var(--r-md); background:var(--c-ink-800); transition:border-color var(--dur),background var(--dur); }
.mnav-card:active{ border-color:var(--c-brass-500); background:var(--c-ink-700); }
.mnav-card__title{ font-family:var(--f-head); font-weight:600; font-size:15px; line-height:1.2; }
.mnav-card__text{ color:var(--c-steel-300); font-size:12px; line-height:1.35; }
.mnav-card__go{ position:absolute; right:12px; top:13px; color:var(--c-brass-500); font-size:14px; }

/* Выделенный пункт «Честный ЗНАК» — поднят на первый экран мобильного меню. */
.mnav-feature{ display:flex; align-items:center; gap:14px; padding:14px 16px;
  border:1px solid var(--c-ink-600); border-left:2px solid var(--c-brass-500); border-radius:var(--r-md);
  background:var(--c-ink-800); transition:border-color var(--dur),background var(--dur); }
.mnav-feature:active{ background:var(--c-ink-700); }
.mnav-feature__ico{ width:36px; height:36px; object-fit:contain; flex:none; }
.mnav-feature__body{ display:flex; flex-direction:column; gap:3px; min-width:0; flex:1; }
.mnav-feature__title{ font-family:var(--f-head); font-weight:600; font-size:17px; line-height:1.15; }
.mnav-feature__note{ color:var(--c-steel-300); font-size:12.5px; line-height:1.3; }
.mnav-feature__go{ color:var(--c-brass-500); font-size:16px; flex:none; }

/* списки разделов (Компания / Сервис / Ещё) */
.mnav__list{ display:flex; flex-direction:column; }
.mnav-link{ display:block; padding:14px 0; border-top:1px solid var(--c-ink-700); transition:color var(--dur) var(--ease); }
.mnav__list .mnav-link:first-child{ border-top:0; padding-top:2px; }
.mnav-link__title{ display:block; font-family:var(--f-head); font-weight:600; font-size:18px; }
.mnav-link:active .mnav-link__title{ color:var(--c-brass-300); }
.mnav-link__note{ display:block; color:var(--c-steel-300); font-size:13px; margin-top:3px; }

/* подвал меню — контакты, соцсети, заявка */
.mobile-menu__foot{ display:flex; flex-direction:column; gap:6px; max-width:560px; width:100%; margin-inline:auto; padding:22px 20px calc(22px + env(safe-area-inset-bottom)); border-top:1px solid var(--c-ink-700); }
.mobile-menu__phone{ font-family:var(--f-mono); font-size:22px; color:var(--c-text-ondark); }
.mobile-menu__phone:hover,.mobile-menu__phone:active{ color:var(--c-brass-300); }
.mobile-menu__mail{ font-size:14px; color:var(--c-steel-300); margin-bottom:14px; }
.mobile-menu__mail:hover,.mobile-menu__mail:active{ color:var(--c-brass-300); }
.socials--menu{ display:flex; gap:10px; margin-bottom:16px; }
.socials--menu .social-link{ width:44px; height:44px; }
.socials--menu .social-link svg{ width:22px; height:22px; }
.mobile-menu__foot .btn{ width:100%; }

@media(max-width:980px){
  .nav,.site-header__actions .btn--primary{ display:none; }
  .site-header__actions{ margin-inline-start:auto; }
  .burger{ display:flex; }
}
@media(min-width:981px){ .mobile-menu{ display:none !important; } }

/* ---------------- hero ---------------- */
.hero{ position:relative; display:flex; align-items:center; min-height:100svh; padding:calc(var(--header-h) + var(--s-6)) 0 var(--s-12); overflow:hidden; }
.hero--inner{ min-height:100svh; padding:calc(var(--header-h) + var(--s-6)) 0 var(--s-8); align-items:center; }
.hero--plain{ min-height:auto; padding:calc(var(--header-h) + var(--s-8)) 0 var(--s-8); background:var(--c-ink-900); }
/* Если перед героем идут хлебные крошки, они уже отступают от фикс-шапки —
   убираем двойной верхний отступ у героя. */
/* Когда сверху хлебные крошки — вычитаем их высоту (шапка + строка крошек),
   чтобы крошки + hero ровно укладывались в один экран без переполнения. */
.crumbs + .hero--inner{ min-height:calc(100svh - var(--header-h) - 56px); padding-top:var(--s-6); }
.crumbs + .hero--plain{ padding-top:var(--s-6); }
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__video,.hero__img{ width:100%; height:100%; object-fit:cover; }
/* Статичное фото «оживляем» как видео: плавный зум-панорама вперёд-назад. */
.hero__img{ transform-origin:50% 45%; will-change:transform; animation:hero-pan 22s ease-in-out infinite alternate; }
@keyframes hero-pan{ from{ transform:scale(1.05); } to{ transform:scale(1.16) translate3d(-1.5%,-1.2%,0); } }
/* Фокус вверх (например «О компании»): держим верх кадра, чтобы зум не срезал лица. */
.hero--top .hero__img{ object-position:50% 0; transform-origin:50% 0; animation-name:hero-pan-top; }
@keyframes hero-pan-top{ from{ transform:scale(1.05); } to{ transform:scale(1.14) translate3d(-1%,0,0); } }
@media(prefers-reduced-motion:reduce){ .hero__img{ animation:none; } }
.hero__scrim{ position:absolute; inset:0; background:
  linear-gradient(180deg, rgba(14,17,22,.55) 0%, rgba(14,17,22,.35) 40%, rgba(14,17,22,.92) 100%),
  linear-gradient(90deg, rgba(14,17,22,.7), rgba(14,17,22,.1)); }
.hero__grid-deco{ position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(rgba(236,231,221,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(236,231,221,.04) 1px,transparent 1px); background-size:48px 48px; mask-image:radial-gradient(circle at 70% 60%,#000,transparent 75%); }
.hero__inner{ position:relative; z-index:2; }
.hero__inner--compact{ max-width:var(--container); }
.hero__eyebrow{ display:inline-block; color:var(--c-brass-300); margin-bottom:20px; }
.hero__title{ font-family:var(--f-display); font-weight:700; font-size:clamp(40px,6.4vw,84px); line-height:1.04; letter-spacing:-.03em; max-width:16ch; }
.hero__title--sm{ font-size:clamp(34px,4.4vw,60px); max-width:23ch; }
.hero__lead{ margin-top:24px; font-size:clamp(18px,1.7vw,22px); color:var(--c-text-ondark); max-width:62ch; opacity:.92; }
.hero__actions{ margin-top:36px; display:flex; flex-wrap:wrap; gap:16px; }
.hero__scroll{ position:absolute; left:50%; bottom:28px; transform:translateX(-50%); color:var(--c-steel-300); z-index:2; }
@media(max-width:768px){ .hero{ min-height:92svh; } .hero--inner{ min-height:90svh; padding:140px 0 var(--s-6); } }

/* ---------------- sections ---------------- */
.section{ padding-block:var(--s-12); }
@media(max-width:768px){ .section{ padding-block:var(--s-8); } }
.section--tight{ padding-block:var(--s-8); }
/* «deep» — глубокая графитовая секция с чертёжной (blueprint) текстурой.
   Заменяет прежний светлый фон: премиальнее и держит единый тёмный ритм. */
.section--paper{ position:relative; background:var(--c-ink-900); color:var(--c-text-ondark);
  background-image:
    linear-gradient(rgba(236,231,221,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(236,231,221,.028) 1px,transparent 1px);
  background-size:64px 64px; }
.section--paper::after{ content:""; position:absolute; left:0; right:0; top:0; height:1px;
  background:linear-gradient(90deg,transparent,rgba(227,162,61,.5),transparent); }
.section--paper > .container{ position:relative; z-index:1; }
.section--paper .section__eyebrow{ color:var(--c-brass-300); }
.section--paper .mono{ color:var(--c-steel-300); }
.section__head{ max-width:760px; margin-bottom:var(--s-6); }
.section__eyebrow{ color:var(--c-brass-300); display:block; margin-bottom:14px; }
.section__title{ font-weight:700; font-size:clamp(28px,3.4vw,46px); letter-spacing:-.025em; }
.section__lead{ font-size:clamp(17px,1.4vw,20px); opacity:.9; margin-top:16px; }
.block__title{ font-size:clamp(24px,2.6vw,34px); margin-bottom:16px; }
.block__text{ font-size:18px; opacity:.92; }
/* Editorial-«шапка» блока: индекс 01/02 + brass-волосок + эйбрау (spec-sheet ритм). */
.block__kicker{ display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.block__kicker-no{ color:var(--c-brass-300); font-size:13px; letter-spacing:.08em; }
.block__kicker-no::after{ content:""; display:inline-block; width:32px; height:1px; vertical-align:middle;
  margin-left:14px; background:linear-gradient(90deg,var(--c-brass-500),transparent); }
.block__kicker-label{ color:var(--c-steel-300); font-size:12px; letter-spacing:.16em; text-transform:uppercase; }
.split__text .block__kicker{ margin-bottom:14px; }

/* ---------------- stats ---------------- */
.stats{ background:var(--c-ink-900); border-block:1px solid var(--c-ink-600); }
.stats__grid{ display:grid; grid-template-columns:repeat(4,1fr); }
.stats__grid--3{ grid-template-columns:repeat(3,1fr); }
.stat{ padding:var(--s-6) var(--s-3); border-left:1px solid var(--c-ink-600); }
.stat:first-child{ border-left:0; }
.stat__value{ display:block; font-family:var(--f-display); font-size:clamp(28px,3vw,44px); color:var(--c-brass-300); }
.stat__label{ color:var(--c-steel-300); font-size:14px; }
@media(max-width:640px){ .stats__grid{ grid-template-columns:repeat(2,1fr); } .stat:nth-child(odd){ border-left:0; } }

/* ---------------- directions / cards grids ---------------- */
.dir-grid,.cat-grid,.prod-grid{ display:grid; gap:24px; grid-template-columns:repeat(3,1fr); }
@media(max-width:1000px){ .dir-grid,.cat-grid,.prod-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:620px){ .dir-grid,.cat-grid,.prod-grid{ grid-template-columns:1fr; } }

.dir-card,.cat-card,.pcard{ position:relative; display:flex; flex-direction:column; background:var(--c-ink-700); border:1px solid var(--c-ink-600); border-radius:var(--r-lg); overflow:hidden; transition:transform var(--dur) var(--ease), border-color var(--dur), box-shadow var(--dur); }
.dir-card:hover,.cat-card:hover,.pcard:hover{ border-color:var(--c-brass-500); box-shadow:var(--shadow-card); }
.dir-card__media,.cat-card__media,.pcard__media{ aspect-ratio:4/3; overflow:hidden; background:var(--c-ink-900); }
.dir-card__media img,.dir-card__media video,.cat-card__media img,.cat-card__media video,.pcard__media img{ width:100%; height:100%; object-fit:cover; transition:transform var(--dur-slow) var(--ease); }
.dir-card:hover .dir-card__media img,.dir-card:hover .dir-card__media video,.cat-card:hover .cat-card__media img,.pcard:hover .pcard__media img{ transform:scale(1.05); }
.dir-card__body,.cat-card__body,.pcard__body{ padding:var(--s-3); display:flex; flex-direction:column; gap:10px; flex:1; }
.dir-card__index,.cat-card__count,.pcard__mono{ color:var(--c-steel-300); }
.dir-card__title,.cat-card__title,.pcard__title{ font-size:21px; }
.dir-card__text,.cat-card__text,.pcard__lead{ color:var(--c-steel-300); font-size:15px; flex:1; }
.dir-card__link,.cat-card__link,.pcard__link{ margin-top:8px; font-family:var(--f-head); font-weight:600; font-size:14px; color:var(--c-brass-300); display:inline-flex; gap:8px; }
.dir-card:hover .arrow,.cat-card:hover .arrow,.pcard:hover .arrow{ transform:translateX(6px); }
.pcard__media{ aspect-ratio:16/11; }

/* ---------------- advantages / features / steps ---------------- */
/* Инженерная hairline-сетка: равная высота, чистые разделители, без «карточек» */
.adv-grid,.feat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--c-ink-600); border:1px solid var(--c-ink-600); border-radius:var(--r-md); overflow:hidden; }
.feat-grid{ grid-template-columns:repeat(3,1fr); }
@media(max-width:1000px){ .adv-grid,.feat-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:560px){ .adv-grid,.feat-grid{ grid-template-columns:1fr; } }

.adv,.feat{ background:var(--c-ink-800); padding:40px 32px; display:flex; flex-direction:column; gap:14px;
  transition:background var(--dur) var(--ease); }
.adv:hover,.feat:hover{ background:var(--c-ink-700); }
.section--paper .adv,.section--paper .feat{ background:var(--c-ink-800); }
.section--paper .adv:hover,.section--paper .feat:hover{ background:var(--c-ink-700); }

.adv__num,.feat__num{ font-family:var(--f-display); font-weight:600; font-size:40px; line-height:1; color:var(--c-brass-500); }
.adv__title,.feat__title{ margin:6px 0 0; font-size:20px; }
.adv__text,.feat__text{ color:var(--c-steel-300); font-size:15px; line-height:1.55; margin:0; }
.feat--icon .feat__num{ display:none; }
.feat__icon{ width:52px; height:52px; }
.feat__icon img{ width:100%; height:100%; object-fit:contain; }
.feat-grid--photo .feat__icon{ width:100%; height:auto; aspect-ratio:4/3; margin-bottom:6px; overflow:hidden; border:1px solid var(--c-ink-600); border-radius:var(--r-md); background:var(--c-ink-900); }
.feat-grid--photo .feat__icon img{ object-fit:cover; }

.steps{ display:grid; gap:24px; grid-template-columns:repeat(3,1fr); counter-reset:s; }
@media(max-width:900px){ .steps{ grid-template-columns:1fr; } }
.step{ padding:var(--s-3); border:1px solid var(--c-ink-600); border-radius:var(--r-md); position:relative; }
.section--paper .step{ border-color:var(--c-ink-600); background:var(--c-ink-800); }
.step__num{ color:var(--c-brass-300); font-size:14px; }
.step__title{ margin:10px 0 6px; font-size:18px; }
.step__text{ color:var(--c-steel-300); font-size:15px; margin:0; }

/* ---------------- split ---------------- */
.split__inner{ display:grid; grid-template-columns:1.1fr 1fr; gap:var(--s-8); align-items:center; }
.split__inner--reverse .split__media{ order:2; }
@media(max-width:900px){ .split__inner{ grid-template-columns:1fr; gap:var(--s-4); } .split__inner--reverse .split__media{ order:0; } }
.split__media{ border-radius:var(--r-lg); overflow:hidden; aspect-ratio:4/3; box-shadow:var(--shadow-card); }
.split__media img{ width:100%; height:100%; object-fit:cover; }
.split__media--contain{ background:var(--c-ink-900); display:flex; align-items:center; justify-content:center; aspect-ratio:16/10; }
.split__media--contain img{ object-fit:contain; padding:40px; }

/* ---------------- materials ---------------- */
.materials__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--c-ink-600); border:1px solid var(--c-ink-600); border-radius:var(--r-md); overflow:hidden; }
@media(max-width:900px){ .materials__grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .materials__grid{ grid-template-columns:1fr; } }
.material{ position:relative; display:flex; align-items:center; gap:16px; min-height:98px; padding:22px 24px;
  background:var(--c-ink-800); transition:background var(--dur) var(--ease); overflow:hidden; }
.material::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:2px; background:var(--c-brass-500);
  transform:scaleY(0); transform-origin:top; transition:transform var(--dur) var(--ease); }
.material:hover{ background:var(--c-ink-700); }
.material:hover::before{ transform:scaleY(1); }
.material__icon{ width:54px; height:54px; flex:none; display:grid; place-items:center;
  background:var(--c-ink-900); border:1px solid var(--c-ink-600); border-radius:var(--r-sm);
  overflow:hidden; transition:border-color var(--dur); }
.material:hover .material__icon{ border-color:var(--c-brass-500); }
.material__icon img{ width:100%; height:100%; object-fit:cover; }
.material__title{ font-family:var(--f-head); font-weight:500; font-size:15px; line-height:1.3;
  color:var(--c-text-ondark); transition:color var(--dur); }
.material:hover .material__title{ color:var(--c-brass-300); }

/* ---------------- crumbs ---------------- */
.crumbs{ background:var(--c-ink-900); border-bottom:1px solid var(--c-ink-700); padding:calc(var(--header-h) + 16px) 0 16px; }
.crumbs__list{ display:flex; flex-wrap:wrap; gap:10px; color:var(--c-steel-300); }
.crumbs__item a:hover{ color:var(--c-brass-300); }
.crumbs__sep{ margin-left:10px; color:var(--c-ink-600); }
.crumbs__item [aria-current]{ color:var(--c-text-ondark); }

/* ---------------- product page ---------------- */
.product-hero{ position:relative; overflow:hidden; padding:calc(var(--header-h) + var(--s-8)) 0 var(--s-8); background:var(--c-ink-900); }
/* Атмосфера: тонкая blueprint-сетка, угасающая в правый верхний угол. */
.product-hero::before{ content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgba(236,231,221,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(236,231,221,.035) 1px,transparent 1px);
  background-size:46px 46px; mask-image:radial-gradient(115% 85% at 100% 0,#000,transparent 68%);
  -webkit-mask-image:radial-gradient(115% 85% at 100% 0,#000,transparent 68%); }
.product-hero__grid{ position:relative; display:grid; grid-template-columns:1.2fr 1fr; gap:var(--s-8); align-items:start; }
@media(max-width:900px){ .product-hero__grid{ grid-template-columns:1fr; gap:var(--s-4); } }
.product-gallery__main{ position:relative; aspect-ratio:var(--media-ratio,16/9); border-radius:var(--r-lg); overflow:hidden; background:var(--c-ink-800); border:1px solid var(--c-ink-600); cursor:zoom-in; }
.product-gallery__main img{ width:100%; height:100%; object-fit:cover; display:block; }
/* Рамка-видоискатель: 4 угловые латунные метки (как на техническом снимке). */
.product-gallery__frame{ position:absolute; inset:13px; pointer-events:none; z-index:2; opacity:.85;
  background:
    linear-gradient(var(--c-brass-500),var(--c-brass-500)) 0 0/18px 2px no-repeat,
    linear-gradient(var(--c-brass-500),var(--c-brass-500)) 0 0/2px 18px no-repeat,
    linear-gradient(var(--c-brass-500),var(--c-brass-500)) 100% 0/18px 2px no-repeat,
    linear-gradient(var(--c-brass-500),var(--c-brass-500)) 100% 0/2px 18px no-repeat,
    linear-gradient(var(--c-brass-500),var(--c-brass-500)) 0 100%/18px 2px no-repeat,
    linear-gradient(var(--c-brass-500),var(--c-brass-500)) 0 100%/2px 18px no-repeat,
    linear-gradient(var(--c-brass-500),var(--c-brass-500)) 100% 100%/18px 2px no-repeat,
    linear-gradient(var(--c-brass-500),var(--c-brass-500)) 100% 100%/2px 18px no-repeat; }
.product-gallery__badge{ position:absolute; left:14px; bottom:14px; background:rgba(14,17,22,.7); padding:6px 10px; border-radius:var(--r-sm); color:var(--c-brass-300); }
.product-gallery__thumbs{ display:grid; grid-template-columns:repeat(auto-fit,minmax(64px,1fr)); gap:10px; margin-top:12px; }
.product-gallery__thumb{ display:block; padding:0; background:none; cursor:pointer; aspect-ratio:var(--media-ratio,16/9); border-radius:var(--r-sm); overflow:hidden; border:1px solid var(--c-ink-600); opacity:.55; transition:var(--dur); }
.product-gallery__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.product-gallery__thumb:hover{ opacity:1; }
.product-gallery__thumb.is-active{ opacity:1; border-color:var(--c-brass-500); box-shadow:0 0 0 2px rgba(201,162,77,.35); }
.product-intro{ position:sticky; top:100px; }
@media(max-width:900px){ .product-intro{ position:static; } }
/* Мета-рейка над заголовком: категория + латунный тире-волосок (datasheet-шапка). */
.product-intro__meta{ display:flex; align-items:center; gap:16px; margin-bottom:20px; }
.product-intro__cat{ position:relative; flex:none; padding-left:26px; color:var(--c-brass-300); white-space:nowrap; }
.product-intro__cat::before{ content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:16px; height:2px; background:var(--c-brass-500); }
.product-intro__meta::after{ content:""; flex:1; height:1px; background:linear-gradient(90deg,var(--c-ink-600),transparent); }
.product-intro__title{ font-family:var(--f-display); font-weight:700; font-size:clamp(34px,4.4vw,60px); line-height:1.04; letter-spacing:-.03em; max-width:20ch; margin:0; }
.product-intro__lead{ color:var(--c-text-ondark); font-size:clamp(18px,1.7vw,22px); line-height:1.55; opacity:.92; max-width:62ch; margin:24px 0 0; }
/* Ключевые факты «Коротко о модели» — открытый datasheet-ридаут:
   индекс 01–06 в моно + факт, тонкие волоски, без карточки/рамки и плавающих тире. */
.product-facts{ margin-top:34px; }
.product-facts__cap{ display:flex; align-items:center; gap:14px; margin-bottom:6px;
  color:var(--c-steel-300); font-size:11px; letter-spacing:.2em; text-transform:uppercase; }
.product-facts__cap::before{ content:""; width:18px; height:2px; background:var(--c-brass-500); flex:none; }
.product-facts__cap::after{ content:""; flex:1; height:1px; background:linear-gradient(90deg,var(--c-ink-600),transparent); }
.product-facts__list{ position:relative; display:grid; grid-template-columns:1fr 1fr; column-gap:34px;
  border-top:1px solid var(--c-ink-600); }
/* вертикальный волосок-разделитель между колонками */
.product-facts__list::before{ content:""; position:absolute; top:0; bottom:0; left:50%; width:1px;
  background:var(--c-ink-600); transform:translateX(-50%); }
.product-facts__item{ display:grid; grid-template-columns:auto 1fr; align-items:center; gap:13px;
  min-height:58px; padding:13px 0; border-bottom:1px solid var(--c-ink-600); }
.product-facts__n{ font-size:11px; color:var(--c-steel-300); letter-spacing:.04em;
  font-variant-numeric:tabular-nums; }
.product-facts__t{ font-size:13.5px; line-height:1.32; color:var(--c-text-ondark); letter-spacing:.005em; }
/* последняя пара строк без нижнего волоска — открытый «низ» ридаута */
.product-facts__item:nth-last-child(-n+2){ border-bottom:0; }
@media(max-width:560px){
  .product-facts__list{ grid-template-columns:1fr; column-gap:0; }
  .product-facts__list::before{ display:none; }
  .product-facts__item{ min-height:0; }
  .product-facts__item:nth-last-child(-n+2):not(:last-child){ border-bottom:1px solid var(--c-ink-600); }
}

/* Цена — заметный блок над кнопкой заявки. */
.product-price{ display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 14px; margin-top:28px; }
.product-price__label{ color:var(--c-steel-300); font-size:12px; align-self:center; }
.product-price__value{ font-family:var(--f-display); font-weight:700; font-size:clamp(30px,3.4vw,44px); line-height:1; letter-spacing:-.02em; color:var(--c-text-ondark); }
.product-price__note{ color:var(--c-steel-300); font-size:13px; width:100%; }

.product-cta{ display:flex; flex-direction:column; gap:14px; margin-top:22px; padding:0; background:transparent; border:0; border-radius:0; }
.product-cta__row{ display:flex; gap:12px; }
.product-cta__row .btn{ flex:1; }
@media(max-width:480px){ .product-cta__row{ flex-direction:column; } }
.product-trust{ display:flex; flex-direction:column; gap:13px; margin-top:26px; padding-top:24px; border-top:1px solid var(--c-ink-600); color:var(--c-steel-300); font-size:13px; }
.product-trust li{ position:relative; padding-left:28px; line-height:1.2; }
.product-trust li::before{ content:""; position:absolute; left:0; top:50%; width:17px; height:17px; transform:translateY(-50%);
  background:var(--c-brass-500);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'><path d='M4 12.5l5 5L20 6.5'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'><path d='M4 12.5l5 5L20 6.5'/></svg>") center/contain no-repeat; }

.spec-table{ width:100%; border-collapse:collapse; }
.spec-table th,.spec-table td{ text-align:left; padding:16px; border-bottom:1px solid var(--c-ink-600); }
.spec-table th{ font-family:var(--f-mono); font-weight:500; font-size:14px; color:var(--c-steel-300); width:40%; }
.spec-table--compact th,.spec-table--compact td{ padding:11px 0; vertical-align:top; }
.spec-table--compact th{ width:52%; padding-right:18px; font-size:12.5px; }
.spec-table--compact td{ font-weight:600; color:var(--c-text-ondark); }
.product-spec-groups{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.product-spec-group{ background:rgba(255,255,255,.025); border:1px solid var(--c-ink-600); border-radius:var(--r-md); padding:var(--s-4); transition:border-color var(--dur) var(--ease); }
.product-spec-group:hover{ border-color:var(--c-steel-500); }
.product-spec-group__title{ font-size:22px; line-height:1.2; margin:0 0 18px; letter-spacing:-.01em; }
/* Комплектация — инженерный «упаковочный лист»: чёткое разделение базы и опций. */
.product-lists{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; align-items:stretch; }
.product-list-card{ border:1px solid var(--c-ink-600); border-radius:var(--r-lg);
  padding:38px 34px 34px; background:var(--c-ink-800);
  transition:border-color var(--dur) var(--ease); }
.product-list-card--base{ background:linear-gradient(180deg,rgba(227,162,61,.05),rgba(20,24,30,0) 55%); }
.product-list-card:hover{ border-color:var(--c-steel-500); }
.product-list-card__head{ margin-bottom:28px; }
.product-list-card__kicker{ display:block; margin-bottom:11px; }
.product-list-card--base .product-list-card__kicker{ color:var(--c-brass-300); }
.product-list-card--options .product-list-card__kicker{ color:var(--c-steel-300); }
.product-list-card__title{ font-size:23px; line-height:1.12; letter-spacing:-.015em; margin:0; }
.product-list-card .check-list{ gap:18px; }
.product-list-card .check-list li{ color:var(--c-text-ondark); }
/* Опции — это добавки, а не комплект: маркер «+» в круге, стальной (вторичный). */
.product-list-card--options .check-list li::before{ background:var(--c-steel-300);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'><circle cx='12' cy='12' r='9.5' stroke-width='1.4'/><path d='M12 7.8v8.4M7.8 12h8.4'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'><circle cx='12' cy='12' r='9.5' stroke-width='1.4'/><path d='M12 7.8v8.4M7.8 12h8.4'/></svg>") center/contain no-repeat; }
@media(max-width:900px){
  .product-spec-groups,.product-lists{ grid-template-columns:1fr; }
}
@media(max-width:560px){
  .spec-table th,.spec-table td{ display:block; width:100%; padding:10px 0; }
  .spec-table td{ padding-top:0; }
  .product-spec-group{ padding:var(--s-4); }
  .product-list-card{ padding:30px 24px 26px; }
}
.spec-empty{ background:var(--c-ink-800); border:1px dashed var(--c-ink-600); border-radius:var(--r-lg); padding:var(--s-6); display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
.video-frame{ border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-card); }
.video-frame video{ width:100%; }

/* ---------------- cta-final ---------------- */
.cta-final{ position:relative; background:var(--c-ink-900); padding-block:var(--s-12); border-top:1px solid var(--c-ink-600); }
.cta-final::after{ content:""; position:absolute; left:0; right:0; top:0; height:2px; background:linear-gradient(90deg,transparent,var(--c-brass-500),transparent); }
.cta-final__inner{ display:grid; grid-template-columns:1.1fr .9fr; align-items:center; gap:var(--s-8); }
.cta-final__title{ font-family:var(--f-display); font-weight:700; font-size:clamp(26px,3vw,42px); letter-spacing:-.025em; max-width:18ch; margin-top:10px; }
.cta-final__lead{ color:var(--c-steel-300); margin-top:12px; max-width:48ch; }
.cta-final__usp{ list-style:none; margin:var(--s-3) 0 var(--s-4); padding:0; display:flex; flex-direction:column; gap:9px; }
.cta-final__usp li{ position:relative; padding-left:26px; color:var(--c-text-ondark); font-size:15px; }
.cta-final__usp li::before{ content:""; position:absolute; left:0; top:.5em; width:12px; height:1px; background:var(--c-brass-500); }
.cta-final__usp li::after{ content:""; position:absolute; left:12px; top:calc(.5em - 2px); width:5px; height:5px; border-radius:50%; background:var(--c-brass-500); }
.cta-final__phone{ display:block; font-family:var(--f-display); font-weight:700; font-size:clamp(24px,3vw,34px); line-height:1; color:var(--c-text-ondark); margin-bottom:14px; }
.cta-final__phone:hover{ color:var(--c-brass-300); }
.cta-final__actions{ display:flex; gap:14px; flex-wrap:wrap; }
.cta-final__form{ margin:0; }
@media(max-width:860px){
  .cta-final__inner{ grid-template-columns:1fr; gap:var(--s-6); }
}

/* ---------------- lists, accordion, masonry, contacts ---------------- */
.check-list{ display:grid; gap:13px; }
.check-list li{ position:relative; padding-left:34px; }
/* Иконка-галочка (SVG-mask): чётко на любом DPI, цвет = brass-токен. */
.check-list li::before{ content:""; position:absolute; left:0; top:2px; width:21px; height:21px;
  background:var(--c-brass-500);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9.5' stroke-width='1.4'/><path d='M7.5 12.4l3 3L16.5 9'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='9.5' stroke-width='1.4'/><path d='M7.5 12.4l3 3L16.5 9'/></svg>") center/contain no-repeat; }
/* Чек-лист в 2 колонки (для «почему мы» и т.п.) */
@media(min-width:720px){ .check-list--cols{ grid-template-columns:1fr 1fr; gap:14px 44px; } }
/* Карточки оборудования: иконка + заголовок + подпись + чек-лист характеристик */
.spec-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:var(--s-6); }
@media(max-width:820px){ .spec-grid{ grid-template-columns:1fr; } }
.spec-card{ background:var(--c-ink-800); border:1px solid var(--c-ink-600); border-radius:var(--r-lg); padding:var(--s-4);
  transition:border-color var(--dur) var(--ease), transform var(--dur) var(--ease); }
.spec-card:hover{ border-color:var(--c-brass-500); transform:translateY(-3px); box-shadow:var(--shadow-card); }
.spec-card__icon{ width:50px; height:50px; margin-bottom:16px; }
.spec-card__icon img{ width:100%; height:100%; object-fit:contain; }
.spec-grid--photo .spec-card__icon{ width:100%; height:auto; aspect-ratio:4/3; margin-bottom:18px; overflow:hidden; border:1px solid var(--c-ink-600); border-radius:var(--r-md); background:var(--c-ink-900); }
.spec-grid--photo .spec-card__icon img{ object-fit:cover; }
.spec-card__title{ font-size:21px; margin-bottom:4px; }
.spec-card__sub{ display:block; color:var(--c-brass-300); font-family:var(--f-mono); font-size:12.5px; letter-spacing:.02em; margin-bottom:18px; }
.spec-card .check-list{ gap:11px; }
.spec-card .check-list li{ font-size:15px; color:var(--c-steel-300); padding-left:30px; }
.spec-card .check-list li::before{ width:18px; height:18px; top:1px; }

.cz-scheme{ padding-top:0; }
.cz-scheme__figure{ margin:0; border:1px solid var(--c-ink-600); border-radius:var(--r-lg); overflow:hidden; background:var(--c-ink-900); box-shadow:var(--shadow-card); position:relative; }
.cz-scheme__figure::before{ content:""; position:absolute; inset:0; pointer-events:none; border-top:2px solid var(--c-brass-500); opacity:.8; }
.cz-scheme__figure img{ display:block; width:100%; height:auto; object-fit:contain; }

.masonry{ columns:3; column-gap:16px; margin-top:var(--s-4); }
/* Если перед галереей идут пункты/чек-лист — добавляем заметный отступ. */
.check-list + .masonry,.steps + .masonry{ margin-top:var(--s-6); }
@media(max-width:900px){ .masonry{ columns:2; } }
@media(max-width:560px){ .masonry{ columns:1; } }
.masonry__item{ display:block; margin-bottom:16px; border-radius:var(--r-md); overflow:hidden; break-inside:avoid; border:1px solid var(--c-ink-600); }
.masonry__item img{ width:100%; transition:transform var(--dur-slow) var(--ease); }
.masonry__item:hover img{ transform:scale(1.04); }
.accordion__item{ border-bottom:1px solid var(--c-ink-600); }
.accordion__head{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:22px 0; text-align:left; font-family:var(--f-head); font-weight:600; font-size:18px; }
.accordion__icon{ color:var(--c-brass-500); font-style:normal; font-size:24px; transition:transform var(--dur); }
.accordion__item.is-open .accordion__icon{ transform:rotate(45deg); }
.accordion__body{ max-height:0; overflow:hidden; transition:max-height var(--dur) var(--ease); }
.accordion__body p{ padding-bottom:22px; color:var(--c-steel-300); margin:0; }
.contacts-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media(max-width:900px){ .contacts-grid{ grid-template-columns:1fr; } }
.contacts-card{ padding:var(--s-4); background:var(--c-ink-700); border:1px solid var(--c-ink-600); border-radius:var(--r-lg); display:flex; flex-direction:column; gap:10px; align-items:flex-start; }
.contacts-card__big{ font-family:var(--f-display); font-size:28px; color:var(--c-brass-300); }

/* ---------------- about photos / maps ---------------- */
.about-photo-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; margin-top:var(--s-4); }
.about-photo-card{ overflow:hidden; background:var(--c-ink-700); border:1px solid var(--c-ink-600); border-radius:var(--r-lg);
  transition:border-color var(--dur), transform var(--dur) var(--ease), box-shadow var(--dur); }
.about-photo-card:hover{ border-color:var(--c-brass-500); transform:translateY(-3px); box-shadow:var(--shadow-card); }
.about-photo-card__media{ aspect-ratio:16/9; overflow:hidden; background:var(--c-ink-900); }
.about-photo-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform var(--dur-slow) var(--ease); }
.about-photo-card:hover .about-photo-card__media img{ transform:scale(1.04); }
.about-photo-card__body{ padding:var(--s-4); }
.about-photo-card__label{ color:var(--c-brass-300); }
.about-photo-card__title{ margin:10px 0 8px; font-size:21px; }
.about-photo-card__text{ color:var(--c-steel-300); font-size:15px; margin:0; }
.location-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:var(--s-4); }
.location-card{ overflow:hidden; background:var(--c-ink-700); border:1px solid var(--c-ink-600); border-radius:var(--r-lg);
  box-shadow:var(--shadow-soft); }
.location-card__map{ aspect-ratio:16/10; background:var(--c-ink-900); border-bottom:1px solid var(--c-ink-600); overflow:hidden; }
.location-card__map iframe{ display:block; width:100%; height:100%; border:0; }
.location-card__body{ padding:var(--s-4); display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.location-card__body p{ color:var(--c-steel-300); margin:0; }
@media(max-width:900px){
  .about-photo-grid,.location-grid{ grid-template-columns:1fr; }
}

/* ============================ Новости на главной ============================ */
.news-teaser__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--c-ink-600); border:1px solid var(--c-ink-600); border-radius:var(--r-md); overflow:hidden; }
.news-teaser__item{ display:flex; flex-direction:column; gap:10px; min-height:164px; padding:28px;
  background:var(--c-ink-800); color:var(--c-text-ondark); transition:background var(--dur) var(--ease); }
.news-teaser__item:hover{ background:var(--c-ink-700); }
.news-teaser__date{ color:var(--c-steel-300); }
.news-teaser__cat{ font-size:11px; letter-spacing:.04em; color:var(--c-brass-300); }
.news-teaser__title{ margin:auto 0 0; font-size:19px; line-height:1.28; overflow-wrap:break-word; }
.news-teaser__item:hover .news-teaser__title{ color:var(--c-brass-300); }
.section__head--row{ display:flex; align-items:flex-end; justify-content:space-between; gap:var(--s-4); flex-wrap:wrap; }
.news-teaser__all{ flex:none; }
@media(max-width:900px){ .news-teaser__grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:560px){ .news-teaser__grid{ grid-template-columns:1fr; } .news-teaser__item{ min-height:auto; } }

/* ---------------- footer ---------------- */
.site-footer{ background:var(--c-ink-900); border-top:1px solid var(--c-ink-600); padding-block:var(--s-8) var(--s-4); position:relative; }
.site-footer__top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr 1.2fr; gap:var(--s-4); padding-bottom:var(--s-6); border-bottom:1px solid var(--c-ink-700); }
@media(max-width:1000px){ .site-footer__top{ grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .site-footer__top{ grid-template-columns:1fr; } }
.site-footer__tag{ color:var(--c-steel-300); margin:16px 0; }
.status-badges{ display:flex; flex-wrap:wrap; gap:8px; }
.status-badge{ border:1px solid var(--c-ink-600); padding:6px 10px; border-radius:var(--r-sm); color:var(--c-steel-300); font-size:11px; }
.status-badges--lg{ gap:10px; margin-top:var(--s-4); }
.status-badges--lg .status-badge{ font-size:14px; padding:10px 16px; font-family:var(--f-mono); letter-spacing:.02em; transition:border-color var(--dur,.25s) var(--ease,ease), color var(--dur,.25s) var(--ease,ease); }
.status-badges--lg .status-badge:hover{ border-color:var(--c-brass-500); color:var(--c-brass-300); }
.site-footer__h{ font-size:14px; text-transform:uppercase; letter-spacing:.06em; color:var(--c-steel-300); margin-bottom:16px; }
.site-footer__col ul{ display:grid; gap:10px; }
.site-footer__col a:hover{ color:var(--c-brass-300); }
.site-footer__contacts{ display:flex; flex-direction:column; gap:8px; align-items:flex-start; }
.site-footer__phone{ font-size:20px; color:var(--c-brass-300); white-space:nowrap; }
.site-footer__contacts a:hover{ color:var(--c-brass-300); }
.site-footer__bottom{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-top:24px; color:var(--c-steel-500); }
.site-footer__bottom a:hover{ color:var(--c-brass-300); }
.site-footer__legal{ display:flex; gap:18px; flex-wrap:wrap; }

/* ---------------- modal / form ---------------- */
.modal{ position:fixed; inset:0; z-index:120; display:flex; align-items:center; justify-content:center; padding:24px; }
.modal[hidden]{ display:none; }
.modal__overlay{ position:absolute; inset:0; background:rgba(8,10,14,.7); backdrop-filter:blur(6px); }
.modal__dialog{ position:relative; width:100%; max-width:520px; background:var(--c-ink-800); border:1px solid var(--c-ink-600); border-radius:var(--r-lg); padding:var(--s-6); max-height:92vh; overflow:auto; animation:modalIn var(--dur) var(--ease-out); }
@keyframes modalIn{ from{ opacity:0; transform:scale(.97) translateY(8px); } to{ opacity:1; transform:none; } }
.modal__close{ position:absolute; top:14px; right:18px; font-size:30px; line-height:1; color:var(--c-steel-300); }
.modal__close:hover{ color:var(--c-brass-300); }
.modal__eyebrow{ color:var(--c-brass-300); }
.modal__title{ font-family:var(--f-display); font-size:28px; margin:10px 0 8px; }
.modal__lead{ color:var(--c-steel-300); font-size:15px; margin-bottom:24px; }
.lead-form__hp{ position:absolute; left:-9999px; width:1px; height:1px; }
.field{ margin-bottom:16px; }
.field label{ display:block; font-size:13px; color:var(--c-steel-300); font-family:var(--f-mono); text-transform:uppercase; letter-spacing:.06em; }
.field label span{ color:var(--c-brass-500); vertical-align:super; font-size:.7em; line-height:0; margin-left:2px; }
.field input,.field textarea{ display:block; width:100%; margin-top:8px; padding:14px 16px; background:var(--c-ink-900); border:1px solid var(--c-ink-600); border-radius:var(--r-sm); color:var(--c-text-ondark); font-family:var(--f-body); font-size:16px; transition:border-color var(--dur); }
.field input:focus,.field textarea:focus{ outline:none; border-color:var(--c-brass-500); box-shadow:0 0 0 2px rgba(227,162,61,.18); }
.field__error{ display:block; color:var(--c-danger); font-size:13px; margin-top:6px; min-height:1px; }

/* кастомные чекбоксы под дизайн-систему */
.consent{ display:flex; gap:12px; align-items:flex-start; font-size:13.5px; line-height:1.45; color:var(--c-steel-300); margin:10px 0; cursor:pointer; }
.consent input[type=checkbox]{ appearance:none; -webkit-appearance:none; flex:none; width:22px; height:22px; margin:0; border:1.5px solid var(--c-ink-600); border-radius:6px; background:var(--c-ink-900); cursor:pointer; position:relative; transition:background var(--dur-fast),border-color var(--dur-fast); }
.consent input[type=checkbox]:hover{ border-color:var(--c-brass-500); }
.consent input[type=checkbox]:checked{ background:linear-gradient(160deg,var(--c-brass-300),var(--c-brass-500)); border-color:var(--c-brass-500); }
.consent input[type=checkbox]:checked::after{ content:""; position:absolute; left:7px; top:3px; width:5px; height:10px; border:solid #1a130a; border-width:0 2.5px 2.5px 0; transform:rotate(43deg); }
.consent input[type=checkbox]:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(227,162,61,.28); }
.consent a{ color:var(--c-brass-300); text-decoration:underline; }
.lead-form .btn{ margin-top:12px; }
.lead-form__result{ margin-top:14px; padding:12px 14px; border-radius:var(--r-sm); font-size:14px; }
.lead-form__result.is-ok{ background:rgba(62,125,90,.16); color:#8fd6ad; }
.lead-form__result.is-err{ background:rgba(178,58,46,.16); color:#f0a59c; }

/* ---------------- cookie ---------------- */
.cookie{ position:fixed; left:24px; right:24px; bottom:24px; z-index:110; max-width:600px; margin-inline:auto; background:var(--c-ink-900); border:1px solid var(--c-ink-600); border-radius:var(--r-md); padding:20px 22px; display:flex; flex-direction:column; gap:16px; box-shadow:var(--shadow-card); }
.cookie::before{ content:""; position:absolute; inset:0 0 auto 0; height:2px; border-radius:var(--r-md) var(--r-md) 0 0; background:linear-gradient(90deg,var(--c-brass-500),transparent 70%); }
.cookie[hidden]{ display:none; }
.cookie__cap{ display:block; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--c-brass-300); margin-bottom:8px; }
.cookie__text{ margin:0; font-size:13.5px; line-height:1.6; color:var(--c-steel-300); }
.cookie__text b{ color:var(--c-text-ondark); font-weight:600; }
.cookie a{ color:var(--c-brass-300); }
.cookie__actions{ display:flex; gap:10px; flex-wrap:wrap; }
.cookie__actions .btn{ flex:1 1 auto; }
@media (max-width:560px){ .cookie{ left:12px; right:12px; bottom:12px; } .cookie__actions .btn{ flex:1 1 100%; } }

/* ---------------- error ---------------- */
.error-hero__code{ font-family:var(--f-display); font-size:clamp(72px,14vw,180px); color:var(--c-brass-500); display:block; line-height:1; }

/* ---------------- reveal animations ---------------- */
[data-reveal],[data-reveal-lines] .line{ opacity:0; transform:translateY(24px); transition:opacity var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out); }
[data-reveal].is-in,[data-reveal-lines].is-in .line{ opacity:1; transform:none; }
[data-reveal-lines] .line{ transition-delay:calc(var(--i,0) * 55ms); display:inline-block; white-space:pre; }
[data-reveal]{ transition-delay:var(--reveal-delay,0ms); }

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  [data-reveal],[data-reveal-lines] .line{ opacity:1; transform:none; }
}

/* ============================ Квиз-калькулятор ============================ */
.quiz-section{ background:var(--c-ink-900); padding-top:var(--s-8); }
.quiz{ display:grid; grid-template-columns:.82fr 1.18fr; gap:var(--s-8);
  background:var(--c-ink-800); border:1px solid var(--c-ink-600); border-radius:var(--r-lg);
  padding:var(--s-8); position:relative; overflow:hidden; }
.quiz::before{ content:""; position:absolute; left:0; right:0; top:0; height:2px;
  background:linear-gradient(90deg,transparent,var(--c-brass-500),transparent); }
.quiz__title{ font-size:clamp(24px,2.4vw,34px); }
.quiz__lead{ margin-top:14px; }
.consultant{ display:flex; align-items:center; gap:13px; margin-top:var(--s-6); }
.consultant__avatar{ width:50px; height:50px; flex:none; border-radius:50%; display:grid; place-items:center;
  font-family:var(--f-head); font-weight:700; font-size:17px; color:#1a130a;
  background:radial-gradient(120% 120% at 30% 20%,var(--c-brass-300),var(--c-brass-500)); }
.consultant__avatar--photo{ width:56px; height:56px; overflow:hidden; padding:0;
  background:var(--c-ink-600); box-shadow:0 0 0 2px var(--c-brass-500); }
.consultant__avatar--photo img{ width:100%; height:100%; object-fit:cover; object-position:top center; display:block; }
.consultant__id{ display:flex; flex-direction:column; }
.consultant__name{ font-family:var(--f-head); font-weight:600; }
.consultant__role{ color:var(--c-steel-300); font-size:13px; }
.consultant__note{ margin-top:16px; color:var(--c-steel-300); font-size:14px; line-height:1.5; }
.consultant__phone{ display:inline-block; margin-top:14px; color:var(--c-brass-300); font-size:16px; }
.consultant__phone:hover{ color:var(--c-brass-300); text-decoration:underline; }

.quiz__main{ min-width:0; display:flex; flex-direction:column; }
.quiz__head{ display:flex; align-items:center; gap:16px; margin-bottom:var(--s-4); }
.quiz__progress{ flex:1; height:6px; background:var(--c-ink-600); border-radius:99px; overflow:hidden; }
.quiz__bar{ display:block; height:100%; width:20%; border-radius:99px;
  background:linear-gradient(90deg,var(--c-brass-500),var(--c-brass-300)); transition:width .45s var(--ease); }
.quiz__counter{ color:var(--c-steel-300); font-size:12px; white-space:nowrap; }
.quiz__panel{ display:none; }
.quiz__panel.is-active{ display:block; animation:quizIn .32s var(--ease-out); }
@keyframes quizIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.quiz__q{ font-size:clamp(19px,1.9vw,25px); margin-bottom:var(--s-4); }
.quiz__hint{ color:var(--c-steel-300); font-weight:400; font-size:.62em; }
.quiz__options{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.quiz__opt{ display:flex; align-items:center; gap:10px; text-align:left; padding:14px 16px;
  border:1px solid var(--c-ink-600); border-radius:var(--r-md); background:var(--c-ink-900);
  color:var(--c-text-ondark); font-family:var(--f-head); font-weight:500; font-size:15px;
  transition:border-color var(--dur),background var(--dur),transform var(--dur-fast); }
.quiz__opt::before{ content:""; width:18px; height:18px; flex:none; border-radius:50%;
  border:2px solid var(--c-ink-600); transition:border-color var(--dur),box-shadow var(--dur); }
.quiz__opt:hover{ border-color:var(--c-brass-500); transform:translateY(-1px); }
.quiz__opt.is-selected{ border-color:var(--c-brass-500); background:rgba(227,162,61,.12); }
.quiz__opt.is-selected::before{ border-color:var(--c-brass-500); box-shadow:inset 0 0 0 4px var(--c-brass-500); }
.quiz__opt--custom{ grid-column:1/-1; color:var(--c-steel-300); }
.quiz__custom-input{ margin-top:12px; width:100%; padding:13px 16px; background:var(--c-ink-900);
  border:1px solid var(--c-brass-500); border-radius:var(--r-sm); color:var(--c-text-ondark);
  font-family:var(--f-body); font-size:16px; }
.quiz__custom-input:focus{ outline:none; box-shadow:0 0 0 2px rgba(227,162,61,.18); }
.quiz__nav{ display:flex; align-items:center; gap:12px; margin-top:var(--s-5,28px); padding-top:var(--s-4); }
.quiz__next,.quiz__submit{ margin-left:auto; }
.quiz__next:disabled{ opacity:.4; cursor:not-allowed; }
.quiz__fields{ display:grid; grid-template-columns:1fr 1fr; gap:8px 16px; margin-bottom:8px; }
.quiz__final-text{ color:var(--c-steel-300); margin:-6px 0 var(--s-4); }
.quiz__done{ text-align:center; padding:var(--s-6) 0; }
.quiz__done-mark{ display:inline-grid; place-items:center; width:64px; height:64px; margin-bottom:18px;
  border-radius:50%; background:rgba(62,125,90,.18); color:var(--c-success); font-size:30px; }
@media(max-width:920px){
  .quiz{ grid-template-columns:1fr; gap:var(--s-6); padding:var(--s-6); }
  .quiz__options{ grid-template-columns:1fr; }
  .quiz__fields{ grid-template-columns:1fr; }
}

/* ============================ Клиенты ============================ */
.clients__grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.client{ display:flex; align-items:center; justify-content:center; min-height:120px; padding:26px 24px;
  background:#fff; border:1px solid var(--c-ink-700); border-radius:var(--r-md);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur); }
.client:hover{ transform:translateY(-4px); box-shadow:var(--shadow-card); }
.client img{ max-height:60px; max-width:100%; width:auto; object-fit:contain; }
@media(max-width:1000px){ .clients__grid{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:560px){ .clients__grid{ grid-template-columns:repeat(2,1fr); } .client{ min-height:96px; padding:18px; } }

/* ============================ Отзывы ============================ */
.testi-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.testi{ position:relative; min-width:0; margin:0; display:grid; grid-template-columns:168px 1fr; gap:var(--s-4); padding:var(--s-4);
  background:var(--c-ink-800); border:1px solid var(--c-ink-600); border-radius:var(--r-lg); transition:border-color var(--dur) var(--ease); }
.testi:hover{ border-color:var(--c-ink-500,#3a424d); }
/* письмо крупно слева — реальный скан, главное доказательство */
.testi__doc{ position:relative; display:block; align-self:start; aspect-ratio:210/297; border-radius:8px; overflow:hidden;
  border:1px solid var(--c-ink-600); background:#fff; cursor:zoom-in; box-shadow:0 8px 24px rgba(8,10,14,.35); transition:border-color var(--dur) var(--ease), transform var(--dur) var(--ease); }
.testi__doc img{ width:100%; height:100%; object-fit:cover; object-position:top center; }
.testi__doc:hover{ border-color:var(--c-brass-500); transform:translateY(-2px); }
.testi__zoom{ position:absolute; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; gap:6px;
  padding:8px 6px; font-size:11px; letter-spacing:.04em; color:var(--c-text-ondark);
  background:linear-gradient(to top,rgba(14,17,22,.92),rgba(14,17,22,0)); opacity:0; transform:translateY(6px);
  transition:opacity var(--dur) var(--ease), transform var(--dur) var(--ease); }
.testi__doc:hover .testi__zoom,.testi__doc:focus-visible .testi__zoom{ opacity:1; transform:none; }
.testi__body{ display:flex; flex-direction:column; min-width:0; }
.testi__quote-mark{ font-family:var(--f-display); font-weight:700; font-size:48px; line-height:.6;
  color:var(--c-brass-500); opacity:.5; height:26px; }
.testi__quote{ margin:0 0 var(--s-4); font-size:16px; line-height:1.58; color:var(--c-text-ondark); overflow-wrap:break-word; }
.testi__foot{ display:flex; align-items:center; gap:14px; margin-top:auto; }
.testi__avatar{ width:44px; height:44px; flex:none; border-radius:50%; display:grid; place-items:center;
  background:var(--c-ink-600); color:var(--c-brass-300); font-family:var(--f-head); font-weight:700; font-size:15px; }
.testi__id{ display:flex; flex-direction:column; flex:1; min-width:0; }
.testi__author{ font-family:var(--f-head); font-weight:600; }
.testi__role{ color:var(--c-steel-300); font-size:13px; overflow-wrap:break-word; }
@media(max-width:1080px){ .testi{ grid-template-columns:140px 1fr; } }
@media(max-width:820px){ .testi-grid{ grid-template-columns:1fr; } .testi{ grid-template-columns:150px 1fr; } }
@media(max-width:430px){ .testi{ grid-template-columns:110px 1fr; gap:14px; } }

/* ============================ Сколково ============================ */
.skolkovo__inner{ display:grid; grid-template-columns:auto 1px 1fr; align-items:center; gap:var(--s-8);
  position:relative; overflow:hidden; border-radius:var(--r-lg); padding:var(--s-8);
  color:var(--c-text-ondark); border:1px solid var(--c-ink-600);
  background-color:var(--c-ink-800);
  background-image:
    radial-gradient(130% 170% at 100% 0%, rgba(227,162,61,.10), transparent 55%),
    linear-gradient(rgba(236,231,221,.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(236,231,221,.03) 1px,transparent 1px);
  background-size:auto, 56px 56px, 56px 56px; }
.skolkovo__logo{ flex:none; display:grid; place-items:center; width:176px; height:112px; padding:22px;
  background:#fff; border-radius:var(--r-md); box-shadow:var(--shadow-soft); }
.skolkovo__logo img{ max-width:100%; max-height:100%; object-fit:contain; }
.skolkovo__divider{ align-self:stretch; width:1px; background:linear-gradient(180deg,transparent,var(--c-ink-600),transparent); }
.skolkovo__title{ font-weight:700; font-size:clamp(22px,2.2vw,30px); letter-spacing:-.02em; margin:10px 0 12px; }
.skolkovo__lead{ color:var(--c-steel-300); max-width:64ch; margin:0; }
@media(max-width:760px){
  .skolkovo__inner{ grid-template-columns:1fr; gap:var(--s-4); padding:var(--s-6); }
  .skolkovo__divider{ display:none; }
}

/* ============================================================
   Правовые документы (.page-legal) — политика ПДн, cookie, оферта.
   Липкое оглавление со скролл-спаем + пронумерованные секции.
   ============================================================ */
.page-legal .hero--plain{
  min-height:auto;
  border-bottom:1px solid var(--c-ink-700);
  background:
    linear-gradient(var(--c-ink-900),var(--c-ink-900)) padding-box,
    repeating-linear-gradient(90deg,transparent 0 31px,rgba(227,162,61,.05) 31px 32px),
    repeating-linear-gradient(0deg,transparent 0 31px,rgba(227,162,61,.05) 31px 32px);
}
.page-legal .hero--plain::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background:linear-gradient(90deg,transparent,var(--c-brass-500),transparent); opacity:.6;
}
.page-legal .hero__title--sm{ max-width:24ch; }

/* — верхняя полоса прогресса чтения — */
.legal-progress{ position:fixed; inset:0 0 auto 0; height:2px; z-index:115; background:transparent; pointer-events:none; }
.legal-progress__bar{ display:block; height:100%; width:0; background:linear-gradient(90deg,var(--c-brass-500),var(--c-brass-300)); box-shadow:0 0 12px rgba(227,162,61,.5); transition:width 80ms linear; }

/* — сетка: оглавление + тело — */
.legal__grid{ display:grid; grid-template-columns:280px minmax(0,1fr); gap:var(--s-8); align-items:start; }
.legal__sticky{ position:sticky; top:calc(var(--header-h) + var(--s-3)); }

/* — оглавление со скролл-спаем — */
.legal__toc{ background:var(--c-ink-800); border:1px solid var(--c-ink-600); border-radius:var(--r-md); padding:var(--s-3) var(--s-2); }
.legal__toc-cap{ display:block; padding:0 8px var(--s-2); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--c-steel-300); }
.legal__toc ol{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.legal__toc a{ position:relative; display:grid; grid-template-columns:26px 1fr; gap:6px; align-items:baseline; padding:8px 10px 8px 12px; border-radius:var(--r-sm); color:var(--c-steel-300); font-size:13.5px; line-height:1.35; transition:color var(--dur) var(--ease),background var(--dur) var(--ease); }
.legal__toc a::before{ content:""; position:absolute; left:0; top:50%; transform:translateY(-50%) scaleY(0); width:2px; height:62%; background:var(--c-brass-500); border-radius:2px; transition:transform var(--dur) var(--ease); }
.legal__toc-no{ font-size:11px; color:var(--c-steel-300); transition:color var(--dur) var(--ease); }
.legal__toc a:hover{ color:var(--c-text-ondark); background:var(--c-ink-700); }
.legal__toc a.is-active{ color:var(--c-text-ondark); background:rgba(227,162,61,.07); }
.legal__toc a.is-active::before{ transform:translateY(-50%) scaleY(1); }
.legal__toc a.is-active .legal__toc-no{ color:var(--c-brass-300); }
.legal__print{ width:100%; margin-top:var(--s-3); }

/* — секции документа — */
.legal__body{ max-width:74ch; }
.legal__sec{ position:relative; padding:var(--s-6) 0; border-top:1px solid var(--c-ink-700); scroll-margin-top:calc(var(--header-h) + var(--s-3)); }
.legal__sec:first-child{ border-top:0; padding-top:0; }
.legal__sec-head{ margin-bottom:var(--s-3); }
.legal__sec-eyebrow{ display:block; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--c-brass-300); margin-bottom:6px; }
.legal__sec-title{ font-family:var(--f-display); font-weight:700; font-size:clamp(20px,2.4vw,26px); line-height:1.2; color:var(--c-text-ondark); margin:0; }
.legal__text{ color:var(--c-steel-300); font-size:15.5px; line-height:1.72; margin:0; }
.legal__list{ list-style:none; margin:var(--s-3) 0 0; padding:0; display:flex; flex-direction:column; gap:11px; }
.legal__list li{ position:relative; padding-left:26px; color:var(--c-text-ondark); font-size:15px; line-height:1.6; }
.legal__list li::before{ content:""; position:absolute; left:0; top:.62em; width:12px; height:1px; background:var(--c-brass-500); }
.legal__list li::after{ content:""; position:absolute; left:12px; top:calc(.62em - 2px); width:5px; height:5px; border-radius:50%; background:var(--c-brass-500); }

/* — концовка — */
.legal__foot{ margin-top:var(--s-6); padding-top:var(--s-4); border-top:1px solid var(--c-ink-700); }
.legal__foot-note{ margin:0; color:var(--c-steel-300); font-size:14px; }
.legal__foot-note a{ color:var(--c-brass-300); }

@media(max-width:980px){
  .legal__grid{ grid-template-columns:1fr; gap:var(--s-4); }
  .legal__sticky{ position:static; }
  .legal__toc{ display:none; }        /* на узких — оглавление лишнее, есть прогресс */
  .legal__body{ max-width:none; }
}

@media print{
  .site-header,.site-footer,.crumbs,.cookie,.legal-progress,.legal__rail,.modal,.hero__actions{ display:none !important; }
  .legal__grid{ grid-template-columns:1fr; }
  body{ background:#fff; color:#000; }
}

/* ============================================================
   Страница «Контакты» (.page-contacts) — hero с формой,
   адреса, реквизиты, карта Яндекс. Scoped.
   ============================================================ */
.page-contacts .contact-hero{ min-height:auto; padding-bottom:var(--s-8); }
.page-contacts .crumbs + .contact-hero{ min-height:auto; }
.contact-hero__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:var(--s-8); align-items:center; width:100%; }
.contact-hero__intro .hero__lead{ margin-bottom:var(--s-4); }

.contact-hero__quick{ list-style:none; margin:0 0 var(--s-4); padding:0; display:flex; flex-direction:column; gap:18px; }
.contact-hero__quick li{ display:flex; flex-direction:column; gap:3px; }
.contact-hero__label{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--c-steel-300); }
.contact-hero__phone{ font-family:var(--f-display); font-weight:700; font-size:clamp(24px,3vw,32px); line-height:1; color:var(--c-text-ondark); }
.contact-hero__phone:hover{ color:var(--c-brass-300); }
.contact-hero__mail{ font-size:17px; color:var(--c-brass-300); }
.contact-hero__hours{ font-size:16px; color:var(--c-text-ondark); }
.page-contacts .socials--menu{ margin-top:4px; }

/* — карточка-форма обратной связи — */
.contact-form{ position:relative; overflow:hidden; background:var(--c-ink-800); border:1px solid var(--c-ink-600); border-radius:var(--r-md); padding:var(--s-4); box-shadow:var(--shadow-card); }
.contact-form::before{ content:""; position:absolute; inset:0 0 auto 0; height:2px; background:linear-gradient(90deg,var(--c-brass-500),transparent 70%); }
.contact-form__cap{ display:block; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--c-brass-300); }
.contact-form__title{ font-family:var(--f-display); font-weight:700; font-size:24px; margin:6px 0 4px; color:var(--c-text-ondark); }
.contact-form__lead{ margin:0 0 var(--s-3); color:var(--c-steel-300); font-size:14px; line-height:1.55; }

/* — реквизиты — */
.requisites{ background:var(--c-ink-800); border:1px solid var(--c-ink-600); border-radius:var(--r-md); padding:var(--s-6); }
.requisites__head{ margin-bottom:var(--s-4); }
.requisites__title{ font-family:var(--f-display); font-weight:700; font-size:clamp(20px,2.4vw,26px); margin:8px 0 0; color:var(--c-text-ondark); }
.requisites__grid{ margin:0; display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--c-ink-600); border:1px solid var(--c-ink-600); border-radius:var(--r-sm); overflow:hidden; }
.requisites__grid > div{ background:var(--c-ink-800); padding:14px 18px; display:flex; flex-direction:column; gap:4px; }
.requisites__grid .requisites__wide{ grid-column:1 / -1; }
.requisites__grid dt{ font-family:var(--f-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--c-steel-300); }
.requisites__grid dd{ margin:0; font-size:15px; color:var(--c-text-ondark); line-height:1.45; }
.requisites__grid dd.mono{ font-family:var(--f-mono); letter-spacing:.02em; }

@media(max-width:900px){
  .contact-hero__grid{ grid-template-columns:1fr; gap:var(--s-6); align-items:start; }
}
@media(max-width:560px){
  .requisites__grid{ grid-template-columns:1fr; }
  .requisites__grid .requisites__wide{ grid-column:auto; }
  .requisites{ padding:var(--s-4); }
}

/* ============================================================
   Липкая мобильная панель быстрой связи (звонок + заявка).
   Показывается только на мобильных, на каждой странице.
   ============================================================ */
.mobile-cta{ display:none; }
@media(max-width:768px){
  /* Панель скрыта на первом экране и выезжает только после прокрутки (класс body.cta-on из JS) —
     чтобы «Оставить заявку» не соседствовала с кнопкой «Получить расчёт» на первом экране. */
  .mobile-cta{ position:fixed; left:0; right:0; bottom:0; z-index:100; display:flex; gap:10px; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); background:rgba(14,17,22,.92); backdrop-filter:blur(8px); border-top:1px solid var(--c-ink-600); transform:translateY(115%); opacity:0; pointer-events:none; transition:transform .32s var(--ease), opacity .32s var(--ease); }
  body.cta-on .mobile-cta{ transform:none; opacity:1; pointer-events:auto; }
  .mobile-cta__call,.mobile-cta__lead{ flex:1 1 50%; display:inline-flex; align-items:center; justify-content:center; gap:8px; height:48px; border-radius:var(--r-sm); font-family:var(--f-head); font-weight:600; font-size:15px; }
  .mobile-cta__call{ color:var(--c-text-ondark); border:1px solid var(--c-ink-600); background:var(--c-ink-800); }
  .mobile-cta__ico{ width:16px; height:16px; background:var(--c-brass-500); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.5 15.5 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.5-1 1-1h3.5c.6 0 1 .4 1 1 0 1.2.2 2.4.6 3.6.1.4 0 .8-.3 1z'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.5 15.5 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.5-1 1-1h3.5c.6 0 1 .4 1 1 0 1.2.2 2.4.6 3.6.1.4 0 .8-.3 1z'/%3E%3C/svg%3E") center/contain no-repeat; }
  body.cta-on{ padding-bottom:68px; }        /* место под панель — только когда она показана */
  body.cta-on .cookie{ bottom:76px; }         /* cookie-баннер над панелью, когда она есть */
}

/* ============================================================
   Блог / новости: featured, сетка карточек, пагинация, статья.
   ============================================================ */
.page-blog__list .post-feat{ display:grid; grid-template-columns:1.05fr .95fr; gap:0; margin-bottom:var(--s-8); border:1px solid var(--c-ink-600); border-radius:var(--r-md); overflow:hidden; background:var(--c-ink-800); }
.post-feat__cover{ position:relative; min-height:320px; display:block; overflow:hidden; }
.post-feat__cover img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform var(--dur-slow) var(--ease); }
.post-feat:hover .post-feat__cover img{ transform:scale(1.04); }
.post-feat__body{ padding:var(--s-6); display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:12px; }
.post-feat__title{ font-family:var(--f-display); font-weight:700; font-size:clamp(22px,2.6vw,30px); line-height:1.18; letter-spacing:-.02em; }
.post-feat__title a{ color:var(--c-text-ondark); }
.post-feat__title a:hover{ color:var(--c-brass-300); }
.post-feat__excerpt{ color:var(--c-steel-300); font-size:15.5px; line-height:1.6; max-width:54ch; }

.post-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s-4); }
.post-card{ display:flex; flex-direction:column; border:1px solid var(--c-ink-600); border-radius:var(--r-md); overflow:hidden; background:var(--c-ink-800); transition:border-color var(--dur) var(--ease), transform var(--dur) var(--ease); }
.post-card:hover{ border-color:var(--c-ink-500,#3a424d); transform:translateY(-3px); }
.post-card__cover{ position:relative; display:block; aspect-ratio:16/10; overflow:hidden; background:var(--c-ink-700); }
.post-card__cover img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform var(--dur-slow) var(--ease); }
.post-card:hover .post-card__cover img{ transform:scale(1.05); }
.post-card__cat,.post-feat__cover .post-card__cat{ position:absolute; left:12px; top:12px; z-index:2; padding:5px 10px; font-family:var(--f-mono); font-size:11px; letter-spacing:.04em; color:var(--c-ink-900); background:var(--c-brass-300); border-radius:100px; }
.post-cover-ph{ position:absolute; inset:0; display:grid; place-items:center; font-family:var(--f-display); font-weight:700; font-size:22px; letter-spacing:.04em; color:var(--c-brass-300); background:
    linear-gradient(135deg,var(--c-ink-700),var(--c-ink-800)),
    repeating-linear-gradient(90deg,transparent 0 31px,rgba(227,162,61,.06) 31px 32px); }
.post-card__body{ padding:var(--s-4); display:flex; flex-direction:column; gap:10px; flex:1; }
.post-card__date{ font-size:12px; color:var(--c-steel-300); }
.post-card__title{ font-family:var(--f-display); font-weight:700; font-size:18px; line-height:1.28; }
.post-card__title a{ color:var(--c-text-ondark); }
.post-card__title a:hover{ color:var(--c-brass-300); }
.post-card__excerpt{ color:var(--c-steel-300); font-size:14px; line-height:1.55; }
.post-card__more{ margin-top:auto; color:var(--c-brass-300); font-size:14px; font-weight:600; }

/* — пагинация — */
.pagination{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px; margin-top:var(--s-8); }
.pagination__page,.pagination__btn{ min-width:42px; height:42px; padding:0 12px; display:inline-grid; place-items:center; border:1px solid var(--c-ink-600); border-radius:var(--r-sm); color:var(--c-text-ondark); font-family:var(--f-mono); font-size:14px; transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease),color var(--dur) var(--ease); }
.pagination__page:hover,.pagination__btn:hover{ border-color:var(--c-brass-500); color:var(--c-brass-300); }
.pagination__page.is-active{ background:var(--c-brass-500); border-color:var(--c-brass-500); color:var(--c-ink-900); font-weight:700; }
.pagination__btn.is-disabled{ opacity:.35; pointer-events:none; }

/* — статья — */
.article{ padding-top:var(--s-6); }
.article__head{ padding-block:var(--s-4) var(--s-4); }
.article__meta{ display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-bottom:14px; font-size:12px; color:var(--c-steel-300); }
.article__cat{ padding:5px 10px; font-family:var(--f-mono); font-size:11px; color:var(--c-ink-900); background:var(--c-brass-300); border-radius:100px; }
.article__rt::before{ content:"· "; }
.article__title{ font-family:var(--f-display); font-weight:700; font-size:clamp(28px,4vw,46px); line-height:1.1; letter-spacing:-.025em; max-width:20ch; }
.article__excerpt{ margin-top:16px; color:var(--c-steel-300); font-size:18px; line-height:1.55; max-width:60ch; }
.article__cover{ margin:var(--s-6) 0 0; border-radius:var(--r-md); overflow:hidden; border:1px solid var(--c-ink-600); aspect-ratio:21/9; }
.article__cover img{ width:100%; height:100%; object-fit:cover; }
.article__body{ padding-top:var(--s-6); max-width:74ch; }
.article__p{ margin:0 0 var(--s-3); color:var(--c-text-ondark); font-size:17px; line-height:1.72; }
.article__h2{ font-family:var(--f-display); font-weight:700; font-size:clamp(21px,2.4vw,27px); line-height:1.2; margin:var(--s-6) 0 14px; }
.article__list{ list-style:none; margin:0 0 var(--s-4); padding:0; display:flex; flex-direction:column; gap:11px; }
.article__list li{ position:relative; padding-left:26px; color:var(--c-text-ondark); font-size:16px; line-height:1.6; }
.article__list li::before{ content:""; position:absolute; left:0; top:.62em; width:12px; height:1px; background:var(--c-brass-500); }
.article__list li::after{ content:""; position:absolute; left:12px; top:calc(.62em - 2px); width:5px; height:5px; border-radius:50%; background:var(--c-brass-500); }
.article__quote{ margin:var(--s-5) 0; padding:var(--s-4) var(--s-5); border-left:2px solid var(--c-brass-500); background:var(--c-ink-800); border-radius:0 var(--r-sm) var(--r-sm) 0; }
.article__quote p{ margin:0; font-family:var(--f-display); font-size:19px; line-height:1.5; color:var(--c-text-ondark); }
.article__quote cite{ display:block; margin-top:10px; font-style:normal; font-size:13px; color:var(--c-brass-300); }
.article__foot{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; margin-top:var(--s-6); padding-top:var(--s-4); border-top:1px solid var(--c-ink-700); }
.article__back{ color:var(--c-brass-300); font-weight:600; }

@media(max-width:860px){
  .page-blog__list .post-feat{ grid-template-columns:1fr; }
  .post-feat__cover{ min-height:220px; aspect-ratio:16/9; }
  .post-grid{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:560px){
  .post-grid{ grid-template-columns:1fr; }
  .article__cover{ aspect-ratio:16/10; }
}

/* Яндекс SmartCaptcha — контейнер в формах */
.captcha-box{ margin:6px 0 2px; min-height:96px; }
.captcha-box:empty{ min-height:0; margin:0; }

/* Тело статьи из редактора (raw HTML) — типографика как у блочного рендера */
.article__html > *:first-child{ margin-top:0; }
.article__html p{ margin:0 0 var(--s-3); color:var(--c-text-ondark); font-size:17px; line-height:1.72; }
.article__html h2{ font-family:var(--f-display); font-weight:700; font-size:clamp(21px,2.4vw,27px); line-height:1.2; margin:var(--s-6) 0 14px; color:var(--c-text-ondark); }
.article__html h3{ font-family:var(--f-display); font-weight:700; font-size:19px; margin:var(--s-5) 0 10px; color:var(--c-text-ondark); }
.article__html ul,.article__html ol{ margin:0 0 var(--s-4); padding-left:0; list-style:none; display:flex; flex-direction:column; gap:11px; }
.article__html ul li{ position:relative; padding-left:26px; color:var(--c-text-ondark); font-size:16px; line-height:1.6; }
.article__html ul li::before{ content:""; position:absolute; left:0; top:.62em; width:12px; height:1px; background:var(--c-brass-500); }
.article__html ul li::after{ content:""; position:absolute; left:12px; top:calc(.62em - 2px); width:5px; height:5px; border-radius:50%; background:var(--c-brass-500); }
.article__html ol{ counter-reset:li; }
.article__html ol li{ position:relative; padding-left:30px; color:var(--c-text-ondark); font-size:16px; line-height:1.6; counter-increment:li; }
.article__html ol li::before{ content:counter(li); position:absolute; left:0; top:0; font-family:var(--f-mono); font-size:13px; color:var(--c-brass-300); }
.article__html blockquote{ margin:var(--s-5) 0; padding:var(--s-4) var(--s-5); border-left:2px solid var(--c-brass-500); background:var(--c-ink-800); border-radius:0 var(--r-sm) var(--r-sm) 0; }
.article__html blockquote p{ margin:0; font-family:var(--f-display); font-size:19px; line-height:1.5; }
.article__html blockquote cite{ display:block; margin-top:10px; font-style:normal; font-size:13px; color:var(--c-brass-300); }
.article__html a{ color:var(--c-brass-300); text-decoration:underline; text-underline-offset:3px; }
.article__html img{ max-width:100%; height:auto; border-radius:var(--r-md); margin:var(--s-4) 0; border:1px solid var(--c-ink-600); }
.article__html strong{ color:#fff; font-weight:700; }

/* Статья: эмбеды и таблицы из редактора */
.article__html iframe{ width:100%; aspect-ratio:16/9; height:auto; border:0; border-radius:var(--r-md); margin:var(--s-4) 0; display:block; background:#000; }
.article__html figure{ margin:var(--s-4) 0; } .article__html figcaption{ color:var(--c-steel-300); font-size:13px; margin-top:8px; text-align:center; }
.article__html table{ width:100%; border-collapse:collapse; margin:var(--s-4) 0; font-size:15px; }
.article__html th,.article__html td{ border:1px solid var(--c-ink-600); padding:10px 12px; text-align:left; }
.article__html th{ background:var(--c-ink-800); color:var(--c-text-ondark); font-weight:600; }
.article__html pre{ background:var(--c-ink-800); border:1px solid var(--c-ink-600); border-radius:var(--r-sm); padding:14px 16px; overflow:auto; font-family:var(--f-mono); font-size:13px; margin:var(--s-3) 0; }
.article__html code{ font-family:var(--f-mono); font-size:.92em; background:var(--c-ink-800); padding:2px 6px; border-radius:4px; }
.article__html pre code{ background:none; padding:0; }