/* Сайт «Сонар Пульс» — стили. Основа — приёмы и цвета aisonar.ru (Сонар Хаб), окно продукта — вид текущего Пульса. */

@font-face{font-family:Rubik;font-weight:300 800;font-display:swap;src:url(fonts/rubik-cyrillic.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}
@font-face{font-family:Rubik;font-weight:300 800;font-display:swap;src:url(fonts/rubik-latin.woff2)format("woff2");unicode-range:U+0-FF,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Inter;font-weight:100 900;font-display:swap;src:url(fonts/inter-cyrillic.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}
@font-face{font-family:Inter;font-weight:100 900;font-display:swap;src:url(fonts/inter-latin.woff2)format("woff2");unicode-range:U+0-FF,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"JetBrains Mono";font-weight:100 800;font-display:swap;src:url(fonts/jetbrains_mono-cyrillic.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}
@font-face{font-family:"JetBrains Mono";font-weight:100 800;font-display:swap;src:url(fonts/jetbrains_mono-latin.woff2)format("woff2");unicode-range:U+0-FF,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ───────── Цвета: тёмная тема — по умолчанию ───────── */
:root{
  color-scheme:dark;
  --f-d:"Rubik","Inter",ui-sans-serif,system-ui,sans-serif;
  --f-b:"Inter",ui-sans-serif,-apple-system,system-ui,"Segoe UI",sans-serif;
  --f-m:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --b300:#c4b5fd;--b400:#a78bfa;--b500:#8b5cf6;--b600:#7c3aed;--b700:#6d28d9;
  --e-out:cubic-bezier(.22,.8,.36,1);
  --nav-h:64px;
  --win-top:32px;            /* где окно встаёт под шапкой */
  --win-end:664px;           /* низ вставшего окна + воздух до следующего блока */

  --base:#222028;
  --text:#f3f1f8;--text-2:rgba(243,241,248,.72);--muted:rgba(243,241,248,.56);
  --bd-s:rgba(255,255,255,.06);--bd:rgba(255,255,255,.11);--bd-x:rgba(196,181,253,.28);
  --hover:rgba(255,255,255,.08);
  --glass:rgba(50,48,56,.78);--card:rgba(50,48,56,.86);
  --glow-1:#5b21b6;--glow-2:#4c1d95;--glow-3:#7b3fc9;--glow-a:.36;
  --grid:rgba(243,241,248,.07);
  --shadow:0 40px 100px -40px rgba(0,0,0,.72),0 0 0 1px var(--bd-s);
  --accent:#c4b5fd;--logo:#c084fc;
  --grad:linear-gradient(100deg,#c4b5fd,#c084fc 60%,#ddd6fe);
  --warm:#fbbf24;--lost:#ff8a7a;--sig:#c4b5fd;--ok:#4ade80;
  --warm-bg:rgba(251,191,36,.14);--lost-bg:rgba(255,138,122,.14);--sig-bg:rgba(196,181,253,.14);--ok-bg:rgba(74,222,128,.12);

  --pw-bg:linear-gradient(135deg,#30353f,#191c22 48%,#30353f);
  --pw-side:rgba(37,43,56,.55);
  --pw-card:rgba(79,87,103,.24);--pw-card-bd:rgba(225,232,245,.12);--pw-edge:rgba(255,255,255,.10);
  --pw-t1:#f1f3f7;--pw-t2:#c9ced8;--pw-t3:#98a0ae;
  --pw-act:rgba(255,255,255,.12);--pw-sunken:rgba(0,0,0,.2);--pw-track:rgba(255,255,255,.14);
}
:root[data-theme="light"]{
  color-scheme:light;
  --base:#f7f6fb;
  --text:#17102a;--text-2:#4a3a6e;--muted:#6f6390;
  --bd-s:rgba(124,58,237,.08);--bd:rgba(52,36,92,.14);--bd-x:rgba(52,36,92,.3);
  --hover:rgba(124,58,237,.07);
  --glass:rgba(255,255,255,.74);--card:#fff;
  --glow-1:#ddd6fe;--glow-2:#c4b5fd;--glow-3:#c084fc;--glow-a:.42;
  --grid:rgba(23,16,42,.085);
  --shadow:0 30px 80px -40px rgba(109,40,217,.38),0 0 0 1px var(--bd-s);
  --accent:#7c3aed;--logo:#8b5cf6;
  --grad:linear-gradient(100deg,#6d28d9,#a855f7 60%,#7c3aed);
  --warm:#a64d08;--lost:#c8232c;--sig:#7c3aed;--ok:#14783a;
  --warm-bg:rgba(217,119,6,.12);--lost-bg:rgba(229,72,77,.10);--sig-bg:rgba(124,58,237,.10);--ok-bg:rgba(22,163,74,.10);

  --pw-bg:linear-gradient(135deg,#f6f7fb,#eaecf3 48%,#f6f7fb);
  --pw-side:rgba(255,255,255,.62);
  --pw-card:rgba(255,255,255,.78);--pw-card-bd:rgba(30,36,60,.10);--pw-edge:rgba(255,255,255,.9);
  --pw-t1:#1a1e2b;--pw-t2:#454c5e;--pw-t3:#596074;
  --pw-act:rgba(124,58,237,.10);--pw-sunken:rgba(30,36,60,.06);--pw-track:rgba(30,36,60,.14);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:auto;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--base);color:var(--text);font:400 16px/1.55 var(--f-b);-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
h1,h2,h3,p{margin:0}
.page{position:relative;overflow-x:clip;min-height:100vh}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:8px}

/* ───────── Кнопки ───────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border-radius:12px;border:1px solid transparent;font:600 14px/1 var(--f-b);cursor:pointer;white-space:nowrap;transition:transform .16s var(--e-out),box-shadow .45s var(--e-out),background-color .25s ease,border-color .25s ease}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--b600);color:#fff;box-shadow:0 8px 24px -10px rgba(124,58,237,.7)}
.btn-secondary{background:var(--glass);color:var(--text);border-color:var(--bd);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.btn-lg{height:50px;padding:0 24px;border-radius:16px;font-size:15.5px}
@media (hover:hover){
  .btn-primary:hover{background:var(--b700);box-shadow:0 0 0 1px rgba(196,181,253,.45),0 0 18px 2px rgba(167,139,250,.45),0 10px 36px -6px rgba(139,92,246,.55)}
  .btn-secondary:hover{border-color:var(--bd-x);box-shadow:0 0 16px 1px rgba(167,139,250,.18),0 8px 28px -8px rgba(167,139,250,.28)}
}

/* ───────── Шапка ───────── */
.nav-wrap{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--base) 62%,transparent);border-bottom:1px solid var(--bd-s);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2)}
.nav{display:flex;align-items:center;gap:32px;max-width:1200px;margin:0 auto;padding:10px 24px;min-height:var(--nav-h)}
.brand{position:relative;display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.brand .mark{position:relative;width:44px;height:44px;margin:-6px -8px -6px -10px;flex:none}
.brand .mark img{width:44px;height:44px;display:block}
.brand b{display:block;font:600 18px/1.1 var(--f-d)}
.brand small{display:block;margin-top:3px;font:500 11px/1 var(--f-b);color:var(--muted)}
:root:not([data-theme="light"]) img.logo-l{display:none}
:root[data-theme="light"] img.logo-d{display:none}
.bping{position:absolute;left:50%;top:50%;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;border:1.5px solid var(--c);pointer-events:none;animation:bping 1.3s var(--e-out) forwards}
@keyframes bping{0%{transform:scale(.9);opacity:.9}100%{transform:scale(2.3);opacity:0}}
.links{display:flex;gap:24px;font:500 13.5px/18px var(--f-b);color:var(--text-2)}
.links a{margin:0 -10px;padding:6px 10px;border-radius:12px;transition:color .25s,background-color .25s}
@media (hover:hover){.links a:hover{color:var(--text);background:var(--hover)}}
.nav .push{display:flex;align-items:center;gap:8px;margin-left:auto}
.theme{display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:12px;background:none;color:var(--text-2);cursor:pointer;transition:color .3s,background-color .3s,transform .16s var(--e-out)}
.theme:active{transform:scale(.94)}
@media (hover:hover){.theme:hover{color:var(--text);background:var(--hover)}}
.theme .sun{display:none}
:root[data-theme="light"] .theme .sun{display:block}
:root[data-theme="light"] .theme .moon{display:none}

/* ───────── Первый экран ───────── */
.track{position:relative;z-index:1}
.hero{position:relative;padding:clamp(44px,8.5vh,100px) 24px 0;overflow-x:clip;overflow-y:visible}
.page:not([data-still]) .track{height:calc(100vh - var(--nav-h) + 60vh)}
.page:not([data-still]) .hero{position:sticky;top:var(--nav-h);height:calc(100vh - var(--nav-h))}

.glow{pointer-events:none;position:absolute;inset:0 0 auto;height:900px;z-index:0}
.glow span{position:absolute;border-radius:50%;opacity:var(--glow-a);background:radial-gradient(closest-side,var(--c) 0%,color-mix(in oklab,var(--c) 80%,transparent) 28%,color-mix(in oklab,var(--c) 40%,transparent) 56%,color-mix(in oklab,var(--c) 9%,transparent) 83%,transparent 100%)}
.glow .b1{--c:var(--glow-1);width:1000px;height:820px;top:-420px;left:-4%}
.glow .b2{--c:var(--glow-2);width:960px;height:800px;top:-400px;right:-6%}
.glow .b3{--c:var(--glow-3);width:720px;height:560px;top:-220px;left:28%;opacity:calc(var(--glow-a)*.6)}
.glow .grid{position:absolute;inset:0;opacity:1;border-radius:0;background:none;background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:48px 48px;-webkit-mask:radial-gradient(70% 60% at 50% 30%,#000,transparent 75%);mask:radial-gradient(70% 60% at 50% 30%,#000,transparent 75%)}

.copy{position:relative;z-index:3;max-width:960px;margin:0 auto;text-align:center}
.page:not([data-still]) .copy{will-change:transform,opacity}
.pill{display:inline-flex;align-items:center;gap:9px;height:32px;padding:0 14px 0 12px;border-radius:999px;background:var(--glass);border:1px solid var(--bd);font:500 12.5px/16px var(--f-b);color:var(--text-2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.dot{position:relative;width:7px;height:7px;border-radius:50%;background:var(--c,var(--accent));flex:none}
.dot::after{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid var(--c,var(--accent));animation:dot 3.2s var(--e-out) infinite;animation-delay:var(--d,0s)}
@keyframes dot{0%{transform:scale(1);opacity:.8}60%,100%{transform:scale(3.4);opacity:0}}
.hero h1{margin-top:24px;font:600 clamp(36px,5.6vw,76px)/1.03 var(--f-d);letter-spacing:-.025em;text-wrap:balance}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.copy>p{max-width:650px;margin:22px auto 0;font:400 clamp(16px,1.35vw,19px)/1.55 var(--f-b);color:var(--text-2);text-wrap:pretty}
.cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:34px}
.kit{margin-top:24px;font:400 13.5px/20px var(--f-b);color:var(--muted)}
.kit b{font-weight:500;color:var(--text-2)}
.kit a{color:var(--accent);border-bottom:1px solid color-mix(in srgb,var(--accent) 35%,transparent);transition:border-color .25s}
@media (hover:hover){.kit a:hover{border-color:var(--accent)}}
.kit i{display:inline-block;width:3px;height:3px;margin:0 10px 3px;border-radius:50%;background:var(--muted)}

.stage{position:relative;z-index:2;max-width:1120px;margin:clamp(40px,6vh,72px) auto 0;transform-origin:50% 0}
.page:not([data-still]) .stage{will-change:transform}

/* ───────── Сонар за окном: кольца, луч и волны сигналов ───────── */
.sonar{position:absolute;left:50%;top:150px;width:0;height:0;z-index:-1;pointer-events:none}
.sonar .rg{position:absolute;left:calc(var(--s)/-2);top:calc(var(--s)/-2);width:var(--s);height:var(--s);border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) var(--a),transparent)}
.sonar .sweep{position:absolute;left:-1000px;top:-1000px;width:2000px;height:2000px;border-radius:50%;background:conic-gradient(from 0deg,transparent 0deg,transparent 292deg,color-mix(in srgb,var(--accent) 5%,transparent) 320deg,color-mix(in srgb,var(--accent) 17%,transparent) 357deg,color-mix(in srgb,var(--accent) 42%,transparent) 360deg);-webkit-mask:radial-gradient(closest-side,#000 0,#000 34%,transparent 74%);mask:radial-gradient(closest-side,#000 0,#000 34%,transparent 74%);animation:spin 8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.pr{position:absolute;left:-330px;top:-330px;width:660px;height:660px;border-radius:50%;border:1px solid var(--c);box-shadow:0 0 30px 0 color-mix(in srgb,var(--c) 34%,transparent),inset 0 0 30px 0 color-mix(in srgb,var(--c) 18%,transparent);opacity:0;animation:pr 2.8s var(--e-out) forwards}
.pr.two{animation-delay:.32s;border-width:1px}
@keyframes pr{0%{transform:scale(.62);opacity:0}10%{opacity:.62}100%{transform:scale(2.5);opacity:0}}

/* ───────── Окно Пульса ───────── */
.pw{position:relative;border-radius:28px;overflow:hidden;background:var(--pw-bg);border:1px solid var(--bd);box-shadow:var(--shadow);color:var(--pw-t1);text-align:left}
.pw-bar{display:flex;align-items:center;gap:6px;height:38px;padding:0 10px 0 14px;border-bottom:1px solid var(--pw-card-bd)}
.pw-bar>i{width:10px;height:10px;border-radius:50%;background:var(--pw-track)}
.pw-pause{display:grid;place-items:center;width:28px;height:28px;border:0;border-radius:8px;background:none;color:var(--pw-t3);cursor:pointer;transition:color .25s,background-color .25s}
@media (hover:hover){.pw-pause:hover{color:var(--pw-t1);background:var(--pw-act)}}
.pw-pause .ic-play{display:none}
.pw-pause[aria-pressed="true"] .ic-play{display:block}
.pw-pause[aria-pressed="true"] .ic-pause{display:none}
.pw-body{display:grid;grid-template-columns:208px minmax(0,1fr);height:500px}
.pw-side{display:grid;align-content:start;gap:14px;padding:14px 10px;background:var(--pw-side);border-right:1px solid var(--pw-card-bd)}
.pw-brand{display:flex;align-items:center;gap:4px;padding:0 2px}
.pw-brand img{width:38px;height:38px;margin:-4px -4px -4px -6px}
.pw-brand b{display:block;font:600 14px/1.1 var(--f-d)}
.pw-brand small{display:block;margin-top:2px;font:500 10px/1 var(--f-b);color:var(--accent)}
.pw-nav svg{width:16px;height:16px;flex:none;opacity:.85}
.pw-main{display:grid;min-width:0;padding:16px 20px}

.call{display:grid;gap:10px;align-content:start;min-width:0}
.crumb{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:26px;font:400 11.5px/16px var(--f-b);color:var(--pw-t3)}
.call-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.call-head h3{font:600 17px/1.25 var(--f-d)}
.call-head .meta{margin-top:3px;font:400 12px/16px var(--f-b);color:var(--pw-t3)}
.status{display:inline-grid;flex:none;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:var(--pw-act);font:500 12px/1 var(--f-b);color:var(--accent);transition:color .5s,background-color .5s}
.status>span{grid-area:1/1;display:inline-flex;align-items:center;justify-self:center;gap:6px;white-space:nowrap;opacity:0;transform:translateY(5px);transition:opacity .22s,transform .22s}
.status>span.on{opacity:1;transform:none;transition:opacity .42s var(--e-out) 80ms,transform .42s var(--e-out) 80ms}
.status.ok{color:var(--ok);background:var(--ok-bg)}
.status .spin{width:11px;height:11px;border-radius:50%;border:1.5px solid color-mix(in srgb,currentColor 30%,transparent);border-top-color:currentColor;animation:spin .9s linear infinite}
.chips{display:flex;flex-wrap:wrap;gap:6px;min-height:24px}
.chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;font:500 11.5px/1 var(--f-b);background:var(--pw-act);color:var(--pw-t2)}
.chip.warm{background:var(--warm-bg);color:var(--warm)}
.chip.lost{background:var(--lost-bg);color:var(--lost)}
.chip.sc-chip,.tag{opacity:0;transform:scale(.94);transition:opacity .2s,transform .2s}
.chip.sc-chip.on,.tag.on{opacity:1;transform:none;transition:opacity .36s var(--e-out),transform .36s var(--e-out)}

.player{display:flex;align-items:center;gap:10px;height:40px;padding:0 12px 0 8px;border-radius:12px;background:var(--pw-sunken)}
.player .pl{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--b600);color:#fff;flex:none}
.player time{font:400 11.5px/1 var(--f-m);color:var(--pw-t3)}
.pbar{position:relative;flex:1;height:4px;border-radius:2px;background:var(--pw-track)}
.pbar .fill{position:absolute;inset:0;border-radius:2px;background:var(--b500);transform-origin:0 50%;transform:scaleX(.26)}
.pbar .fill.run{transform:scaleX(.42);transition:transform 9s linear}
.pbar .tk{position:absolute;top:50%;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;background:var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 22%,transparent);opacity:0;transform:scale(.4);transition:opacity .2s,transform .2s}
.pbar .tk.on{opacity:1;transform:none;transition:opacity .3s var(--e-out),transform .42s var(--e-out)}

.lines{display:grid;gap:7px}
.ln{display:grid;grid-template-columns:42px 64px minmax(0,1fr);gap:8px;align-items:start;font:400 13px/1.45 var(--f-b);opacity:0;transform:translateY(6px);transition:opacity .2s,transform .2s}
.ln.on{opacity:1;transform:none;transition:opacity .42s var(--e-out),transform .5s var(--e-out)}
.ln time{justify-self:start;margin-top:1px;padding:2px 5px;border-radius:6px;background:var(--pw-sunken);font:400 10.5px/14px var(--f-m);color:var(--pw-t3)}
.ln .who{font:500 11.5px/19px var(--f-b);color:var(--pw-t3)}
.ln .who.cl{color:var(--accent)}
.hl{padding:1px 3px;margin:0 -3px;border-radius:4px;color:inherit;background:linear-gradient(var(--hb),var(--hb)) no-repeat 0 0/0% 100%;-webkit-box-decoration-break:clone;box-decoration-break:clone;transition:background-size 0s}
.hl.on{background-size:100% 100%;transition:background-size .62s var(--e-out)}
.hl.warm{--hb:var(--warm-bg)}
.hl.lost{--hb:var(--lost-bg)}
.tag{display:inline-flex;align-items:center;gap:5px;margin-left:6px;padding:1px 7px;border-radius:999px;font:500 10.5px/16px var(--f-b);vertical-align:1px;white-space:nowrap}
.tag.warm{background:var(--warm-bg);color:var(--warm)}
.tag.lost{background:var(--lost-bg);color:var(--lost)}
.tag::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}

.sum,.dc,.mets{opacity:0;transform:translateY(10px);transition:opacity .2s,transform .2s}
.sum.on,.dc.on,.mets.on{opacity:1;transform:none;transition:opacity .5s var(--e-out),transform .6s var(--e-out)}
.sum{padding:8px 12px;border-left:2px solid var(--b500);border-radius:0 12px 12px 0;background:var(--pw-card);font:400 12.5px/1.45 var(--f-b);color:var(--pw-t2)}
.sum b{display:block;margin-bottom:2px;font:600 12px/16px var(--f-b);color:var(--pw-t1)}

.mets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.met{padding:9px 11px 10px;border-radius:12px;background:var(--pw-card);border:1px solid var(--pw-card-bd);box-shadow:inset 0 1px 0 var(--pw-edge)}
.met small{display:block;font:400 11px/14px var(--f-b);color:var(--pw-t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.met b{display:block;margin-top:5px;font:600 20px/1 var(--f-d)}
.met b.w{color:var(--warm)}
.met span{display:block;margin-top:4px;font:400 11px/14px var(--f-b);color:var(--pw-t3)}
.did{display:grid;gap:10px;align-content:start;min-width:0}
.did-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px;height:26px;font:600 13.5px/1 var(--f-d)}
.did-h small{font:400 11.5px/1 var(--f-b);color:var(--pw-t3)}
.dc{padding:11px 13px;border-radius:14px;background:var(--pw-card);border:1px solid var(--pw-card-bd);box-shadow:inset 0 1px 0 var(--pw-edge)}
.dc-t{display:flex;align-items:center;gap:8px;font:600 13px/18px var(--f-b)}
.dc-t small{margin-left:auto;display:inline-flex;align-items:center;gap:5px;font:400 11.5px/16px var(--f-b);color:var(--pw-t3);white-space:nowrap}
.dc-t small svg{color:var(--ok)}
.dc p{margin-top:6px;font:400 12.5px/1.45 var(--f-b);color:var(--pw-t2)}
.dc p b{font-weight:500;color:var(--pw-t1)}
.dc.sigc{border-left:2px solid var(--lost)}
.dc.task{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;align-items:start}
.dc.task .box{width:16px;height:16px;margin-top:1px;border-radius:5px;border:1.5px solid var(--pw-t3)}
.dc.task b{display:block;font:500 13px/18px var(--f-b)}
.dc.task small{display:block;margin-top:3px;font:400 11.5px/16px var(--f-b);color:var(--pw-t3)}
.dc.mini{display:grid;grid-template-columns:16px minmax(0,1fr);gap:9px;align-items:start;padding:10px 13px;font:400 12.5px/1.45 var(--f-b);color:var(--pw-t2)}
.dc.mini svg{margin-top:2px;color:var(--ok)}
.dc.mini b{font-weight:500;color:var(--pw-t1)}
.q{display:grid;margin-top:8px}
.qr{display:grid;grid-template-columns:18px minmax(0,1fr) auto;gap:8px;align-items:center;height:30px;padding:0 8px;margin:0 -8px;border-radius:9px;font:400 12.5px/1 var(--f-b);color:var(--pw-t2)}
.qr i{font:400 11px/1 var(--f-m);font-style:normal;color:var(--pw-t3)}
.qr b{overflow:hidden;font-weight:500;color:var(--pw-t1);white-space:nowrap;text-overflow:ellipsis}
.qr small{font:400 11.5px/1 var(--f-b);color:var(--pw-t3);white-space:nowrap}
.qnew{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows 0s,opacity 0s}
.qnew>div{overflow:hidden;min-height:0}
.qnew.on{grid-template-rows:1fr;opacity:1;transition:grid-template-rows .52s var(--e-out),opacity .4s ease .1s}
.qnew .qr{background:var(--lost-bg)}
.qnew .qr small{color:var(--lost)}

/* ───────── Блоки ниже ───────── */
.sec{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:clamp(88px,11vw,128px) 24px 0}
.page:not([data-still]) .track+.sec{margin-top:calc(var(--win-end) - 100vh + var(--nav-h));padding-top:0}
.sec-head{max-width:760px}
.sec-head h2,.final h2{font:600 clamp(30px,3.4vw,46px)/1.1 var(--f-d);letter-spacing:-.015em;text-wrap:balance}
.sec-head p,.final p{margin-top:18px;font:400 clamp(16px,1.35vw,19px)/1.55 var(--f-b);color:var(--text-2);text-wrap:pretty}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:44px}
.sg{position:relative;padding:22px 22px 24px;border-radius:24px;background:var(--card);border:1px solid var(--bd);overflow:hidden}
.sg::before{content:"";position:absolute;left:-80px;top:-80px;width:220px;height:220px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--c) 26%,transparent),transparent);pointer-events:none}
.sg .lab{position:relative;display:inline-flex;align-items:center;gap:9px;font:500 12.5px/16px var(--f-b);color:var(--c)}
.sg h3{position:relative;margin-top:14px;font:600 20px/1.25 var(--f-d);text-wrap:balance}
.sg ol{position:relative;display:grid;gap:12px;margin:18px 0 0;padding:0;list-style:none}
.sg li{position:relative;padding-left:20px;font:400 14px/1.45 var(--f-b);color:var(--text-2)}
.sg li::before{content:"";position:absolute;left:2px;top:7px;width:6px;height:6px;border-radius:50%;background:color-mix(in srgb,var(--c) 70%,transparent)}
.sg li:not(:last-child)::after{content:"";position:absolute;left:4.5px;top:17px;bottom:-15px;width:1px;background:color-mix(in srgb,var(--c) 28%,transparent)}
.sg li b{font-weight:500;color:var(--text)}
.nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.num{padding:20px 22px;border-radius:24px;border:1px solid var(--bd-s);background:color-mix(in srgb,var(--card) 55%,transparent)}
.num b{display:block;font:600 clamp(26px,2.6vw,34px)/1.1 var(--f-d);letter-spacing:-.01em}
.num span{display:block;margin-top:8px;font:400 14px/1.45 var(--f-b);color:var(--text-2)}
.note{margin-top:14px;font:400 12.5px/18px var(--f-b);color:var(--muted)}

.hubc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center;margin-top:0;padding:36px;border-radius:28px;background:var(--card);border:1px solid var(--bd);overflow:hidden;position:relative}
.hubc::before{content:"";position:absolute;right:-160px;top:-200px;width:560px;height:520px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--glow-3) 34%,transparent),transparent);pointer-events:none}
.hubc h2{position:relative;font:600 clamp(28px,3vw,40px)/1.1 var(--f-d);letter-spacing:-.015em}
.hubc p{position:relative;margin-top:16px;font:400 16px/1.55 var(--f-b);color:var(--text-2)}
.hubc .btn{position:relative;margin-top:24px}
.models{position:relative;display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}
.models span{height:28px;padding:0 11px;border-radius:999px;border:1px solid var(--bd);font:500 12.5px/26px var(--f-b);color:var(--text-2)}
.chat{position:relative;display:grid;gap:10px;padding:18px;border-radius:20px;background:color-mix(in srgb,var(--base) 60%,transparent);border:1px solid var(--bd-s)}
.chat .me{justify-self:end;max-width:86%;padding:9px 13px;border-radius:14px 14px 4px 14px;background:var(--b600);color:#fff;font:400 14px/1.4 var(--f-b)}
.chat .ai{display:grid;gap:8px;padding:12px 14px;border-radius:14px 14px 14px 4px;background:var(--card);border:1px solid var(--bd);font:400 14px/1.45 var(--f-b);color:var(--text-2)}
.chat .ai b{font-weight:500;color:var(--text)}
.chat .row{display:grid;grid-template-columns:14px minmax(0,1fr);gap:8px;align-items:baseline}
.chat .row .dot{top:-1px}
.chat .row .dot::after{display:none}

.final{position:relative;z-index:1;margin-top:clamp(88px,11vw,128px);padding:clamp(72px,8vw,104px) 24px 130px;text-align:center;overflow:hidden}
.final .sonar{top:auto;bottom:-120px}
.final h2{position:relative;max-width:820px;margin:0 auto}
.final p{position:relative;max-width:600px;margin:18px auto 0}
.final .cta{position:relative}
.final .kit{position:relative}

.foot{position:relative;z-index:1;border-top:1px solid var(--bd-s)}
.foot-in{display:grid;gap:16px;max-width:1120px;margin:0 auto;padding:30px 24px 40px}
.foot-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px}
.foot nav{display:flex;flex-wrap:wrap;gap:8px 20px;font:400 13px/18px var(--f-b);color:var(--text-2)}
.foot-top nav{font-weight:500;color:var(--text)}
@media (hover:hover){.foot nav a:hover{color:var(--accent)}}
.foot small{font:400 12px/17px var(--f-b);color:var(--muted)}

