:root{
  color-scheme: light dark;
  --paper:#FFFFFF;
  --surface:#F8F5FD;
  --panel:#FFFFFF;
  --line:#E6E1F0;
  --line-soft:#F0ECF8;
  --grid:rgba(30,26,36,.045);
  --ink:#14101F;
  --mute:#5B5470;
  --faint:#6B6382;   /* 4.90:1 на фоне с бликом rgb(247,235,254); было #736B8A = 4.35, провал */
  --brand:#6A2FDF;
  --on-brand:#FFFFFF;
  --tint:#EAE0FC;
  --tint-2:#F5EFFE;
  --ok:#0E7C5A;
  --ok-bg:#E1F4EC;
  --warn:#8A5A00;
  --warn-bg:#FBF0DC;
  --cta-a:#6A2FDF; --cta-b:#2D2570; --cta-ink:#FFFFFF; --cta-soft:rgba(255,255,255,.86);
  --wash:rgba(215,153,251,.20);
  --wash-2:rgba(106,47,223,.07);
  --deep:#2D2570;
  --shadow:0 1px 2px rgba(30,26,36,.04), 0 18px 44px -28px rgba(45,37,112,.42);
  --maxw:1180px;
  --r:12px;
  --f-display:-apple-system,"SF Pro Display","Segoe UI Variable Display","Segoe UI","Helvetica Neue",Arial,sans-serif;
  --f-body:-apple-system,"SF Pro Text","Segoe UI","Helvetica Neue",Arial,sans-serif;
  --f-mono:ui-monospace,"SF Mono","JetBrains Mono","Roboto Mono",Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#0B0813; --surface:#120D1E; --panel:#171029;
    --line:#2A2140; --line-soft:#211A33; --grid:rgba(233,226,246,.05);
    --ink:#E9E2F6; --mute:#9A93AE; --faint:#948CA8;
    --brand:#A98BFF; --on-brand:#0B0813; --tint:#2A1F52; --tint-2:#1B1330;
    --wash:rgba(106,47,223,.30); --wash-2:rgba(215,153,251,.07); --deep:#3A2D78;
  --cta-a:#2A1F52; --cta-b:#241A47; --cta-ink:#FFFFFF; --cta-soft:rgba(255,255,255,.80);
    --ok:#5FD3A6; --ok-bg:#0F2A22; --warn:#E0B060; --warn-bg:#2A2113;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 18px 44px -28px rgba(0,0,0,.85);
  }
}
:root[data-theme="dark"]{
  --paper:#0B0813; --surface:#120D1E; --panel:#171029;
  --line:#2A2140; --line-soft:#211A33; --grid:rgba(233,226,246,.05);
  --ink:#E9E2F6; --mute:#9A93AE; --faint:#948CA8;
  --brand:#A98BFF; --on-brand:#0B0813; --tint:#2A1F52; --tint-2:#1B1330;
  --wash:rgba(106,47,223,.30); --wash-2:rgba(215,153,251,.07); --deep:#3A2D78;
  --cta-a:#2A1F52; --cta-b:#241A47; --cta-ink:#FFFFFF; --cta-soft:rgba(255,255,255,.80);
  --ok:#5FD3A6; --ok-bg:#0F2A22; --warn:#E0B060; --warn-bg:#2A2113;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 18px 44px -28px rgba(0,0,0,.85);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
/* Фон: не сетка. Мягкий свет, исходящий из дуги оголовья — мотив логотипа. */
body{
  margin:0;background:var(--paper);
  background-image:
    radial-gradient(120% 62% at 82% -12%, var(--wash) 0%, transparent 58%),
    radial-gradient(90% 50% at 8% 4%, var(--wash-2) 0%, transparent 62%);
  background-repeat:no-repeat;background-attachment:fixed;
  color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
h1,h2,h3{font-family:var(--f-display);font-weight:800;letter-spacing:-.03em;line-height:1.05;margin:0;text-wrap:balance}
h1{font-size:clamp(2.1rem,1.4rem + 3.2vw,3.6rem)}
h2{font-size:clamp(1.6rem,1.2rem + 1.5vw,2.4rem)}
h3{font-size:clamp(1.05rem,.95rem + .45vw,1.28rem);font-weight:700}
p{margin:0}
a{color:inherit}
.mono{font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);display:inline-flex;align-items:center;gap:8px}
.mono::before{
  content:"";width:15px;height:8px;flex:none;
  border:1.6px solid var(--brand);border-bottom:0;
  border-radius:15px 15px 0 0;
  transform:translateY(1px);
}
.lede{color:var(--mute);font-size:clamp(1rem,.96rem + .25vw,1.13rem);max-width:66ch}
.small{font-size:.9rem;color:var(--mute)}
.stack{display:flex;flex-direction:column;gap:16px}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.g2,.g3{grid-template-columns:1fr}}
section{padding:clamp(50px,6vw,86px) 0}
section.band{background:var(--surface);border-radius:28px;margin:0 14px}
@media (max-width:640px){section.band{margin:0 6px;border-radius:20px}}

