

/* Start:/local/templates/agat/fonts/fonts.css?17926654494717*/
/* Geologica, Golos Text — локальные копии с Google Fonts (OFL), вариативные по насыщенности.
   font-display: block — текст ждёт шрифт (он предзагружается в header.php), а не подменяется: при подмене пункты
   меню в шапке сдвигались. Если шрифт не загрузится, текст покажется запасным шрифтом той же ширины (ниже). */
/* cyrillic-ext */
@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 400 700;
  font-display: block;
  src: url(/local/templates/agat/fonts/geologica-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 400 700;
  font-display: block;
  src: url(/local/templates/agat/fonts/geologica-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 400 700;
  font-display: block;
  src: url(/local/templates/agat/fonts/geologica-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 400 700;
  font-display: block;
  src: url(/local/templates/agat/fonts/geologica-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 600;
  font-display: block;
  src: url(/local/templates/agat/fonts/golos-text-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 600;
  font-display: block;
  src: url(/local/templates/agat/fonts/golos-text-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 600;
  font-display: block;
  src: url(/local/templates/agat/fonts/golos-text-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 600;
  font-display: block;
  src: url(/local/templates/agat/fonts/golos-text-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Запасные шрифты с подогнанной шириной: пока Geologica и Golos Text загружаются, текст набран Arial того же
   размера, что и основной шрифт, — при подмене строки не меняют длину и пункты меню в шапке не сдвигаются.
   Коэффициенты измерены по ширине строк меню и шапки (RU, BY, EN), 23.09.2026. */
@font-face {
  font-family: 'Golos Text Fallback';
  src: local('Arial'), local('ArialMT'), local('Liberation Sans'), local('Helvetica');
  size-adjust: 107%;
  ascent-override: 92%;
  descent-override: 24%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Geologica Fallback';
  src: local('Arial'), local('ArialMT'), local('Liberation Sans'), local('Helvetica');
  size-adjust: 108.5%;
  ascent-override: 93%;
  descent-override: 24%;
  line-gap-override: 0%;
}
/* телефон в шапке: цифры и строка часов работы уже, чем текст меню, — свои коэффициенты */
@font-face {
  font-family: 'Geologica Fallback Digits';
  src: local('Arial'), local('ArialMT'), local('Liberation Sans'), local('Helvetica');
  size-adjust: 104.95%;
  ascent-override: 93%;
  descent-override: 24%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Golos Text Fallback Digits';
  src: local('Arial'), local('ArialMT'), local('Liberation Sans'), local('Helvetica');
  size-adjust: 103.7%;
  ascent-override: 92%;
  descent-override: 24%;
  line-gap-override: 0%;
}

/* End */


/* Start:/local/templates/agat/css/style.css?179266544982767*/
/* ============================================================
   ОАО «АГАТ-СИСТЕМ» — дизайн-система редизайна, 2026
   Направление: технологичный промышленный корпоративный сайт.
   Структурный язык — инженерная документация и приборный шильдик:
   волосяные линии, точная сетка, радиус 2px, без мягких теней.
   ============================================================ */

/* ---------- 1. Токены ---------- */
:root{
  /* Цвет */
  --ink:#0E1836;            /* глубокая чернильная синь — тёмные полосы */
  --ink-2:#16224A;
  --brand:#243E7C;          /* фирменный цвет логотипа АГАТ */
  --brand-deep:#16295A;
  --brand-tint:#E8ECF5;
  --signal:#00A6C0;         /* приборный циан — акцент, дозировано */
  --signal-deep:#00808F;
  --signal-tint:#E2F5F8;
  --paper:#F7F8FA;          /* фон страницы */
  --panel:#FFFFFF;
  --panel-2:#F8F9FB;
  --rule:#D5DAE3;           /* волосяная линия */
  --rule-strong:#B6BECC;
  --text:#101725;
  --steel:#5D6878;          /* вторичный текст */
  --steel-dim:#8A94A3;
  --on-dark:#FFFFFF;
  --on-dark-dim:#A9B4CD;
  --warn:#B4531B;
  --ok:#2F7A4B;

  /* Типографика */
  --ff-head:"Geologica","Helvetica Neue",Arial,sans-serif;
  --ff-body:"Golos Text","Helvetica Neue",Arial,sans-serif;
  --fs-display:clamp(38px,4.6vw,66px);
  --fs-h1:clamp(31px,3.3vw,46px);
  --fs-h2:clamp(25px,2.4vw,34px);
  --fs-h3:clamp(19px,1.4vw,22px);
  --fs-h4:17px;
  --fs-lead:clamp(17px,1.25vw,19px);
  --fs-body:16px;
  --fs-sm:14px;
  --fs-xs:12.5px;

  /* Сетка и ритм */
  --container:1320px;
  --gutter:24px;
  --pad:clamp(16px,3.4vw,40px);
  --s-1:4px;  --s-2:8px;  --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;
  --sect:clamp(56px,7vw,104px);
  --r:2px;
  --header-h:76px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- 2. База ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; overflow-x:clip}
body{overflow-x:clip}
body{
  margin:0; background:var(--paper); color:var(--text);
  font-family:var(--ff-body); font-size:var(--fs-body); line-height:1.6;
  font-feature-settings:"tnum" 0; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5{font-family:var(--ff-head); font-weight:600; letter-spacing:-.022em; line-height:1.1; margin:0}
h1{font-size:var(--fs-h1)} h2{font-size:var(--fs-h2)} h3{font-size:var(--fs-h3)} h4{font-size:var(--fs-h4); letter-spacing:-.01em}
p{margin:0 0 1em}
a{color:inherit; text-decoration:none}
img,svg{display:block; max-width:100%}
button,input,select,textarea{font:inherit; color:inherit}
ul,ol{margin:0 0 1em; padding-left:1.15em}
hr{border:0; border-top:1px solid var(--rule); margin:var(--s-6) 0}
code,kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.9em; background:var(--panel-2); border:1px solid var(--rule); border-radius:2px; padding:1px 5px}
.swatch-info code{border:0; background:none; padding:0; font-family:var(--ff-body); font-size:12px}
:focus-visible{outline:2px solid var(--signal); outline-offset:2px; border-radius:var(--r)}
::selection{background:var(--signal); color:#fff}

.container{width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--pad)}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}

/* Цифры в таблицах и показателях — моноширинные по ширине */
.tnum{font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1}

/* ---------- 3. Фирменный приём: спектр ---------- */
/* Полоса вертикальных штрихов переменной высоты — визуальный код радиосвязи.
   Используется как акцент героя, как разделитель разделов и как указатель
   активного состояния. Единственный «громкий» элемент системы. */
.spectrum{display:grid; grid-auto-flow:column; grid-auto-columns:1fr; align-items:end; height:40px; overflow:hidden}
.spectrum i{width:100%; max-width:3px; justify-self:center; background:currentColor; opacity:.5; height:var(--h,20%); transform-origin:bottom}
.spectrum--hero{color:var(--signal); height:58px}
.spectrum--hero i{opacity:.9}
.spectrum--rule{height:14px; color:var(--rule-strong)}
.spectrum--rule i{opacity:.75}
@media (max-width:900px){.spectrum i:nth-child(n+61){display:none}}
@media (max-width:560px){.spectrum i:nth-child(n+37){display:none}}

@media (prefers-reduced-motion:no-preference){
  .spectrum--hero i{animation:spectrum-in .7s var(--ease) both; animation-delay:calc(var(--i) * 18ms)}
  @keyframes spectrum-in{from{transform:scaleY(0)} to{transform:scaleY(1)}}
}

/* ---------- 4. Служебная строка ---------- */
.topbar{background:var(--ink); color:var(--on-dark-dim); font-size:var(--fs-xs); line-height:1}
.topbar .container{display:flex; align-items:center; gap:var(--s-4); min-height:42px; flex-wrap:wrap}
.topbar a{color:var(--on-dark-dim); padding:6px 0; border-bottom:1px solid transparent}
.topbar a:hover{color:#fff; border-bottom-color:var(--signal)}
.topbar-official{display:flex; gap:var(--s-5); flex-wrap:wrap}
.topbar-tools{display:flex; align-items:center; gap:var(--s-4)}
.lang{display:flex; gap:2px}
.lang a{padding:5px 8px; border:1px solid transparent; border-bottom:0; letter-spacing:.04em}
.lang a[aria-current="true"]{color:#fff; background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.18)}
.eye{display:inline-flex; align-items:center; gap:6px}
.eye svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6}

/* ---------- 5. Шапка ---------- */
.header{position:sticky; top:0; z-index:60; background:var(--panel); border-bottom:1px solid var(--rule)}
.header .container{display:flex; align-items:center; gap:clamp(10px,1.2vw,18px); min-height:var(--header-h)}

.logo{display:flex; align-items:center; flex:0 0 auto; padding:8px 0}
.logo img{height:34px; width:auto}
@media (max-width:1380px){.logo img{height:31px}}
@media (max-width:560px){.logo img{height:28px}}

.nav{display:flex; align-items:center; justify-content:center; gap:clamp(0px,.5vw,6px); flex:1 1 auto; min-width:0}
.nav-item{position:relative; display:flex; align-items:center}
.nav-item > a{
  display:inline-flex; align-items:center; padding:10px 4px 10px 9px; font-size:14.5px; color:var(--text);
  line-height:1.2; white-space:nowrap; border-bottom:2px solid transparent; margin-bottom:-2px}
.nav-item:not(:has(.nav-sub)) > a{padding-right:9px}
.nav-sub{display:inline-flex; align-items:center; justify-content:center; width:22px; height:30px; padding:0;
  background:none; border:0; cursor:pointer; color:var(--steel-dim); border-radius:var(--r)}
.nav .caret{width:9px; height:9px; stroke:currentColor; stroke-width:2; fill:none; transition:transform .2s var(--ease)}
/* Состояния пункта: наведение, открытый список, активный раздел */
.nav-item:hover > a,.nav-item.is-open > a{color:var(--brand)}
.nav-item:hover > .nav-sub,.nav-item.is-open > .nav-sub{color:var(--brand)}
.nav-item.is-open > .nav-sub .caret{transform:rotate(180deg)}
.nav-item > a[aria-current="page"]{color:var(--brand); font-weight:500; border-bottom-color:var(--signal)}
.nav-item > a[aria-current="page"] ~ .nav-sub{color:var(--brand)}

/* Выпадающий список раздела — обычный dropdown, без мега-меню */
.drop{position:absolute; top:calc(100% + 14px); left:0; z-index:70; min-width:280px; max-width:min(640px,calc(100vw - 32px));
  background:var(--panel); border:1px solid var(--rule-strong); border-top:2px solid var(--signal); border-radius:0 0 var(--r) var(--r);
  box-shadow:0 22px 44px -24px rgba(14,24,54,.45); padding:8px; display:none}
.drop::before{content:""; position:absolute; left:0; right:0; top:-16px; height:16px} /* мостик для мыши */
.nav-item.is-open > .drop{display:block}
.drop--wide{width:max-content; max-width:min(620px,calc(100vw - 32px))}
.nav-item:nth-last-child(-n+4) > .drop{left:auto; right:0}
.drop-list{list-style:none; margin:0; padding:0}
.drop-list--2{columns:2; column-gap:4px}
.drop-list li{break-inside:avoid}
.drop-list a,.drop-group-head{display:block; padding:8px 12px 8px 12px; font-size:14px; line-height:1.35; color:var(--text);
  border-left:2px solid transparent; border-radius:var(--r); max-width:34ch}
.drop-list a:hover,a.drop-group-head:hover{background:var(--panel-2); border-left-color:var(--rule-strong); color:var(--brand)}
.drop-list a[aria-current="page"],.drop-group-head[aria-current="page"]{background:var(--brand-tint); color:var(--brand); border-left-color:var(--signal); font-weight:500}
.drop-groups{display:grid; grid-template-columns:repeat(2,minmax(0,260px)); gap:4px}
.drop-group-head{font-family:var(--ff-head); font-weight:500; color:var(--brand); display:flex; gap:8px; align-items:baseline}
.drop-group-head em{font-style:normal; font-family:var(--ff-body); font-size:var(--fs-xs); color:var(--steel-dim); font-weight:400}
.drop-group .drop-list a{color:var(--steel); padding-left:24px; position:relative}
.drop-group .drop-list a::before{content:""; position:absolute; left:12px; top:17px; width:6px; height:1px; background:var(--rule-strong)}
.drop-group--sub{margin-top:4px; padding-top:4px; border-top:1px solid var(--rule)}
.drop-group--sub .drop-group-head{font-family:var(--ff-body); font-size:var(--fs-xs); color:var(--steel-dim); font-weight:400; padding-bottom:2px}
.drop-all{display:flex; align-items:center; gap:8px; margin:6px 0 0; padding:10px 12px 4px; border-top:1px solid var(--rule); font-size:13.5px; font-weight:500; color:var(--brand)}
.drop-all svg{width:15px; height:15px}
.drop-all:hover{color:var(--brand-deep)}

.header-phone{font-family:var(--ff-head); font-weight:500; font-size:15px; white-space:nowrap; letter-spacing:-.01em}
.header-phone span{display:block; font-family:var(--ff-body); font-weight:400; font-size:11.5px; color:var(--steel); letter-spacing:0}

/* Поиск по сайту */
.search{position:relative; flex:0 0 232px; min-width:44px}
/* Поиск живёт в служебной строке — шапка остаётся под логотип, меню и телефон */
.topbar .search{margin-left:auto}
.topbar .search-form{height:28px; padding:0 8px 0 10px; gap:6px;
  background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.2)}
.topbar .search-form svg{width:15px; height:15px; stroke:#93A4C6}
.topbar .search-form:focus-within{background:rgba(255,255,255,.14); border-color:var(--signal)}
.topbar .search-form:focus-within svg{stroke:var(--signal)}
.topbar .search-input{color:#fff; font-size:13px}
.topbar .search-input::placeholder{color:#93A4C6}
.topbar .search-clear{color:#93A4C6}
.topbar .search-panel{top:calc(100% + 6px)}
.search-form{display:flex; align-items:center; gap:8px; height:40px; padding:0 10px 0 12px;
  border:1px solid var(--rule); border-radius:var(--r); background:var(--panel-2);
  transition:border-color .18s var(--ease), background .18s var(--ease)}
.search-form:focus-within{border-color:var(--brand); background:var(--panel)}
.search-form svg{width:17px; height:17px; flex:0 0 auto; stroke:var(--steel); fill:none; stroke-width:1.8}
.search-form:focus-within svg{stroke:var(--brand)}
.search-input{flex:1 1 auto; min-width:0; border:0; background:none; outline:0; font-size:14px}
.search-input::placeholder{color:var(--steel-dim)}
.search-input::-webkit-search-cancel-button,.search-input::-webkit-search-decoration{-webkit-appearance:none; display:none}
.search-clear{display:none; border:0; background:none; cursor:pointer; padding:4px; color:var(--steel)}
.search.is-filled .search-clear{display:block}

.search-panel{
  position:absolute; top:calc(100% + 8px); right:0; width:min(520px,92vw);
  background:var(--panel); border:1px solid var(--rule-strong); border-radius:var(--r);
  box-shadow:0 18px 44px -20px rgba(14,24,54,.42); padding:var(--s-4); display:none; max-height:70vh; overflow:auto
}
.search.is-open .search-panel{display:block}
.search-group + .search-group{margin-top:var(--s-4); padding-top:var(--s-4); border-top:1px solid var(--rule)}
.search-group-title{font-size:var(--fs-xs); color:var(--steel); margin-bottom:6px; letter-spacing:.02em}
.search-hit{display:flex; align-items:baseline; gap:10px; padding:8px 10px; border-radius:var(--r); border-left:2px solid transparent}
.search-hit:hover,.search-hit:focus-visible{background:var(--panel-2); border-left-color:var(--signal)}
.search-hit b{font-weight:500}
.search-hit mark{background:var(--signal-tint); color:inherit; padding:0 1px}
.search-hit span{margin-left:auto; font-size:var(--fs-xs); color:var(--steel-dim); white-space:nowrap}
.search-empty{padding:10px; color:var(--steel); font-size:var(--fs-sm)}
.search-tags{display:flex; flex-wrap:wrap; gap:6px}
.search-tags button{border:1px solid var(--rule); background:var(--panel-2); border-radius:var(--r); padding:5px 10px; font-size:13px; cursor:pointer}
.search-tags button:hover{border-color:var(--brand); color:var(--brand)}

.nav-foot{display:none}
.lang--light a{color:var(--steel); border:1px solid var(--rule); padding:7px 11px; font-size:13px; letter-spacing:.04em; border-radius:var(--r)}
.lang--light{gap:6px}
.lang--light a[aria-current="true"]{color:#fff; background:var(--brand); border-color:var(--brand)}
.eye--light{font-size:13.5px; color:var(--steel)}
.eye--light:hover{color:var(--brand)}
.burger{display:none; width:42px; height:42px; border:1px solid var(--rule); background:var(--panel); border-radius:var(--r); cursor:pointer; align-items:center; justify-content:center}
.burger svg{width:20px; height:20px; stroke:var(--text); stroke-width:1.8; fill:none}
.burger-close{display:none}
.burger[aria-expanded="true"] .burger-open{display:none}
.burger[aria-expanded="true"] .burger-close{display:block}
.nav-scrim{position:fixed; inset:0; z-index:55; background:rgba(14,24,54,.42)}
.search-toggle{display:none}

/* ---------- 6. Кнопки ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  height:46px; padding:0 22px; border-radius:var(--r); border:1px solid transparent;
  font-family:var(--ff-head); font-size:15px; font-weight:500; letter-spacing:-.01em;
  cursor:pointer; transition:background .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease);
  white-space:nowrap;
}
.btn svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; flex:0 0 auto}
.btn--primary{background:var(--brand); color:#fff}
.btn--primary:hover{background:var(--brand-deep)}
.btn--ghost{border-color:var(--rule-strong); color:var(--text); background:var(--panel)}
.btn--ghost:hover{border-color:var(--brand); color:var(--brand)}
.btn--on-dark{border-color:rgba(255,255,255,.34); color:#fff; background:transparent}
.btn--on-dark:hover{background:rgba(255,255,255,.1); border-color:#fff}
.btn--signal{background:var(--signal-deep); color:#fff}
.btn--signal:hover{background:#00646f}
.btn--sm{height:38px; padding:0 15px; font-size:14px}
.btn--block{width:100%}
.btn[disabled]{opacity:.45; pointer-events:none}

/* Текстовая ссылка с подчёркиванием-волоском */
.link{display:inline-block; color:var(--brand); border-bottom:1px solid var(--rule-strong); padding-bottom:1px; font-weight:500}
.link:hover{border-bottom-color:var(--brand)}
.link--on-dark{color:#fff; border-bottom-color:rgba(255,255,255,.4)}
.link--on-dark:hover{border-bottom-color:var(--signal)}

/* ---------- 7. Заголовок раздела ---------- */
.sect{padding-block:var(--sect)}
.sect--tight{padding-block:calc(var(--sect) * .62)}
.sect--dark{background:var(--ink); color:var(--on-dark)}
.sect--panel{background:var(--panel)}

.sect-head{display:grid; grid-template-columns:minmax(0,4fr) minmax(0,8fr); gap:var(--gutter);
  padding-top:var(--s-5); border-top:1px solid var(--rule); margin-bottom:var(--s-7)}
.sect--dark .sect-head{border-top-color:rgba(255,255,255,.18)}
.sect-head h2{max-width:14ch}
.sect-head-aside{display:flex; flex-direction:column; gap:var(--s-4); align-items:flex-end; text-align:right}
.sect-head-aside p{max-width:52ch; color:var(--steel); font-size:var(--fs-sm); line-height:1.65; margin:0; text-wrap:balance}
.sect--dark .sect-head-aside p{color:var(--on-dark-dim)}

/* ---------- 8. Герой ---------- */
.hero{position:relative; background:var(--ink); color:#fff; overflow:hidden}
.hero-bg{position:absolute; inset:0}
.hero-bg img{width:100%; height:100%; object-fit:cover; object-position:42% 55%; filter:grayscale(.28) contrast(1.04)}
.hero-bg::after{content:""; position:absolute; inset:0;
  background:
    linear-gradient(to bottom, rgba(14,24,54,0) 34%, rgba(14,24,54,.55) 70%, rgba(14,24,54,.9) 100%),
    linear-gradient(100deg, rgba(14,24,54,.97) 0%, rgba(14,24,54,.92) 38%, rgba(14,24,54,.6) 68%, rgba(20,32,70,.46) 100%)}
/* Тонкая измерительная сетка — код конструкторского чертежа */
.hero-grid{position:absolute; inset:0; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:88px 88px; mask-image:linear-gradient(90deg,#000 0 55%,transparent 92%)}
.hero-inner{position:relative; padding-block:clamp(56px,8vw,104px) 0}
.hero-brandline{display:flex; align-items:center; gap:12px; font-size:var(--fs-sm); color:var(--on-dark-dim); margin-bottom:var(--s-5)}
.hero-brandline::before{content:""; width:34px; height:1px; background:var(--signal)}
.hero h1{font-size:var(--fs-display); max-width:17ch; font-weight:600; line-height:1.03}
.hero-lead{max-width:56ch; color:#D7DEEE; font-size:var(--fs-lead); margin:var(--s-5) 0 var(--s-6)}
.hero-actions{display:flex; gap:var(--s-3); flex-wrap:wrap}
.hero-spectrum{margin-top:clamp(40px,6vw,76px)}

/* Направления — четыре плитки в подвале героя */
.directions{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid rgba(255,255,255,.2); position:relative; margin-top:clamp(48px,7vw,92px)}
.direction{display:block; padding:var(--s-5) var(--s-5) var(--s-6) 0; border-right:1px solid rgba(255,255,255,.16); position:relative}
.direction:last-child{border-right:0}
.direction:not(:first-child){padding-left:var(--s-5)}
.direction::before{content:""; position:absolute; top:-1px; left:0; right:0; height:2px; background:var(--signal); transform:scaleX(0); transform-origin:left; transition:transform .28s var(--ease)}
.direction:hover::before,.direction:focus-visible::before{transform:scaleX(1)}
.direction h3{font-size:17px; font-weight:500; margin-bottom:6px}
.direction p{font-size:13.5px; color:var(--on-dark-dim); margin:0 0 var(--s-3); max-width:30ch}
.direction-count{font-size:var(--fs-xs); color:var(--signal); letter-spacing:.02em}

/* ---------- 9. Карточка-шильдик (продукция) ---------- */
.cards{display:grid; gap:var(--gutter)}
.cards--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cards--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cards--2{grid-template-columns:repeat(2,minmax(0,1fr))}

.plate{
  display:flex; flex-direction:column; background:var(--panel); border:1px solid var(--rule);
  border-radius:var(--r); position:relative; transition:border-color .2s var(--ease)
}
.plate::before{content:""; position:absolute; top:-1px; left:-1px; width:44px; height:2px; background:var(--signal); transition:width .28s var(--ease)}
.plate:hover{border-color:var(--rule-strong)}
.plate:hover::before{width:calc(100% + 2px)}
.plate-art{background:var(--panel-2); border-bottom:1px solid var(--rule); padding:var(--s-5); aspect-ratio:16/10; display:flex; align-items:center; justify-content:center; overflow:hidden}
.plate-art--photo{padding:0}
.plate-art svg{width:100%; height:100%; max-height:160px}
.plate-art img{width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease)}
.plate:hover .plate-art--photo img{transform:scale(1.04)}
.plate-body{padding:var(--s-5); display:flex; flex-direction:column; flex:1 1 auto}
.plate-cat{font-size:var(--fs-xs); color:var(--steel-dim); margin-bottom:8px}
.plate h3{font-size:18px; font-weight:500; line-height:1.25; margin-bottom:var(--s-3)}
.plate:hover h3{color:var(--brand)}
.plate-spec{list-style:none; margin:0 0 var(--s-4); padding:0; font-size:13.5px}
.plate-spec li{display:flex; align-items:baseline; gap:6px; padding:5px 0; border-top:1px solid var(--rule); color:var(--steel)}
.plate-spec li b{margin-left:auto; font-weight:500; color:var(--text); text-align:right}
.plate-foot{margin-top:auto; display:flex; align-items:center; gap:var(--s-3); padding-top:var(--s-3); border-top:1px solid var(--rule)}
.plate-foot .link{font-size:14px}
.plate-link::after{content:""; position:absolute; inset:0}

/* Бейдж */
.badge{display:inline-flex; align-items:center; gap:5px; font-size:var(--fs-xs); padding:3px 8px; border-radius:var(--r); border:1px solid var(--rule); color:var(--steel); background:var(--panel-2); white-space:nowrap}
.badge--signal{color:var(--signal-deep); border-color:#A9DDE5; background:var(--signal-tint)}
.badge--brand{color:var(--brand); border-color:#C6C2DE; background:var(--brand-tint)}
.badge--new{color:var(--warn); border-color:#E6C4AE; background:#FBF0E9}

/* Плитка раздела: реальная фотография и подпись под ней */
.tile{position:relative; display:flex; flex-direction:column; background:var(--panel);
  border:1px solid var(--rule); border-radius:var(--r); overflow:hidden; transition:border-color .2s var(--ease)}
.tile::before{content:""; position:absolute; top:0; left:0; width:44px; height:2px; background:var(--signal); z-index:2; transition:width .28s var(--ease)}
.tile:hover{border-color:var(--rule-strong)}
.tile:hover::before{width:100%}
.tile-media{aspect-ratio:10/7; overflow:hidden; background:var(--panel-2); border-bottom:1px solid var(--rule)}
.tile-media img{width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease)}
.tile:hover .tile-media img{transform:scale(1.04)}
.tile-body{padding:var(--s-5); display:flex; flex-direction:column; flex:1 1 auto}
.tile-cat{font-size:var(--fs-xs); color:var(--steel-dim); margin-bottom:8px}
.tile h3{font-size:17px; font-weight:500; line-height:1.3; margin:0}
.tile:hover h3{color:var(--brand)}
.tile p{font-size:13.5px; color:var(--steel); margin:var(--s-3) 0 0}
.tile-foot{margin-top:auto; padding-top:var(--s-4)}
.tile-link::after{content:""; position:absolute; inset:0; z-index:1}

/* Широкая плитка — для единичной записи раздела */
.tile--wide{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.tile--wide .tile-media{aspect-ratio:auto; border-bottom:0; border-right:1px solid var(--rule); min-height:260px}
.tile--wide .tile-body{padding:clamp(20px,2.4vw,34px)}
.tile--wide h3{font-size:clamp(19px,1.6vw,24px); font-weight:600}
.tile--wide p{font-size:15px}
@media (max-width:760px){.tile--wide{grid-template-columns:minmax(0,1fr)}
  .tile--wide .tile-media{aspect-ratio:10/7; min-height:0; border-right:0; border-bottom:1px solid var(--rule)}}

/* ---------- 10. Компетенции — строки спецификации ---------- */
.competence{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(24px,4vw,64px); align-items:start}
.competence-media{position:sticky; top:calc(var(--header-h) + 24px)}
.competence-media img{width:100%; aspect-ratio:16/11; object-fit:cover; object-position:62% 46%; border-radius:var(--r); filter:grayscale(.25)}
.competence-caption{font-size:var(--fs-xs); color:var(--steel); margin-top:var(--s-3); padding-left:var(--s-3); border-left:2px solid var(--signal)}
.spec-rows{border-top:1px solid var(--rule)}
.spec-row{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); gap:var(--s-5); padding:var(--s-5) 0; border-bottom:1px solid var(--rule)}
.spec-row h3{font-size:18px; font-weight:500}
.spec-row p{margin:0; color:var(--steel); font-size:15px}
.spec-row .tags{margin-top:var(--s-3); display:flex; flex-wrap:wrap; gap:6px}

/* ---------- 11. Проекты ---------- */
.case{display:grid; background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); overflow:hidden; position:relative}
.case--wide{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.case-media{position:relative; overflow:hidden; background:var(--ink); min-height:250px}
.case:not(.case--wide) .case-media{aspect-ratio:16/9; min-height:0}
.case-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:grayscale(.3); transition:transform .5s var(--ease)}
.case:hover .case-media img{transform:scale(1.03)}
.case-body{padding:clamp(20px,2.4vw,34px); display:flex; flex-direction:column}
.case-meta{display:flex; flex-wrap:wrap; gap:var(--s-2); margin-bottom:var(--s-4)}
.case h3{font-size:clamp(19px,1.6vw,25px); font-weight:600; margin-bottom:var(--s-3)}
.case-steps{list-style:none; margin:0 0 var(--s-5); padding:0; font-size:14.5px}
.case-steps li{display:grid; grid-template-columns:86px minmax(0,1fr); gap:var(--s-4); padding:9px 0; border-top:1px solid var(--rule)}
.case-steps li > span{color:var(--steel-dim); font-size:var(--fs-xs); padding-top:3px}
.case-steps li > div{color:var(--steel)}
.case-foot{margin-top:auto}

/* Карусель: показываем три записи, остальные листаются стрелками */
.carousel{position:relative}
.carousel-track{display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 2 * var(--gutter)) / 3);
  gap:var(--gutter); overflow-x:auto; overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:none; padding-bottom:2px}
.carousel-track::-webkit-scrollbar{display:none}
.carousel-track > *{scroll-snap-align:start}
.carousel-nav{display:flex; gap:8px}
.carousel-nav button{width:42px; height:42px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--rule-strong); background:var(--panel); border-radius:var(--r); cursor:pointer;
  color:var(--text); transition:border-color .18s var(--ease), color .18s var(--ease), opacity .18s var(--ease)}
.carousel-nav button svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8}
.carousel-nav button:hover{border-color:var(--brand); color:var(--brand)}
.carousel-nav button[disabled]{opacity:.32; pointer-events:none}
.carousel-count{font-size:var(--fs-xs); color:var(--steel-dim); align-self:center; font-variant-numeric:tabular-nums}
@media (max-width:1024px){.carousel-track{grid-auto-columns:calc((100% - var(--gutter)) / 2)}}
@media (max-width:760px){.carousel-track{grid-auto-columns:86%}}
@media (prefers-reduced-motion:reduce){.carousel-track{scroll-behavior:auto}}

/* ---------- 12. АГАТ в цифрах ---------- */
.figures{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); border-top:1px solid rgba(255,255,255,.2)}
.figure{padding:var(--s-6) var(--s-5) 0 0; border-right:1px solid rgba(255,255,255,.14)}
.figure:not(:first-child){padding-left:var(--s-5)}
.figure:last-child{border-right:0}
.figure b{display:block; font-family:var(--ff-head); font-weight:500; font-size:clamp(38px,3.8vw,54px); line-height:1; letter-spacing:-.035em; color:#fff}
.figure b i{font-style:normal; font-size:.44em; color:var(--signal); margin-left:4px; letter-spacing:0}
.figure span{display:block; margin-top:var(--s-3); font-size:14px; color:var(--on-dark-dim); max-width:22ch}
.figures-note{margin-top:var(--s-6); padding-top:var(--s-4); border-top:1px solid rgba(255,255,255,.14); font-size:var(--fs-xs); color:var(--on-dark-dim); display:flex; gap:var(--s-5); flex-wrap:wrap; justify-content:space-between}

/* ---------- 13. Сертификаты и партнёры ---------- */
.certs{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--gutter)}
.cert{background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); padding:var(--s-5); display:flex; flex-direction:column; gap:var(--s-3)}
.cert-mark{width:40px; height:40px; stroke:var(--brand); fill:none; stroke-width:1.4}
.cert h4{font-weight:500}
.cert p{margin:0; font-size:13.5px; color:var(--steel)}
.cert .link{font-size:13.5px; margin-top:auto}
.partners{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gutter); padding-top:var(--s-5); margin-top:var(--s-7); border-top:1px solid var(--rule)}
.partners a{display:flex; align-items:center; gap:var(--s-4); padding:var(--s-4) var(--s-5); background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); font-size:13.5px; color:var(--steel); transition:border-color .2s var(--ease)}
.partners a:hover{border-color:var(--rule-strong); color:var(--text)}
.partners img{height:46px; width:auto; max-width:104px; object-fit:contain; flex:0 0 auto}
.partners-label{font-size:var(--fs-xs); color:var(--steel-dim); grid-column:1/-1; margin-bottom:calc(var(--s-3) * -1)}
@media (max-width:760px){.partners{grid-template-columns:minmax(0,1fr)}}

/* Государственные интернет-ресурсы */
.gov{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gutter)}
.gov a{display:flex; align-items:center; gap:var(--s-4); padding:var(--s-4) var(--s-5);
  background:var(--panel); border:1px solid var(--rule); border-radius:var(--r);
  font-size:13.5px; line-height:1.4; color:var(--steel); transition:border-color .2s var(--ease), color .2s var(--ease)}
.gov a:hover{border-color:var(--brand); color:var(--text)}
.gov img{height:48px; width:auto; max-width:92px; object-fit:contain; flex:0 0 auto}
@media (max-width:900px){.gov{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.gov{grid-template-columns:minmax(0,1fr)}}

/* ---------- 14. Новости ---------- */
.news{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gutter)}
.news-item{background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); padding:var(--s-5); display:flex; flex-direction:column; position:relative; transition:border-color .2s var(--ease)}
.news-item:hover{border-color:var(--rule-strong)}
.news-date{font-size:var(--fs-xs); color:var(--steel-dim); display:flex; align-items:center; gap:10px; margin-bottom:var(--s-3)}
.news-date::after{content:""; flex:1 1 auto; height:1px; background:var(--rule)}
.news-item h3{font-size:17px; font-weight:500; line-height:1.3; margin-bottom:var(--s-3)}
.news-item:hover h3{color:var(--brand)}
.news-item p{font-size:14px; color:var(--steel); margin:0 0 var(--s-4)}
.news-item .badge{margin-top:auto; align-self:flex-start}
.news-item a::after{content:""; position:absolute; inset:0}

/* ---------- 15. Контакты и форма ---------- */
.contact{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(24px,4vw,64px)}
.contact-list{list-style:none; margin:0; padding:0; border-top:1px solid var(--rule)}
.contact-list li{display:grid; grid-template-columns:132px minmax(0,1fr); gap:var(--s-4); padding:var(--s-4) 0; border-bottom:1px solid var(--rule)}
.contact-list dt,.contact-list li > span:first-child{color:var(--steel-dim); font-size:var(--fs-sm)}
.contact-list a{font-weight:500; border-bottom:1px solid var(--rule-strong)}
.contact-list a:hover{color:var(--brand); border-bottom-color:var(--brand)}

.form{background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); padding:clamp(20px,2.6vw,36px)}

/* Акцентный вариант: обращение подаётся с синего поля — блок заметен на светлой странице */
.form--accent{position:relative; overflow:hidden; border-color:transparent; color:#fff;
  background:linear-gradient(152deg, #2A4A91 0%, var(--brand) 42%, var(--ink) 100%)}
.form--accent::before{content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:72px 72px; mask-image:radial-gradient(120% 90% at 100% 0%,#000,transparent 72%)}
.form--accent > *{position:relative}
.form--accent .form-head{border-bottom-color:rgba(255,255,255,.22)}
.form--accent .form-head h3{color:#fff}
.form--accent .form-head p{color:#C7D3EC}
.form--accent .field label{color:#C7D3EC}
.form--accent .field label .req{color:#7FE3F2}
.form--accent .input,.form--accent .select,.form--accent .textarea{
  background-color:rgba(255,255,255,.07); border-color:rgba(255,255,255,.3); color:#fff}
.form--accent .input::placeholder,.form--accent .textarea::placeholder{color:#93A4C6}
.form--accent .input:hover,.form--accent .select:hover,.form--accent .textarea:hover{border-color:rgba(255,255,255,.55)}
.form--accent .input:focus,.form--accent .select:focus,.form--accent .textarea:focus{
  border-color:var(--signal); background-color:rgba(255,255,255,.12); box-shadow:0 0 0 3px rgba(0,166,192,.28)}
.form--accent .select{color:#fff;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 4.5 6 8.5 10 4.5' fill='none' stroke='%23C7D3EC' stroke-width='1.6'/%3E%3C/svg%3E")}
.form--accent .select option{color:var(--text); background:#fff}
.form--accent .field-hint{color:#93A4C6}
.form--accent .field-error{color:#FFC08A}
.form--accent .field.is-error .input,.form--accent .field.is-error .textarea,.form--accent .field.is-error .select{border-color:#FFC08A}
.form--accent .check{color:#C7D3EC}
.form--accent .check input{accent-color:var(--signal)}
.form--accent .check a{color:#fff; border-bottom-color:rgba(255,255,255,.5)}
.form--accent .form-foot{border-top-color:rgba(255,255,255,.22)}
.form--accent .btn--primary{background:#fff; color:var(--brand); font-weight:600}
.form--accent .btn--primary:hover{background:#E8ECF5}
.form--accent .form-status--ok{color:#8BE8A8}
.form--accent .form-status--err{color:#FFC08A}
.form-head{margin-bottom:var(--s-5); padding-bottom:var(--s-4); border-bottom:1px solid var(--rule)}
.form-head p{margin:var(--s-2) 0 0; font-size:var(--fs-sm); color:var(--steel)}
.form-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-4)}
.field{display:flex; flex-direction:column; gap:6px; min-width:0}
.field--full{grid-column:1/-1}
.field label{font-size:var(--fs-sm); color:var(--steel)}
.field label .req{color:var(--warn)}
.input,.select,.textarea{
  height:46px; padding:0 13px; border:1px solid var(--rule-strong); border-radius:var(--r);
  background:var(--panel); font-size:15px; width:100%; transition:border-color .16s var(--ease), box-shadow .16s var(--ease)
}
.textarea{height:auto; min-height:112px; padding:11px 13px; resize:vertical; line-height:1.5}
.input:hover,.select:hover,.textarea:hover{border-color:var(--steel-dim)}
.input:focus,.select:focus,.textarea:focus{outline:0; border-color:var(--brand); box-shadow:0 0 0 3px rgba(36,62,124,.14)}
.select{appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 4.5 6 8.5 10 4.5' fill='none' stroke='%235D6878' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center; background-size:12px; padding-right:34px}
.field-hint{font-size:var(--fs-xs); color:var(--steel-dim)}
.field-error{font-size:var(--fs-xs); color:var(--warn); display:none}
.field.is-error .input,.field.is-error .textarea,.field.is-error .select{border-color:var(--warn)}
.field.is-error .field-error{display:block}
.check{display:flex; gap:10px; align-items:flex-start; font-size:13.5px; color:var(--steel); cursor:pointer}
.check input{width:18px; height:18px; margin:2px 0 0; accent-color:var(--brand); flex:0 0 auto}
.form-foot{display:flex; align-items:center; gap:var(--s-4); flex-wrap:wrap; margin-top:var(--s-5); padding-top:var(--s-5); border-top:1px solid var(--rule)}
.form-status{font-size:var(--fs-sm); display:none; align-items:center; gap:8px}
.form-status.is-shown{display:flex}
.form-status--ok{color:var(--ok)}
.form-status--err{color:var(--warn)}

/* ---------- 16. Подвал ---------- */
.footer{background:var(--ink); color:var(--on-dark-dim); font-size:var(--fs-sm)}
.footer-top{display:grid; grid-template-columns:minmax(0,3fr) repeat(3,minmax(0,2fr)); gap:var(--gutter); padding-block:var(--s-8) var(--s-7)}
.footer h4{color:#fff; font-size:var(--fs-sm); font-weight:500; margin-bottom:var(--s-4); letter-spacing:0}
.footer ul{list-style:none; margin:0; padding:0}
.footer li + li{margin-top:9px}
.footer a:hover{color:#fff}
.footer-brand .logo img{height:40px}
.footer-brand p{margin:var(--s-4) 0 0; max-width:34ch; font-size:13.5px}
.footer-official{display:flex; flex-wrap:wrap; gap:var(--s-5); padding-block:var(--s-5); border-top:1px solid rgba(255,255,255,.14); font-size:13px}
.footer-bottom{display:flex; flex-wrap:wrap; gap:var(--s-5); justify-content:space-between; padding-block:var(--s-5); border-top:1px solid rgba(255,255,255,.14); font-size:var(--fs-xs)}
.footer-bottom .link--on-dark{font-size:var(--fs-xs)}

/* ---------- 17. Внутренние страницы ---------- */
.crumbs{background:var(--panel); border-bottom:1px solid var(--rule)}
.crumbs ol{display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; list-style:none; margin:0; padding:12px 0; font-size:13px; color:var(--steel)}
.crumbs li{display:flex; align-items:center; gap:8px; min-width:0}
.crumbs li:not(:last-child)::after{content:""; width:5px; height:5px; border-right:1.3px solid var(--rule-strong); border-bottom:1.3px solid var(--rule-strong); transform:rotate(-45deg); flex:0 0 auto}
.crumbs a{border-bottom:1px solid transparent; padding:2px 0}
.crumbs a:hover{color:var(--brand); border-bottom-color:var(--rule-strong)}
.crumbs [aria-current="page"]{color:var(--text); max-width:52ch; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.crumbs-back{display:none}
.crumbs-back svg{width:16px; height:16px}
/* На телефоне цепочка сворачивается в одну ссылку на родительский раздел */
@media (max-width:760px){
  .crumbs ol{display:none}
  .crumbs-back{display:inline-flex; align-items:center; gap:8px; padding:12px 0; font-size:14px; color:var(--brand); font-weight:500}
}

.pagehead{background:var(--panel); border-bottom:1px solid var(--rule); padding-block:var(--s-7) var(--s-7)}
.pagehead-grid{display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:clamp(24px,4vw,64px); align-items:end}
.pagehead h1{max-width:20ch}
.pagehead-lead{margin:var(--s-4) 0 0; color:var(--steel); font-size:var(--fs-lead); max-width:64ch}
.pagehead-aside{display:flex; flex-direction:column; align-items:flex-start; gap:var(--s-3)}

.layout{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:clamp(28px,4vw,72px); align-items:start}
.layout--left{grid-template-columns:280px minmax(0,1fr)}
.rail{position:sticky; top:calc(var(--header-h) + 24px); display:flex; flex-direction:column; gap:var(--s-5)}
.rail-box{background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); padding:var(--s-5)}
.rail-box h4{margin-bottom:var(--s-3)}
.rail-nav{list-style:none; margin:0; padding:0; font-size:14px}
.rail-nav li a{display:block; padding:7px 0 7px 13px; border-left:2px solid var(--rule); color:var(--steel)}
.rail-nav li a:hover{color:var(--text); border-left-color:var(--rule-strong)}
.rail-nav li a[aria-current]{color:var(--brand); border-left-color:var(--signal); font-weight:500}

/* Проза информационной страницы */
.prose{max-width:74ch}
.prose h2{margin:var(--s-8) 0 var(--s-4); font-size:var(--fs-h2)}
.prose h2:first-child{margin-top:0}
.prose h3{margin:var(--s-6) 0 var(--s-3)}
.prose p,.prose ul,.prose ol{color:#2A3242}
.prose li{margin-bottom:7px}
.prose ul{list-style:none; padding-left:0}
.prose ul li{position:relative; padding-left:20px}
.prose ul li::before{content:""; position:absolute; left:0; top:11px; width:7px; height:1px; background:var(--signal)}
.prose ol{counter-reset:n; list-style:none; padding-left:0}
.prose ol li{position:relative; padding-left:30px; counter-increment:n}
.prose ol li::before{content:counter(n,decimal-leading-zero); position:absolute; left:0; top:0; font-family:var(--ff-head); font-size:13px; color:var(--signal-deep)}
.prose a:not(.btn){color:var(--brand); border-bottom:1px solid var(--rule-strong)}
.prose a:not(.btn):hover{border-bottom-color:var(--brand)}
.prose figure{margin:var(--s-6) 0}
.prose figure img{width:100%; border-radius:var(--r)}
.prose figcaption{margin-top:var(--s-3); font-size:var(--fs-xs); color:var(--steel); padding-left:var(--s-3); border-left:2px solid var(--signal)}
blockquote{margin:var(--s-6) 0; padding:var(--s-5) var(--s-6); background:var(--panel); border:1px solid var(--rule); border-left:3px solid var(--brand); border-radius:var(--r)}
blockquote p:last-child{margin:0}
blockquote cite{display:block; margin-top:var(--s-3); font-style:normal; font-size:var(--fs-sm); color:var(--steel)}

.callout{display:flex; gap:var(--s-4); padding:var(--s-5); border:1px solid var(--rule); border-left:3px solid var(--signal); background:var(--panel); border-radius:var(--r); margin:var(--s-6) 0}
.callout svg{width:22px; height:22px; flex:0 0 auto; stroke:var(--signal-deep); fill:none; stroke-width:1.6; margin-top:1px}
.callout p:last-child{margin:0}
.callout--warn{border-left-color:var(--warn)}
.callout--warn svg{stroke:var(--warn)}

/* Таблица */
.table-wrap{overflow-x:auto; margin:var(--s-5) 0; border:1px solid var(--rule); border-radius:var(--r); background:var(--panel)}
table{width:100%; border-collapse:collapse; font-size:14.5px; min-width:520px}
caption{text-align:left; padding:var(--s-4) var(--s-5) 0; font-size:var(--fs-xs); color:var(--steel)}
th,td{padding:12px var(--s-5); text-align:left; border-bottom:1px solid var(--rule); vertical-align:top}
thead th{background:var(--panel-2); font-family:var(--ff-head); font-weight:500; font-size:13.5px; color:var(--steel); white-space:nowrap}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--panel-2)}
td.num{font-variant-numeric:tabular-nums; white-space:nowrap}

/* Документы */
.docs{list-style:none; margin:0; padding:0; border-top:1px solid var(--rule)}
.docs li{border-bottom:1px solid var(--rule)}
.docs a{display:flex; align-items:center; gap:var(--s-4); padding:var(--s-4) 0}
.docs a:hover{color:var(--brand)}
.docs svg{width:26px; height:32px; flex:0 0 auto; stroke:var(--steel-dim); fill:none; stroke-width:1.3}
.docs a:hover svg{stroke:var(--brand)}
.docs b{font-weight:500}
.docs span{margin-left:auto; font-size:var(--fs-xs); color:var(--steel-dim); white-space:nowrap}

/* Аккордеон */
.acc{border-top:1px solid var(--rule)}
.acc-item{border-bottom:1px solid var(--rule)}
.acc-btn{display:flex; width:100%; align-items:flex-start; gap:var(--s-4); background:none; border:0; padding:var(--s-5) 0; cursor:pointer; text-align:left; font-family:var(--ff-head); font-size:17px; font-weight:500; letter-spacing:-.01em}
.acc-btn:hover{color:var(--brand)}
.acc-icon{width:18px; height:18px; flex:0 0 auto; margin-left:auto; margin-top:3px; position:relative}
.acc-icon::before,.acc-icon::after{content:""; position:absolute; background:var(--brand); transition:transform .24s var(--ease)}
.acc-icon::before{top:8px; left:0; width:18px; height:1.6px}
.acc-icon::after{left:8px; top:0; width:1.6px; height:18px}
.acc-btn[aria-expanded="true"] .acc-icon::after{transform:scaleY(0)}
.acc-panel{display:none; padding-bottom:var(--s-5); color:var(--steel); max-width:74ch}
.acc-panel.is-open{display:block}

/* Табы */
.tabs{display:flex; gap:var(--s-5); margin:0; padding:0; list-style:none; border-bottom:1px solid var(--rule); overflow-x:auto; scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{background:none; border:0; border-bottom:2px solid transparent; padding:14px 0 12px; cursor:pointer; font-family:var(--ff-head); font-size:14.5px; font-weight:500; color:var(--steel); white-space:nowrap; letter-spacing:-.01em}
.tabs button:hover{color:var(--text)}
.tabs button[aria-selected="true"]{color:var(--brand); border-bottom-color:var(--signal)}
.tabpanel{display:none; padding-top:var(--s-6)}
.tabpanel.is-active{display:block}

/* Пагинация */
.pager{display:flex; gap:6px; align-items:center; justify-content:center; margin-top:var(--s-7); flex-wrap:wrap}
.pager a,.pager span{min-width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; padding:0 10px;
  border:1px solid var(--rule); border-radius:var(--r); background:var(--panel); font-size:14.5px; font-variant-numeric:tabular-nums}
.pager a:hover{border-color:var(--brand); color:var(--brand)}
.pager [aria-current="page"]{background:var(--brand); border-color:var(--brand); color:#fff}
.pager .pager-gap{border:0; background:none; color:var(--steel-dim)}

/* ---------- 18. Каталог ---------- */
.filters{display:flex; flex-direction:column; gap:var(--s-5)}
.filter-box{background:var(--panel); border:1px solid var(--rule); border-radius:var(--r)}
.filter-box > h4{padding:var(--s-4) var(--s-5); margin:0; border-bottom:1px solid var(--rule)}
.filter-box > div{padding:var(--s-4) var(--s-5)}
.filter-list{display:flex; flex-direction:column; gap:10px; font-size:14px}
.filter-list label{display:flex; gap:9px; align-items:center; cursor:pointer; color:var(--steel)}
.filter-list label:hover{color:var(--text)}
.filter-list input{width:16px; height:16px; accent-color:var(--brand); flex:0 0 auto}
.filter-list em{margin-left:auto; font-style:normal; font-size:var(--fs-xs); color:var(--steel-dim)}
.toolbar{display:flex; align-items:center; gap:var(--s-4); flex-wrap:wrap; margin-bottom:var(--s-5)}
.toolbar-count{font-size:var(--fs-sm); color:var(--steel)}
.toolbar-count b{color:var(--text); font-weight:500}
.toolbar .select{width:auto; height:38px; font-size:14px; margin-left:auto}
.chips{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:var(--s-5)}
.chip{display:inline-flex; align-items:center; gap:8px; padding:5px 10px; border:1px solid var(--rule-strong); border-radius:var(--r); background:var(--panel); font-size:13.5px}
.chip button{border:0; background:none; cursor:pointer; color:var(--steel); line-height:1; font-size:15px; padding:0}
.chip button:hover{color:var(--warn)}

/* ---------- 19. Карточка продукции ---------- */
.product{display:grid; grid-template-columns:minmax(0,6fr) minmax(0,6fr); gap:clamp(28px,4vw,64px); align-items:start}
.gallery-main{background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); aspect-ratio:4/3; display:flex; align-items:center; justify-content:center; padding:var(--s-7); position:relative}
.gallery-main svg{width:100%; height:100%}
.gallery-main img{width:100%; height:100%; object-fit:cover; border-radius:var(--r)}
.gallery-thumbs{display:flex; gap:10px; margin-top:10px}
.gallery-thumbs button{width:80px; height:64px; padding:8px; border:1px solid var(--rule); border-radius:var(--r); background:var(--panel); cursor:pointer; flex:0 0 auto}
.gallery-thumbs button[aria-current="true"]{border-color:var(--brand)}
.gallery-thumbs svg,.gallery-thumbs img{width:100%; height:100%; object-fit:cover}
.product-title{margin-bottom:var(--s-4)}
.product-key{list-style:none; margin:var(--s-5) 0; padding:0; border-top:1px solid var(--rule)}
.product-key li{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:var(--s-4); padding:11px 0; border-bottom:1px solid var(--rule); font-size:14.5px}
.product-key li > span{color:var(--steel)}
.product-key li > b{font-weight:500}
.product-actions{display:flex; gap:var(--s-3); flex-wrap:wrap; margin-bottom:var(--s-5)}
.manager{display:flex; gap:var(--s-4); align-items:center; padding:var(--s-4); background:var(--panel-2); border:1px solid var(--rule); border-radius:var(--r)}
.manager-avatar{width:48px; height:48px; border-radius:50%; background:var(--brand-tint); color:var(--brand); display:flex; align-items:center; justify-content:center; font-family:var(--ff-head); font-weight:600; flex:0 0 auto}
.manager div{font-size:14px}
.manager b{display:block; font-weight:500}
.manager span{color:var(--steel); font-size:13px}

/* ---------- 20. Проект / услуга ---------- */
.project-hero{position:relative; background:var(--ink); color:#fff; min-height:380px; display:flex; align-items:flex-end; overflow:hidden}
.project-hero img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:grayscale(.4)}
.project-hero::after{content:""; position:absolute; inset:0; background:linear-gradient(20deg,rgba(14,24,54,.95) 12%,rgba(14,24,54,.55) 76%)}
.project-hero .container{position:relative; z-index:1; padding-block:var(--s-7)}
.facts-band{background:var(--panel); border-bottom:1px solid var(--rule)}
.project-facts{display:grid; grid-template-columns:repeat(4,minmax(0,1fr))}
.project-fact{padding:var(--s-5) var(--s-5) var(--s-5) 0; border-right:1px solid var(--rule)}
.project-fact:not(:first-child){padding-left:var(--s-5)}
.project-fact:last-child{border-right:0; padding-right:0}
.project-fact span{display:block; font-size:var(--fs-xs); color:var(--steel-dim); margin-bottom:6px}
.project-fact b{font-family:var(--ff-head); font-weight:500; font-size:17px; letter-spacing:-.01em}
.stages{counter-reset:st; display:grid; gap:0; border-top:1px solid var(--rule)}
.stage{display:grid; grid-template-columns:120px minmax(0,1fr); gap:var(--s-5); padding:var(--s-6) 0; border-bottom:1px solid var(--rule); counter-increment:st}
.stage-no{font-family:var(--ff-head); font-size:14px; color:var(--signal-deep); letter-spacing:.02em}
.stage-no::before{content:"Этап " counter(st,decimal-leading-zero)}
.stage h3{margin-bottom:var(--s-3)}
.stage p{color:var(--steel); margin:0; max-width:70ch}
.gallery-row{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gutter)}
.gallery-row img{width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--r); filter:grayscale(.25)}
.result-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gutter)}
.result{background:var(--panel); border:1px solid var(--rule); border-top:2px solid var(--signal); border-radius:var(--r); padding:var(--s-5)}
.result b{display:block; font-family:var(--ff-head); font-size:30px; font-weight:500; letter-spacing:-.03em; margin-bottom:8px}
.result span{font-size:14px; color:var(--steel)}

/* ---------- 21. UI-kit ---------- */
.kit-sect{padding-block:var(--s-8); border-top:1px solid var(--rule)}
.kit-sect > h2{margin-bottom:var(--s-2)}
.kit-sect > p.kit-note{color:var(--steel); max-width:70ch; margin-bottom:var(--s-6)}
.kit-label{font-size:var(--fs-xs); color:var(--steel-dim); margin-bottom:var(--s-3)}
.kit-row{display:flex; flex-wrap:wrap; gap:var(--s-4); align-items:center; margin-bottom:var(--s-5)}
.kit-demo{background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); padding:var(--s-5); margin-bottom:var(--s-5)}
.swatches{display:grid; grid-template-columns:repeat(auto-fill,minmax(168px,1fr)); gap:var(--s-4)}
.swatch{border:1px solid var(--rule); border-radius:var(--r); overflow:hidden; background:var(--panel)}
.swatch-chip{height:76px}
.swatch-info{padding:10px 12px; font-size:var(--fs-xs); line-height:1.5}
.swatch-info b{display:block; font-weight:500; font-size:13px; color:var(--text)}
.swatch-info code{color:var(--steel); font-family:var(--ff-body); letter-spacing:.02em}
.type-row{display:grid; grid-template-columns:180px minmax(0,1fr); gap:var(--s-5); padding:var(--s-5) 0; border-top:1px solid var(--rule); align-items:baseline}
.type-row > div:first-child{font-size:var(--fs-xs); color:var(--steel); line-height:1.6}
.grid-demo{display:grid; grid-template-columns:repeat(12,1fr); gap:var(--gutter)}
.grid-demo div{background:var(--brand-tint); border:1px solid #CFCBE4; height:64px; border-radius:var(--r); font-size:11px; color:var(--brand); display:flex; align-items:center; justify-content:center}
.space-scale{display:flex; align-items:flex-end; gap:var(--s-4); flex-wrap:wrap}
.space-scale figure{margin:0; text-align:center; font-size:var(--fs-xs); color:var(--steel)}
.space-scale i{display:block; background:var(--signal); margin-bottom:8px}
.icon-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(104px,1fr)); gap:var(--s-3)}
.icon-cell{background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); padding:var(--s-4) 8px; text-align:center; font-size:11px; color:var(--steel)}
.icon-cell svg{width:26px; height:26px; margin:0 auto 10px; stroke:var(--brand); fill:none; stroke-width:1.5}

/* ---------- 23. Адаптив ---------- */
@media (max-width:1380px){
  .nav-item > a{padding:10px 3px 10px 7px; font-size:14px}
  .nav-item:not(:has(.nav-sub)) > a{padding-right:7px}
  .search{flex-basis:196px}
}
@media (max-width:1260px){
  .header-phone{display:none}
}
@media (max-width:1200px){
  .topbar-official a:nth-child(2){display:none}
}
@media (max-width:1024px){
  :root{--header-h:66px}
  .burger{display:inline-flex}
  .search-toggle{display:inline-flex}
  .nav{position:absolute; top:100%; right:0; width:min(400px,100vw); background:var(--panel);
    border-left:1px solid var(--rule); box-shadow:-16px 16px 34px -22px rgba(14,24,54,.55);
    flex-direction:column; align-items:stretch; justify-content:flex-start; gap:0; padding:8px var(--pad) var(--s-6);
    height:calc(100dvh - var(--header-h)); overflow-y:auto; overscroll-behavior:contain; margin:0;
    transform:translateX(105%); visibility:hidden; transition:transform .3s var(--ease), visibility 0s .3s}
  .nav.is-open{transform:none; visibility:visible; transition:transform .3s var(--ease)}
  /* Пункт меню на мобильном: ссылка ведёт в раздел, стрелка справа раскрывает подразделы */
  .nav-item{flex-wrap:wrap; border-bottom:1px solid var(--rule)}
  .nav-item > a{flex:1 1 auto; padding:15px 4px; font-size:16.5px; border-bottom:0; margin:0}
  .nav-item > a[aria-current="page"]{border-left:2px solid var(--signal); padding-left:12px}
  .nav-sub{width:48px; height:48px; border-left:1px solid var(--rule); border-radius:0; color:var(--steel)}
  .nav .caret{width:12px; height:12px}
  .drop,.drop--wide{position:static; width:100%; max-width:none; min-width:0; flex:0 0 100%; box-shadow:none; border:0; border-radius:0;
    background:var(--panel-2); padding:6px 0 10px; margin:0 0 0; border-top:1px solid var(--rule)}
  .drop::before{display:none}
  .drop-list--2{columns:1}
  .drop-groups{grid-template-columns:minmax(0,1fr)}
  .drop-list a,.drop-group-head{max-width:none; font-size:15px; padding:10px 14px}
  .drop-group .drop-list a{padding-left:28px}
  .drop-group .drop-list a::before{left:14px; top:20px}
  .drop-all{margin:4px 14px 0; padding:12px 0 2px}
  .nav-foot{display:block; padding:var(--s-5) 4px 0}
  .nav-foot-tools{display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:var(--s-5); margin-bottom:var(--s-5); border-bottom:1px solid var(--rule)}
  .nav-foot-phone{display:block; font-family:var(--ff-head); font-size:19px; font-weight:500; color:var(--brand)}
  .nav-foot p{margin:6px 0 0; font-size:13px; color:var(--steel)}
  .search{position:static; flex:0 0 auto}
  .topbar .search{display:none}
  .topbar-tools{display:none} /* язык и версия для слабовидящих — в выдвижном меню */
  .topbar-official a:nth-child(2){display:inline}
  .search .search-form{position:absolute; left:0; right:0; top:100%; margin:0 var(--pad); display:none;
    height:52px; border-top:0; background:var(--panel); box-shadow:0 14px 30px -18px rgba(14,24,54,.5)}
  .search.is-expanded .search-form{display:flex}
  .search-panel{left:var(--pad); right:var(--pad); width:auto; top:calc(100% + 60px)}
  .search-toggle{width:42px; height:42px; border:1px solid var(--rule); background:var(--panel); border-radius:var(--r);
    align-items:center; justify-content:center; cursor:pointer; margin-left:auto}
  .search-toggle svg{width:19px; height:19px; stroke:var(--text); fill:none; stroke-width:1.8}
  .directions{grid-template-columns:repeat(2,minmax(0,1fr))}
  .direction{border-bottom:1px solid rgba(255,255,255,.16)}
  .direction:nth-child(2n){border-right:0}
  .direction:nth-child(2n+1){padding-left:0}
  .direction:nth-last-child(-n+2){border-bottom:0}
  .cards--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .figures{grid-template-columns:repeat(3,minmax(0,1fr))}
  .figure{border-bottom:1px solid rgba(255,255,255,.14); padding-bottom:var(--s-5)}
  .figure:nth-child(3n){border-right:0}
  .certs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-top{grid-template-columns:repeat(2,minmax(0,1fr))}
  .layout,.layout--left{grid-template-columns:minmax(0,1fr)}
  .rail{position:static; flex-direction:row; flex-wrap:wrap}
  .rail-box{flex:1 1 260px}
  .competence,.contact,.product,.pagehead-grid{grid-template-columns:minmax(0,1fr)}
  .competence-media{position:static; max-width:520px}
  .sect-head{grid-template-columns:minmax(0,1fr); gap:var(--s-4)}
  .sect-head h2{max-width:22ch}
}
@media (max-width:760px){
  .topbar{display:none}
  .topbar .container{min-height:34px}
  .cards--3,.cards--2,.news,.gallery-row,.result-grid,.project-facts{grid-template-columns:minmax(0,1fr)}
  .directions{grid-template-columns:minmax(0,1fr)}
  .direction{border-right:0 !important; padding-left:0 !important; padding-bottom:var(--s-5)}
  .direction:last-child{border-bottom:0}
  .project-fact{border-right:0; border-bottom:1px solid var(--rule); padding-left:0 !important; padding-right:0}
  .project-fact:last-child{border-bottom:0}
  .case--wide{grid-template-columns:minmax(0,1fr)}
  .figures{grid-template-columns:repeat(2,minmax(0,1fr))}
  .figure:nth-child(3n){border-right:1px solid rgba(255,255,255,.14)}
  .figure:nth-child(2n){border-right:0}
  .form-grid{grid-template-columns:minmax(0,1fr)}
  .spec-row,.stage,.case-steps li,.contact-list li,.product-key li,.type-row{grid-template-columns:minmax(0,1fr); gap:6px}
  .stage-no{color:var(--signal-deep)}
  .grid-demo{grid-template-columns:repeat(6,1fr)}
  .certs,.cards--4{grid-template-columns:minmax(0,1fr)}
  .footer-top{grid-template-columns:minmax(0,1fr); gap:var(--s-6)}
}
@media (max-width:420px){
  .figures{grid-template-columns:minmax(0,1fr)}
  .figure{border-right:0 !important; padding-left:0 !important}
  .hero-actions .btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important; transition-duration:.001ms !important}
}

@media print{
  .topbar,.header,.footer,.hero-bg,.rail{display:none !important}
  body{background:#fff}
}


/* ---------- 24. Навигация внутренних страниц ---------- */
/* Каркас: боковое меню раздела слева, контент справа */
.inner{display:grid; grid-template-columns:272px minmax(0,1fr); gap:clamp(28px,3.6vw,56px); align-items:start;
  padding-block:var(--s-7) var(--s-9)}
.inner-aside{position:sticky; top:calc(var(--header-h) + 20px); display:flex; flex-direction:column; gap:var(--s-5)}
.inner-main{min-width:0}
.inner--rside{grid-template-columns:minmax(0,1fr) 272px}

/* Заголовок внутренней страницы */
.ihead{padding-bottom:var(--s-6); margin-bottom:var(--s-7); border-bottom:1px solid var(--rule)}
.ihead-kicker{display:flex; align-items:center; gap:10px; font-size:var(--fs-xs); color:var(--steel); margin-bottom:var(--s-4)}
.ihead-kicker::before{content:""; width:28px; height:1px; background:var(--signal)}
.ihead h1{max-width:24ch}
.ihead-lead{margin:var(--s-4) 0 0; color:var(--steel); font-size:16px; line-height:1.55; max-width:64ch}
.ihead-row{display:flex; align-items:flex-end; justify-content:space-between; gap:var(--s-5); flex-wrap:wrap}

/* Боковое меню раздела — единый компонент для всех разделов */
/* Белая панель: заголовок раздела и список без линий.
   Текущая страница — синий полужирный текст без плашки, ветка выше — тёмный текст, вложенность — отступом. */
.sidenav{background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); padding:22px 14px 14px}
.sidenav-toggle{display:none}
.sidenav-head{display:block; padding:0 10px 14px; margin-bottom:6px; border-bottom:1px solid var(--rule)}
.sidenav-head small{display:none}
.sidenav-head b{font-family:var(--ff-head); font-weight:600; font-size:19px; letter-spacing:-.015em; color:var(--text)}
a.sidenav-head:hover b{color:var(--brand)}
.sidenav-list{list-style:none; margin:0; padding:10px 0 0}

.sidenav-list ul{list-style:none; margin:0; padding:0 0 8px 14px}
.sidenav-row{display:flex; align-items:center}
.sidenav-list a{display:block; flex:1 1 auto; min-width:0; padding:8px 10px;
  font-size:15px; line-height:1.4; color:var(--steel); border-radius:var(--r); transition:color .15s var(--ease), background .15s var(--ease)}
.sidenav-list a em{display:none}
.sidenav-list a:hover{color:var(--brand); background:var(--panel-2)}
.sidenav-list .is-branch > .sidenav-row > a{color:var(--text); font-weight:500}
.sidenav-list a[aria-current="page"]{color:var(--brand); font-weight:500}
.sidenav-list a[aria-current="page"]:hover{background:none}
.sidenav-list ul a{font-size:14px; padding:6px 10px}
.sidenav-list ul a[aria-current="page"]{color:var(--brand)}
.sidenav-branch{flex:0 0 32px; height:32px; display:flex; align-items:center; justify-content:center; background:none; border:0; cursor:pointer; color:var(--steel-dim); border-radius:var(--r)}
.sidenav-branch:hover{color:var(--brand); background:var(--panel)}
.sidenav-branch svg{width:10px; height:10px; transition:transform .2s var(--ease)}
.sidenav-branch[aria-expanded="true"] svg{transform:rotate(180deg)}
.sidenav-list li > ul[hidden]{display:none}

/* Ссылка «вернуться в раздел / категорию» */
.backlink{display:inline-flex; align-items:center; gap:10px; font-size:14.5px; font-weight:500; color:var(--brand); padding:6px 0}
.backlink svg{width:18px; height:18px; transition:transform .2s var(--ease)}
.backlink:hover svg{transform:translateX(-3px)}
.backlink span{border-bottom:1px solid var(--rule-strong)}
.backlink:hover span{border-bottom-color:var(--brand)}
.backbar{display:flex; align-items:center; justify-content:space-between; gap:var(--s-4); flex-wrap:wrap;
  margin-top:var(--s-8); padding:var(--s-4) var(--s-5); background:var(--panel); border:1px solid var(--rule); border-radius:var(--r)}
.backbar p{margin:0; font-size:var(--fs-sm); color:var(--steel)}

/* Небольшой блок связи в боковой колонке */
.aside-note{padding:var(--s-5); border:1px solid var(--rule); border-left:2px solid var(--signal); background:var(--panel); border-radius:var(--r); font-size:14px}
.aside-note h4{font-size:15px; margin-bottom:6px}
.aside-note p{color:var(--steel); margin:0 0 var(--s-3); font-size:13.5px}
.aside-note a.tel{display:block; font-family:var(--ff-head); font-weight:500; font-size:16px}

/* Оглавление страницы — строкой под заголовком */

/* Блоки контента внутренней страницы */
.iblock{margin-top:var(--s-8); scroll-margin-top:calc(var(--header-h) + 72px)}
.iblock:first-child{margin-top:0}
.iblock > h2{font-size:clamp(22px,1.9vw,28px); margin-bottom:var(--s-5)}
.iblock-head{display:flex; align-items:baseline; justify-content:space-between; gap:var(--s-4); flex-wrap:wrap; margin-bottom:var(--s-5)}
.iblock-head h2{font-size:clamp(22px,1.9vw,28px)}

/* Карточка изделия в списке категории */
.pcard{position:relative; display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); overflow:hidden; transition:border-color .2s var(--ease)}
.pcard + .pcard{margin-top:var(--gutter)}
.pcard::before{content:""; position:absolute; top:0; left:0; width:44px; height:2px; background:var(--signal); z-index:2; transition:width .28s var(--ease)}
.pcard:hover{border-color:var(--rule-strong)}
.pcard:hover::before{width:100%}
.pcard-media{background:var(--panel-2); border-right:1px solid var(--rule); min-height:250px; overflow:hidden}
.pcard-media img{width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease)}
.pcard:hover .pcard-media img{transform:scale(1.03)}
.pcard-body{padding:clamp(20px,2.2vw,30px); display:flex; flex-direction:column}
.pcard-cat{font-size:var(--fs-xs); color:var(--steel-dim); margin-bottom:8px}
.pcard h3{font-size:clamp(19px,1.5vw,22px); font-weight:600; line-height:1.22; margin-bottom:var(--s-3)}
.pcard:hover h3{color:var(--brand)}
.pcard p{font-size:14.5px; color:var(--steel); margin:0 0 var(--s-4)}
.pcard .plate-spec{margin-bottom:var(--s-4)}
.pcard-foot{margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:var(--s-3); flex-wrap:wrap}
.pcard-go{display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:500; color:var(--brand)}
.pcard-go svg{width:16px; height:16px; transition:transform .2s var(--ease)}
.pcard:hover .pcard-go svg{transform:translateX(3px)}
.pcard-link::after{content:""; position:absolute; inset:0; z-index:1}
.pcard .badge{position:relative; z-index:2}
/* Сетка карточек — второй вид списка */
.pcards--grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gutter)}
.pcards--grid .pcard{grid-template-columns:minmax(0,1fr); grid-template-rows:auto 1fr; margin:0}
.pcards--grid .pcard-media{border-right:0; border-bottom:1px solid var(--rule); min-height:0; aspect-ratio:10/7}
.pcards--grid .pcard p{display:none}
.pcards--grid .pcard h3{font-size:17px; font-weight:500}
.pcards--grid .plate-spec b{white-space:nowrap}

/* Карточка другого / связанного изделия */
.rcard{position:relative; display:flex; gap:var(--s-4); align-items:center; padding:12px; background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); transition:border-color .2s var(--ease)}
.rcard:hover{border-color:var(--brand)}
.rcard img{width:96px; height:72px; object-fit:cover; border-radius:var(--r); flex:0 0 auto; background:var(--panel-2)}
.rcard small{display:block; font-size:var(--fs-xs); color:var(--steel-dim); margin-bottom:3px}
.rcard b{display:block; font-family:var(--ff-head); font-weight:500; font-size:15.5px; line-height:1.3; letter-spacing:-.01em}
.rcard:hover b{color:var(--brand)}
.rcard > svg{width:18px; height:18px; margin-left:auto; flex:0 0 auto; color:var(--steel-dim)}
.rcard:hover > svg{color:var(--brand)}
.rcard a::after{content:""; position:absolute; inset:0}
.rcards{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-4)}

/* ---- Карточка продукции ---- */
.ptop{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,340px); gap:clamp(24px,3vw,48px); align-items:start}
.ptop .pgal{order:2}
.pgal{background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); overflow:hidden}
.pgal img{width:100%; aspect-ratio:4/3; object-fit:cover}
.pgal figcaption{padding:10px 14px; font-size:var(--fs-xs); color:var(--steel); border-top:1px solid var(--rule)}
.pinfo h1{font-size:clamp(28px,2.6vw,38px); line-height:1.1; margin-bottom:var(--s-4)}
.pinfo-lead{color:var(--steel); font-size:16.5px; margin:0 0 var(--s-5)}
.pinfo .product-key{margin:0 0 var(--s-5)}
.pinfo-actions{display:flex; gap:var(--s-3); flex-wrap:wrap; align-items:center}
.pinfo-models{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:var(--s-5)}

/* Липкая навигация по блокам карточки */
.anchors{position:sticky; top:var(--header-h); z-index:20; background:var(--paper); margin:var(--s-8) 0 0; border-bottom:1px solid var(--rule)}
.anchors ol{display:flex; gap:var(--s-5); list-style:none; margin:0; padding:0; overflow-x:auto; scrollbar-width:none}
.anchors ol::-webkit-scrollbar{display:none}
.anchors a{display:block; padding:14px 0 12px; font-family:var(--ff-head); font-size:14.5px; font-weight:500; color:var(--steel); border-bottom:2px solid transparent; white-space:nowrap; letter-spacing:-.01em}
.anchors a:hover{color:var(--text)}
.anchors a[aria-current="true"]{color:var(--brand); border-bottom-color:var(--signal)}
.ihead + .anchors,.pj-top + .anchors{margin-top:0}
.anchors + .iblock,.anchors + .prose{margin-top:var(--s-7)}

/* Возможности — сетка отметок */
.feats{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 var(--gutter); list-style:none; margin:0; padding:0; border-top:1px solid var(--rule)}
.feats li{display:flex; gap:12px; align-items:flex-start; padding:14px 0; border-bottom:1px solid var(--rule); font-size:15px}
.feats svg{width:20px; height:20px; flex:0 0 auto; color:var(--signal-deep); margin-top:2px}

/* Таблица характеристик с группами и исполнениями */
.spec-tools{display:flex; align-items:center; justify-content:space-between; gap:var(--s-4); flex-wrap:wrap; margin-bottom:var(--s-4)}
.spec-tools p{margin:0; font-size:var(--fs-sm); color:var(--steel)}
.spec{min-width:640px; font-size:14.5px}
.spec thead th{position:sticky; top:0; background:var(--panel-2); color:var(--text); font-size:13.5px; vertical-align:bottom}
.spec thead th small{display:block; font-family:var(--ff-body); font-weight:400; color:var(--steel-dim); font-size:12px}
.spec th[scope="row"]{font-weight:400; color:var(--steel); width:42%; background:var(--panel)}
.spec td{font-variant-numeric:tabular-nums}
.spec td[colspan]{color:var(--text)}
.spec tr.spec-group th{background:var(--panel-2); font-family:var(--ff-head); font-weight:500; color:var(--brand); font-size:13.5px; letter-spacing:0; padding-top:14px; padding-bottom:8px}
.spec tbody tr.spec-group:hover{background:none}
.spec tbody tr:hover th[scope="row"]{background:var(--panel-2)}
.spec-note{font-size:var(--fs-xs); color:var(--steel-dim); margin:var(--s-3) 0 0}
.spec-wrap{position:relative}
.spec-wrap.is-collapsed .table-wrap{max-height:560px; overflow:hidden}
.spec-wrap.is-collapsed .table-wrap::after{content:""; position:absolute; left:1px; right:1px; bottom:1px; height:120px; pointer-events:none;
  background:linear-gradient(to bottom, rgba(255,255,255,0), #fff 85%)}
.spec-wrap .table-wrap{position:relative}
.spec-more{display:flex; align-items:center; justify-content:center; gap:10px; width:100%; height:46px; margin-top:-1px;
  border:1px solid var(--rule); border-radius:0 0 var(--r) var(--r); background:var(--panel); cursor:pointer;
  font-family:var(--ff-head); font-size:14.5px; font-weight:500; color:var(--brand)}
.spec-more:hover{background:var(--panel-2)}
.spec-more svg{width:11px; height:11px; transition:transform .2s var(--ease)}
.spec-more[aria-expanded="true"] svg{transform:rotate(180deg)}
@media (max-width:760px){
  .spec th[scope="row"]{position:sticky; left:0; z-index:1; min-width:170px; box-shadow:1px 0 0 var(--rule)}
}

/* Документы изделия */
.dl{display:grid; gap:10px}
.dl a{display:flex; align-items:center; gap:var(--s-4); padding:14px 18px; background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); transition:border-color .2s var(--ease)}
.dl a:hover{border-color:var(--brand)}
.dl-ico{width:40px; height:48px; flex:0 0 auto; display:flex; align-items:flex-end; justify-content:center; padding-bottom:6px; border:1px solid var(--rule-strong); border-radius:var(--r); font-size:10px; font-weight:600; color:var(--warn); letter-spacing:.04em; position:relative; background:var(--panel-2)}
.dl-txt{min-width:0}
.dl b{display:block; font-weight:500}
.dl small{display:block; font-size:var(--fs-xs); color:var(--steel-dim)}
.dl svg{width:20px; height:20px; margin-left:auto; color:var(--steel); flex:0 0 auto}
.dl a:hover svg{color:var(--brand)}

/* Окно «Получить дополнительную информацию» */

/* ---- Проект / услуга ---- */
.pj-top{display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:var(--gutter); margin-bottom:var(--s-7); align-items:stretch}
.pj-cover{position:relative; border-radius:var(--r); overflow:hidden; background:var(--panel); border:1px solid var(--rule); aspect-ratio:10/7}
.pj-cover img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.pj-facts{display:grid; grid-template-rows:repeat(4,1fr); border:1px solid var(--rule); border-top:2px solid var(--signal); border-radius:var(--r); background:var(--panel); margin:0}
.pj-fact{padding:var(--s-4) var(--s-5); border-bottom:1px solid var(--rule); display:flex; flex-direction:column; justify-content:center}
.pj-fact:last-child{border-bottom:0}
.pj-fact dd b{font-size:19px}
.pj-fact span{display:block; font-size:var(--fs-xs); color:var(--steel-dim); margin-bottom:4px}
.pj-fact b{font-family:var(--ff-head); font-weight:500; font-size:16.5px; letter-spacing:-.01em; line-height:1.25}
.pj-comp{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 var(--gutter); counter-reset:c; list-style:none; margin:0; padding:0; border-top:1px solid var(--rule)}
.pj-comp li{display:flex; gap:14px; padding:13px 0; border-bottom:1px solid var(--rule); font-size:15px; counter-increment:c}
.pj-comp li::before{content:counter(c,decimal-leading-zero); font-family:var(--ff-head); font-size:13px; color:var(--signal-deep); padding-top:2px; flex:0 0 22px}
.units{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gutter)}
.unit{background:var(--panel); border:1px solid var(--rule); border-top:2px solid var(--signal); border-radius:var(--r); padding:var(--s-5)}
.unit small{display:block; font-size:var(--fs-xs); color:var(--steel-dim); margin-bottom:4px}
.unit h3{font-size:18px; font-weight:500; margin-bottom:var(--s-4)}
.unit .plate-spec{margin:0}

/* ---- Результаты поиска ---- */
.sbar{display:flex; gap:10px; max-width:760px}
.sbar .search-form{flex:1 1 auto; height:52px; background:var(--panel); border-color:var(--rule-strong)}
.sbar .search-form svg{width:20px; height:20px}
.sbar .search-input{font-size:16.5px}
.sbar .btn{height:52px}
.stypes{display:flex; gap:var(--s-5); margin:var(--s-6) 0 0; padding:0; list-style:none; border-bottom:1px solid var(--rule); overflow-x:auto; scrollbar-width:none}
.stypes::-webkit-scrollbar{display:none}
.stypes button:disabled{opacity:.45; cursor:default}
.stypes button{display:inline-flex; align-items:baseline; gap:6px; background:none; border:0; border-bottom:2px solid transparent; padding:14px 0 12px; cursor:pointer; font-family:var(--ff-head); font-size:14.5px; font-weight:500; color:var(--steel); white-space:nowrap; letter-spacing:-.01em}
.stypes button:hover{color:var(--text)}
.stypes button[aria-pressed="true"]{color:var(--brand); border-bottom-color:var(--signal)}
.stypes button em{font-style:normal; font-size:var(--fs-xs); font-weight:400; color:var(--steel-dim)}
.stypes svg{display:none}
.stypes + .sres{border-top:0}
.sres{list-style:none; margin:0; padding:0; border-top:1px solid var(--rule)}
.sres li{position:relative; display:grid; grid-template-columns:44px minmax(0,1fr); gap:var(--s-4); padding:var(--s-5) 0; border-bottom:1px solid var(--rule)}
.sres-ico{width:44px; height:44px; border-radius:var(--r); display:flex; align-items:center; justify-content:center; border:1px solid var(--rule); background:var(--panel)}
.sres-ico svg{width:22px; height:22px}
.sres-meta{display:flex; gap:10px; align-items:center; flex-wrap:wrap; font-size:var(--fs-xs); color:var(--steel-dim); margin-bottom:6px}
.sres-type{font-weight:500; letter-spacing:.02em}
.sres h3{font-size:18px; font-weight:500; line-height:1.3; margin-bottom:6px}
.sres h3 a::after{content:""; position:absolute; inset:0}
.sres li:hover h3{color:var(--brand)}
.sres p{margin:0; font-size:14.5px; color:var(--steel); max-width:78ch}
.sres mark,.search-hit mark{background:var(--signal-tint); color:inherit; padding:0 1px; border-bottom:1px solid var(--signal)}
.sres-path{font-size:var(--fs-xs); color:var(--steel-dim)}
/* Цвет типа материала — только в иконке и подписи, чтобы выдача оставалась спокойной */
.t-product .sres-ico,.t-product.search-hit .hit-ico{color:var(--brand); border-color:#C6CFE4; background:var(--brand-tint)}
.t-product .sres-type{color:var(--brand)}
.t-project .sres-ico,.t-project.search-hit .hit-ico{color:var(--signal-deep); border-color:#A9DDE5; background:var(--signal-tint)}
.t-project .sres-type{color:var(--signal-deep)}
.t-news .sres-ico,.t-news.search-hit .hit-ico{color:var(--warn); border-color:#E6C4AE; background:#FBF0E9}
.t-news .sres-type{color:var(--warn)}
.t-page .sres-ico,.t-page.search-hit .hit-ico{color:var(--steel); border-color:var(--rule); background:var(--panel-2)}
.t-page .sres-type{color:var(--steel)}
.t-doc .sres-ico,.t-doc.search-hit .hit-ico{color:var(--ok); border-color:#BFDCC9; background:#EDF6F0}
.t-doc .sres-type{color:var(--ok)}
.sempty{padding:var(--s-7) var(--s-6); background:var(--panel); border:1px solid var(--rule); border-radius:var(--r)}
.sempty h3{margin-bottom:var(--s-3)}
.sempty p{color:var(--steel)}
/* Подсказки в выпадающем поиске шапки */
.search-hit{align-items:center}
.hit-ico{width:28px; height:28px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; border:1px solid var(--rule); border-radius:var(--r)}
.hit-ico svg{width:16px; height:16px}
.search-hit .hit-ico{margin-left:0}
.search-all{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:var(--s-3); padding:10px; border-top:1px solid var(--rule); font-size:13.5px; font-weight:500; color:var(--brand)}
.search-all svg{width:15px; height:15px}
.search-all:hover{background:var(--panel-2)}

/* ---- UI-kit: демонстрация навигации ---- */
.kit-grid2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s-5)}
.kit-grid3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s-5); align-items:start}
.kit-cap{font-size:var(--fs-xs); color:var(--steel); margin:var(--s-3) 0 0}
.kit-navbar{display:flex; align-items:center; gap:6px; padding:8px 16px; background:var(--panel); border:1px solid var(--rule); border-radius:var(--r)}
.kit-state{display:flex; flex-direction:column; align-items:flex-start; gap:6px}
.kit-state > span{font-size:11px; color:var(--steel-dim); letter-spacing:.03em}
.nav-item.is-hover > a{color:var(--brand)}
.nav-item.is-hover > .nav-sub{color:var(--brand)}
.is-focus{outline:2px solid var(--signal); outline-offset:2px; border-radius:var(--r)}
.kit-drop{position:static; display:block; box-shadow:0 22px 44px -24px rgba(14,24,54,.45)}
.phones{display:flex; gap:var(--s-5); overflow-x:auto; padding-bottom:var(--s-3)}
.phone{flex:0 0 auto; width:392px}
.phone iframe{display:block; width:392px; height:780px; border:1px solid var(--rule-strong); border-radius:18px; background:#fff}
.phone p{margin:var(--s-3) 0 0; font-size:var(--fs-xs); color:var(--steel); max-width:40ch}

/* ---- Адаптив внутренних шаблонов ---- */
@media (max-width:1200px){
  .inner{grid-template-columns:240px minmax(0,1fr)}
  .pcards--grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ptop{grid-template-columns:minmax(0,1fr)}
  .pgal{max-width:440px}
  .ptop .pgal{order:0}
  .pj-top{grid-template-columns:minmax(0,1fr)}
  .pj-cover{max-width:640px}
  .pj-facts{grid-template-rows:none; grid-template-columns:repeat(2,minmax(0,1fr))}
  .pj-fact:nth-child(odd){border-right:1px solid var(--rule)}
  .pj-fact:nth-child(3){border-bottom:0}
  .units{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1024px){
  .inner,.inner--rside{grid-template-columns:minmax(0,1fr); padding-top:var(--s-4); gap:var(--s-5)}
  .inner-aside{position:static; gap:0}
  .inner-aside .aside-note{display:none}
  /* Боковое меню сворачивается в строку «раздел · текущая страница» и раскрывается по нажатию */
  .sidenav-toggle{display:flex; align-items:center; gap:12px; width:100%; padding:12px 16px; background:none; border:0; cursor:pointer; text-align:left}
  .sidenav-toggle small{display:block; font-size:var(--fs-xs); color:var(--steel-dim)}
  .sidenav-toggle b{display:block; font-weight:500; font-size:15px; line-height:1.3}
  .sidenav-toggle svg{width:12px; height:12px; margin-left:auto; flex:0 0 auto; color:var(--brand); transition:transform .2s var(--ease)}
  .sidenav-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
  .sidenav{padding:0}
  .sidenav-body{display:none; border-top:1px solid var(--rule); padding:16px 16px 12px}
  .sidenav.is-open .sidenav-body{display:block}
  .sidenav-head{display:none}
  .sidenav-list{padding-top:0}
  .ihead{margin-bottom:var(--s-6)}
}
@media (max-width:760px){
  .pcard{grid-template-columns:minmax(0,1fr)}
  .pcard-media{border-right:0; border-bottom:1px solid var(--rule); min-height:0; aspect-ratio:10/7}
  .pcards--grid{grid-template-columns:minmax(0,1fr)}
  .feats,.pj-comp,.rcards,.kit-grid2,.kit-grid3{grid-template-columns:minmax(0,1fr)}
  .units{grid-template-columns:minmax(0,1fr)}
  .pj-fact dd b{font-size:16.5px}
  .pj-fact{padding:var(--s-3) var(--s-4)}
  .sbar .btn{display:none}
  .sres li{grid-template-columns:minmax(0,1fr)}
  .sres-ico{display:none}
  .backbar{padding:var(--s-4)}
  .anchors{margin-top:var(--s-7)}
  .pinfo-actions .btn{width:100%}
}

/* Во внутренних шаблонах текст занимает всю ширину колонки контента */
.inner-main .prose,.inner-main .acc-panel,.inner-main .ihead-lead,.inner-main .ihead h1{max-width:none}

/* End */


/* Start:/local/templates/agat/css/bitrix.css?179266544935407*/
/* ============================================================
   Дополнения к style.css макета для Битрикса: блоки, которых нет в макете
   (руководство, сертификаты, галерея, видео, 404, формы модуля «Веб-формы»),
   режим для слабовидящих и поправки под режим правки публичной части.
   style.css — файл дизайнера, его не правим: при обновлении макета заменяется целиком.
   ============================================================ */

/* шрифты: за основными — запасные с подогнанной шириной (fonts.css), чтобы меню не прыгало при загрузке шрифтов */
:root{--ff-head:"Geologica","Geologica Fallback","Helvetica Neue",Arial,sans-serif; --ff-body:"Golos Text","Golos Text Fallback","Helvetica Neue",Arial,sans-serif}
/* третичный текст (счётчики, подписи карточек, «Документ · PDF»): #8A94A3 макета давал контраст 2,9:1 на фоне страницы,
   для WCAG AA мелкому тексту нужно 4,5:1 — на тон темнее, 4,6:1 */
:root{--steel-dim:#687281}
.header-phone{font-family:"Geologica","Geologica Fallback Digits","Helvetica Neue",Arial,sans-serif}
.header-phone span{font-family:"Golos Text","Golos Text Fallback Digits","Helvetica Neue",Arial,sans-serif}

/* панель подсказок поиска открывается из верхней полосы вниз, поверх шапки: шапка липкая (z-index 60) и иначе её закрывает */
.topbar{position:relative; z-index:61}

/* ---------- шапка внутренней страницы и карточки ---------- */
.ihead--flush{border:0; padding-bottom:0; margin-bottom:var(--s-6)}
.ihead-kicker:empty{display:none}
.pj-top--single{grid-template-columns:minmax(0,1fr)}
.pj-top--single .pj-cover{max-width:880px; aspect-ratio:16/9}
.pj-cover{display:block}
/* рядом с панелью параметров фото не держит пропорцию 10/7: занимает свою колонку и высоту ряда (панель бывает выше, чем в макете) */
.pj-top:not(.pj-top--single) .pj-cover{aspect-ratio:auto; min-height:280px; min-width:0}
.pj-fact dd{margin:0}
.pinfo-actions{margin-bottom:var(--s-6)}
.pinfo-actions .btn svg{width:18px; height:18px}
.card > .iblock:first-child{margin-top:0}
.inner--wide{grid-template-columns:minmax(0,1fr)}
.prose--table{max-width:none}
.pcard-noimg{width:60%; height:auto; margin:18% auto; display:block; stroke:var(--rule-strong); fill:none}

/* текст из старой базы: картинки и таблицы не шире колонки */
.prose img{max-width:100%; height:auto}
.prose table{width:100%}
.prose .table-wrap{margin:var(--s-5) 0}
/* таблицы из текста (характеристики и т. п.): на узком экране не сжимаются в столбик, а прокручиваются вбок (UI-kit) */
@media (max-width:760px){.prose .table-wrap table, .inner-main > .table-wrap table{min-width:600px}}
.prose iframe{max-width:100%}
.inner-main > .table-wrap, .inner-main > p, .inner-main > ul, .inner-main > ol{max-width:none}

/* текст статических страниц (перенесён со старого сайта без классов): оформление как у .prose,
   выравнивание по ширине и шрифты из атрибутов style снимаем */
.inner-main [style*="justify"], .inner-main [align="justify"]{text-align:left !important}
.inner-main [style*="font-size"]:not(svg *){font-size:inherit !important}
.inner-main [style*="font-family"]{font-family:inherit !important}
.inner-main > h2, .inner-main > div:not([class]) > h2, .inner-main > h3, .inner-main > div:not([class]) > h3{margin:var(--s-7) 0 var(--s-4)}
.inner-main > .ihead + h2, .inner-main > .ihead + h3{margin-top:0}
.inner-main > h2{font-size:clamp(22px,1.9vw,28px)}
.inner-main > p, .inner-main > div:not([class]) > p, .inner-main > div:not([class]){color:#2A3242; max-width:none}
.inner-main > p, .inner-main > div:not([class]) > p{margin:0 0 var(--s-4)}
.inner-main ul:not([class]){list-style:none; padding-left:0}
.inner-main ul:not([class]) > li{position:relative; padding-left:20px; margin-bottom:7px}
.inner-main ul:not([class]) > li::before{content:""; position:absolute; left:0; top:11px; width:7px; height:1px; background:var(--signal)}
/* ссылки только в тексте страниц (абзацы, неразмеченные списки, таблицы), не в карточках, вкладках-якорях и результатах поиска */
.inner-main p a:not([class]), .inner-main ul:not([class]) li a:not([class]), .inner-main ol:not([class]):not(.anchors ol) li a:not([class]), .inner-main td a:not([class]){color:var(--brand); border-bottom:1px solid var(--rule-strong)}
.inner-main p a:not([class]):hover, .inner-main ul:not([class]) li a:not([class]):hover{border-bottom-color:var(--brand)}
.sres h3 a, .sres p a{border-bottom:0 !important}
.inner-main > table, .inner-main > div:not([class]) > table{width:100%; margin:var(--s-5) 0}
/* таблицы статических страниц оборачиваются в прокручиваемый блок (agat.js), как .table-wrap макета */
.table-scroll{overflow-x:auto; margin:var(--s-5) 0; -webkit-overflow-scrolling:touch}
.table-scroll > table{margin:0}
@media (max-width:760px){.table-scroll > table{min-width:560px}}
/* картинки только в тексте страниц — не в плитках, карточках и логотипах (у них своя высота) */
.inner-main > img, .inner-main > p img, .inner-main > div:not([class]) img, .inner-main td img, .inner-main li img{max-width:100%; height:auto}
.inner-main > .news, .inner-main > .cards{margin-bottom:var(--s-5)}

/* блоки макета внутри текста карточки (.prose): свои нумерация и маркеры вместо маркеров текста */
.prose ol.pj-comp{counter-reset:c; padding:0}
.prose ol.pj-comp li{padding-left:0; margin:0; counter-increment:c}
.prose ol.pj-comp li::before{content:counter(c,decimal-leading-zero); position:static; flex:0 0 22px; font-size:13px; padding-top:2px}
.prose .plate-spec li{padding-left:0; margin:0}
.prose .plate-spec li::before{display:none}
.prose .units{margin-top:var(--s-4)}
.prose .unit h3{margin:0 0 var(--s-4)}
.prose .unit small{color:var(--steel-dim)}
@media (max-width:760px){.prose ol.pj-comp{grid-template-columns:minmax(0,1fr)}}

/* ---------- главная ---------- */
.tile--note{background:var(--panel-2)}
.tile--note .tile-body{justify-content:center}
.tile--note h3{font-size:19px}
.tile-media{position:relative}
.tile-play{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; pointer-events:none}
.tile-play svg{width:58px; height:58px; padding:16px; border-radius:50%; background:rgba(14,24,54,.72); fill:#fff}
/* «АГАТ в цифрах» без элементов: секция видна только в режиме правки */
#figures:not(:has(.figures)){display:none}
#figures.is-editing:not(:has(.figures)){display:block}
.figures-empty{border-top:1px solid rgba(255,255,255,.14)}
.hero-bg img{width:100%; height:100%; object-fit:cover}

/* ---------- руководство ---------- */
.people{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--gutter)}
.person{display:flex; gap:var(--s-5); align-items:flex-start; padding:var(--s-5); background:var(--panel); border:1px solid var(--rule); border-top:2px solid var(--signal); border-radius:var(--r)}
.person h3{font-size:18px; font-weight:500; margin-bottom:6px}
.person-pos{margin:0 0 var(--s-3); color:var(--steel); font-size:14.5px}
.person-photo{width:88px; height:88px; object-fit:cover; border-radius:50%; flex:0 0 auto}
.person .manager-avatar{width:64px; height:64px; font-size:20px}
.person-contacts{list-style:none; margin:0; padding:0; font-size:14px}
.person-contacts li{display:flex; gap:10px; padding:4px 0; border-top:1px solid var(--rule)}
.person-contacts span{color:var(--steel-dim); min-width:110px}
.person-contacts a{color:var(--brand)}
.person-text{margin-top:var(--s-3); font-size:14.5px}
@media (max-width:900px){.people{grid-template-columns:minmax(0,1fr)}}

/* ---------- сертификаты и лицензии ---------- */
.certs{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.cert-scan{display:block; aspect-ratio:3/4; background:var(--panel-2); border:1px solid var(--rule); border-radius:var(--r); overflow:hidden}
.cert-scan img{width:100%; height:100%; object-fit:contain}
.cert h4{font-size:14.5px; line-height:1.35}

/* ---------- партнёры, уценка ---------- */
.partners--page{margin-top:0; padding-top:0; border-top:0}
.partners--page > div{display:flex; align-items:center; gap:var(--s-4); padding:var(--s-4) var(--s-5); background:var(--panel); border:1px solid var(--rule); border-radius:var(--r); font-size:13.5px; color:var(--steel)}
.sales{display:grid; gap:var(--gutter)}
.sales .pcard + .pcard{margin-top:0}
.sales-text{font-size:14.5px}

/* ---------- галерея, видео, новость ---------- */
.gallery-row a{display:block}
.gallery-row a img{transition:filter .2s var(--ease)}
.gallery-row a:hover img{filter:none}
@media (max-width:760px){.gallery-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
.video{position:relative; aspect-ratio:16/9; margin:0 0 var(--s-5); background:var(--ink); border-radius:var(--r); overflow:hidden}
.video iframe, .video video{position:absolute; inset:0; width:100%; height:100%; border:0}
/* пост Telegram (виджет): высоту задаёт сам виджет */
.tg-post{max-width:560px; margin:0 0 var(--s-5)}
.tg-post iframe{max-width:100%}
.article-cover{margin:0 0 var(--s-6)}
.article-cover img{width:100%; max-height:560px; object-fit:cover; border-radius:var(--r)}
.media-page > .gallery-row{margin-top:var(--s-5)}

/* размеры — от окна просмотра (inset:0, проценты), не vw/vh: в версии для слабовидящих body увеличен zoom,
   и в Chromium 100vw становится шире экрана — картинка и крестик уходили за край */
.lightbox{border:0; inset:0; margin:0; width:auto; height:auto; max-width:none; max-height:none; padding:56px 64px 24px; box-sizing:border-box;
  background:rgba(8,12,28,.92); color:#fff}
.lightbox[open]{display:flex; align-items:center; justify-content:center}
.lightbox::backdrop{background:rgba(8,12,28,.6)}
.lightbox figure{margin:0; height:100%; max-width:100%; min-height:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center}
.lightbox img{max-width:100%; max-height:100%; min-height:0; flex:0 1 auto; object-fit:contain}
.lightbox figcaption{margin-top:10px; font-size:14px; color:var(--on-dark-dim)}
.lightbox button{position:absolute; background:none; border:0; color:#fff; font-size:42px; line-height:1; cursor:pointer; padding:12px 18px}
.lightbox-close{top:10px; right:14px}
.lightbox-prev{left:8px; top:50%; transform:translateY(-50%)}
.lightbox-next{right:8px; top:50%; transform:translateY(-50%)}
@media (max-width:760px){ .lightbox{padding:52px 12px 16px} .lightbox-prev,.lightbox-next{top:auto; bottom:4px; transform:none} }

/* ---------- поиск ---------- */
.search-tags a, .topbar .search-tags a{border:1px solid var(--rule); background:var(--panel-2); border-radius:var(--r); padding:5px 10px; font-size:13px; line-height:1.4; color:var(--text); opacity:1}
.search-tags a:hover{border-color:var(--brand); color:var(--brand)}
/* панель подсказок лежит в тёмной служебной строке: правило .topbar a:hover (белый текст, линия снизу)
   делало «Все результаты» и подсказки невидимыми при наведении */
.topbar .search-panel .search-hit, .topbar .search-panel .search-hit:hover{color:var(--text); border-bottom-color:transparent}
.topbar .search-panel .search-all, .topbar .search-panel .search-all:hover{color:var(--brand); border-bottom-color:transparent}
.sres li[hidden]{display:none}

/* страница поиска на телефоне и планшете: «Часто ищут» — строкой под полем (в боковой колонке скрыт, она уходит под результаты) */
.sbar-tags{display:none}
@media (max-width:1024px){
  .sbar-tags{display:flex; flex-wrap:nowrap; overflow-x:auto; gap:6px; margin:var(--s-4) 0 0; padding-bottom:4px; scrollbar-width:none}
  .sbar-tags::-webkit-scrollbar{display:none}
  .sbar-tags a{flex:0 0 auto; white-space:nowrap}
  .search-aside-tags{display:none !important}
  .sbar{flex-wrap:nowrap}
  .sbar .btn{padding:0 16px}
}

/* ---------- формы модуля «Веб-формы» ---------- */
.form--agat{max-width:760px}
.form--agat .form-desc{color:var(--steel); font-size:14.5px}
.form--agat .form-status{display:block; margin-bottom:var(--s-4)}
.form--agat .form-foot{display:flex; align-items:center; gap:var(--s-4); flex-wrap:wrap; margin-top:var(--s-5)}
.form--agat .field .input, .form--agat .field .textarea, .form--agat .field .select{width:100%}
.form--agat .check input{margin-top:3px}
.form--agat .check span a{color:var(--brand); border-bottom:1px solid var(--rule-strong)}
.captcha{display:flex; gap:10px; align-items:center; flex-wrap:wrap}
.captcha img{border:1px solid var(--rule); border-radius:var(--r)}
.captcha .input{flex:1 1 140px}
.req{color:var(--warn)}

/* анкета идёт сразу за сеткой сертификатов: отступ как между секциями */
.anketa{margin-top:var(--s-8)}
/* анкета СМК: шкала 0–10 — группа радиокнопок (fieldset/legend), поля связаны с подписями через for/id */
.anketa section{margin:var(--s-7) 0}
.anketa section > strong{display:block; font-family:var(--ff-head); font-size:20px; font-weight:500; margin-bottom:var(--s-3)}
.anketa section > label{display:block; margin:var(--s-5) 0 var(--s-2); font-weight:500}
/* отступ — у группы: поле legend внешние отступы сверху не применяет */
.anketa .rs-group{border:0; margin:var(--s-5) 0 0; padding:0; min-width:0}
.anketa .rs-group legend{display:block; margin:0 0 var(--s-2); padding:0; font-weight:500}
.anketa textarea, .anketa input[type="text"], .anketa input[type="tel"]{width:100%; max-width:640px; border:1px solid var(--rule-strong); border-radius:var(--r); padding:10px 12px; font:inherit; background:var(--panel)}
.anketa .captcha input[type="text"]{flex:0 1 220px; max-width:220px}
.anketa .intro div{font-family:var(--ff-head); font-size:20px; font-weight:600; margin-bottom:var(--s-4)}
.anketa .rs{display:flex; flex-wrap:wrap; gap:6px}
.anketa .rs label{position:relative; display:block}
.anketa .rs input{position:absolute; inset:0; margin:0; opacity:0; cursor:pointer}
.anketa .rs span{display:flex; align-items:center; justify-content:center; width:38px; height:38px; border:1px solid var(--rule-strong); border-radius:var(--r); font-weight:500; background:var(--panel)}
.anketa .rs label:hover span{border-color:var(--brand); color:var(--brand)}
.anketa .rs input:checked + span{background:var(--brand); border-color:var(--brand); color:#fff}
.anketa .rs input:focus-visible + span{outline:2px solid var(--brand); outline-offset:2px}
html.a11y .anketa .rs input:checked + span{background-color:var(--a-fg) !important; color:var(--a-bg) !important}
.anketa .hp-field{position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden}
.anketa button, .anketa input[type="submit"]{height:46px; padding:0 22px; border:0; border-radius:var(--r); background:var(--brand); color:#fff; font:500 15px var(--ff-head); cursor:pointer}

/* ---------- страница 404 ---------- */
.page-bare{padding-block:var(--s-8)}
.page-404{display:flex; align-items:center; justify-content:center; gap:clamp(24px,5vw,72px); flex-wrap:wrap; min-height:52vh; text-align:left}
.page-404-code{font-family:var(--ff-head); font-weight:600; font-size:clamp(110px,16vw,200px); line-height:1; letter-spacing:-.05em; color:var(--brand)}
.page-404 h1{font-size:var(--fs-h2); margin-bottom:var(--s-3)}
.page-404 p{color:var(--steel); margin:0 0 var(--s-5)}
.page-404-actions{display:flex; gap:var(--s-4); align-items:center; flex-wrap:wrap}

/* ---------- режим правки публичной части: обёртки областей не ломают сетки ---------- */
.sect-head > [id^="bx_incl_area"], .cards > [id^="bx_incl_area"], .directions > [id^="bx_incl_area"],
.hero-inner > [id^="bx_incl_area"], .nav > [id^="bx_incl_area"], .gov > [id^="bx_incl_area"], .footer-bottom > [id^="bx_incl_area"], .topbar-official > [id^="bx_incl_area"]{display:contents}

/* ---------- версия для слабовидящих: тот же шаблон + панель настроек (header.php, agat.js) ----------
   Цветовая схема задаётся переменными --a-bg/--a-fg/--a-link и перекрывает фоны и цвета всех блоков,
   размер шрифта — масштабом страницы (в макете размеры в px), изображения — скрываются целиком. */
.a11y-panel{display:none}
html.a11y .a11y-panel{display:block; position:relative; z-index:60; border-bottom:2px solid var(--a-fg); background:var(--a-bg); color:var(--a-fg)}
.a11y-panel .container{display:flex; flex-wrap:wrap; align-items:center; gap:14px 28px; padding-block:12px}
.a11y-group{display:flex; align-items:center; gap:6px; flex-wrap:wrap}
.a11y-group > span{font-weight:600; margin-right:4px}
.a11y-panel button{min-width:40px; height:40px; padding:0 12px; border:2px solid var(--a-fg); border-radius:2px; background:var(--a-bg);
  color:var(--a-fg); font:600 16px/1 var(--ff-body); cursor:pointer}
.a11y-panel button[aria-pressed="true"]{background:var(--a-fg); color:var(--a-bg)}
.a11y-group--fs button:nth-of-type(1){font-size:15px}
.a11y-group--fs button:nth-of-type(2){font-size:19px}
.a11y-group--fs button:nth-of-type(3){font-size:23px}
.a11y-group--color button{font-size:18px}
.a11y-group--color button[value="bw"]{background:#fff; color:#000; border-color:#000}
.a11y-group--color button[value="wb"]{background:#000; color:#fff; border-color:#000}
.a11y-group--color button[value="blue"]{background:#9DD1FF; color:#063462; border-color:#063462}
.a11y-group--color button[value="beige"]{background:#F7F3D6; color:#4D4B43; border-color:#4D4B43}
.a11y-group--color button[aria-pressed="true"]{outline:3px solid var(--a-fg); outline-offset:2px}
.a11y-exit{display:inline-flex; align-items:center; gap:8px; margin-left:auto; font-weight:600; text-decoration:underline}
.a11y-exit svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6}

html.a11y-c-bw{--a-bg:#fff; --a-fg:#000; --a-link:#00237a}
html.a11y-c-wb{--a-bg:#000; --a-fg:#fff; --a-link:#ffe600}
html.a11y-c-blue{--a-bg:#9DD1FF; --a-fg:#063462; --a-link:#063462}
html.a11y-c-beige{--a-bg:#F7F3D6; --a-fg:#4D4B43; --a-link:#3a2a00}
html.a11y body{--text:var(--a-fg); --steel:var(--a-fg); --steel-dim:var(--a-fg); --rule:var(--a-fg); --rule-strong:var(--a-fg);
  --paper:var(--a-bg); --panel:var(--a-bg); --panel-2:var(--a-bg); --brand:var(--a-link); --brand-deep:var(--a-fg); --brand-tint:var(--a-bg);
  --signal:var(--a-fg); --signal-deep:var(--a-fg); --signal-tint:var(--a-bg); --on-dark:var(--a-fg); --on-dark-dim:var(--a-fg);
  --ink:var(--a-bg); --ink-2:var(--a-bg); background:var(--a-bg); color:var(--a-fg); line-height:1.7}
/* общая перекраска — с нулевой специфичностью (:where), чтобы правила для отдельных блоков ниже её перебивали */
:where(html.a11y body *:not(svg, svg *, img, iframe, .btn, .a11y-panel button)){background-color:transparent !important; color:var(--a-fg) !important;
  border-color:var(--a-fg) !important; text-shadow:none !important; box-shadow:none !important}
/* выпадающие и закреплённые слои — непрозрачные, в цвет схемы: иначе сквозь них видна страница */
html.a11y body, html.a11y .header, html.a11y .topbar, html.a11y .drop, html.a11y .search-panel, html.a11y .search-form,
html.a11y .nav, html.a11y .anchors, html.a11y .crumbs, html.a11y .sidenav-body, html.a11y .lightbox,
html.a11y .a11y-panel{background-color:var(--a-bg) !important}
html.a11y .search-panel, html.a11y .drop{border:2px solid var(--a-fg) !important}
html.a11y .search-tags a{background-color:var(--a-bg) !important; border:1px solid var(--a-fg) !important}
html.a11y a:not(.btn):not(.logo):not(.a11y-panel *){color:var(--a-link) !important; text-decoration:underline}
/* нижние линии ссылок из макета (прозрачные, при наведении, у текущего пункта) после перекраски рамок видны —
   вместе с подчёркиванием текста получалось двойное; оставлены только рамки ссылок-плашек */
html.a11y a:not(.btn):not(.logo):not(.a11y-panel *):not(.dl a, .gov a, .pager a, .lang a, .search-tags a){border-bottom-color:transparent !important}
html.a11y :is(.nav-item > a[aria-current="page"], .anchors a[aria-current="true"]){text-decoration-thickness:3px; font-weight:700}
/* вкладки-якоря и вкладки изделия: в макете прокручиваются вбок без полосы прокрутки — здесь переносятся на новую строку */
html.a11y :is(.anchors ol, .tabs){flex-wrap:wrap; overflow-x:visible; column-gap:24px; row-gap:0}
html.a11y .anchors a{padding:8px 0}
/* на узком экране перенесённые вкладки занимают несколько строк — не прилипают к верху, чтобы не закрывать текст */
@media (max-width:1024px){ html.a11y .anchors{position:static} }
/* переключатель языков: в макете вкладки без нижней рамки (прилегают к краю тёмной полосы) — здесь полная рамка,
   текущий язык — инверсией */
html.a11y .lang a{border:1px solid var(--a-fg) !important}
html.a11y body .lang a[aria-current="true"]:not(.btn){background-color:var(--a-fg) !important; color:var(--a-bg) !important; text-decoration:none}
html.a11y .btn, html.a11y .btn *{background:var(--a-fg) !important; color:var(--a-bg) !important; border:2px solid var(--a-fg) !important}
html.a11y .btn svg{stroke:var(--a-bg)}
html.a11y svg{color:var(--a-fg)}
html.a11y .hero-bg, html.a11y .hero-grid, html.a11y .spectrum{display:none}
html.a11y .hero{min-height:0}
html.a11y img{filter:grayscale(1) contrast(1.1)}
html.a11y-c-wb .logo img{filter:invert(1) grayscale(1) brightness(2)}
html.a11y .footer .logo img{filter:grayscale(1) brightness(0)}
html.a11y-c-wb .footer .logo img{filter:grayscale(1) brightness(2)}
html.a11y :focus-visible{outline:3px solid var(--a-fg) !important; outline-offset:3px}
/* размер шрифта: макет свёрстан в px, поэтому масштаб страницы */
html.a11y-fs1 body{zoom:1.12}
html.a11y-fs2 body{zoom:1.3}
html.a11y-fs3 body{zoom:1.5}
/* изображения выключены: картинки и фоновые изображения не показываются, логотип остаётся */
html.a11y-noimg img:not(.logo img), html.a11y-noimg .tile-media, html.a11y-noimg .pcard-media, html.a11y-noimg .pj-cover,
html.a11y-noimg .gallery-row, html.a11y-noimg .article-cover, html.a11y-noimg .cert-scan, html.a11y-noimg .rcard img,
html.a11y-noimg .video, html.a11y-noimg .tg-post, html.a11y-noimg [class*="map"]{display:none !important}
html.a11y-noimg .pcard{grid-template-columns:minmax(0,1fr)}
html.a11y-noimg .tile--wide{grid-template-columns:minmax(0,1fr)}
html.a11y-noimg .pj-top{grid-template-columns:minmax(0,1fr)}
/* увеличенный интервал */
html.a11y-ls body{letter-spacing:.12em; word-spacing:.24em}
html.a11y-ls body *{letter-spacing:inherit !important}
html.a11y-ls p, html.a11y-ls li{line-height:1.9}
/* шапка в версии для слабовидящих: крупный шрифт не помещается в одну строку — логотип и телефон сверху,
   меню ниже с переносом пунктов; шапка не липкая, чтобы не закрывать полэкрана */
@media (min-width:1025px){
  html.a11y .header{position:relative}
  html.a11y .header .container{flex-wrap:wrap; row-gap:4px; padding-block:10px}
  html.a11y .header .logo{order:1}
  html.a11y .header-phone{order:2; margin-left:auto}
  html.a11y .nav{order:3; flex:1 1 100%; justify-content:flex-start; flex-wrap:wrap; row-gap:4px}
  html.a11y .anchors{top:0}
}
/* телефон: полуторное увеличение оставляет ~260 px ширины — увеличение меньше, длинные слова переносятся, логотип сжимается */
html.a11y body{hyphens:auto}
html.a11y :is(h1,h2,h3,h4,p,li,dt,dd,small,label){overflow-wrap:anywhere}
html.a11y :is(.anchors,.tabs,.stypes,.num,.tnum,.plate-spec b,.facts b){overflow-wrap:normal; hyphens:manual}
@media (max-width:600px){
  html.a11y-fs2 body{zoom:1.15}
  html.a11y-fs3 body{zoom:1.25}
  html.a11y .header .logo{flex:1 1 auto; min-width:0}
  html.a11y .header .logo img{max-width:100%; height:auto}
  html.a11y .badge{white-space:normal}
  html.a11y-ls body{letter-spacing:.06em; word-spacing:.12em}
}
/* число строк панели параметров задаётся из данных (--rows); на узком экране панель в два столбца — строки по содержимому */
@media (min-width:1201px){ .pj-facts{grid-template-rows:repeat(var(--rows,4),1fr)} }
/* таблица «параметр — значение» (без шапки, одно значение в строке, как «Сведения об организации»): на телефоне
   переносится по ширине экрана, а не прокручивается вбок */
@media (max-width:760px){
  .prose .table-wrap table:not(:has(thead)):not(:has(td + td)),
  .inner-main > .table-wrap table:not(:has(thead)):not(:has(td + td)){min-width:0}
  .table-wrap table:not(:has(thead)):not(:has(td + td)) :is(th,td){hyphens:auto; overflow-wrap:anywhere}
  .table-wrap table:not(:has(thead)):not(:has(td + td)) td.num{white-space:normal}
}

/* пагинация: стрелки у «Назад/Дальше»; на узком экране — только стрелки и соседние номера, в одну строку */
.pager .pager-dir{gap:8px; padding:0 16px}
/* правило макета «.pager span» не должно задевать подписи внутри ссылок */
.pager a span{min-width:0; height:auto; padding:0; border:0; border-radius:0; background:none}
html.a11y .pager a span{border:0}
@media (max-width:560px){
  .pager{gap:4px}
  .pager a,.pager span{min-width:36px; padding:0 6px}
  .pager .pager-dir{padding:0 10px}
  .pager .pager-txt,.pager .pager-far{display:none}
  .pager .pager-gap{min-width:16px; padding:0}
}
/* версия для слабовидящих: текущая страница — инверсия цветов схемы */
html.a11y .pager [aria-current="page"]{background-color:var(--a-fg) !important; color:var(--a-bg) !important; border:2px solid var(--a-fg)}
html.a11y .pager a{border:1px solid var(--a-fg)}
html.a11y .pager .pager-far{display:none}
@media (max-width:560px){html.a11y .pager{gap:3px} html.a11y .pager a, html.a11y .pager > span{min-width:32px; padding:0 4px} html.a11y .pager > .pager-gap{min-width:12px; padding:0}}

/* ---------- согласие на cookie (Agat\Consent): уведомление внизу, окно настроек, заглушка внешнего видео ---------- */
.cookie-banner{position:fixed; left:var(--s-4); right:var(--s-4); bottom:var(--s-4); z-index:250; max-width:1120px; margin:0 auto;
  display:flex; align-items:center; gap:var(--s-4) var(--s-6); padding:18px 22px; background:var(--panel); color:var(--text);
  border:1px solid var(--rule); border-radius:var(--r); box-shadow:0 12px 40px rgba(14,24,54,.18)}
.cookie-text{margin:0; font-size:14px; line-height:1.55}
.cookie-actions{display:flex; align-items:center; flex-wrap:wrap; gap:10px; flex:none}
.cookie-settings-link{font-size:14px; font-weight:500; color:var(--brand); text-decoration:underline; text-underline-offset:3px}
@media (max-width:760px){
  .cookie-banner{left:10px; right:10px; bottom:10px; flex-direction:column; align-items:stretch; padding:16px}
  .cookie-actions .btn{flex:1 1 auto}
  .cookie-settings-link{flex:1 1 100%; text-align:center}
}
/* окно: без скрипта открывается якорем (:target), со скриптом — классом is-open */
.cookie-modal{position:fixed; inset:0; z-index:320; display:none; place-items:center; padding:20px; background:rgba(14,24,54,.6)}
.cookie-modal:target, .cookie-modal.is-open{display:grid}
.cookie-dialog{position:relative; width:100%; max-width:640px; max-height:100%; overflow:auto; padding:28px;
  background:var(--panel); color:var(--text); border-radius:var(--r); box-shadow:0 20px 60px rgba(14,24,54,.3)}
.cookie-dialog:focus, .cookie-dialog:focus-visible{outline:none}
.cookie-close{position:absolute; top:14px; right:14px; display:grid; place-items:center; width:40px; height:40px; color:var(--brand)}
.cookie-close:hover{background:var(--panel-2)}
.cookie-close svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2}
.cookie-modal-title{margin:0 44px var(--s-3) 0; font-size:26px; color:var(--brand)}
.cookie-modal-intro{margin:0 0 18px; font-size:14.5px; line-height:1.55; color:var(--steel)}
.cookie-form{display:grid; gap:10px}
.cookie-group{display:flex; align-items:flex-start; gap:14px; padding:14px 16px; border:1px solid var(--rule); border-radius:var(--r); background:var(--panel); cursor:pointer}
.cookie-group input{width:20px; height:20px; margin:2px 0 0; flex:none; accent-color:var(--brand)}
.cookie-group input:disabled{cursor:not-allowed}
.cookie-group input:focus-visible{outline:none}
.cookie-group:has(input:focus-visible){border-color:var(--brand); box-shadow:0 0 0 2px rgba(36,62,124,.25)}
.cookie-group-body{display:grid; gap:4px}
.cookie-group-name{font-weight:600; color:var(--brand)}
.cookie-group-text{font-size:14px; line-height:1.5; color:var(--steel)}
.cookie-list{font-size:14px; line-height:1.5; color:var(--steel)}
.cookie-list summary{cursor:pointer; font-weight:500; color:var(--brand); padding:4px 0}
.cookie-list ul{margin:8px 0 0; padding-left:20px; display:grid; gap:6px}
.cookie-form-actions{display:flex; flex-wrap:wrap; gap:10px; margin-top:8px}
@media (max-width:560px){
  .cookie-dialog{padding:22px 18px}
  .cookie-form-actions .btn{flex:1 1 100%}
}
/* внешнее видео до согласия: заглушка на месте плеера */
.video--consent{display:grid; place-items:center; color:#fff}
.consent-media{max-width:460px; padding:var(--s-5); text-align:center; font-size:14px; line-height:1.55}
.consent-media p{margin:0 0 var(--s-4); color:rgba(255,255,255,.85)}
.consent-media-actions{display:flex; flex-wrap:wrap; gap:var(--s-3) var(--s-5); align-items:center; justify-content:center}
.video--consent .consent-media-actions .link{font-size:14px}
@media (max-width:560px){ .video--consent{aspect-ratio:auto; min-height:220px} }
/* версия для слабовидящих: уведомление и окно — на фоне схемы, с рамкой */
html.a11y .cookie-banner, html.a11y .cookie-dialog{background-color:var(--a-bg) !important; border:2px solid var(--a-fg); box-shadow:none}
html.a11y .cookie-modal{background-color:rgba(0,0,0,.6) !important}
html.a11y .cookie-group{border:1px solid var(--a-fg)}
html.a11y .video--consent{display:grid !important; border:2px solid var(--a-fg)}

/* версия для слабовидящих, мобильное меню: ширина — от шапки, а не 100vw (при zoom на body в Chromium панель
   выходила за левый край); высоту по свободному месту на экране ставит agat.js (fitNav) */
@media (max-width:1024px){ html.a11y .nav{width:min(400px,100%)} }

/* длинные слова без пробелов (имя файла вместо названия документа, «Radioelectronics» при крупном шрифте) не выталкивают
   ячейку за край экрана: текст во flex-строке может сжиматься и переноситься */
.dl-txt, .partners a span{min-width:0}
.dl-txt b, .partners a span{overflow-wrap:anywhere}

/* госресурсы на главной: логотипы в рамке одной ширины — подписи начинаются с одной линии; широкие логотипы
   (флаг pravo.by, «АГАТ») вписываются в неё и становятся уже, чем были (92 px) */
.gov img{width:80px; max-width:none; height:48px; object-fit:contain}

/* «АГАТ в цифрах» на телефоне — по две цифры в строке (в макете до 420 px — одна) */
@media (max-width:420px){
  .figures{grid-template-columns:repeat(2,minmax(0,1fr))}
  .figure{border-right:1px solid rgba(255,255,255,.14) !important; padding-right:var(--s-4)}
  .figure:nth-child(2n), .figure:last-child{border-right:0 !important}
  .figure:nth-child(2n){padding-left:var(--s-4) !important}
  .figure b{font-size:34px}
  .figure span{font-size:13px}
}

/* карта сайта (karta-sayta, шаблон menu/sitemap) */
.sitemap{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s-6) var(--gutter)}
.sitemap-sect h2{font-size:20px; margin:0 0 var(--s-3); padding-bottom:var(--s-3); border-bottom:1px solid var(--rule)}
.sitemap-sect h2 a{color:var(--text)}
.sitemap ul{list-style:none; margin:0; padding:0}
.sitemap li{margin:6px 0; line-height:1.4}
.sitemap li a{color:var(--steel)}
.sitemap a:hover{color:var(--brand)}
.sitemap li ul{margin:4px 0 8px; padding-left:var(--s-4); border-left:1px solid var(--rule); font-size:14px}
@media (max-width:900px){.sitemap{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.sitemap{grid-template-columns:minmax(0,1fr)}}

/* End */
/* /local/templates/agat/fonts/fonts.css?17926654494717 */
/* /local/templates/agat/css/style.css?179266544982767 */
/* /local/templates/agat/css/bitrix.css?179266544935407 */