/* ───────── Заявка ───────── */
dialog.req{width:min(480px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--bd);border-radius:24px;background:var(--base);color:var(--text);box-shadow:0 40px 100px -30px rgba(0,0,0,.6);overflow:auto}
dialog.req::backdrop{background:rgba(12,10,18,.58);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
dialog.req[open]{animation:dlg .36s var(--e-out)}
@keyframes dlg{from{opacity:0;transform:translateY(12px) scale(.98)}}
.req form{display:grid;gap:14px;padding:26px}
.req h3{font:600 24px/1.15 var(--f-d);letter-spacing:-.01em}
.req .lead{font:400 14px/1.5 var(--f-b);color:var(--text-2)}
.req .x{position:absolute;right:12px;top:12px;display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:10px;background:none;color:var(--text-2);cursor:pointer}
@media (hover:hover){.req .x:hover{background:var(--hover);color:var(--text)}}
.seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;border-radius:14px;background:var(--hover)}
.seg label{position:relative;display:grid;place-items:center;min-height:38px;padding:4px 6px;border-radius:10px;font:500 12.5px/1.2 var(--f-b);color:var(--text-2);text-align:center;cursor:pointer;transition:background-color .25s,color .25s}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label:has(input:checked){background:var(--card);color:var(--text);box-shadow:0 1px 2px rgba(0,0,0,.18),0 0 0 1px var(--bd)}
.seg label:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.fld{display:grid;gap:6px;font:500 12.5px/16px var(--f-b);color:var(--text-2)}
.fld input{height:46px;padding:0 14px;border-radius:12px;border:1px solid var(--bd);background:var(--card);color:var(--text);font:400 16px/1 var(--f-b);transition:border-color .25s,box-shadow .25s}
.fld input::placeholder{color:var(--muted)}
.fld input:focus{outline:0;border-color:var(--b500);box-shadow:0 0 0 3px color-mix(in srgb,var(--b500) 25%,transparent)}
.agree{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;align-items:start;font:400 12.5px/1.45 var(--f-b);color:var(--text-2);cursor:pointer}
.agree input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--b600)}
.agree a{color:var(--accent);border-bottom:1px solid color-mix(in srgb,var(--accent) 35%,transparent)}
.req .btn{width:100%}
.req .done{display:none;padding:34px 26px 30px;text-align:center}
.req .done svg{color:var(--ok)}
.req .done p{margin-top:10px;font:400 14px/1.5 var(--f-b);color:var(--text-2)}
.req .done small{display:block;margin-top:14px;font:400 12px/17px var(--f-b);color:var(--muted)}
.req.sent form{display:none}
.req.sent .done{display:block}
/* заявка уходит в Пульс (13.11): ловушка для ботов — поле за краем экрана (не display:none — такие поля боты пропускают);
   ошибка — словами под полями; кнопка на время отправки — «Отправляем…» */
