/* ============================================================
   VortexSkins — секции страницы About
   ============================================================ */
.vx-ab{--acid:#6df800;--acid-d:rgba(109,248,0,.30);--acid-s:rgba(109,248,0,.07);
  --ink:rgba(255,255,255,.74);--dim:rgba(255,255,255,.42);--line:rgba(255,255,255,.10);
  --panel:#212121;--panel2:#191919;}

/* ---------- живые цифры ---------- */
.vx-stats{
  display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin:0 0 96px;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.vx-stat{
  position:relative;padding:30px 26px 28px;display:flex;flex-direction:column;gap:10px;
  border-left:1px solid var(--line);
}
.vx-stat:first-child{border-left:0;padding-left:0}
.vx-stat:before{
  content:"";position:absolute;left:26px;top:-1px;width:0;height:1px;background:var(--acid);
  transition:width .45s cubic-bezier(.2,.7,.3,1);
}
.vx-stat:first-child:before{left:0}
.vx-stat:hover:before{width:48px}
.vx-stat__n{
  font-family:"Getto",sans-serif;font-size:clamp(24px,2.6vw,34px);line-height:1;
  color:var(--acid);white-space:nowrap;
}
.vx-stat__l{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);line-height:1.5}

/* ---------- сплит: липкий заголовок + контент ---------- */
.vx-ab__split{display:grid;grid-template-columns:minmax(280px,.85fr) 1.15fr;gap:56px;margin:0 0 100px;align-items:start}
.vx-ab__sticky{position:sticky;top:120px}
.vx-ab__lead{
  margin:0 0 34px;font-size:19px;line-height:1.6;color:rgba(255,255,255,.9);
  padding-left:20px;border-left:2px solid var(--acid);
}

/* ---------- do / don't ---------- */
.vx-vs{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.vx-vs__col{
  padding:24px 24px 22px;background:#1a1a1a;border-radius:5px;
  box-shadow:inset 0 0 0 1px var(--line);
}
.vx-vs__head{display:block;margin:0 0 16px;font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.vx-vs__col--yes{border-top:2px solid var(--acid)}
.vx-vs__col--yes .vx-vs__head{color:var(--acid)}
.vx-vs__col--no{border-top:2px solid rgba(227,82,70,.85)}
.vx-vs__col--no .vx-vs__head{color:rgba(227,82,70,.95)}
.vx-vs ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:13px}
.vx-vs li{position:relative;padding-left:26px;font-size:14.5px;line-height:1.55;color:var(--ink)}
.vx-vs__col--yes li:before{content:"";position:absolute;left:2px;top:6px;width:9px;height:5px;border:2px solid var(--acid);border-top:0;border-right:0;transform:rotate(-45deg)}
.vx-vs__col--no li:before{content:"";position:absolute;left:3px;top:7px;width:10px;height:10px;
  background:linear-gradient(45deg,transparent 44%,rgba(227,82,70,.95) 44% 56%,transparent 56%),
             linear-gradient(-45deg,transparent 44%,rgba(227,82,70,.95) 44% 56%,transparent 56%);}

/* ---------- шкала износа ---------- */
.vx-wear{margin:0 0 100px}
.vx-wear__head{max-width:700px;margin:0 0 40px}
.vx-wear__bar{display:flex;height:96px;border:1px solid var(--line);overflow:hidden}
.vx-wear__seg{
  position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:5px;
  padding:14px 12px;overflow:hidden;transition:filter .25s;
}
.vx-wear__seg:hover{filter:brightness(1.22)}
.vx-wear__seg b{font-family:"Getto",sans-serif;font-size:19px;line-height:1;color:rgba(0,0,0,.82)}
.vx-wear__seg i{font-style:normal;font-size:10.5px;letter-spacing:.06em;color:rgba(0,0,0,.62);white-space:nowrap}
.vx-w-fn{width:7%;background:#2f9e8f}
.vx-w-mw{width:8%;background:#7aa23a}
.vx-w-ft{width:23%;background:#e9d04f}
.vx-w-ww{width:7%;background:#ff8a4c}
.vx-w-bs{width:55%;background:#e35246}
.vx-w-fn b,.vx-w-fn i,.vx-w-mw b,.vx-w-mw i{color:rgba(255,255,255,.92)}
.vx-w-fn i,.vx-w-mw i{color:rgba(255,255,255,.7)}
.vx-wear__note{max-width:760px;margin:22px 0 26px;font-size:15px;line-height:1.7;color:var(--dim)}

/* ---------- принципы ---------- */
.vx-ab__pillars{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:0 0 96px;
  border-top:1px solid var(--line);
}
.vx-pillar{
  position:relative;padding:30px 40px 28px 0;border-bottom:1px solid var(--line);
  background:none;box-shadow:none;clip-path:none;transition:none;
}
.vx-pillar:nth-child(even){padding-left:40px;padding-right:0;border-left:1px solid var(--line)}
.vx-pillar:before{
  content:"";position:absolute;left:0;top:-1px;width:0;height:1px;background:var(--acid);
  transition:width .45s cubic-bezier(.2,.7,.3,1);
}
.vx-pillar:nth-child(even):before{left:40px}
.vx-pillar:hover{transform:none}
.vx-pillar:hover:before{width:64px}
.vx-pillar__i{
  display:block;margin:0 0 14px;font-family:"Getto",sans-serif;font-size:13px;line-height:1;
  letter-spacing:.2em;color:var(--acid);-webkit-text-stroke:0;
}
.vx-pillar:hover .vx-pillar__i{-webkit-text-stroke:0}
.vx-pillar h3{margin:0 0 10px;font-size:17px;line-height:1.2;color:#fff;text-transform:uppercase;letter-spacing:.04em}
.vx-pillar p{margin:0;max-width:46ch;font-size:14.5px;line-height:1.65;color:var(--ink)}

/* ---------- финальная полоса ---------- */
.vx-band{
  display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap;
  padding:46px 44px;margin:0 0 20px;
  background:radial-gradient(110% 150% at 0% 0%,rgba(109,248,0,.09),transparent 58%),#191919;
  border-radius:6px;box-shadow:inset 0 0 0 1px var(--line),inset 3px 0 0 var(--acid);border:0;
}
.vx-band__actions{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- кнопки ---------- */
.vx-cta{
  display:inline-flex;align-items:center;gap:9px;padding:13px 24px;text-decoration:none;
  font-size:11.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--acid);
  border:1px solid var(--acid-d);background:var(--acid-s);
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
  transition:background .22s,color .22s,box-shadow .22s;
}
.vx-cta:after{content:"→";transition:transform .22s}
.vx-cta:hover{background:var(--acid);color:#0c0c0c;box-shadow:0 0 24px rgba(109,248,0,.3)}
.vx-cta:hover:after{transform:translateX(4px)}
.vx-cta--solid{background:var(--acid);color:#0c0c0c;border-color:var(--acid);font-weight:600}
.vx-cta--solid:hover{filter:brightness(1.1)}

/* ---------- адаптив ---------- */
@media (max-width:1100px){
  .vx-stats{grid-template-columns:repeat(3,1fr)}
  .vx-ab__split{grid-template-columns:1fr;gap:34px}
  .vx-ab__sticky{position:static}
  .vx-ab__pillars{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .vx-stats{grid-template-columns:1fr 1fr;margin-bottom:60px}
  .vx-vs{grid-template-columns:1fr}
  .vx-ab__pillars{grid-template-columns:1fr}
  .vx-wear__bar{height:78px}
  .vx-wear__seg i{display:none}
  .vx-wear__seg{padding:10px 6px}
  .vx-wear__seg b{font-size:15px}
  .vx-band{padding:32px 24px;flex-direction:column;align-items:flex-start}
}

/* убираем лишний воздух между hero и новыми секциями */
.vx-about-section{padding-top:0!important;padding-bottom:0!important}
.vx-ab{padding-top:20px}
@media (max-width:720px){.vx-ab{padding-top:10px}}


/* адаптив для переработанных секций */
@media (max-width:1100px){
  .vx-stats{grid-template-columns:repeat(3,1fr)}
  .vx-stat:nth-child(4){border-left:0;padding-left:0}
}
@media (max-width:820px){
  .vx-ab__pillars{grid-template-columns:1fr}
  .vx-pillar,.vx-pillar:nth-child(even){padding:24px 0;border-left:0}
  .vx-pillar:nth-child(even):before{left:0}
}
@media (max-width:640px){
  .vx-stats{grid-template-columns:1fr 1fr;margin-bottom:56px}
  .vx-stat{padding:22px 18px}
  .vx-stat:nth-child(odd){border-left:0;padding-left:0}
}