/* Generated by tools/fonts/fetch.js. Do not edit.
   Self-hosted so the page does not have to reach fonts.googleapis.com before
   it can paint, and so visitors are not announced to a third party.
   Only the latin and cyrillic ranges are kept; unicode-range still limits
   each browser to the files it actually needs. */

@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url(/static/fonts/q5uCsoe9Lv5t7Meb31EcEx58hLxR.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url(/static/fonts/q5uCsoe9Lv5t7Meb31EcExd8hLxR.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url(/static/fonts/q5uCsoe9Lv5t7Meb31EcEx18hLxR.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;
}

@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url(/static/fonts/q5uCsoe9Lv5t7Meb31EcExN8hA.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;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/static/fonts/-F63fjptAgt5VM-kVkqdyU8n1iIq129k.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/static/fonts/-F63fjptAgt5VM-kVkqdyU8n1isq129k.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/static/fonts/-F63fjptAgt5VM-kVkqdyU8n1iEq129k.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;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/static/fonts/-F63fjptAgt5VM-kVkqdyU8n1i8q1w.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;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/static/fonts/-F6qfjptAgt5VM-kVkqdyU8n3twJwl1FgtIU.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/static/fonts/-F6qfjptAgt5VM-kVkqdyU8n3twJwlRFgtIU.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/static/fonts/-F6qfjptAgt5VM-kVkqdyU8n3twJwl5FgtIU.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;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/static/fonts/-F6qfjptAgt5VM-kVkqdyU8n3twJwlBFgg.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;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/static/fonts/-F6qfjptAgt5VM-kVkqdyU8n3vAOwl1FgtIU.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/static/fonts/-F6qfjptAgt5VM-kVkqdyU8n3vAOwlRFgtIU.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/static/fonts/-F6qfjptAgt5VM-kVkqdyU8n3vAOwl5FgtIU.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;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/static/fonts/-F6qfjptAgt5VM-kVkqdyU8n3vAOwlBFgg.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;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxTKYbABA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxaKYbABA.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxQKYbABA.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;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxeKYY.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;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxTKYbABA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxaKYbABA.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxQKYbABA.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;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxeKYY.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;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxTKYbABA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxaKYbABA.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxQKYbABA.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;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(/static/fonts/zYXzKVElMYYaJe8bpLHnCwDKr932-G7dytD-Dmu1syxeKYY.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;
}
/* ═══════════════════════════════════════════════════════════════════════
   ТОКЕНЫ — те же, что в runtime-демо платформы: teal = проведено/сервер,
   amber = ожидание, нулевые скругления везде.
   ═══════════════════════════════════════════════════════════════════════ */
/* Тексты третьего уровня и номера строк подняты до контраста 4.5:1 —
   порога WCAG AA для мелкого текста. Проверяется axe в internal/handlers. */
:root{
  --paper:#F2F4F3; --card:#FBFCFB; --sunk:#EBEFEE; --hover:#E9EEED;
  --ink:#14232A; --ink2:#4A5D66; --ink3:#626E72;
  --rule:#DBE2E0; --rule2:#BAC7C3;
  --srv:#0B6E6E; --srv-bg:#E7F1F0; --srv-line:#9CC7C4;
  --amber:#836315; --amber-bg:#F7F1DF; --amber-line:#DCC98C;
  --cli:#A93F49;
  --deep:#0E171B; --deep2:#14232A; --deep-rule:#24373F;
  --deep-ink:#DCE6E4; --deep-ink2:#93A9AC; --deep-ink3:#788B8F;
  --deep-srv:#3FB3AC;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --disp:"Golos Text",system-ui,sans-serif;
  --gut:clamp(16px,4vw,44px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--ink);font-size:16px;line-height:1.6;
  font-family:"IBM Plex Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased;
  overflow-x:hidden}
/* длинные идентификаторы метаданных не должны распирать страницу */
h1,h2,h3,p,li,td,th{overflow-wrap:break-word}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;text-align:left}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--srv);outline-offset:2px}
img{max-width:100%}

.wrap{max-width:1240px;margin:0 auto;padding:0 var(--gut)}
.band{padding:clamp(56px,8vw,104px) 0;border-top:1px solid var(--rule)}
.band--flush{border-top:none}
.band--deep{background:var(--deep);color:var(--deep-ink);border-top:none}
.band--sunk{background:var(--sunk)}

/* ── типографика ─────────────────────────────────────────────────────── */
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink3)}
.band--deep .eyebrow{color:var(--deep-ink3)}
h1,h2,h3{font-family:var(--disp);font-weight:600;line-height:1.08;
  letter-spacing:-.02em}
h1{font-weight:600;font-size:clamp(34px,5.6vw,66px)}
h2{font-weight:600;font-size:clamp(26px,3.4vw,40px);
  line-height:1.1}
h3{font-weight:600;font-size:18px;line-height:1.25;
  letter-spacing:-.005em}
.lead{font-size:clamp(16px,1.5vw,19px);color:var(--ink2);max-width:62ch}
.band--deep .lead{color:var(--deep-ink2)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.sechead{display:grid;grid-template-columns:1fr;gap:14px;margin-bottom:clamp(28px,4vw,52px);
  max-width:74ch}

/* ── кнопки ──────────────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:9px;padding:13px 22px;
  border:1px solid var(--rule2);background:var(--card);font-size:15px;
  transition:border-color .15s,color .15s,background .15s}
.btn:hover{border-color:var(--srv);color:var(--srv)}
.btn--pri{background:var(--srv);border-color:var(--srv);color:#fff;font-weight:500}
.btn--pri:hover{background:#0A5F5F;border-color:#0A5F5F;color:#fff}
.btn--ghost{background:transparent}
.band--deep .btn{background:transparent;border-color:var(--deep-rule);color:var(--deep-ink)}
.band--deep .btn:hover{border-color:var(--deep-srv);color:var(--deep-srv)}

/* ── шапка ───────────────────────────────────────────────────────────── */
.head{position:sticky;top:0;z-index:40;background:rgba(242,244,243,.93);
  backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--rule2)}
.head__in{display:flex;align-items:center;gap:clamp(14px,3vw,34px);
  padding:12px var(--gut);max-width:1240px;margin:0 auto}
/* марка выравнивается по строчной высоте слова, а не по базовой линии,
   поэтому у неё своя привязка внутри флекса */
.brand{display:flex;align-items:baseline;gap:9px;flex:0 0 auto}
.brand__m{width:17px;height:17px;flex:0 0 auto;align-self:center;
  color:var(--srv);margin-right:1px}
.band--deep .brand__m{color:var(--deep-srv)}
.brand__n{font-family:var(--disp);font-weight:700;
  font-size:19px;letter-spacing:.01em}
.brand__c{font-family:var(--mono);font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink3)}
.mainnav{display:flex;gap:2px;flex:1;overflow-x:auto;scrollbar-width:none}
.mainnav::-webkit-scrollbar{display:none}
.mainnav a{padding:8px 11px;font-size:14px;color:var(--ink2);white-space:nowrap;
  border-bottom:2px solid transparent}
.mainnav a:hover{color:var(--ink);border-bottom-color:var(--rule2)}
.langseg{display:flex;border:1px solid var(--rule2);background:var(--card);flex:0 0 auto}
/* переключатель языка — ссылки на /, /uz, /en: язык выбирает адрес страницы.
   В исходной однофайловой версии это были кнопки, поэтому селекторы по тегу
   пришлось сменить вместе с разметкой. */
.langseg a{display:flex;align-items:center;padding:6px 10px;
  font-family:var(--mono);font-size:11px;
  letter-spacing:.08em;color:var(--ink3);border-right:1px solid var(--rule)}
.langseg a:last-child{border-right:none}
.langseg a:hover{color:var(--ink)}
.langseg a.on{background:var(--srv-bg);color:var(--srv);font-weight:600}