.lov{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.req .oshibka{padding:10px 12px;border-radius:12px;background:var(--lost-bg);color:var(--lost);font:500 13px/1.45 var(--f-b)}
.fld input[aria-invalid="true"]{border-color:var(--lost)}
.agree input[aria-invalid="true"]{outline:2px solid var(--lost);outline-offset:2px}
.req .btn[disabled]{opacity:.72;cursor:progress}

/* ───────── Узкие экраны: без закрепления, всё в одну колонку ───────── */
@media (max-width:899px){
  .links{display:none}
  .nav{gap:12px;padding:8px 16px}
  .brand small{display:none}
  .brand b{font-size:17px}
  .nav .push .btn{height:36px;padding:0 12px;font-size:13.5px}
  .hero{padding:40px 16px 0}
  .pill{height:auto;min-height:30px;padding:6px 12px;font-size:11.5px;text-align:left}
  .cta .btn{width:100%}
  .kit i{display:block;width:0;height:0;margin:2px 0}
  .stage{margin-top:40px}
  .sonar{top:90px}
  .pw{border-radius:20px}
  .pw-body{grid-template-columns:minmax(0,1fr);height:auto}
  .pw-side{display:none}
  .pw-main{padding:14px}
  .call-head{flex-direction:column;gap:8px}
  .ln{grid-template-columns:42px minmax(0,1fr)}
  .ln .who{grid-column:2;line-height:16px}
  .ln .tx{grid-column:2}
  .ln time{grid-row:1/3}
  .met small{white-space:normal}
  .sec{padding:80px 16px 0}
  .cards,.nums{grid-template-columns:minmax(0,1fr)}
  .hubc{grid-template-columns:minmax(0,1fr);gap:26px;padding:24px 20px}
  .final{padding:64px 16px 100px}
  .foot-in{padding:26px 16px 36px}
  .req form{padding:22px 18px}
  .seg{grid-template-columns:minmax(0,1fr)}
}
@media (min-width:900px) and (max-width:1100px){
  .pw-body{grid-template-columns:64px minmax(0,1fr)}
  .pw-brand b,.pw-brand small,.pw-nav>*{font-size:0}
  .pw-nav>*{justify-content:center;padding:0}
}

/* ───────── Уменьшить движение: без луча, волн и подъёма ───────── */
@media (prefers-reduced-motion:reduce){
  .sonar .sweep,.dot::after,.status .spin{animation:none}
  .pr,.bping{display:none}
  *,*::before,*::after{transition-duration:.01ms!important}
}