/* шапка */
.top{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--paper) 86%,transparent);backdrop-filter:blur(14px);border-bottom:0;box-shadow:0 1px 0 var(--line-soft)}
.top__in{max-width:var(--maxw);margin:0 auto;padding:11px 22px;display:flex;align-items:center;gap:18px}
.logo{display:inline-flex;align-items:center;gap:9px;text-decoration:none;font-family:var(--f-display);font-weight:800;letter-spacing:-.02em;font-size:19px;color:var(--ink)}
.logo svg{width:19px;height:21px;color:var(--brand);flex:none}
.top nav{display:flex;gap:16px;margin-left:10px}
.top nav a{text-decoration:none;color:var(--mute);font-size:.92rem;white-space:nowrap}
.top nav a:hover{color:var(--ink)}
.top__r{margin-left:auto;display:flex;align-items:center;gap:10px}
.langw{position:relative}
.langb{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 11px;background:var(--tint-2);border:0;border-radius:999px;color:var(--mute);font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;line-height:1;cursor:pointer}
.langb:hover{color:var(--ink)}
.langb .chev{transition:transform .16s ease}
.langb[aria-expanded="true"]{color:var(--ink);border-color:var(--brand)}
.langb[aria-expanded="true"] .chev{transform:rotate(180deg)}
.langm{position:absolute;top:calc(100% + 8px);right:0;z-index:40;min-width:190px;display:none;flex-direction:column;padding:6px;background:var(--panel);border:0;border-radius:16px;box-shadow:var(--shadow)}
.langm.is-open{display:flex}
.langm a{display:flex;align-items:center;gap:10px;height:40px;padding:0 12px;border-radius:999px;text-decoration:none;color:var(--mute);font-size:.9rem}
.langm a:hover,.langm a:focus-visible{background:var(--tint-2);color:var(--ink)}
.langm a[aria-current="page"]{background:var(--tint);color:var(--brand);font-weight:600}
.langm .c{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;width:22px;flex:none}
.langm .ok{margin-left:auto;flex:none}
.tbtn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:var(--tint-2);border:0;border-radius:999px;color:var(--mute);cursor:pointer}
.tbtn:hover{color:var(--ink)}
.tbtn .sun{display:none}
:root[data-theme="dark"] .tbtn .sun{display:block}
:root[data-theme="dark"] .tbtn .moon{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--brand);color:var(--on-brand);text-decoration:none;border:0;border-radius:999px;padding:13px 24px;font-family:var(--f-display);font-weight:700;font-size:.98rem;cursor:pointer}
.btn.sm{padding:9px 14px;font-size:.85rem}
.btn.ghost{background:var(--tint);color:var(--brand);border:0}
.btn:hover{filter:brightness(1.06)}
.top__r .btn.sm{height:34px;padding-top:0;padding-bottom:0;white-space:nowrap}
@media (max-width:1120px){.top nav{gap:13px}.top nav a{font-size:.88rem}}
@media (max-width:1000px){.top nav{display:none}}
@media (max-width:640px){.hero__cta{flex-direction:column;align-items:stretch}.hero__cta .btn{width:100%}}
@media (max-width:560px){
  .top__in{padding:10px 14px;gap:8px}
  .top__r{gap:6px}
  .langb{height:36px;padding:0 8px;gap:5px}
  .tbtn{width:36px;height:36px}
  .top__r .btn.sm{height:36px;padding:0 12px;font-size:.8rem}
  .logo{font-size:17px}
  .langm{min-width:210px}
  .langm a{height:44px;font-size:.95rem}
}
@media (max-width:380px){
  .top__in{padding:10px 12px;gap:6px}
  .logo{font-size:16px}
  .logo svg{width:17px;height:19px}
  .top__r .btn.sm{padding:0 11px;font-size:.76rem}
}