/* ── меню: группы с выпадающими списками ─────────────────────────────── */
.mainnav{overflow:visible}
.navi{position:relative;flex:0 0 auto}
.navi > a,.navi > button{display:flex;align-items:center;gap:6px;padding:8px 11px;
  font-size:14px;color:var(--ink2);white-space:nowrap;border-bottom:2px solid transparent}
.navi > a:hover,.navi > button:hover{color:var(--ink);border-bottom-color:var(--rule2)}
.navi.on > button{color:var(--ink);border-bottom-color:var(--srv)}
.navi .ar{font-size:9px;color:var(--ink3);transition:transform .15s}
.navi.on .ar{transform:rotate(180deg)}
.navd{position:absolute;top:100%;left:0;z-index:60;min-width:214px;background:var(--card);
  border:1px solid var(--rule2);box-shadow:0 12px 28px rgba(20,35,42,.14);
  animation:fadeUp .16s both}
.navd a{display:block;padding:9px 14px;font-size:14px;color:var(--ink2);
  border-bottom:1px solid var(--rule)}
.navd a:last-child{border-bottom:none}
.navd a:hover{background:var(--srv-bg);color:var(--srv)}
.navi--ai > button{color:var(--srv);font-weight:600}
.navi--ai > button:hover{border-bottom-color:var(--srv)}
.navi--ai .dot{width:6px;height:6px;background:var(--srv);display:inline-block;
  animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}
@media (prefers-reduced-motion:reduce){ .navi--ai .dot{animation:none} }
.navcta{flex:0 0 auto;padding:7px 15px;font-size:13.5px;font-weight:500;color:#fff;
  background:var(--srv);border:1px solid var(--srv);white-space:nowrap}
.navcta:hover{background:#0A5F5F;border-color:#0A5F5F}

/* ── указатель разделов в герое ──────────────────────────────────────── */
.hidx{margin-top:clamp(30px,4vw,44px);border-top:1px solid var(--rule2);
  border-left:1px solid var(--rule);display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.hidx a{display:grid;gap:3px;padding:13px 15px;border-right:1px solid var(--rule);
  border-bottom:1px solid var(--rule);transition:background .15s}
.hidx a:hover{background:var(--card)}
.hidx a:hover .t{color:var(--srv)}
.hidx .n{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;color:var(--ink3)}
.hidx .t{font-size:14px;color:var(--ink)}

/* ── переход к следующему разделу ────────────────────────────────────── */
.nextlink{margin-top:clamp(34px,5vw,54px);display:flex;align-items:baseline;gap:14px;
  flex-wrap:wrap;padding-top:16px;border-top:1px solid var(--rule2)}
.nextlink .l{font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink3)}
.nextlink a{display:inline-flex;align-items:baseline;gap:10px;
  font-family:var(--disp);font-weight:600;
  font-size:clamp(19px,2.3vw,26px);letter-spacing:-.01em;color:var(--ink)}
.nextlink a:hover{color:var(--srv)}
.nextlink a .ar{font-family:"IBM Plex Sans";font-size:16px;transition:transform .18s}
.nextlink a:hover .ar{transform:translateX(5px)}
.band--deep .nextlink{border-color:var(--deep-rule)}
.band--deep .nextlink .l{color:var(--deep-ink3)}
.band--deep .nextlink a{color:var(--deep-ink)}
.band--deep .nextlink a:hover{color:var(--deep-srv)}

@media (min-width:640px){ .hidx{grid-template-columns:repeat(4,minmax(0,1fr))} }
@media (max-width:859px){
  .navi{display:none}
  .navi--ai{display:block}
  .brand{flex:1}
}
@media (prefers-reduced-motion:reduce){
  .navd{animation:none}
  .nextlink a .ar,.navi .ar{transition:none}
}

/* ── меню на телефоне ────────────────────────────────────────────────── */
.burger{display:none;flex:0 0 auto;width:40px;height:40px;align-items:center;
  justify-content:center;border:1px solid var(--rule2);background:var(--card)}
.burger i{display:block;width:17px;height:1.5px;background:var(--ink);position:relative;
  transition:background .2s}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:17px;
  height:1.5px;background:var(--ink);transition:transform .22s ease,top .22s ease}
.burger i::before{top:-5.5px}
.burger i::after{top:5.5px}
.burger.on i{background:transparent}
.burger.on i::before{top:0;transform:rotate(45deg)}
.burger.on i::after{top:0;transform:rotate(-45deg)}

.mobm{position:absolute;top:100%;left:0;right:0;background:var(--card);
  border-bottom:1px solid var(--rule2);box-shadow:0 16px 32px rgba(20,35,42,.12);
  max-height:min(calc(100vh - 54px), calc(100dvh - 54px));
  overflow-y:auto;-webkit-overflow-scrolling:touch;
  opacity:0;transform:translateY(-8px);pointer-events:none;
  transition:opacity .22s ease,transform .22s ease}
.mobm.on{opacity:1;transform:none;pointer-events:auto}
.mobm__g{border-bottom:1px solid var(--rule)}
.mobm__g:has(> a:first-child) a{padding-top:14px}
.mobm__t{padding:12px 18px 6px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink3)}
.mobm__t.ai{color:var(--srv)}
.mobm a{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px 18px;font-size:15px;color:var(--ink)}
.mobm a:active{background:var(--srv-bg)}
.mobm a .n{font-family:var(--mono);font-size:10px;color:var(--ink3)}
.mobm__cta{padding:16px 18px 20px}
.mobm__cta a{width:100%;min-height:48px;background:var(--srv);color:#fff;
  border:1px solid var(--srv);font-size:16px;font-weight:500}
@media (max-width:859px){
  .burger{display:flex}
  .navcta{display:none}
  .navi--ai{display:none}
  .mainnav{flex:0}
}
@media (min-width:860px){ .mobm{display:none} }
@media (prefers-reduced-motion:reduce){
  .mobm{transition:none}
  .burger i,.burger i::before,.burger i::after{transition:none}
}

/* ── герой ───────────────────────────────────────────────────────────── */
.hero{padding:clamp(44px,6vw,76px) 0 0}
.hero__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(30px,4vw,44px);
  align-items:start}
.hero__copy{display:grid;gap:22px;max-width:60ch}
.hero h1 em{font-style:normal;color:var(--srv)}
.hero__cta{display:flex;gap:12px;flex-wrap:wrap}
.stats{display:grid;grid-template-columns:minmax(0,1fr);
  border-top:1px solid var(--rule2);margin-top:clamp(40px,5vw,60px)}
.stat{padding:18px 20px 20px;border-bottom:1px solid var(--rule)}
.stat:last-child{border-bottom:none}
.stat__n{font-family:var(--mono);font-size:clamp(20px,2.4vw,28px);font-weight:600;
  color:var(--srv);font-variant-numeric:tabular-nums;line-height:1.1}
.stat__l{font-size:13px;color:var(--ink2);margin-top:6px}

/* ── карточка ассистента в герое ─────────────────────────────────────── */
.heroa{border:1px solid var(--rule2);background:var(--card);display:grid;
  grid-template-rows:auto 1fr auto;min-height:288px}
.heroa__h{display:flex;align-items:center;gap:9px;padding:11px 14px;background:var(--sunk);
  border-bottom:1px solid var(--rule2);font-family:var(--mono);font-size:10px;
  letter-spacing:.13em;text-transform:uppercase;color:var(--ink3)}
.heroa__h b{color:var(--srv);font-weight:600;letter-spacing:.08em}
.heroa__h .dot{width:6px;height:6px;background:var(--srv);display:inline-block;
  animation:pulse 2.4s ease-in-out infinite}
.heroa__b{padding:14px;display:grid;gap:11px;align-content:start;
  opacity:1;transition:opacity .3s ease}
