/* Сайт GBC, одиннадцатый заход: космос не кончается — один неподвижный холст позади страницы, на нём россыпь
   точек (src/v11/pyl.js). Разделы прозрачны, между ними нет ни линий, ни полос (его слово 19.10): цвет космоса
   меняется плавно сам. Белое — только бумага бланка КП. */
:root{
  --space:#030405; --bg:#05070B; --fg:#F2F3F5; --fg2:#B4BAC4; --fg3:#8A909A; --lb:rgba(255,255,255,.09); --lb2:rgba(255,255,255,.16);
  --card:rgba(255,255,255,.025); --ink:#0B0D10; --ink2:#4A515C;
  --acc:#2F5FE3; --acc2:#A9C2FF; --acc3:#6F9BFF; --sun:#FFB064; --wa:#12803F;
  --t:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif; --m:"Geist Mono",ui-monospace,monospace; --d:"Tektur",var(--t); --serif:"Cinzel","Times New Roman",serif;
  --ease:cubic-bezier(.2,.7,.2,1); --hh:68px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--hh);background:var(--space)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background-color:var(--space);color:var(--fg);font:400 17px/1.55 var(--t);-webkit-font-smoothing:antialiased;overflow-x:hidden}
/* звёзды CSS — пока холста нет (первый кадр, без модуля, без WebGL): под холстом их не видно */
html:not(.gl-on) body{background-image:radial-gradient(1px 1px at 12% 18%,rgba(220,230,255,.55),transparent 60%),radial-gradient(1px 1px at 68% 9%,rgba(255,236,214,.5),transparent 60%),radial-gradient(1.4px 1.4px at 83% 41%,rgba(220,230,255,.6),transparent 60%),radial-gradient(1px 1px at 27% 63%,rgba(200,215,255,.45),transparent 60%),radial-gradient(1px 1px at 52% 34%,rgba(255,255,255,.4),transparent 60%),radial-gradient(1.2px 1.2px at 91% 78%,rgba(220,230,255,.5),transparent 60%),radial-gradient(1px 1px at 6% 88%,rgba(255,236,214,.45),transparent 60%),radial-gradient(1px 1px at 41% 92%,rgba(220,230,255,.4),transparent 60%);background-attachment:fixed;}
a{color:inherit}
img{max-width:100%;display:block}
button,input,textarea{font:inherit;color:inherit}
[hidden]{display:none!important}
.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,48px)}
:focus-visible{outline:2px solid var(--acc3);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 14px;border-radius:10px;background:#fff;color:var(--ink);text-decoration:none}
.skip:focus{top:12px}
main:focus{outline:none}

/* ── кнопки ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:999px;border:1px solid transparent;
  background:var(--acc);color:#fff;font:500 16px/1 var(--t);text-decoration:none;cursor:pointer;position:relative;overflow:hidden;
  transition:background-color .25s,border-color .25s,transform .2s,box-shadow .3s}
.btn:hover{background:#244FC4;box-shadow:0 0 0 6px rgba(47,95,227,.18),0 10px 30px rgba(47,95,227,.35)}
.btn:active{transform:translateY(1px)}
.btn-o{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}
.btn-o:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.6);box-shadow:none}
.btn-wa{background:var(--wa)}
.btn-wa:hover{background:#0E6B34;box-shadow:0 0 0 6px rgba(18,128,63,.2),0 10px 30px rgba(18,128,63,.35)}
.btn svg{width:18px;height:18px;flex:none}
/* наведение: кнопка чуть светлеет, точки космоса собираются вокруг неё и бегут по кругу (pyl.js) */
.btn:hover,.btn:focus-visible{background:#3A6BF0;box-shadow:0 0 0 1px rgba(143,176,255,.25),0 10px 34px rgba(47,95,227,.38)}
.btn-wa:hover,.btn-wa:focus-visible{background:#159449;box-shadow:0 0 0 1px rgba(91,234,155,.25),0 10px 34px rgba(18,128,63,.38)}
.btn-o:hover,.btn-o:focus-visible{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.7);box-shadow:0 10px 34px rgba(160,190,255,.16)}

/* ── шапка: над планетой прозрачная, ниже — тёмное стекло ── */
.hd{position:fixed;left:0;right:0;top:0;z-index:50;height:var(--hh);display:flex;align-items:center;gap:28px;padding:0 clamp(16px,3vw,36px);color:var(--fg);
  transition:transform .4s var(--ease),opacity .3s}
/* рамки нет: под шапкой — мягкое затемнение без края (буквы меню читаются над бумагой бланка) */
.hd::before{content:"";position:absolute;left:0;right:0;top:0;height:calc(100% + 44px);z-index:-1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(3,4,5,.72),rgba(3,4,5,.42) 52%,rgba(3,4,5,0));opacity:0;transition:opacity .4s}
.hd.hd-ten::before{opacity:1}
.hd__brand{display:flex;align-items:center;gap:9px;text-decoration:none;flex:none;transition:opacity .35s,visibility 0s}
.hd__brand #lg{width:50px;height:50px;display:block;margin:-8px -6px -8px -10px}
.hd__brand #lgb{width:70px;height:24px;display:none}
.hd__brand img{height:19px;width:auto}
.mod .hd__brand #lgb{display:block}
.mod .hd__brand img{display:none}
.mod .hd.at-hero .hd__brand{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s,visibility 0s .35s}
.hd__nav{display:flex;gap:26px;margin-left:auto}
.hd__nav a{text-decoration:none;font:500 15px/1 var(--t);color:var(--fg2);transition:color .2s;text-shadow:0 1px 10px rgba(3,4,5,.9),0 0 2px rgba(3,4,5,.8)}
.hd__nav a:hover,.hd__nav a.is-here{color:#fff}
.hd__wa{min-height:40px;padding:0 16px;font-size:15px}
.hd__menu{display:none;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:none;color:inherit;cursor:pointer;font:500 15px/1 var(--t)}
.mnav{position:fixed;inset:0;z-index:60;background:var(--space);color:var(--fg);display:flex;flex-direction:column;padding:calc(var(--hh) + 12px) 24px 28px;overflow:auto}
.mnav__x{position:absolute;right:16px;top:14px;width:40px;height:40px;border-radius:50%;border:1px solid var(--lb2);background:none;color:inherit;font-size:24px;line-height:1;cursor:pointer}
.mnav a:not(.btn){display:block;padding:14px 0;border-bottom:1px solid var(--lb);font:500 24px/1.2 var(--t);text-decoration:none}
.mnav .btn{margin-top:28px;font-size:17px;min-height:52px}
@media (max-width:900px){
  .hd__nav{display:none}
  .hd__wa{display:none}
  .hd__menu{display:inline-flex;margin-left:auto}
}

/* ── первый экран: логотип фирмы — GL, планета вместо O, BAL, ниже BUSINESS CONSTRUCTION (его слово 20.10) ── */
.hero{position:relative;min-height:100vh;min-height:100svh;background:transparent;color:var(--fg);display:flex;align-items:center;overflow:hidden}
#gl{position:fixed;left:0;top:0;width:100%;height:100vh;height:100lvh;display:block;z-index:0;pointer-events:none}
.nogl #gl{display:none}
main,.ft{position:relative;z-index:1}
.hero__in{position:relative;z-index:2;width:100%;padding-top:calc(var(--hh) + 24px);padding-bottom:40px;display:flex;flex-direction:column;align-items:center;text-align:center}
/* логотип: буквы собирают точки россыпи (картинка — для неё и без WebGL), планета — на месте O (global-logo.json);
   ширина — колонка, но не выше, чем оставляют заголовок, кнопки и цифры: первый экран целиком на виду */
.logo{position:relative;width:min(100%,max(300px,calc((100vh - 540px) * var(--asp))));aspect-ratio:var(--asp)}
@supports (height:100svh){.logo{width:min(100%,max(300px,calc((100svh - 540px) * var(--asp))))}}
.logo img{display:block;width:100%;height:100%}
.logo__g{position:absolute;left:calc(var(--cx) * 100%);top:calc(var(--cy) * 100%);width:calc(var(--d) * 100%);aspect-ratio:1;transform:translate(-50%,-50%)}
.js:not(.mod) .logo img{opacity:0;animation:v9show .9s var(--ease) 7s forwards}
.mod .logo img{opacity:0}
.nogl .logo img{opacity:1}
.hero h1{max-width:900px;text-wrap:balance;margin:clamp(26px,4.5vh,46px) 0 0;font:600 clamp(30px,4.6vw,58px)/1.05 var(--t);letter-spacing:-.025em}
.hero__sub{max-width:640px;margin:16px 0 0;font-size:clamp(17px,1.4vw,20px);line-height:1.5;color:#C9CED6}
.hero__acts{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:28px}
.hero__num{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 40px;margin:clamp(30px,5vh,52px) 0 0;padding:0;list-style:none}
.hero__num li{display:flex;align-items:baseline;gap:9px;font-size:15px;color:var(--fg2);text-align:left}
.hero__num b{font:600 26px/1 var(--d);color:#fff;letter-spacing:.01em;min-width:1.4ch}
/* слова первого экрана: со скриптом — после сборки; модуль не загрузился — проступают через 4 с */
.js .hero h1,.js .hero__sub,.js .hero__acts,.js .hero__num{opacity:0;transition:opacity .9s var(--ease),transform .9s var(--ease);animation:v9show .9s var(--ease) 7s forwards}
.js .hero__acts,.js .hero__num{transform:translateY(12px)}
.js .hero__acts{visibility:hidden}
.is-gathered .hero__acts{visibility:visible}
@keyframes v9show{to{opacity:1;transform:none;visibility:visible}}
.is-gathered .hero__acts,.is-gathered .hero__num,.hero .rv.is-in{animation:none}
.hero .rv.is-in{opacity:1}
.is-gathered .hero__acts{opacity:1;transform:none;transition-delay:.1s}
.is-gathered .hero__num{opacity:1;transform:none;transition-delay:.3s}
/* кнопки и цифры первого экрана ведёт россыпь, разом со всем первым экраном: прятать их до конца сборки нечего */
.mod .hero__acts.tx{visibility:visible}
@media (max-width:640px){
  .hero__in{padding-top:calc(var(--hh) + 8px)}
  .hero__acts{flex-direction:column;align-items:stretch;width:100%;max-width:360px}
  .hero__num{gap:10px 22px}
  .hero__num b{font-size:22px}
}
@media (prefers-reduced-motion:reduce){
  .js .hero h1,.js .hero__sub,.js .hero__acts,.js .hero__num{transition:none;animation:none;opacity:1;transform:none;visibility:visible}
}

/* ── разделы: тёмные, у каждого своё пятно света ── */
.sec{position:relative;padding:clamp(80px,11vw,140px) 0;background:transparent;overflow-x:clip}
.sec>.wrap{position:relative}
.sec__head{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(20px,5vw,64px);align-items:end}
.sec__head .lead{margin:0}
@media (max-width:900px){.sec__head{grid-template-columns:1fr}}
.h2{margin:0;max-width:820px;text-wrap:balance;font:600 clamp(30px,4vw,52px)/1.06 var(--t);letter-spacing:-.024em}
.lead{max-width:640px;margin:18px 0 0;font-size:clamp(17px,1.35vw,19px);line-height:1.55;color:var(--fg2)}
.note{margin:16px 0 0;color:var(--fg3);font-size:13.5px}

/* появление при прокрутке — только живым модулем */
.mod .rv{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.mod .rv.is-in{opacity:1;transform:none}
.mod .rv.tx{opacity:0;transform:none;transition:none}
/* прозрачность у текстов пишет россыпь каждый кадр — своих переходов по прозрачности у них нет */
.mod .tv__c.rv.tx{transition:border-color .3s,background .3s}
.mod .hero__acts.tx,.mod .hero__num.tx{transition:transform .9s var(--ease)}
.mod .rv.tx.is-in{opacity:1}
@media (prefers-reduced-motion:reduce){.mod .rv{opacity:1;transform:none;transition:none}}

/* ── карта ── */
.karta{display:block;width:100%;height:auto;margin-top:clamp(28px,4vw,48px);cursor:crosshair;touch-action:pan-y}

/* ── товар: песок собирается в силуэт ── */
.tv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(36px,5vw,56px)}
.tv__c{display:flex;flex-direction:column;border:1px solid var(--lb);border-radius:20px;background:var(--card);overflow:hidden;transition:border-color .3s,background .3s}
.mod .tv__c.rv{transition:opacity .8s var(--ease),transform .8s var(--ease),border-color .3s,background .3s}
.tv__c:hover{border-color:rgba(111,155,255,.35);background:rgba(111,155,255,.04)}
.tv__pesok{display:block;width:100%;aspect-ratio:400/260;background:radial-gradient(70% 70% at 50% 60%,rgba(111,155,255,.08),transparent 70%)}
.tv__t{display:flex;flex-direction:column;gap:8px;padding:4px 22px 22px;flex:1}
.tv__t h3{margin:0;font:600 20px/1.25 var(--t);letter-spacing:-.01em}
.tv__t p{margin:0;color:var(--fg2);font-size:15.5px;line-height:1.5}
.tv__any{justify-content:center;padding:26px 22px;border-style:dashed}
.tv__any h3{margin:0 0 8px;font:600 22px/1.2 var(--t)}
.tv__any p{margin:0 0 18px;color:var(--fg2)}
.tv__any .btn{align-self:flex-start}
@media (max-width:980px){.tv{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.tv{grid-template-columns:1fr}}
/* четыре товара: «Нет в списке?» добирает строку — на две колонки (в одну колонку — нет) */
@media (min-width:621px){.tv__any{grid-column:span 2}}

/* ── заказчикам: запрос слева, бланк КП справа заполняется сам ── */
.zk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:start}
.kp{margin-top:30px}
.kp label{display:block;margin:0 0 14px}
.kp label>span{display:block;margin-bottom:6px;font:500 13px/1.2 var(--t);color:var(--fg2)}
.kp label i,.kp__or i{font-style:normal;color:#FF8A7A}
.kp input,.kp textarea{width:100%;padding:12px 14px;border:1px solid var(--lb2);border-radius:12px;background:rgba(255,255,255,.03);font-size:16px;line-height:1.4;transition:border-color .2s,box-shadow .2s,background .2s}
.kp input::placeholder,.kp textarea::placeholder{color:#7F858F}
.kp textarea{min-height:120px;resize:vertical}
.kp input:focus,.kp textarea:focus{outline:none;border-color:var(--acc3);background:rgba(111,155,255,.05);box-shadow:0 0 0 3px rgba(111,155,255,.16)}
.kp [aria-invalid="true"]{border-color:#FF8A7A}
.kp__row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kp__act{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.kp__copy{min-height:48px;padding:0 6px;border:0;background:none;color:var(--acc2);font:500 15px/1 var(--t);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.kp__err{margin:8px 0 0;color:#FF8A7A;font-size:14px;min-height:1.2em}
.kp__or{margin:4px 0 0;color:var(--fg3);font-size:14px}
.kp__or a{color:var(--acc2)}
@media (max-width:480px){.kp__row{grid-template-columns:1fr}.kp__act .btn,.kp__copy{width:100%}}
/* товар — наименование и количество в одну строку, и на телефоне; у добавленных строк подписи — только для чтения с экрана */
.kp__row.kp__tovar{grid-template-columns:minmax(0,1.8fr) minmax(0,1fr)}
.kp__tovar+.kp__tovar label>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.kp__plus{display:block;margin:-4px 0 18px;padding:4px 0;border:0;background:none;color:var(--acc2);font:500 15px/1.2 var(--t);cursor:pointer}
.kp__plus:hover{text-decoration:underline;text-underline-offset:3px}
/* бланк — официальный бланк GBC (шапка и подвал — с бланка КП фирмы, глобус водяным знаком), текст — шаблон КП
   кабинета, Times New Roman, как в КП; без директора и печати; бумага белая, с тенью, чуть повёрнута */
.zk__r{position:sticky;top:calc(var(--hh) + 24px)}
.blank{position:relative;overflow:hidden;border-radius:3px;background:#fff;color:#111;box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06);transform:rotate(.6deg);
  font:400 12.5px/1.42 "Times New Roman",Times,"Liberation Serif","Noto Serif",serif}
.blank__shapka,.blank__podval{display:block;width:100%;height:auto}
.blank__telo{padding:8px 8% 12px;background:url(/lk/static/sajt/img/blank-fon.ca96ec99dd.jpg) 50% 30%/96% auto no-repeat}
.blank p{margin:0}
.blank__telo>p+p{margin-top:2px}
.blank__ln{display:inline-block;width:2.6em;border-bottom:1px solid #111;vertical-align:-1px}
.blank p.blank__to{margin:8px 0 0 50%;font-weight:700;overflow-wrap:anywhere}
.blank p.blank__to.pust{color:#9AA1AC;font-weight:400}
.blank p.blank__t{margin:14px 0 8px;text-align:center;font-weight:700;font-size:13px;letter-spacing:.02em}
.blank__vst{text-align:justify}
.blank table{width:100%;margin:8px 0 10px;border-collapse:collapse;table-layout:fixed;font-size:11px;line-height:1.25}
.blank th,.blank td{padding:4px 3px;border:1px solid #2B2F36;vertical-align:middle;overflow-wrap:anywhere}
.blank th{font-weight:700;text-align:center;overflow-wrap:normal;word-break:normal;hyphens:manual}
.blank td:first-child,.blank td:nth-child(n+3){text-align:center}
.blank tfoot td{font-weight:700}
.blank tr.pust td{color:#9AA1AC}
.blank tr.nov td{animation:bstroka .5s var(--ease)}
.blank .b-wait,.blank tr.b-wait td{color:transparent!important;transition:none}
.blank [data-b],.blank td{transition:color .3s}
.blank__prim{margin:0 0 10px}
/* холст перелёта букв с поля на бланк — над страницей, под шапкой */
.perenos{position:fixed;left:0;top:0;width:100%;height:100%;z-index:40;pointer-events:none}
@keyframes bstroka{from{background:#E8EEFF}to{background:transparent}}
/* под бланком, не на нём (его слово 20.10) */
.blank__note{margin:16px 0 0;color:var(--fg2);font-size:14.5px;line-height:1.45}
@media (max-width:900px){.zk{grid-template-columns:1fr}.zk__r{position:static}.blank{transform:none}}
/* телефон: колонки шире под слова шапки («Кол-во», «Ед.изм.» не рвутся посреди слова), наименование — уже */
@media (max-width:480px){.blank{font-size:11px}.blank p.blank__t{font-size:11.5px}.blank table{font-size:9.5px}.blank th,.blank td{padding:3px 2px}.blank th{font-size:8.5px}.blank__telo{padding:6px 6% 10px}
  .blank col:nth-child(1){width:6%!important}.blank col:nth-child(2){width:33%!important}.blank col:nth-child(3){width:17%!important}
  .blank col:nth-child(4){width:12%!important}.blank col:nth-child(5){width:12%!important}.blank col:nth-child(6){width:20%!important}}

/* ── заводам: конвейер ── */
.zv__lead{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,5vw,64px);align-items:end}
.zv__lead .lead{margin:0}
@media (max-width:900px){.zv__lead{grid-template-columns:1fr}}
.zavod{width:min(100%,640px);aspect-ratio:2/1;margin:clamp(28px,4vw,48px) auto 0}
.kv{position:relative;margin-top:clamp(40px,5vw,60px);display:grid;gap:26px}
.kv__st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.kv__c{border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:14px 14px 16px;background:transparent;transform:translateY(8px);transition:transform .6s var(--ease),border-color .5s,background .5s}
.kv__c.is-on{transform:none;border-color:rgba(110,150,255,.45);background:rgba(76,125,255,.06)}
.kv__k{display:none}
.kv__c h3{margin:2px 0 6px;font:600 17px/1.2 var(--t);color:#C9CED6;transition:color .5s}
.kv__c p{margin:0;font-size:14px;line-height:1.45;color:#9AA1AC;transition:color .5s}
.kv__c.is-on h3{color:#fff}.kv__c.is-on p{color:#C9CED6}
.kv__track{position:relative;height:74px}
.kv__lane{position:absolute;left:10%;right:10%;top:14px;height:2px;background:rgba(255,255,255,.12)}
.kv__fill{position:absolute;left:0;top:0;height:100%;width:0;background:linear-gradient(90deg,var(--acc),var(--acc2));box-shadow:0 0 12px rgba(111,155,255,.6)}
.kv__node{position:absolute;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;padding:0;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:#05070B;cursor:pointer;transition:border-color .4s,background .4s,box-shadow .4s}
.kv__node::after{content:"";position:absolute;inset:-14px}
.kv__node b{display:none}
.kv__node.on{border-color:var(--acc2);background:var(--acc);box-shadow:0 0 14px rgba(111,155,255,.8)}
.kv__lot{position:absolute;left:10%;top:40px;transform:translateX(-50%);display:flex;align-items:center;gap:9px;padding:8px 13px 8px 10px;border-radius:12px;background:#fff;color:var(--ink);white-space:nowrap;box-shadow:0 14px 34px rgba(0,0,0,.4);font:500 13px/1 var(--t)}
.kv__lot i{width:9px;height:9px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 4px rgba(47,95,227,.2)}
.kv__viz{height:146px;margin-bottom:14px;border-radius:10px;background:#0A0E16;border:1px solid rgba(255,255,255,.06);overflow:hidden;position:relative}
.vz{position:absolute;inset:0;padding:10px;font:500 10.5px/1.3 var(--m);color:#C9CED6}
.vz__bar{display:flex;align-items:center;gap:4px;margin-bottom:8px}.vz__bar i{width:5px;height:5px;border-radius:50%;background:#2A3140}.vz__bar span{margin-left:6px;color:#8A909A;font-size:9.5px}
.vz__row{display:flex;justify-content:space-between;gap:8px;padding:5px 6px;border-radius:5px;margin-bottom:3px;background:rgba(255,255,255,.03)}
.vz__row em{font-style:normal;color:#8A909A}
.vz__row.new{background:rgba(76,125,255,.18);color:#fff}.vz__row.new em{color:var(--acc2)}
.vz__ping{position:absolute;right:14px;top:72px;width:8px;height:8px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 0 rgba(76,125,255,.6);transition:opacity .3s}
.kv__c.is-on .vz__ping{animation:ping 1.2s infinite}
@keyframes ping{to{box-shadow:0 0 0 12px rgba(76,125,255,0)}}
.vz__t{margin:0 0 8px;color:#8D94A0;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase}
.vz__ln{display:flex;justify-content:space-between;gap:8px;padding:5px 2px;border-bottom:1px solid rgba(255,255,255,.06)}
.vz__ln b{opacity:0;color:#7CE0A1;transition:opacity .3s}
.vz__ln.chk b{opacity:1}
.vz__pg{position:absolute;left:50%;top:50%;width:92px;height:116px;margin:-58px 0 0 -46px;padding:12px 10px;background:#fff;border-radius:2px;box-shadow:0 6px 16px rgba(0,0,0,.4);color:#1A1D24;font:700 7px/1.3 var(--t);opacity:0}
.vz__pg p{margin:0 0 8px;text-align:center}
.vz__pg i{display:block;height:3px;margin:5px 0;background:#E1E5EB}
.vz__sg{position:absolute;bottom:10px;display:block;width:30px;height:12px;border-bottom:1px solid #9AA1AC}
.vz__sg.a{left:10px}.vz__sg.b{right:10px}
.vz__sg svg{width:100%;height:100%;overflow:visible}
.vz__sg path{fill:none;stroke:#1F4FBF;stroke-width:1.4;stroke-linecap:round;stroke-dasharray:60;stroke-dashoffset:60}
.vz__road{position:absolute;left:12px;right:12px;top:58px;height:2px;background:rgba(255,255,255,.1)}
.vz__road i{position:absolute;left:0;top:0;height:100%;width:0;background:var(--acc2)}
.vz__truck{position:absolute;top:44px;left:12px;width:28px;height:14px;border-radius:3px;background:#DDE4EE}
.vz__truck::after{content:"";position:absolute;right:-9px;bottom:0;width:9px;height:10px;border-radius:0 3px 3px 0;background:#A9C2FF}
.vz__ends{position:absolute;left:12px;right:12px;top:70px;display:flex;justify-content:space-between;color:#8A909A;font-size:9.5px}
.vz__ok{position:absolute;left:12px;right:12px;bottom:12px;padding:7px 8px;border-radius:8px;background:rgba(30,142,90,.16);color:#9FE3BE;font:500 10px/1.3 var(--t);opacity:0}
.vz__sum{position:absolute;left:10px;right:10px;bottom:10px;display:flex;justify-content:space-between;align-items:baseline;padding-top:8px;border-top:1px solid rgba(255,255,255,.1)}
.vz__sum b{font:600 13px/1 var(--t);color:#fff}
.vz__sum b i{font-style:normal;color:#7CE0A1;opacity:0;transition:opacity .4s}
.kv-static .vz__row.new,.kv-static .vz__pg,.kv-static .vz__ok,.kv-static .vz__sum b i{opacity:1}
.kv-static .vz__sg path{stroke-dashoffset:0}
.kv-static .vz__ln b{opacity:1}
.kv-static .kv__c{transform:none}
.kv-static .kv__c h3{color:#fff}.kv-static .kv__c p{color:#C9CED6}
.kv-static .kv__lot{display:none}
@media (max-width:1100px){
  .kv__st{grid-template-columns:1fr}
  .kv__lot{display:none}
  .kv__track{height:36px}
  .kv__viz{height:170px}
  .mod .kv:not(.kv-static) .kv__st{overflow:hidden}
  .mod .kv:not(.kv-static) .kv__c{grid-area:1/1;transition:transform .6s var(--ease),border-color .5s,background .5s}
  .mod .kv:not(.kv-static) .kv__track{order:-1}
  .kv-static .kv__track{display:none}
}
.zv__need{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(48px,6vw,72px)}
.zv__box{display:flex;flex-direction:column;align-items:flex-start;padding:24px;border:1px solid var(--lb);border-radius:18px;background:var(--card)}
.zv__box h3{margin:0 0 12px;font:600 19px/1.25 var(--t)}
.zv__box ul{margin:0;padding:0;list-style:none;display:grid;gap:9px}
.zv__box li{position:relative;padding-left:22px;color:#C9CED6}
.zv__box li::before{content:"";position:absolute;left:2px;top:.6em;width:8px;height:8px;border-radius:50%;background:var(--acc2)}
.zv__box p{margin:0 0 18px;color:#C9CED6}
.zv__act{margin-top:auto;display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:980px){.zv__need{grid-template-columns:1fr}}

/* ── о компании: цифры досчитывают ── */
.km__num{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:clamp(36px,5vw,56px) 0 0;padding:0;list-style:none}
.km__num li{padding:24px 22px;border-radius:20px;border:1px solid var(--lb);background:var(--card);position:relative;overflow:hidden}
.km__num li::after{content:"";position:absolute;left:-30%;right:-30%;bottom:-60%;height:80%;background:radial-gradient(closest-side,rgba(111,155,255,.16),transparent);pointer-events:none}
.km__num b{display:block;font:600 clamp(40px,5vw,60px)/1 var(--d);color:#fff;letter-spacing:.01em}
.km__num span{display:block;margin-top:10px;color:var(--fg2);font-size:15px;line-height:1.4}
/* лента партнёров: точки — свой холст на всю ширину (v11/logotipy.js); названия — для чтения с экрана (без
   скриптов — списком) */
.lg{position:relative;margin-top:clamp(56px,7vw,96px)}
.lg__cnv{display:block;width:100%;height:clamp(84px,9vw,112px)}
.lg__spisok{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 28px;margin:0;padding:0 16px;list-style:none;color:var(--fg2)}
.js .lg__spisok{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;padding:0}
.km__num em{font:600 clamp(18px,2vw,24px)/1 var(--d);font-style:normal;color:#fff;margin-left:4px}
.km__num b{display:inline-block}
.km__txt{display:grid;gap:14px}
.km__txt .lead{margin:0}
/* график по годам: точки — россыпь (v11/grafik.js), подписи — страницей */
.gr{margin-top:clamp(48px,6vw,80px)}
.gr__top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 16px;margin-bottom:18px;font:500 12.5px/1.3 var(--m);letter-spacing:.12em;text-transform:uppercase;color:var(--fg3)}
.gr__pole{position:relative;aspect-ratio:1000/360}
.gr__lbl{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.gr__k{position:relative}
.gr__k b{position:absolute;left:8%;font:600 clamp(17px,2vw,26px)/1 var(--d);color:#fff}
.gr__god{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:12px;font:500 12.5px/1.35 var(--m);letter-spacing:.08em;color:var(--fg3)}
.gr__god span{padding:0 4px 0 8%}
@media (max-width:620px){.gr__pole{aspect-ratio:1000/620}.gr__god{font-size:11px;letter-spacing:.02em}}
@media (max-width:900px){.km__num{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ── контакты: в конце — планета и инициалы GBC (в начале — полное название, его правило 19.10) ── */
.fin{position:relative;display:flex;flex-direction:column;align-items:center;gap:clamp(14px,2vw,22px);margin:0 auto clamp(56px,7vw,88px)}
.fin__g{width:clamp(150px,22vw,260px);aspect-ratio:1}
.fin__gbc{width:clamp(200px,30vw,420px);aspect-ratio:640/218}
.fin__gbc img{width:100%;height:auto}
.mod .fin__gbc img{opacity:0}
.nogl .fin__gbc img{opacity:1}
.kt{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,64px);align-items:start}
.kt__ch{display:grid;gap:12px;margin-top:28px}
.kt__ch a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 20px;border-radius:16px;border:1px solid var(--lb);background:var(--card);text-decoration:none;transition:border-color .2s,background .2s}
.kt__ch a:hover{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.06)}
.kt__ch span{color:var(--fg2);font-size:14.5px}
.kt__ch b{font:500 18px/1.2 var(--t);color:#fff;text-align:right;overflow-wrap:anywhere}
.kt__rk{margin:0;padding:22px;border-radius:18px;border:1px solid var(--lb);background:var(--card);display:grid;gap:14px}
.kt__rk div{display:grid;gap:3px}
.kt__rk dt{color:var(--fg3);font-size:13px}
.kt__rk dd{margin:0;color:#E4E7EB;font-size:15.5px}
@media (max-width:900px){.kt{grid-template-columns:1fr}}

/* ── подвал ── */
.ft{background:transparent;color:var(--fg3);font-size:13.5px;padding:22px 0 calc(22px + env(safe-area-inset-bottom))}
.ft .wrap{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}

/* тексты ведёт россыпь (inline opacity) — на бумаге все видны */
@media print{.tx{opacity:1!important}}

/* ── всплывашка ── */
.toast{position:fixed;left:50%;bottom:24px;z-index:80;transform:translate(-50%,20px);padding:12px 18px;border-radius:12px;background:#151922;border:1px solid var(--lb2);color:#fff;font-size:15px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media print{
  .js .hero h1,.js .hero__sub,.js .hero__acts,.js .hero__num,.mod .rv,.fin__gbc img,.logo img{opacity:1!important;transform:none!important;animation:none!important;visibility:visible!important}
  .hd,.mnav,.toast,#gl,.kv__track{display:none!important}
  body,.hero,.sec,.ft{background:#fff!important;color:#000!important}
}