/* первый экран */
.hero{padding:clamp(50px,6vw,90px) 0 clamp(38px,5vw,64px);border-top:0}
.hero h1{margin:14px 0 0}
.hero .lede{margin-top:18px}
.hero__cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.trust{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.pill{border:0;border-radius:999px;padding:8px 15px;font-size:.82rem;color:var(--mute);background:var(--tint-2)}

/* карточки */
/* Карточка: скруглением наследует чашку гарнитуры. Рамки нет — отделяет заливка. */
.card{background:var(--tint-2);border:0;border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:9px;transition:background .18s ease,box-shadow .18s ease}
.card .k{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;color:var(--brand)}
.card ul{margin:6px 0 0;padding-left:17px;color:var(--mute);font-size:.9rem;display:flex;flex-direction:column;gap:4px}
a.card{text-decoration:none}
a.card:hover{background:var(--panel);box-shadow:var(--shadow)}
.card .go{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;color:var(--brand);margin-top:auto;padding-top:12px}

/* услуги строками */
.rows{display:flex;flex-direction:column;gap:2px}
.row{display:grid;grid-template-columns:52px minmax(0,.9fr) minmax(0,1.4fr);gap:20px;align-items:start;
  padding:22px 24px;background:var(--panel);border:0;transition:background .18s ease}
.row:first-child{border-radius:18px 18px 4px 4px}
.row:last-child{border-radius:4px 4px 18px 18px}
.row:hover{background:var(--tint-2)}

.row .n{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;color:var(--brand);
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:22px;border-radius:999px;background:var(--tint)}
.row p{color:var(--mute);font-size:.93rem}
@media (max-width:760px){
  .row{grid-template-columns:34px 1fr;gap:8px 14px}
  .row p{grid-column:2}
}

/* таблица */
.tblwrap{overflow-x:auto;border:0;border-radius:18px;background:var(--panel);box-shadow:var(--shadow)}
.tbl{width:100%;border-collapse:collapse;font-size:.9rem}
.tbl th,.tbl td{text-align:left;padding:11px 16px;border-bottom:1px solid var(--line-soft);white-space:nowrap}
.tbl th{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--faint);font-weight:400;background:var(--surface)}
.tbl td{color:var(--mute)}
.tbl td:first-child{color:var(--ink);font-weight:600}
.tbl .n{font-family:var(--f-mono);font-variant-numeric:tabular-nums;color:var(--ink)}
.tbl tr:last-child td{border-bottom:0}

/* две колонки настройки */
.taskbox{background:var(--panel);border:0;border-radius:18px;box-shadow:var(--shadow);padding:26px;display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media (max-width:700px){.taskbox{grid-template-columns:1fr}}
.taskbox h3{margin-bottom:4px}
.taskbox ul{margin:0;padding-left:18px;color:var(--mute);font-size:.92rem;display:flex;flex-direction:column;gap:6px}

/* шаги */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;border:0;border-radius:18px;overflow:hidden;background:var(--tint-2)}
@media (max-width:900px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}
.step{padding:24px;background:var(--panel);border:0;display:flex;flex-direction:column;gap:8px}
.step .n{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;color:var(--brand)}
.step .t{font-family:var(--f-display);font-weight:700;font-size:1.02rem}