.heroa__b.out{opacity:0}
.heroa__q{border:1px solid var(--srv-line);background:var(--srv-bg);color:#0A4F4F;
  padding:9px 11px;font-size:13.5px;line-height:1.5}
.heroa__t{display:flex;flex-wrap:wrap;gap:5px}
.heroa__t span{font-family:var(--mono);font-size:10px;padding:3px 6px;
  border:1px solid var(--rule2);color:var(--ink3);background:var(--card)}
.heroa__t span.none{border-style:dashed}
.heroa__a{font-size:13.5px;line-height:1.55;color:var(--ink2)}
.heroa__a .acc{font-size:12.5px}
.heroa__f{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:10px 14px;border-top:1px solid var(--rule);background:var(--sunk)}
.heroa__f a{font-size:13px;color:var(--srv);display:inline-flex;align-items:center;gap:7px}
.heroa__f a .ar{transition:transform .18s}
.heroa__f a:hover .ar{transform:translateX(4px)}
.heroa__f .pg{display:flex;gap:5px}
.heroa__f .pg i{width:14px;height:2px;background:var(--rule2);display:block}
.heroa__f .pg i.on{background:var(--srv)}
@media (prefers-reduced-motion:reduce){
  .heroa__b{transition:none}
  .heroa__h .dot,.heroa__f a .ar{animation:none;transition:none}
}

/* ── СИГНАТУРА: конфигурация → приложение ────────────────────────────── */
.swap{border:1px solid var(--rule2);background:var(--card)}
.swap__tabs{display:flex;align-items:stretch;background:var(--sunk);
  border-bottom:1px solid var(--rule2);overflow-x:auto;scrollbar-width:none}
.swap__tabs::-webkit-scrollbar{display:none}
.swap__tab{display:flex;align-items:center;gap:9px;padding:10px 15px;
  border-right:1px solid var(--rule);white-space:nowrap;font-family:var(--mono);
  font-size:12px;color:var(--ink3)}
.swap__tab:hover{background:var(--hover);color:var(--ink2)}
.swap__tab.on{background:var(--card);color:var(--ink);font-weight:600;
  box-shadow:inset 0 2px 0 var(--srv)}
.swap__tab span{font-family:"IBM Plex Sans";font-size:11px;font-weight:400;
  color:var(--ink3);letter-spacing:0}
.swap__body{display:grid;grid-template-columns:minmax(0,1fr)}
.pane-yaml{background:var(--deep);color:var(--deep-ink);padding:16px 0 18px;
  overflow-x:auto;-webkit-overflow-scrolling:touch;border-bottom:1px solid var(--rule2)}
.pane-yaml__cap{display:flex;justify-content:space-between;gap:12px;
  padding:0 18px 12px;font-family:var(--mono);font-size:10px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--deep-ink3)}
.yline{display:grid;grid-template-columns:34px minmax(0,1fr);gap:0;
  font-family:var(--mono);font-size:12.5px;line-height:1.75;white-space:pre}
.yline__n{color:#738187;text-align:right;padding-right:12px;user-select:none;
  font-variant-numeric:tabular-nums}
.yline__t{padding-right:18px;color:var(--deep-ink2)}
.yline k{color:var(--deep-srv);font-style:normal}
.yline v{color:#E2C88A;font-style:normal}
.yline c{color:#57707A;font-style:normal}
.anim .yline{animation:slideIn .34s both;animation-delay:calc(var(--i) * 22ms)}
@keyframes slideIn{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}

.pane-app{padding:16px 18px 20px;min-width:0;container-type:inline-size}
.pane-app__cap{display:flex;justify-content:space-between;gap:12px;
  font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink3);margin-bottom:14px}
.appform{border:1px solid var(--rule);background:var(--card)}
.appform__bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:9px 11px;
  background:var(--sunk);border-bottom:1px solid var(--rule)}
.appform__b{font-size:12.5px;padding:5px 11px;border:1px solid var(--rule2);
  background:var(--card);white-space:nowrap}
.appform__b--pri{background:var(--srv);border-color:var(--srv);color:#fff;font-weight:500}
.appform__title{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  padding:13px 14px 10px}
.appform__title .appform__t{font-family:var(--disp);font-weight:600;font-size:17px}
.chip{font-family:var(--mono);font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;
  padding:3px 7px;border:1px solid var(--rule2);color:var(--ink2);background:var(--card);
  white-space:nowrap}
.chip--ok{border-color:var(--srv-line);background:var(--srv-bg);color:var(--srv)}
.chip--wait{border-color:var(--amber-line);background:var(--amber-bg);color:var(--amber)}
.fgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:0 26px;padding:0 14px 12px}
@container (min-width:460px){.fgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.f{display:grid;grid-template-columns:minmax(88px,34%) minmax(0,1fr);gap:10px;
  align-items:baseline;padding:5px 0;border-bottom:1px solid var(--rule)}
.f__l{font-size:12.5px;color:var(--ink3)}
.f__v{font-size:13.5px;overflow-wrap:anywhere}
.appform{overflow:hidden}
.appform table{width:100%;border-collapse:collapse;table-layout:fixed}
.appform th{font-family:var(--disp);font-weight:600;
  font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);
  text-align:left;padding:7px 10px;line-height:1.3;border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule2);background:var(--sunk)}
.appform td{font-size:13px;padding:8px 10px;border-bottom:1px solid var(--rule);
  overflow-wrap:anywhere;hyphens:auto}
.appform th.r,.appform td.r{text-align:right}
.appform td.num{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:12.5px}
.appform__foot{display:flex;justify-content:flex-end;gap:12px;align-items:baseline;
  padding:10px 14px;border-top:1px solid var(--rule2)}
.appform__foot .l{font-size:12.5px;color:var(--ink3)}
.appform__foot .v{font-family:var(--mono);font-weight:600;font-size:15px;
  font-variant-numeric:tabular-nums}
.swap__note{display:grid;gap:10px;padding:14px 18px;border-top:1px solid var(--rule2);
  background:var(--sunk);font-size:13.5px;color:var(--ink2)}
.grep{font-family:var(--mono);font-size:12px;overflow-x:auto;white-space:pre;
  color:var(--ink2)}
.grep b{color:var(--ink);font-weight:600}
.grep i{font-style:normal;color:var(--srv);font-weight:600}

/* ── редактор в панели героя: подсказки из метаданных ─────────────────── */
.ide{display:flex;gap:0;padding:0 18px 10px;margin-top:-4px}
.ide button{font-family:var(--mono);font-size:11px;letter-spacing:.06em;padding:5px 11px;
  border:1px solid var(--deep-rule);color:var(--deep-ink3);background:transparent;
  border-right-width:0}
.ide button:last-child{border-right-width:1px}
.ide button:hover{color:var(--deep-ink2)}
.ide button.on{background:#12242A;color:var(--deep-srv);border-color:#2A5A5C;
  border-right-width:1px}
.ide button.on + button{border-left-width:0}
.acp{margin:6px 0 0 34px;border:1px solid #2A5A5C;background:#0B1317;max-width:520px;
  animation:fadeUp .22s both;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.acp__h{padding:5px 10px;border-bottom:1px solid var(--deep-rule);font-family:var(--mono);
  font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--deep-ink3)}
.acp__i{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;align-items:baseline;
  padding:6px 10px;font-family:var(--mono);font-size:12px;color:var(--deep-ink2);
  border-bottom:1px solid #16262C}
.acp__i:last-child{border-bottom:none}
.acp__i.on{background:#12313200;background:#123132;color:var(--deep-ink)}
.acp__i .kk{font-size:9px;letter-spacing:.05em;border:1px solid var(--deep-rule);
  padding:0 4px;color:var(--deep-ink3);white-space:nowrap}
.acp__i.on .kk{border-color:#2A5A5C;color:var(--deep-srv)}
.acp__i .tt{font-size:10.5px;color:#57707A;display:block;margin-top:2px}
.acp__i.on .tt{color:var(--deep-ink3)}
.acp__f{padding:5px 10px;border-top:1px solid var(--deep-rule);font-family:var(--mono);
  font-size:10px;color:#57707A}
.yline .cr{display:inline-block;width:7px;height:13px;background:var(--deep-srv);
  vertical-align:-2px;animation:blink .9s steps(1) infinite}
@media (prefers-reduced-motion:reduce){
  .acp{animation:none}
  .yline .cr{animation:none}
}

/* ── панель кода ─────────────────────────────────────────────────────── */
.code{border:1px solid var(--rule2);background:var(--deep);color:var(--deep-ink)}
.code__tabs{display:flex;overflow-x:auto;scrollbar-width:none;
  border-bottom:1px solid var(--deep-rule);background:#0B1317}
.code__tabs::-webkit-scrollbar{display:none}
.code__tab{display:flex;align-items:center;gap:8px;padding:11px 16px;white-space:nowrap;
  font-family:var(--mono);font-size:12px;color:var(--deep-ink3);
  border-right:1px solid var(--deep-rule)}
.code__tab:hover{color:var(--deep-ink2);background:#101B20}
.code__tab.on{color:var(--deep-ink);background:var(--deep);font-weight:600;
  box-shadow:inset 0 2px 0 var(--deep-srv)}
.code__head{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:14px 18px 10px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--deep-ink3)}
.code__head b{color:var(--deep-srv);font-weight:600;letter-spacing:.1em}
.code__body{padding:0 0 16px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.cline{display:grid;grid-template-columns:38px minmax(0,1fr);
  font-family:var(--mono);font-size:12.5px;line-height:1.8;white-space:pre}
.cline__n{color:#738187;text-align:right;padding-right:13px;user-select:none;
  font-variant-numeric:tabular-nums}
.cline__t{padding-right:18px;color:var(--deep-ink)}
.cline kw{color:#C08BE0;font-style:normal}
.cline fn{color:var(--deep-srv);font-style:normal}
.cline st{color:#E2C88A;font-style:normal}
.cline nu{color:#7FBF9E;font-style:normal}
.cline cm{color:#57707A;font-style:normal}
.anim-c .cline{animation:fadeUp .28s both;animation-delay:calc(var(--i) * 16ms)}
.code__note{padding:13px 18px;border-top:1px solid var(--deep-rule);background:#101B20;
  font-size:13.5px;color:var(--deep-ink2)}
.code__note b{color:var(--deep-ink);font-weight:500}

/* ── проведение: конвейер и проводки ─────────────────────────────────── */
.post{border:1px solid var(--rule2);background:var(--card)}
.post__ctl{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;
  background:var(--sunk);border-bottom:1px solid var(--rule2)}
.post__ctl .sp{flex:1}
.seg{display:flex;border:1px solid var(--rule2);background:var(--card)}
.seg button{padding:7px 12px;font-size:12.5px;color:var(--ink3);
  border-right:1px solid var(--rule)}
.seg button:last-child{border-right:none}
.seg button.on{background:var(--srv-bg);color:var(--srv);font-weight:500}
.post__grid{display:grid;grid-template-columns:minmax(0,1fr)}
.pipe{padding:14px;border-bottom:1px solid var(--rule)}
.pstep{display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:11px;
  align-items:baseline;padding:9px 4px;border-bottom:1px solid var(--rule);
  /* Состояние ступени читается по точке и цвету текста, а не по прозрачности
     всей строки: приглушение через opacity уводило подпись к 1.8:1, и никакой
     базовый цвет этого не переживает. */
  transition:color .3s}
.pstep__t{color:var(--ink2)}
.pstep.on .pstep__t,.pstep.done .pstep__t{color:var(--ink)}
.pstep:last-child{border-bottom:none}
.pstep__d{width:10px;height:10px;border:1px solid var(--rule2);background:var(--card);
  justify-self:center;transition:background .25s,border-color .25s}
.pstep.done .pstep__d{background:var(--srv);border-color:var(--srv)}
.pstep.on .pstep__d{background:var(--amber);border-color:var(--amber);
  animation:blink .7s infinite}
.pstep.bad .pstep__d{background:var(--cli);border-color:var(--cli);animation:none}
.pstep__t{font-size:13.5px}
.pstep.done .pstep__t{font-weight:500}
.pstep__n{font-family:var(--mono);font-size:11px;color:var(--ink3)}
.pstep.bad .pstep__t{color:var(--cli)}
.pout{padding:14px;min-width:0}
.pout__t{font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink3);margin:0 0 8px}
.pout__t + .pout__t{margin-top:20px}
.mv{border:1px solid var(--rule);background:var(--card)}
.mv table{width:100%;border-collapse:collapse;table-layout:fixed}
.mv th{font-family:var(--disp);font-weight:600;font-size:9.5px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);text-align:left;
  padding:6px 9px;background:var(--sunk);border-bottom:1px solid var(--rule2)}
.mv td{font-size:12.5px;padding:7px 9px;border-bottom:1px solid var(--rule);
  overflow-wrap:anywhere}
.mv tr:last-child td{border-bottom:none}
.mv td.num,.mv th.r,.mv td.r{text-align:right}
.mv td.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.mv td.acc{font-family:var(--mono);font-weight:600;color:var(--srv)}
.mv tbody tr{animation:fadeUp .32s both;animation-delay:calc(var(--i) * 90ms)}
.mv--empty{padding:16px 12px;font-size:12.5px;color:var(--ink3);border:1px dashed var(--rule2);
  background:var(--sunk)}
.pbal{display:flex;justify-content:space-between;gap:12px;align-items:baseline;flex-wrap:wrap;
  margin-top:12px;padding:10px 12px;border:1px solid var(--srv-line);background:var(--srv-bg)}
.pbal .l{font-size:12.5px;color:var(--srv)}
.pbal .v{font-family:var(--mono);font-weight:600;font-variant-numeric:tabular-nums;
  color:var(--srv)}
.perr{margin-top:12px;padding:10px 12px;border:1px solid #E0B7BA;background:#FAEDEE;
  color:var(--cli);font-size:13px}
.post__hint{padding:12px 14px;border-top:1px solid var(--rule2);background:var(--sunk);
  font-size:13px;color:var(--ink2)}
@media (min-width:860px){
  .post__grid{grid-template-columns:minmax(280px,.82fr) minmax(0,1.18fr)}
  .pipe{border-bottom:none;border-right:1px solid var(--rule)}
}

/* ── терминал: демонстрация командной строки ─────────────────────────── */
.term{border:1px solid var(--rule2);background:var(--deep);color:var(--deep-ink)}
.term__bar{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#0B1317;
  border-bottom:1px solid var(--deep-rule);font-family:var(--mono);font-size:10.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--deep-ink3)}
.term__bar .sp{flex:1}
.term__grid{display:grid;grid-template-columns:minmax(0,1fr)}
.term__side{border-bottom:1px solid var(--deep-rule);padding:8px 0;
  display:flex;overflow-x:auto;scrollbar-width:none}
.term__side::-webkit-scrollbar{display:none}
.term__side button{padding:7px 14px;font-family:var(--mono);font-size:12px;
  color:var(--deep-ink3);white-space:nowrap;border-left:2px solid transparent}
.term__side button:hover{color:var(--deep-ink2);background:#101B20}
.term__side button.on{color:var(--deep-ink);background:#101B20;font-weight:600;
  border-left-color:var(--deep-srv)}
.term__view{padding:14px 16px 18px;overflow-x:auto;-webkit-overflow-scrolling:touch;
  min-height:246px}
.tline{font-family:var(--mono);font-size:12.5px;line-height:1.85;white-space:pre}
.tline.dim{color:var(--deep-ink3)}
.tline.ok{color:var(--deep-srv)}
.tline.warn{color:#D9A441}
.tline.err{color:#E4707A}
.tline.out{animation:fadeUp .22s both}
.tprompt{font-family:var(--mono);font-size:12.5px;line-height:1.85;color:var(--deep-ink);
  white-space:pre-wrap;overflow-wrap:anywhere}
.tprompt b{color:var(--deep-srv);font-weight:600}
.caret{display:inline-block;width:7px;height:14px;background:var(--deep-srv);
  vertical-align:-2px;animation:blink .9s steps(1) infinite}
.texit{display:inline-block;margin-top:10px;font-family:var(--mono);font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;
  border:1px solid var(--deep-rule);color:var(--deep-ink2)}
.texit.ok{border-color:#2A6B69;background:#0F2E30;color:var(--deep-srv)}
.texit.err{border-color:#7A3B41;background:#33191D;color:#E4707A}
@media (min-width:780px){
  .term__grid{grid-template-columns:minmax(190px,.28fr) minmax(0,1fr)}
  .term__side{border-bottom:none;border-right:1px solid var(--deep-rule);
    display:block;overflow-x:visible}
  .term__side button{display:block;width:100%}
}
@media (prefers-reduced-motion:reduce){
  .caret,.tline.out{animation:none}
}

/* ── сцена: дизайнер → компоненты → форма → отчёт ─────────────────── */
.stage{border:1px solid var(--rule2);background:var(--card)}
.stage__rail{display:flex;overflow-x:auto;scrollbar-width:none;background:var(--sunk);
  border-bottom:1px solid var(--rule2)}
.stage__rail::-webkit-scrollbar{display:none}
.rstep{position:relative;flex:1 0 auto;min-width:132px;padding:11px 14px 12px;
  border-right:1px solid var(--rule);text-align:left}
.rstep:last-child{border-right:none}
.rstep__n{font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--ink3)}
.rstep__t{font-size:13px;color:var(--ink3);margin-top:3px;white-space:nowrap}
.rstep:hover .rstep__t{color:var(--ink2)}
.rstep.done .rstep__t{color:var(--ink2)}
.rstep.on{background:var(--card)}
.rstep.on .rstep__t{color:var(--ink);font-weight:500}
.rstep.on .rstep__n{color:var(--srv)}
.rstep::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;
  background:var(--srv)}
.rstep.done::after{width:100%}
.rstep.on::after{width:100%;animation:railFill var(--dur,7s) linear both}
@keyframes railFill{from{width:0}to{width:100%}}

.stage__vp{overflow:hidden}
.stage__track{display:flex;align-items:stretch;
  transition:transform .5s cubic-bezier(.22,.61,.36,1)}
.slide{flex:0 0 100%;min-width:100%;padding:16px;display:grid;gap:14px;align-content:start}
.slide__cap{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.slide__cap h3{font-size:17px}
.slide__cap p{font-size:13.5px;color:var(--ink2);flex:1;min-width:220px}
.slide__two{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-items:start}
.stage__ctl{display:flex;align-items:center;gap:8px;padding:10px 14px;
  border-top:1px solid var(--rule2);background:var(--sunk)}
.stage__ctl .sp{flex:1}
/* Точка остаётся девятипиксельной, а нажимаемая область вокруг неё — 24px:
   меньше этого сенсорные цели не проходят проверку доступности. */
.dots{display:flex;gap:2px}
.dots button{width:24px;height:24px;display:grid;place-items:center;
  background:none;border:none;padding:0}
.dots button::before{content:"";width:9px;height:9px;
  border:1px solid var(--rule2);background:var(--card)}
.dots button.on::before{background:var(--srv);border-color:var(--srv)}

/* дерево метаданных и панель свойств */
.mtree{border:1px solid var(--rule);background:var(--card);padding:8px 0;
  font-size:13px;max-height:330px;overflow:auto}
.mnode{display:flex;align-items:center;gap:8px;padding:5px 12px;
  border-left:2px solid transparent;color:var(--ink2)}
.mnode.grp{font-family:var(--disp);font-weight:600;
  font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink3);
  padding-top:11px}
.mnode.on{background:var(--sel);color:var(--ink);border-left-color:var(--srv);font-weight:500}
.mnode .kk{font-family:var(--mono);font-size:9px;letter-spacing:.05em;color:var(--ink3);
  border:1px solid var(--rule2);padding:0 3px}
.props{border:1px solid var(--rule);background:var(--card)}
.props__h{padding:9px 12px;background:var(--sunk);border-bottom:1px solid var(--rule);
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink3)}
.prow{display:grid;grid-template-columns:minmax(94px,40%) minmax(0,1fr);gap:10px;
  padding:7px 12px;border-bottom:1px solid var(--rule);font-size:13px;align-items:baseline}
.prow:last-child{border-bottom:none}
.prow .l{color:var(--ink3);font-size:12.5px}
.prow .v{overflow-wrap:anywhere}
.prow .v.m{font-family:var(--mono);font-size:12px}

/* палитра компонентов */
.pal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;
  background:var(--rule);border:1px solid var(--rule)}
.pit{background:var(--card);padding:12px;display:grid;gap:7px;align-content:start}
.pit__t{font-size:13.5px;font-weight:500}
.pit__d{font-size:12px;color:var(--ink3)}
.pit__x{border:1px solid var(--rule);background:var(--sunk);padding:7px;display:grid;gap:4px}
.xbar{height:7px;background:var(--rule2)}
.xbar.t{background:var(--srv);width:42%}
.xrow{display:flex;gap:4px}
.xrow span{height:7px;background:var(--rule2);flex:1}

/* ОСВ */
.osv{border:1px solid var(--rule);background:var(--card);overflow-x:auto;
  -webkit-overflow-scrolling:touch}
.osv table{width:100%;border-collapse:collapse;min-width:560px}
.osv th{font-family:var(--disp);font-weight:600;font-size:9px;
  letter-spacing:.09em;text-transform:uppercase;color:var(--ink2);padding:6px 9px;
  background:var(--sunk);border-bottom:1px solid var(--rule2);text-align:right}
.osv th.l{text-align:left}
.osv th.g{border-left:1px solid var(--rule2)}
.osv td{font-size:12.5px;padding:6px 9px;border-bottom:1px solid var(--rule);text-align:right;
  font-family:var(--mono);font-variant-numeric:tabular-nums}
.osv td.l{text-align:left;font-family:"IBM Plex Sans"}
.osv td.acc{font-family:var(--mono);font-weight:600;color:var(--srv);text-align:left}
.osv td.g{border-left:1px solid var(--rule)}
.osv tfoot td{border-top:1px solid var(--rule2);border-bottom:none;font-weight:600;
  background:var(--sunk)}
.slide.on .osv tbody tr,.slide.on .prow,.slide.on .pit,.slide.on .fgrid .f{
  animation:fadeUp .34s both;animation-delay:calc(var(--i) * 55ms + 90ms)}
.rep__bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:9px 11px;
  border:1px solid var(--rule);border-bottom:none;background:var(--sunk);font-size:12.5px}
.rep__bar .f{display:flex;align-items:baseline;gap:6px}
.rep__bar .f b{font-weight:400;color:var(--ink3);font-size:12px}
.rep__bar .f span{font-family:var(--mono);font-size:12px}
@media (min-width:820px){
  .slide__two{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:14px}
  .pal{grid-template-columns:repeat(3,minmax(0,1fr))}
  .slide{padding:18px}
}
@media (prefers-reduced-motion:reduce){
  .stage__track{transition:none}
  .rstep.on::after{animation:none;width:100%}
  .slide.on .osv tbody tr,.slide.on .prow,.slide.on .pit,.slide.on .fgrid .f{animation:none}
}

/* ── модули ──────────────────────────────────────────────────────────── */
.mods{border:1px solid var(--rule2);background:var(--card)}
.mods__grid{display:grid;grid-template-columns:minmax(0,1fr)}
.mods__rail{display:flex;overflow-x:auto;scrollbar-width:none;background:var(--sunk);
  border-bottom:1px solid var(--rule2)}
.mods__rail::-webkit-scrollbar{display:none}
.mods__rail button{flex:0 0 auto;padding:11px 15px;font-size:13.5px;color:var(--ink3);
  white-space:nowrap;border-right:1px solid var(--rule);border-left:2px solid transparent}
.mods__rail button:hover{color:var(--ink2);background:var(--hover)}
.mods__rail button.on{background:var(--card);color:var(--ink);font-weight:500;
  box-shadow:inset 0 2px 0 var(--srv)}
.mods__body{padding:16px;display:grid;gap:16px;align-content:start;min-width:0}
.mods__head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.mods__head h3{font-size:19px}
.mods__d{font-size:14.5px;color:var(--ink2);max-width:74ch}
.mgrp{display:grid;gap:7px}
.mgrp__t{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink3)}
.mgrp .chips .chip{font-family:var(--mono);font-size:11px;padding:5px 9px;
  letter-spacing:.02em;text-transform:none}
.mods__cols{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.demo{border:1px solid var(--rule);background:var(--card)}
.demo__h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding:10px 12px;
  background:var(--sunk);border-bottom:1px solid var(--rule);font-size:13px}
.demo__h b{font-weight:500}
.demo__h .f{font-family:var(--mono);font-size:12px;color:var(--ink3)}
.demo__h .f i{font-style:normal;color:var(--ink)}
.demo table{width:100%;border-collapse:collapse;table-layout:fixed}
.demo th{font-family:var(--disp);font-weight:600;font-size:9px;
  letter-spacing:.09em;text-transform:uppercase;color:var(--ink2);text-align:right;
  padding:6px 9px;border-bottom:1px solid var(--rule2);line-height:1.3}
.demo th.l{text-align:left}
.demo td{font-size:12.5px;padding:6px 9px;border-bottom:1px solid var(--rule);text-align:right;
  font-family:var(--mono);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.demo td.l{text-align:left;font-family:"IBM Plex Sans"}
.demo tr:last-child td{border-bottom:none}
.demo tr.gap td{color:var(--ink3);text-align:center;font-family:var(--mono)}
.demo tr.last td{background:var(--amber-bg);color:var(--amber);font-weight:600}
.demo tbody tr{animation:fadeUp .3s both;animation-delay:calc(var(--i) * 55ms)}
.demo__n{padding:11px 12px;border-top:1px solid var(--rule);background:var(--sunk);
  font-size:13px;color:var(--ink2)}
.par{display:grid;grid-template-columns:minmax(0,1fr);gap:1px;background:var(--rule)}
.par__c{background:var(--card);padding:12px}
.par__t{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink3);margin-bottom:9px}
.par__r{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:9px;align-items:baseline;
  padding:6px 0;border-bottom:1px solid var(--rule);font-size:12.5px}
.par__r:last-of-type{border-bottom:none}
.par__r .a{font-family:var(--mono);font-weight:600;color:var(--srv)}
.par__r .v{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right}
.par__s{display:flex;justify-content:space-between;gap:10px;margin-top:8px;padding-top:8px;
  border-top:1px solid var(--rule2);font-size:12.5px}
.par__s .v{font-family:var(--mono);font-weight:600;font-variant-numeric:tabular-nums}
@media (min-width:900px){
  .mods__cols{grid-template-columns:repeat(3,minmax(0,1fr))}
  .par{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mods__body{padding:18px}
}

/* ── бот: переписка и каскад источников ──────────────────────────────── */
.bot{border:1px solid var(--rule2);background:var(--card)}
.bot__ctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 14px;
  background:var(--sunk);border-bottom:1px solid var(--rule2)}
.bot__ctl .sp{flex:1}
.bot__grid{display:grid;grid-template-columns:minmax(0,1fr)}
.chat{padding:14px;display:grid;gap:9px;align-content:start;min-height:352px;
  max-height:440px;overflow-y:auto;scroll-behavior:smooth;
  border-bottom:1px solid var(--rule)}
.bub{max-width:88%;border:1px solid var(--rule);background:var(--card);padding:9px 11px;
  font-size:13.5px;line-height:1.55;opacity:0;transform:translateY(10px);
  transition:opacity .45s cubic-bezier(.22,.61,.36,1),
             transform .45s cubic-bezier(.22,.61,.36,1)}
.bub.in{opacity:1;transform:none}
.bub--me{justify-self:end;background:var(--srv-bg);border-color:var(--srv-line);color:#0A4F4F}
.bub__f{display:grid;gap:0;margin-top:8px;border-top:1px solid var(--rule);padding-top:6px}
.bub__r{display:grid;grid-template-columns:minmax(92px,42%) minmax(0,1fr) auto;gap:8px;
  align-items:baseline;padding:4px 0;border-bottom:1px solid var(--rule);font-size:12.5px;
  opacity:0;transform:translateY(6px);
  transition:opacity .38s ease,transform .38s ease;
  transition-delay:calc(var(--i) * 70ms + 160ms)}
.bub.in .bub__r{opacity:1;transform:none}
.bub__r:last-child{border-bottom:none}
.bub__r .l{color:var(--ink3)}
.bub__r .v{font-family:var(--mono);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.bub__att{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;
  color:var(--ink2)}
.bub__att i{display:block;width:26px;height:32px;border:1px solid var(--rule2);
  background:var(--sunk);flex:0 0 auto}
.typing{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--ink3);
  font-family:var(--mono);opacity:0;max-height:0;overflow:hidden;
  transition:opacity .25s ease,max-height .25s ease}
.typing.on{opacity:1;max-height:28px}
.typing b{display:flex;gap:3px}
.typing b span{width:5px;height:5px;background:var(--ink3);display:block;
  animation:blink 1s infinite}
.typing b span:nth-child(2){animation-delay:.15s}
.typing b span:nth-child(3){animation-delay:.3s}
.casc{padding:14px}
.casc__t{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink3);margin-bottom:10px}
.cst{display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:10px;align-items:baseline;
  /* то же, что и у ступеней проведения: строка въезжает, но не выцветает —
     иначе подпись оказывается нечитаемой, пока каскад не дошёл до неё */
  padding:9px 0;border-bottom:1px solid var(--rule);transform:translateX(-5px);
  transition:transform .42s ease,color .42s ease}
.cst__t{color:var(--ink2)}
.cst.hit .cst__t,.cst.miss .cst__t{color:var(--ink)}
.cst:last-child{border-bottom:none}
.cst.seenc{transform:none}
.cst__d{transition:background .3s ease,border-color .3s ease}
.cst__d{width:10px;height:10px;border:1px solid var(--rule2);background:var(--card);
  justify-self:center}
.cst.hit .cst__d{background:var(--srv);border-color:var(--srv)}
.cst.miss .cst__d{background:var(--cli);border-color:var(--cli)}
.cst__t{font-size:13.5px}
.cst.hit .cst__t{font-weight:500}
.cst__n{font-size:12px;color:var(--ink3);grid-column:2;margin-top:-4px}
.cst__s{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink3)}
.cst.hit .cst__s{color:var(--srv)}
.cst.miss .cst__s{color:var(--cli)}
@media (min-width:860px){
  .bot__grid{grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr)}
  .chat{border-bottom:none;border-right:1px solid var(--rule)}
}
@media (prefers-reduced-motion:reduce){
  .bub,.bub__r,.cst,.typing{transition:none;opacity:1;transform:none}
  .typing{max-height:28px}
  .typing b span{animation:none}
  .chat{scroll-behavior:auto}
}

/* ── ассистент ───────────────────────────────────────────────────────── */
.asst{border:1px solid var(--rule2);background:var(--card)}
.asst__tabs{display:flex;overflow-x:auto;scrollbar-width:none;background:var(--sunk);
  border-bottom:1px solid var(--rule2)}
.asst__tabs::-webkit-scrollbar{display:none}
.asst__tabs button{flex:0 0 auto;display:flex;align-items:baseline;gap:8px;padding:11px 15px;
  font-size:13.5px;color:var(--ink3);white-space:nowrap;border-right:1px solid var(--rule)}
.asst__tabs button:hover{background:var(--hover);color:var(--ink2)}
.asst__tabs button.on{background:var(--card);color:var(--ink);font-weight:500;
  box-shadow:inset 0 2px 0 var(--srv)}
.asst__tabs .fk{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;
  border:1px solid var(--rule2);padding:1px 4px;color:var(--ink3)}
.asst__grid{display:grid;grid-template-columns:minmax(0,1fr)}
.asst__main{padding:16px;min-width:0;min-height:360px}
.asst__side{padding:16px;background:var(--sunk);border-top:1px solid var(--rule)}
.aq{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:baseline;
  padding:11px 12px;border:1px solid var(--srv-line);background:var(--srv-bg);color:#0A4F4F;
  font-size:14.5px;line-height:1.5}
.aq__k{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--srv)}
.aq .caret{background:var(--srv);height:15px}
.think{display:flex;align-items:center;gap:8px;margin-top:14px;font-family:var(--mono);
  font-size:12px;color:var(--ink3)}
.think b{display:flex;gap:3px}
.think b span{width:5px;height:5px;background:var(--srv);display:block;animation:blink 1s infinite}
.think b span:nth-child(2){animation-delay:.15s}
.think b span:nth-child(3){animation-delay:.3s}
.aans{margin-top:14px;display:grid;gap:10px}
.aans p{font-size:14.5px;line-height:1.6;animation:fadeUp .35s both;
  animation-delay:calc(var(--i) * 110ms)}
.acc{font-family:var(--mono);font-weight:600;color:var(--srv);
  border-bottom:1px solid var(--srv-line)}
.averd{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:4px}
.averd div{background:var(--card);padding:9px 11px;font-size:13px;display:grid;
  grid-template-columns:16px minmax(0,1fr);gap:9px;align-items:baseline;
  animation:fadeUp .3s both}
.averd .m{font-family:var(--mono);font-weight:600}
.averd .ok .m{color:var(--srv)}
.averd .bad .m{color:var(--cli)}
.averd .bad{background:#FAEDEE}
.atool{display:grid;grid-template-columns:14px minmax(0,1fr);gap:10px;padding:9px 0;
  border-bottom:1px solid var(--rule);animation:fadeUp .28s both}
.atool:last-of-type{border-bottom:none}
.atool__d{width:8px;height:8px;background:var(--amber);justify-self:center;margin-top:5px;
  animation:blink .7s infinite}
.atool.done .atool__d{background:var(--srv);animation:none}
.atool__n{font-family:var(--mono);font-size:12.5px;font-weight:600}
.atool__p{font-family:var(--mono);font-size:11.5px;color:var(--ink3);overflow-wrap:anywhere;
  margin-top:2px}
.atool__m{font-family:var(--mono);font-size:10.5px;color:var(--srv);margin-top:3px}
.asst__none{font-size:13px;color:var(--ink3);padding:9px 0}
.kb{display:flex;justify-content:space-between;gap:10px;margin-top:14px;padding-top:11px;
  border-top:1px solid var(--rule2);font-family:var(--mono);font-size:11px;color:var(--ink3)}
.kb b{color:var(--ink2);font-weight:600}
.never{margin-top:14px}
.never .chip{border-color:#E0B7BA;background:#FAEDEE;color:var(--cli);text-transform:none;
  font-family:"IBM Plex Sans";letter-spacing:0;font-size:11.5px}
.cta{margin-top:26px;border:1px solid var(--srv);background:var(--srv);color:#fff;
  padding:clamp(20px,3vw,30px);display:grid;gap:14px}
.cta h3{color:#fff;font-size:clamp(20px,2.6vw,28px);font-weight:600}
.cta p{font-size:15px;color:#CFE6E4;max-width:66ch}
.cta__b{display:flex;gap:10px;flex-wrap:wrap;margin-top:2px}
.cta__b a,.cta__b button{display:inline-flex;align-items:center;padding:12px 20px;
  font-size:15px;font-weight:500;background:#fff;color:var(--srv);border:1px solid #fff}
.cta__b .gh{background:transparent;color:#fff;border-color:#5FA9A6;font-weight:400}
.cta__b .gh:hover{border-color:#fff}
@media (min-width:900px){
  .asst__grid{grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr)}
  .asst__side{border-top:none;border-left:1px solid var(--rule)}
}
@media (prefers-reduced-motion:reduce){
  .aans p,.atool,.averd div{animation:none}
  .think b span,.atool__d{animation:none}
}

.note{margin-top:18px;padding:14px 16px;border:1px solid var(--rule2);background:var(--card);
  font-size:14px;color:var(--ink2)}
.note b{color:var(--ink);font-weight:600}

/* ── карточки / сетки ────────────────────────────────────────────────── */
.cards{display:grid;grid-template-columns:minmax(0,1fr);gap:1px;background:var(--rule);
  border:1px solid var(--rule)}
.card{background:var(--card);padding:24px 22px 26px;display:grid;gap:10px;
  align-content:start}
.band--deep .cards{background:var(--deep-rule);border-color:var(--deep-rule)}
.band--deep .card{background:var(--deep2)}
.card__k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--srv)}
.band--deep .card__k{color:var(--deep-srv)}
.card p{font-size:14.5px;color:var(--ink2)}
.band--deep .card p{color:var(--deep-ink2)}

.chips{display:flex;flex-wrap:wrap;gap:7px}
.chips .chip{font-size:11px;padding:5px 9px;letter-spacing:.05em;text-transform:none;
  font-family:var(--mono)}

/* ── продукт ─────────────────────────────────────────────────────────── */
.prod{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(24px,4vw,52px);
  align-items:start}
.prod__head{display:grid;gap:16px;align-content:start}
.prod__mark{display:flex;align-items:baseline;gap:11px;flex-wrap:wrap}
.prod__mark strong{font-family:var(--disp);font-weight:700;
  font-size:clamp(28px,3.6vw,42px);letter-spacing:-.01em}
.flist{display:grid;gap:0;border-top:1px solid var(--rule)}
@media (min-width:1000px){
  .flist--wide{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:26px}
  .flist--wide .fitem{grid-template-columns:minmax(0,1fr)}
}
.band--deep .flist{border-color:var(--deep-rule)}
.fitem{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:15px 0;
  border-bottom:1px solid var(--rule)}
.band--deep .fitem{border-color:var(--deep-rule)}
.fitem h3{font-size:16px}
.fitem p{font-size:14.5px;color:var(--ink2)}
.band--deep .fitem p{color:var(--deep-ink2)}

/* ── таблица техстека ────────────────────────────────────────────────── */
.spec{width:100%;border-collapse:collapse;border:1px solid var(--rule);background:var(--card)}
.spec th{font-family:var(--disp);font-weight:600;font-size:10px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ink2);text-align:left;
  padding:10px 14px;background:var(--sunk);border-bottom:1px solid var(--rule2)}
.spec td{padding:11px 14px;border-bottom:1px solid var(--rule);font-size:14px;
  vertical-align:top}
.spec tr:last-child td{border-bottom:none}
.spec td.k{font-family:var(--mono);font-size:12.5px;color:var(--ink);white-space:nowrap}
.spec td.d{color:var(--ink2)}

/* ── этапы внедрения ─────────────────────────────────────────────────── */
.steps{display:grid;grid-template-columns:minmax(0,1fr);gap:1px;background:var(--rule);
  border:1px solid var(--rule)}
.step{background:var(--card);padding:22px;display:grid;gap:9px;align-content:start}
.step__n{font-family:var(--mono);font-size:12px;color:var(--srv);font-weight:600;
  letter-spacing:.1em}
.step p{font-size:14.5px;color:var(--ink2)}
.step__t{font-family:var(--mono);font-size:11px;color:var(--ink3)}

/* ── форма записи на демонстрацию ────────────────────────────────────── */
/* Форма запроса демо раскрывается ссылкой #demo, поэтому работает и без JS.
   Класс dform--on ставит сервер (после отклонённой отправки или на странице
   подтверждения) и скрипт — когда открывает форму, не уходя по ссылке. */
.dform{border:1px solid var(--deep-rule);gap:0;overflow:hidden;display:none}
.dform:target,.dform--on{display:grid}
.contact:has(.dform:target) .openb-w,
.contact:has(.dform--on) .openb-w{display:none}
/* приманка для ботов: человек её не видит, а display:none такие поля
   выдаёт — боты их пропускают, поэтому убираем за пределы экрана */
.hp{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.dform__h{padding:13px 18px;border-bottom:1px solid var(--deep-rule);background:#0B1317;
  font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--deep-ink3)}
.dform__b{padding:18px;display:grid;gap:14px;animation:fadeUp .35s both}
.fld{display:grid;gap:6px}
.fld label{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--deep-ink3)}
.fld input,.fld select{width:100%;padding:12px 12px;background:#0B1317;color:var(--deep-ink);
  border:1px solid var(--deep-rule);font-family:"IBM Plex Sans";font-size:16px}
.fld input::placeholder{color:#3F5760}
.fld input:focus,.fld select:focus{outline:none;border-color:var(--deep-srv)}
.fld.bad input{border-color:#8C4249}
.fld__e{font-size:12.5px;color:#E4707A}
.dform__n{font-size:13.5px;color:var(--deep-ink2);line-height:1.55;
  border-left:2px solid var(--deep-srv);padding-left:12px}
.dform__s button{padding:12px 22px;background:var(--deep-srv);color:#062726;
  border:1px solid var(--deep-srv);font-weight:600;font-size:15px}
.dform__s button:hover{background:#57C7C0;border-color:#57C7C0}
/* ответ сервера: превышен лимит заявок или отправка не удалась */
.dform__e{font-size:13px;color:#E4707A;line-height:1.5;
  border:1px solid rgba(228,112,122,.4);padding:9px 11px}
.dform__s button[disabled]{opacity:.55;cursor:default}
.dform__s button[disabled]:hover{background:var(--deep-srv);border-color:var(--deep-srv)}
.dform__ok{padding:22px 18px;display:grid;gap:10px;animation:fadeUp .4s both}
.dform__ok h3{color:var(--deep-srv);font-size:20px}
.dform__ok p{font-size:14.5px;color:var(--deep-ink2);max-width:52ch}
.dform__ok .tick{width:26px;height:26px;border:2px solid var(--deep-srv);
  display:grid;place-items:center;color:var(--deep-srv);font-family:var(--mono);
  animation:sweepIn .45s both}
.dform__ok a{justify-self:start;margin-top:4px;font-size:13.5px;color:var(--deep-ink3);
  border-bottom:1px solid var(--deep-rule);padding-bottom:2px}
.dform__ok a:hover{color:var(--deep-ink)}
.openb{display:inline-flex;align-items:center;gap:9px;padding:13px 22px;
  background:var(--deep-srv);color:#062726;border:1px solid var(--deep-srv);
  font-weight:600;font-size:15px}
.openb:hover{background:#57C7C0;border-color:#57C7C0}
@media (prefers-reduced-motion:reduce){
  .dform__b,.dform__ok,.dform__ok .tick{animation:none}
}

/* ── контакты / подвал ───────────────────────────────────────────────── */
.contact{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(24px,4vw,44px);
  align-items:start}
.foot{border-top:1px solid var(--deep-rule);padding:22px 0 34px;font-size:13px;
  color:var(--deep-ink3);display:flex;gap:18px;flex-wrap:wrap;justify-content:space-between}

/* ── движение ────────────────────────────────────────────────────────────
   Три момента, и больше нигде: загрузка героя, появление секций при
   скролле и «пересборка» формы при смене конфигурации или языка.       */
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes sweepIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes blink{50%{opacity:.25}}

.rv{opacity:0;transform:translateY(10px);
  transition:opacity .55s ease,transform .55s ease;
  transition-delay:calc(var(--d,0) * 55ms)}
.rv.seen{opacity:1;transform:none}

.hero__copy > *{animation:fadeUp .6s both;animation-delay:calc(var(--i,0) * 90ms + 80ms)}
.hero__demo{animation:fadeUp .7s both;animation-delay:.42s}

/* пересборка формы: строки метаданных слева, поля и строки таблицы справа */
.anim .yline{animation:fadeUp .3s both;animation-delay:calc(var(--i) * 20ms)}
.anim .appform .f{animation:fadeUp .34s both;animation-delay:calc(var(--i) * 45ms + 150ms)}
.anim .appform tbody tr{animation:fadeUp .34s both;
  animation-delay:calc(var(--i) * 55ms + 330ms)}
.anim .appform__b{animation:fadeUp .3s both;animation-delay:calc(var(--i) * 40ms + 60ms)}
.sweep{height:2px;background:var(--srv);transform-origin:left;margin-bottom:12px}
.anim .sweep{animation:sweepIn .55s cubic-bezier(.22,.61,.36,1) both}
.pane-yaml__cap .live{color:var(--deep-srv);animation:blink 1.1s 2}

/* наведение: подсказка, что элемент живой, без лишнего шума */
.card{transition:background .18s}
.card:hover{background:var(--hover)}
.band--deep .card:hover{background:#18303A}
.fitem{transition:padding-left .18s,border-color .18s}
.fitem h3{transition:color .18s}
.fitem:hover h3{color:var(--srv)}
.band--deep .fitem:hover h3{color:var(--deep-srv)}
.spec tbody tr{transition:background .15s}
.spec tbody tr:hover{background:var(--sunk)}

/* ── адаптив ─────────────────────────────────────────────────────────── */
@media (max-width:1099px){
  .brand__c{display:none}
}
@media (max-width:639px){
  .appform__b,.seg button,.swap__tab,.code__tab,.mods__rail button,
  .term__side button,.asst__tabs button{min-height:40px}
  .btn,.openb,.navcta{min-height:44px}
  .hero__cta .btn{flex:1 1 100%;justify-content:center}
  .stage__ctl,.post__ctl,.bot__ctl{gap:7px}
  .wrap{padding:0 16px}
  .osv table{min-width:520px}
}
@media (min-width:720px){
  .stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .stat{border-right:1px solid var(--rule);border-bottom:none}
  .stat:last-child{border-right:none}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fitem{grid-template-columns:minmax(200px,34%) minmax(0,1fr);gap:18px;align-items:baseline}
}
@media (min-width:1000px){
  .hero__grid{grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
    gap:clamp(28px,3.6vw,52px);align-items:stretch}
  .hero__demo{grid-column:1 / -1}
}
@media (min-width:940px){
  .swap__body{grid-template-columns:minmax(0,1fr) minmax(420px,1fr)}
  .pane-yaml{min-height:498px}
  .pane-yaml{border-bottom:none;border-right:1px solid var(--rule2)}
}
@media (min-width:1000px){
  .cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cards--4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .steps{grid-template-columns:repeat(4,minmax(0,1fr))}
  .prod{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr)}
  .contact{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none;transition:none}
  .hero__copy > *,.hero__demo,.anim .yline,.anim .appform .f,
  .anim .appform tbody tr,.anim .appform__b,.sweep,.pane-yaml__cap .live{animation:none}
  .sweep{transform:none}
  *{transition-duration:.01ms!important}
}