/* призыв */
.cta{background:linear-gradient(135deg,var(--cta-a),var(--cta-b));color:var(--cta-ink);border-radius:26px;padding:clamp(26px,4vw,42px);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:28px;align-items:center}
@media (max-width:800px){.cta{grid-template-columns:1fr}}
.cta h2{color:var(--cta-ink)}
.cta p{color:var(--cta-soft)}
.cta .btn{background:#FFFFFF;color:#5C27C9}
.cta .btn.alt{background:transparent;color:var(--cta-ink);border:1px solid rgba(255,255,255,.5)}
.cta .btnrow{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.cta form{display:flex;flex-direction:column;gap:9px}
.cta input,.cta textarea{border:0;border-radius:14px;padding:12px 14px;font-family:var(--f-body);font-size:.95rem;background:color-mix(in srgb,var(--paper) 94%,transparent);color:#14101F}
.cta textarea{min-height:82px;resize:vertical}

.trustbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:760px){.trustbar{grid-template-columns:1fr}}
.trustbar div{border:0;border-radius:18px;padding:20px;background:var(--panel);box-shadow:var(--shadow);font-size:.88rem;color:var(--mute)}
.trustbar b{display:block;color:var(--ink);font-family:var(--f-display);font-size:.98rem;margin-bottom:5px}

.foot{border-top:0;padding:40px 0 60px;color:var(--faint);font-size:.85rem}
.foot__in{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.foot .r{margin-left:auto;display:flex;gap:16px;flex-wrap:wrap}
.foot a{color:var(--mute);text-decoration:none}
.foot a:hover{color:var(--ink)}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ============ разговор с ИИ-агентом ============ */
/* Демо-звонок: кнопка + модалка с виджетом. Геометрия та же — капсулы и дуга. */
.talk{background:var(--panel);border:0;border-radius:22px;box-shadow:var(--shadow);
  padding:30px;display:flex;flex-direction:column;align-items:center;gap:15px;text-align:center}
.talk .arc{width:132px;height:78px;position:relative;flex:none;display:grid;place-items:end center}
.talk .arc::before{content:"";position:absolute;inset:0;
  border:2.5px solid var(--brand);border-bottom:0;border-radius:132px 132px 0 0;opacity:.32}
.talk .arc::after{content:"";position:absolute;left:14%;right:14%;top:16%;bottom:0;
  border:2.5px solid var(--brand);border-bottom:0;border-radius:100px 100px 0 0;opacity:.55}
.talk .arc i{width:15px;height:15px;border-radius:999px;background:var(--brand);
  position:relative;z-index:1;animation:tvpulse 2.4s ease-in-out infinite}
@keyframes tvpulse{0%,100%{opacity:.4;transform:scale(.82)}50%{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.talk .arc i{animation:none}}
.talk h3{font-size:1.28rem}
.talk .meta{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.btn .dot{width:8px;height:8px;border-radius:999px;background:currentColor;opacity:.9;animation:tvpulse 2.4s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.btn .dot{animation:none}}

.modal{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;
  padding:20px;background:rgba(20,16,31,.68);backdrop-filter:blur(5px)}
.modal.is-open{display:flex}
.modal__box{width:min(920px,100%);height:min(620px,86vh);background:#120D1E;border-radius:24px;
  overflow:hidden;display:flex;flex-direction:column;box-shadow:0 40px 90px -30px rgba(0,0,0,.8)}
.modal__bar{display:flex;align-items:center;gap:12px;padding:13px 18px;background:#1B1330;color:#E9E2F6;
  font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.modal__bar .x{margin-left:auto;background:rgba(233,226,246,.1);border:0;color:#E9E2F6;
  border-radius:999px;padding:7px 14px;cursor:pointer;font-family:inherit;font-size:11px}
.modal__bar .x:hover{background:rgba(233,226,246,.2)}
.modal__bar a{color:#A98BFF;text-decoration:none}
.modal iframe{flex:1;width:100%;border:0;background:#120D1E}

/* герой продуктовой страницы: текст слева, демо справа */
.phero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:44px;align-items:center}
@media (max-width:960px){.phero{grid-template-columns:1fr;gap:30px}}

/* ============ управление таблицей маршрутов ============ */
/* Переиспользует .chips/.chip/.tsearch таблицы DID — здесь только дельта:
   выключенное состояние контролов и карточки состояний с бейджем. */
.chip:disabled,.tsearch input:disabled{opacity:.45;cursor:not-allowed}
.tsearch.is-off{opacity:.6}
.tctl{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.tctl__n{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;color:var(--faint);margin-left:auto}
@media (max-width:560px){.tctl__n{margin-left:0}}

/* Состояния таблицы: загрузка, пусто, недоступно. Каждое видно и подписано. */
.tstate{background:var(--panel);border:0;border-radius:18px;box-shadow:var(--shadow);
  padding:clamp(24px,4vw,38px);display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.tstate h3{font-size:1.1rem}
.tstate p{color:var(--mute);font-size:.93rem;max-width:60ch;margin:0}
.tstate .badge{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;
  border-radius:999px;padding:5px 11px;background:var(--warn-bg);color:var(--warn)}
.tstate .badge.load{background:var(--tint-2);color:var(--faint)}
[hidden]{display:none !important}

/* панель фильтров и состояния живой таблицы DID */
.tfilter{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}
.chips{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;background:var(--tint-2);border-radius:999px}
.chip{border:0;border-radius:999px;padding:8px 15px;background:transparent;color:var(--mute);
  font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;line-height:1}
.chip:hover{color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--brand);color:var(--on-brand)}
.chip:focus-visible,.tsearch input:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.tsearch{display:flex;align-items:center;gap:8px;background:var(--tint-2);border-radius:999px;padding:0 14px;min-width:min(260px,100%)}
.tsearch svg{color:var(--faint);flex:none}
.tsearch input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);
  font-family:var(--f-body);font-size:.92rem;height:38px;padding:0}
.tsearch input::placeholder{color:var(--faint)}
/* обёртка таблицы не даёт странице ехать вбок: скролл живёт внутри неё */
.tblwrap{max-width:100%;min-width:0}
.tblstate{padding:30px 20px;color:var(--mute);font-size:.92rem;text-align:center}
.tblstate b{display:block;color:var(--ink);font-family:var(--f-display);font-size:1rem;margin-bottom:5px}
.tblnote{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;color:var(--faint);font-size:.84rem}
.tblnote .c{font-family:var(--f-mono);font-variant-numeric:tabular-nums;color:var(--mute)}

/* ============ доступность ============ */
/* Ссылка для клавиатуры: видна только при фокусе, уводит сразу к содержимому,
   минуя шапку с меню из пяти пунктов и двумя переключателями. */
.skip{position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--brand);color:#FFFFFF;padding:12px 20px;border-radius:0 0 999px 0;
  font-family:var(--f-display);font-weight:700;font-size:.95rem;text-decoration:none}
.skip:focus{left:0}
/* Метка в блоке призыва: раньше цвет был вписан в разметку как rgba(255,255,255,.75)
   и в тёмной теме давал 2.15:1 на светлом фиолетовом. Теперь берёт токен темы. */
.cta .cta-kicker{color:var(--cta-soft)}
.cta .cta-kicker::before{background:var(--cta-ink)}
/* Заголовок демо-карточки и заголовок внутри секции были h3 сразу после h1 —
   пропуск уровня для скринридера. Повышены до h2, кегль оставлен прежним. */
.talk h2{font-size:1.28rem;font-family:var(--f-display);font-weight:700;letter-spacing:-.02em;line-height:1.05;margin:0}