/* ==================================================================
   AURA — редизайн 01.10.2026 по концепции voksdigital.ru
   Грузится ПОСЛЕ style.css: часть 1 — главная (классы a-*),
   часть 2 — перекраска приложения поверх старых стилей (логика не тронута).

   Палитра (контраст проверен, WCAG AA):
     ночь      #0D0A1C  фон тёмных секций и приложения   белый 19.5:1
     бумага    #F6F4FB  фон светлых секций                 чернила 16.8:1
     фиолет    #6D3FF0  кнопки                            белый 5.8:1
     бренд     #60b0ff → #c084fc → #f472b6 (градиент логотипа — оставлен, владелец
               вернул его 02.08 после «цвета хрень»); на светлом — на ступень глубже
     плашка    #4C7DF0 → #8A4FE8 → #D9468F  (белые ЗАГЛАВНЫЕ ≥ 3.8:1, крупный кегль)
   Шрифт — Onest (кириллица своя): Space Grotesk и DM Sans кириллицы не имеют,
   русское падало на системный шрифт («шрифты хрень»).
   ================================================================== */

:root{
  --a-night:#0d0a1c;
  --a-night-2:#15112b;
  --a-night-3:#1e1839;
  --a-paper:#f6f4fb;
  --a-paper-2:#ece8f7;
  --a-ink:#16131f;
  --a-ink-2:#5e5a6e;
  --a-mute:#b9b3cc;
  --a-line:rgba(22,19,31,.12);
  --a-line-dk:rgba(255,255,255,.1);
  --a-violet:#6d3ff0;
  --a-violet-dk:#5b2fe0;
  --a-grad:linear-gradient(110deg,#60b0ff 0%,#c084fc 52%,#f472b6 100%);
  --a-grad-deep:linear-gradient(110deg,#5a3ee8 0%,#9a3fd6 55%,#c9307f 100%);
  --a-plate:linear-gradient(135deg,#4c7df0 0%,#8a4fe8 52%,#d9468f 100%);
  --a-r:14px;

  --a-wrap:1240px;
  --a-gut:clamp(16px,6.9vw,100px);
  --a-sec:clamp(64px,8.3vw,120px);
  --a-hdr:64px;
  --a-f-h1:clamp(40px,6.1vw,86px);
  --a-f-h2:clamp(30px,4.3vw,56px);
  --a-ease:cubic-bezier(.2,.7,.3,1);
  --a-hero-bg:
    radial-gradient(60% 75% at 96% 38%,rgba(138,79,232,.42) 0%,rgba(138,79,232,0) 70%),
    radial-gradient(45% 55% at 72% 108%,rgba(217,70,143,.30) 0%,rgba(217,70,143,0) 70%),
    linear-gradient(110deg,#0b0918 0%,#110d24 38%,#1a123b 70%,#27154b 100%);

  /* токены старого style.css — перекрашиваем приложение целиком */
  --bg:var(--a-night);
  --card:rgba(255,255,255,.035);
  --card-border:rgba(255,255,255,.09);
  --text:#fff;
  --text-muted:rgba(255,255,255,.66);
  --accent:linear-gradient(110deg,#60b0ff,#c084fc,#f472b6);
  --btn-primary:var(--a-violet);
  --btn-hover:var(--a-violet-dk);
  --radius:var(--a-r);
}

/* ============================ ЧАСТЬ 1. ГЛАВНАЯ ============================ */

#page-home{padding:0!important;margin:0!important;max-width:none!important;width:100%!important}
.a-home{
  position:relative;font-family:'Onest',system-ui,'Segoe UI',sans-serif;
  font-size:clamp(16px,1.15vw,18px);line-height:1.55;color:var(--a-ink);
  -webkit-font-smoothing:antialiased;
}
/* сброс — через :where, чтобы нулевая специфичность не перебивала наши же классы */
:where(.a-home) *,:where(.a-home) *::before,:where(.a-home) *::after{box-sizing:border-box}
:where(.a-home) :is(h1,h2,h3,p,ul,ol,dl,dd,figure){margin:0;padding:0}
/* старые правила style.css красили h1/h2 градиентом по тексту — у главной свои */
.a-home :is(h1,h2,h3){background:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:currentColor;filter:none;text-shadow:none}
:where(.a-home) li{list-style:none}
:where(.a-home) img{max-width:100%;display:block}
:where(.a-home) a{color:inherit;text-decoration:none}
:where(.a-home) button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
.a-home :focus-visible{outline:3px solid #c084fc;outline-offset:3px;border-radius:4px}

.a-wrap{width:min(var(--a-wrap),100% - var(--a-gut)*2);margin-inline:auto}
.a-home section{position:relative;scroll-margin-top:var(--a-hdr)}

/* заголовки секций: как у VOKS — крупно, плотный трекинг, вторая половина акцентом */
.a-h2{font-size:var(--a-f-h2);font-weight:600;line-height:1.04;letter-spacing:-.03em;margin-bottom:18px!important}
.a-h2 em{font-style:normal;background:var(--a-grad-deep);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
[data-tone="dark"] .a-h2,[data-tone="hero"] .a-h2{color:#fff}
[data-tone="dark"] .a-h2 em,[data-tone="hero"] .a-h2 em{background-image:var(--a-grad)}
.a-sub{font-size:clamp(16px,1.2vw,19px);line-height:1.6;color:var(--a-ink-2);max-width:62ch}
[data-tone="dark"] .a-sub{color:var(--a-mute)}
.a-tag{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--a-violet);margin-bottom:16px!important}
.a-tag--dk{color:#c084fc}

/* кнопки */
.a-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:60px;padding:0 clamp(24px,2.6vw,34px);border-radius:var(--a-r);
  font-size:16px;font-weight:600;letter-spacing:.005em;white-space:nowrap;
  transition:background .2s var(--a-ease),color .2s var(--a-ease),border-color .2s var(--a-ease),transform .2s var(--a-ease),box-shadow .2s var(--a-ease);
}
.a-btn svg{width:20px;height:20px;flex:none}
.a-btn:active{transform:translateY(1px)}
.a-btn--violet{background:var(--a-violet)!important;color:#fff!important;box-shadow:0 10px 30px -12px rgba(109,63,240,.8)}
.a-btn--violet:hover{background:var(--a-violet-dk)!important;box-shadow:0 14px 36px -12px rgba(109,63,240,.9)}
.a-btn--ghost{border:1px solid rgba(255,255,255,.55)!important;color:#fff!important}
.a-btn--ghost:hover{background:#fff!important;color:var(--a-ink)!important}
.a-btn--white{background:#fff!important;color:var(--a-ink)!important}
.a-btn--white:hover{background:var(--a-paper-2)!important}
.a-lnk{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-weight:600;color:var(--a-violet)!important}
.a-lnk i{font-style:normal;transition:transform .2s var(--a-ease)}
.a-lnk:hover i{transform:translateX(4px)}

/* ------------------------------------------------------------ рельс */
.a-rail{
  position:fixed!important;right:clamp(10px,1.4vw,22px);top:50%;transform:translateY(-50%);
  z-index:9;display:flex!important;flex-direction:column;gap:6px;isolation:auto!important;
}
.a-rail a{display:flex;align-items:center;justify-content:flex-end;gap:10px;height:30px;color:#fff}
.a-rail a span{
  font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:5px 10px;border-radius:999px;background:rgba(13,10,28,.55);
  opacity:0;transform:translateX(6px);transition:opacity .25s var(--a-ease),transform .25s var(--a-ease);
  pointer-events:none;white-space:nowrap;
}
.a-rail a i{width:9px;height:9px;border-radius:50%;border:1.5px solid currentColor;opacity:.55;transition:all .25s var(--a-ease)}
/* подпись — только при наведении на рельс: постоянная подпись активного пункта наезжала на текст у правого края */
.a-rail:hover a span,.a-rail a:focus-visible span{opacity:1;transform:none}
.a-rail a.on i{opacity:1;background:#c084fc;border-color:#c084fc;box-shadow:0 0 0 4px rgba(192,132,252,.25)}
.a-rail a.is-light{color:var(--a-ink)}
.a-rail a.is-light span{background:rgba(255,255,255,.85);color:var(--a-ink)}
.a-rail a.is-light.on i{background:var(--a-violet);border-color:var(--a-violet);box-shadow:0 0 0 4px rgba(109,63,240,.18)}
@media (max-width:1100px){.a-rail{display:none!important}}

/* ------------------------------------------------------------ герой */
.a-hero{
  color:#fff;background:var(--a-hero-bg);isolation:isolate;overflow:hidden;
  min-height:calc(100svh - var(--a-hdr));display:flex;flex-direction:column;justify-content:center;
  padding:clamp(40px,6vw,88px) 0 0;
}
.a-aurora{position:absolute;inset:0;width:100%;height:100%;z-index:-2;display:block;pointer-events:none;filter:blur(8px)}
.a-hero::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(to top,rgba(8,6,20,.62) 0%,rgba(8,6,20,0) 34%)}
.a-hero__in{
  width:min(var(--a-wrap),100% - var(--a-gut)*2);margin-inline:auto;flex:1 0 auto;
  display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(28px,4vw,64px);align-items:center;
  padding-block:clamp(24px,4vw,56px);
}
.a-hero__kick{font-size:clamp(15px,1.4vw,20px);color:rgba(255,255,255,.82);margin-bottom:16px!important;letter-spacing:.01em}
.a-hero__h{font-size:var(--a-f-h1);font-weight:600;line-height:1;letter-spacing:-.035em;margin-bottom:clamp(20px,2.6vw,32px)!important;color:#fff}
.a-hero__h em{font-style:normal;background:var(--a-grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  padding-bottom:.08em}
.a-hero__lead{font-size:clamp(16px,1.3vw,20px);line-height:1.6;color:rgba(255,255,255,.86);max-width:34em;margin-bottom:clamp(24px,3vw,36px)!important}
.a-hero__cta{display:flex;flex-wrap:wrap;gap:12px}
.a-hero__alt{margin-top:18px!important;font-size:15px;color:rgba(255,255,255,.66)}
.a-hero__alt a{color:#fff;border-bottom:1px solid rgba(255,255,255,.35);transition:border-color .2s}
.a-hero__alt a:hover{border-color:#c084fc}

/* СИГНАТУРА: лента образов — три колонки настоящих кадров одной модели плывут вверх-вниз */
.a-reel{position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:center;min-width:0}
.a-reel__cols{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;
  height:clamp(460px,68svh,700px);overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 88%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 88%,transparent 100%);
  transform:rotate(-4deg) scale(1.06);transform-origin:50% 50%;
}
.a-reel__col{display:flex;flex-direction:column;gap:12px;animation:a-up var(--dur,70s) linear infinite;will-change:transform}
.a-reel__col:nth-child(2){animation-name:a-down;--dur:84s}
.a-reel__col:nth-child(3){--dur:62s}
.a-reel__col img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 18%;border-radius:12px;
  background:#1d1733;box-shadow:0 18px 40px -18px rgba(0,0,0,.7)}
@keyframes a-up{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes a-down{from{transform:translateY(-50%)}to{transform:translateY(0)}}
.a-reel:hover .a-reel__col{animation-play-state:paused}
.a-reel__cap{
  align-self:center;margin-top:18px!important;display:inline-flex;align-items:center;gap:10px;
  font-size:13px;color:rgba(255,255,255,.8);padding:8px 14px;border-radius:999px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
}
.a-reel__cap i{width:7px;height:7px;border-radius:50%;background:#f472b6;box-shadow:0 0 0 4px rgba(244,114,182,.2);
  animation:a-breathe 2.4s ease-in-out infinite}
@keyframes a-breathe{0%,100%{box-shadow:0 0 0 3px rgba(244,114,182,.22)}50%{box-shadow:0 0 0 7px rgba(244,114,182,.06)}}

.a-nums{
  width:min(var(--a-wrap),100% - var(--a-gut)*2);margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(16px,3vw,40px);padding:clamp(24px,3vw,36px) 0 clamp(32px,4vw,52px);border-top:1px solid rgba(255,255,255,.14);
}
.a-nums dt{font-size:clamp(30px,3.4vw,48px);font-weight:600;letter-spacing:-.03em;line-height:1.05;
  font-variant-numeric:proportional-nums;white-space:nowrap}
.a-nums dd{margin-top:8px!important;font-size:14px;color:rgba(255,255,255,.72);max-width:22ch}

/* ------------------------------------------------------------ образы */
.a-looks,.a-use,.a-serv,.a-where,.a-why,.a-price{background:var(--a-paper);padding:var(--a-sec) 0}
.a-use{padding-top:0}
.a-looks__hd{display:grid;grid-template-columns:minmax(0,1fr);gap:26px;margin-bottom:clamp(28px,3.4vw,44px)!important}
.a-looks__hd>div{max-width:780px}
.a-chips{display:flex;flex-wrap:wrap;gap:8px}
.a-chip{
  height:42px;padding:0 18px!important;border-radius:999px;border:1px solid var(--a-line)!important;
  font-size:15px;font-weight:500;color:var(--a-ink)!important;background:#fff!important;
  transition:background .2s var(--a-ease),color .2s var(--a-ease),border-color .2s var(--a-ease);
}
.a-chip:hover{border-color:var(--a-violet)!important}
.a-chip.on{background:var(--a-ink)!important;color:#fff!important;border-color:var(--a-ink)!important}
.a-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.a-card{position:relative;border-radius:var(--a-r);overflow:hidden;background:var(--a-paper-2);aspect-ratio:3/4}
.a-card.is-off{display:none}
.a-card button{position:absolute;inset:0;width:100%;display:block;text-align:left}
.a-card img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;transition:transform .6s var(--a-ease)}
.a-card__t{
  position:absolute;left:0;right:0;bottom:0;padding:44px 16px 14px;color:#fff;
  background:linear-gradient(to top,rgba(13,10,28,.86),rgba(13,10,28,0));
  display:flex;flex-direction:column;gap:2px;
}
.a-card__t b{font-size:15px;font-weight:600;line-height:1.3}
.a-card__t span{font-size:13px;color:rgba(255,255,255,.78);opacity:0;transform:translateY(6px);transition:all .25s var(--a-ease)}
@media (hover:hover) and (pointer:fine){
  .a-card:hover img{transform:scale(1.05)}
  .a-card:hover .a-card__t span{opacity:1;transform:none}
}
@media (hover:none){.a-card__t span{opacity:1;transform:none}}
.a-looks__more{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:clamp(28px,3vw,40px)!important}
.a-looks__more p{color:var(--a-ink-2);font-size:15px;max-width:40ch}
.a-more{height:60px;padding:0 26px!important;border-radius:var(--a-r);border:1px solid var(--a-ink)!important;font-weight:600;color:var(--a-ink)!important;background:transparent!important}
.a-more:hover{background:var(--a-ink)!important;color:#fff!important}

/* ------------------------------------------------------------ польза */
.a-use__in{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:clamp(28px,4vw,64px);align-items:center;
  border-top:1px solid var(--a-line);padding-top:var(--a-sec)}
.a-use__g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.a-use__g li{border-radius:var(--a-r);overflow:hidden;background:#fff;box-shadow:0 1px 0 var(--a-line)}
.a-use__g button{display:block;width:100%;text-align:left}
.a-use__g img{width:100%;aspect-ratio:3/4.3;object-fit:cover;object-position:50% 0}
.a-use__g b{display:block;padding:12px 14px 14px;font-size:14px;font-weight:600;line-height:1.3}

/* ------------------------------------------------------------ возможности (аккордеон VOKS) */
.a-serv__in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,5vw,80px);align-items:start}
.a-serv__l{position:sticky;top:calc(var(--a-hdr) + 32px)}
.a-serv__l .a-sub{margin-bottom:28px!important}
.a-serv__r{border-top:1px solid var(--a-line)}
.a-serv__r details{border-bottom:1px solid var(--a-line)}
.a-serv__r summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:clamp(20px,2.2vw,28px) 0;font-size:clamp(20px,2vw,28px);font-weight:600;letter-spacing:-.02em;
}
.a-serv__r summary::-webkit-details-marker{display:none}
.a-serv__r summary::after{
  content:'';flex:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--a-line);
  background:
    linear-gradient(var(--a-ink),var(--a-ink)) center/14px 2px no-repeat,
    linear-gradient(var(--a-ink),var(--a-ink)) center/2px 14px no-repeat;
  transition:transform .3s var(--a-ease),background-color .2s,border-color .2s;
}
.a-serv__r summary:hover::after{border-color:var(--a-violet)}
.a-serv__r details[open] summary::after{transform:rotate(45deg);background-color:var(--a-ink);
  background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff)}
.a-serv__lead{color:var(--a-ink-2);margin-bottom:14px!important;max-width:58ch}
.a-lst{display:grid;gap:10px;padding-bottom:28px!important}
.a-lst li{position:relative;padding-left:24px!important;color:var(--a-ink-2);line-height:1.55}
.a-lst li::before{content:'';position:absolute;left:0;top:.62em;width:10px;height:2px;background:var(--a-violet)}
.a-lst b{color:var(--a-ink);font-weight:600}
.a-serv__r details .a-lnk{margin:-8px 0 28px}

/* ------------------------------------------------------------ нейросети */
.a-models,.a-trends,.a-how{background:var(--a-night);color:#fff;padding:var(--a-sec) 0}
.a-models__in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr);gap:clamp(32px,5vw,80px);align-items:start}
.a-mdl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.a-mdl li>*{
  position:relative;display:flex;flex-direction:column;gap:8px;width:100%;height:100%;text-align:left;
  padding:24px 56px 24px 24px!important;border-radius:var(--a-r);background:var(--a-night-2)!important;
  border:1px solid var(--a-line-dk)!important;transition:border-color .25s var(--a-ease),transform .25s var(--a-ease),background .25s;
}
.a-mdl b{font-size:clamp(22px,2vw,28px);font-weight:600;letter-spacing:-.02em;color:#fff}
.a-mdl span{font-size:15px;color:var(--a-mute);line-height:1.5}
.a-mdl i{position:absolute;right:22px;top:24px;font-style:normal;font-size:20px;color:#c084fc;transition:transform .25s var(--a-ease)}
.a-mdl li>*:hover{border-color:rgba(192,132,252,.55)!important;background:var(--a-night-3)!important}
.a-mdl li>*:hover i{transform:translateX(4px)}

/* ------------------------------------------------------------ тренды */
.a-trends{padding-top:0}
.a-trends__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center;
  border-top:1px solid var(--a-line-dk);padding-top:var(--a-sec)}
.a-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:32px 0 28px!important}
.a-facts li{border-top:1px solid var(--a-line-dk);padding-top:16px!important}
.a-facts b{display:inline-block;font-size:clamp(30px,3vw,44px);font-weight:600;letter-spacing:-.03em;line-height:1;
  background:var(--a-grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.a-facts span{display:block;margin-top:8px;font-size:14px;color:var(--a-mute)}
.a-trends__where{font-size:15px;color:var(--a-mute)}
.a-trends__where a{color:#fff;border-bottom:1px solid rgba(255,255,255,.3)}
.a-phones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,2vw,28px);align-items:start}
.a-phone--b{margin-top:clamp(28px,5vw,72px)!important}
.a-phone__scr{
  position:relative;border-radius:28px;overflow:hidden;aspect-ratio:9/16;background:#000;
  border:6px solid #221c3b;box-shadow:0 30px 70px -30px rgba(109,63,240,.55),0 0 0 1px rgba(255,255,255,.06);
}
.a-phone__scr video{width:100%;height:100%;object-fit:cover;display:block}
.a-phone__snd{
  position:absolute;right:12px;bottom:12px;width:44px;height:44px;border-radius:50%;
  display:grid;place-items:center;color:#fff!important;background:rgba(13,10,28,.6)!important;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18)!important;
}
.a-phone__snd svg{width:22px;height:22px}
.a-phone__snd .w{display:none}
.a-phone__snd[aria-pressed="true"] .w{display:block}
.a-phone__snd[aria-pressed="true"] .x{display:none}
.a-phone figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:14px;font-size:15px}
.a-phone figcaption b{font-weight:600}
.a-phone figcaption a{color:#c084fc;white-space:nowrap}
.a-phone figcaption a i{font-style:normal}

/* ------------------------------------------------------------ где работает */
.a-where__hd{max-width:760px;margin-bottom:clamp(28px,3.4vw,44px)!important}
.a-pl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.a-pl__c{position:relative;display:flex;flex-direction:column;gap:10px;padding:26px 24px!important;border-radius:var(--a-r);
  background:#fff;border:1px solid var(--a-line);transition:transform .25s var(--a-ease),box-shadow .25s var(--a-ease)}
.a-pl__c:hover{transform:translateY(-3px);box-shadow:0 22px 40px -26px rgba(22,19,31,.35)}
.a-pl__ic{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;color:#fff;margin-bottom:8px}
.a-pl__ic svg{width:24px;height:24px}
.a-pl__c--tg .a-pl__ic{background:#229ed9}
.a-pl__c--vk .a-pl__ic{background:#0077ff}
.a-pl__c--max .a-pl__ic{background:var(--a-plate)}
.a-pl__c--web .a-pl__ic{background:var(--a-ink)}
.a-pl__c h3{font-size:22px;font-weight:600;letter-spacing:-.02em}
.a-pl__c p{color:var(--a-ink-2);font-size:15px;line-height:1.5;flex:1}
.a-pl__a{display:inline-flex;align-items:center;gap:8px;margin-top:8px;font-weight:600;color:var(--a-violet)!important;align-self:flex-start}
.a-pl__a i{font-style:normal;transition:transform .2s var(--a-ease)}
.a-pl__c:hover .a-pl__a i{transform:translateX(4px)}

/* ------------------------------------------------------------ почему */
.a-why{padding-top:0}
.a-why__in{border-top:1px solid var(--a-line);padding-top:var(--a-sec)}
.a-why__l{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:clamp(20px,3vw,40px)!important;counter-reset:w}
.a-why__l li{counter-increment:w;padding:28px 28px 32px 0!important;border-top:1px solid var(--a-line)}
.a-why__l li:nth-child(3n+2),.a-why__l li:nth-child(3n){padding-left:28px!important;border-left:1px solid var(--a-line)}
.a-why__l li::before{content:counter(w,decimal-leading-zero);display:block;font-size:13px;font-weight:600;color:var(--a-violet);
  letter-spacing:.08em;margin-bottom:18px}
.a-why__l b{display:block;font-size:clamp(19px,1.6vw,22px);font-weight:600;letter-spacing:-.015em;margin-bottom:10px}
.a-why__l p{color:var(--a-ink-2);font-size:15px;line-height:1.55}

/* ------------------------------------------------------------ шаги */
.a-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:clamp(24px,3vw,40px)!important}
.a-steps li{padding:30px 28px!important;border-radius:var(--a-r);background:var(--a-night-2);border:1px solid var(--a-line-dk)}
.a-steps__n{display:block;font-size:clamp(44px,5vw,72px);font-weight:600;line-height:1;letter-spacing:-.04em;margin-bottom:22px;
  background:var(--a-grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.a-steps b{display:block;font-size:22px;font-weight:600;margin-bottom:8px}
.a-steps p{color:var(--a-mute);font-size:15px}

/* ------------------------------------------------------------ цены */
.a-price__hd{max-width:760px;margin-bottom:clamp(28px,3.4vw,44px)!important}
.a-pk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.a-pk li>button{
  position:relative;display:flex;flex-direction:column;gap:6px;width:100%;text-align:left;padding:26px 24px 24px!important;
  border-radius:var(--a-r);background:#fff!important;border:1px solid var(--a-line)!important;
  transition:transform .25s var(--a-ease),box-shadow .25s var(--a-ease),border-color .25s;
}
.a-pk li>button:hover{transform:translateY(-3px);border-color:var(--a-violet)!important;box-shadow:0 22px 40px -26px rgba(109,63,240,.45)}
.a-pk__c{font-size:clamp(30px,3vw,40px);font-weight:600;letter-spacing:-.03em;line-height:1.05}
.a-pk__c small{font-size:16px;font-weight:500;color:var(--a-ink-2);letter-spacing:0;margin-left:6px}
.a-pk__b{font-size:14px;color:#1a8a5a;font-weight:600;min-height:1.5em}
.a-pk__n{font-size:14px;color:var(--a-ink-2)}
.a-pk__p{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding-top:14px;border-top:1px solid var(--a-line);
  font-size:20px;font-weight:600}
.a-pk__p i{font-style:normal;font-size:15px;color:var(--a-violet)}
.a-pk__tag{position:absolute;top:16px;right:16px;font-size:12px;font-weight:600;padding:5px 10px;border-radius:999px;
  background:var(--a-ink);color:#fff}
.a-pk__tag--hot{background:var(--a-plate)}
.a-price__note{margin-top:22px!important;color:var(--a-ink-2);font-size:15px}

/* ------------------------------------------------------------ начать */
.a-start{background:var(--a-hero-bg);color:#fff;padding:clamp(80px,10vw,140px) 0;overflow:hidden;isolation:isolate}
.a-start::before{content:'';position:absolute;inset:-20% -10%;z-index:-1;
  background:radial-gradient(40% 50% at 20% 30%,rgba(96,176,255,.18),transparent 70%),radial-gradient(40% 50% at 80% 70%,rgba(244,114,182,.18),transparent 70%)}
.a-start__in{text-align:center;display:flex;flex-direction:column;align-items:center}
.a-start__h{font-size:var(--a-f-h1);font-weight:600;line-height:1.02;letter-spacing:-.035em;max-width:14ch}
.a-start__h em{font-style:normal;background:var(--a-grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.a-start__p{margin:20px 0 34px!important;font-size:clamp(16px,1.3vw,20px);color:rgba(255,255,255,.82)}
.a-start__cta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}

/* ------------------------------------------------------------ подвал */
.a-foot{background:#08061a;color:#fff;padding:56px 0 36px}
.a-foot__top{display:flex;flex-wrap:wrap;align-items:center;gap:24px 40px;padding-bottom:28px;border-bottom:1px solid var(--a-line-dk)}
.a-foot__n{display:flex!important;flex-wrap:wrap;gap:8px 26px;flex:1}
.a-foot__n button{font-size:15px;color:rgba(255,255,255,.78)!important;transition:color .2s}
.a-foot__n button:hover{color:#fff!important}
.a-soc{display:flex!important;gap:10px}
.a-soc a{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;border:1px solid var(--a-line-dk);color:#fff;transition:all .2s}
.a-soc a:hover{background:#fff;color:var(--a-ink)}
.a-soc svg{width:20px;height:20px}
.a-foot__bot{padding-top:24px;display:grid;gap:10px;font-size:14px;color:rgba(255,255,255,.55)}
.a-foot__legal{display:flex!important;flex-wrap:wrap;gap:6px 22px}
.a-foot__legal a:hover,.a-foot__bot a:hover{color:#fff}

/* плашка бренда (главная и шапка приложения) */
.a-logo{display:flex}
.a-plate{
  display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 16px;border-radius:10px;
  background:var(--a-plate);color:#fff;font-weight:700;font-size:19px;letter-spacing:.14em;line-height:1;
  font-family:'Onest',system-ui,sans-serif;
}

/* ------------------------------------------------------------ адаптив */
@media (max-width:1100px){
  .a-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .a-pl{grid-template-columns:repeat(2,minmax(0,1fr))}
  .a-use__in{grid-template-columns:1fr}
}
@media (max-width:900px){
  .a-hero__in{grid-template-columns:1fr}
  .a-reel__cols{height:380px;transform:rotate(-3deg) scale(1.04)}
  .a-looks__hd,.a-serv__in,.a-models__in,.a-trends__in{grid-template-columns:1fr}
  .a-chips{justify-content:flex-start}
  .a-serv__l{position:static}
  .a-why__l{grid-template-columns:repeat(2,minmax(0,1fr))}
  .a-why__l li,.a-why__l li:nth-child(3n+2),.a-why__l li:nth-child(3n){padding:24px 20px 26px 0!important;border-left:0}
  .a-why__l li:nth-child(2n){padding-left:20px!important;border-left:1px solid var(--a-line)}
  .a-steps{grid-template-columns:1fr}
  .a-pk{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .a-nums{grid-template-columns:1fr;gap:18px}
  .a-nums>div{display:flex;align-items:baseline;gap:14px}
  .a-nums dd{margin-top:0!important}
  .a-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .a-card__t{padding:36px 12px 10px}
  .a-card__t b{font-size:14px}
  .a-use__g{grid-template-columns:repeat(2,minmax(0,1fr))}
  .a-mdl{grid-template-columns:1fr}
  .a-pl{grid-template-columns:1fr}
  .a-why__l{grid-template-columns:1fr}
  .a-why__l li:nth-child(2n){padding-left:0!important;border-left:0}
  .a-facts{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .a-pk{grid-template-columns:1fr}
  .a-hero__cta .a-btn{flex:1 1 100%}
  .a-start__cta .a-btn{flex:1 1 100%}
  .a-btn{min-height:56px}
}

@media (prefers-reduced-motion:reduce){
  .a-home *{animation:none!important;transition:none!important}
  .a-reel__col{transform:none!important}
}

/* ========================= ЧАСТЬ 2. ПРИЛОЖЕНИЕ ========================= */

/* шрифт с кириллицей на всё приложение */
body,button,input,select,textarea{font-family:'Onest',system-ui,'Segoe UI',sans-serif!important}
body{background:var(--a-night)!important;color:#fff}
/* старый фон (картинка, полосы сияния, неоновые частицы) убран: спокойный фирменный фон */
.bg-image,.bg-overlay,.aurora,#bgCanvas{display:none!important}
/* фон — слоем ПОД всем (z-index:-1): если поднять #app своим z-index, меню и окна приложения
   запираются в его слое и плавающие кнопки ложатся поверх меню */
body::before{
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(55% 45% at 100% 0%,rgba(138,79,232,.16),transparent 70%),
    radial-gradient(45% 40% at 0% 100%,rgba(96,176,255,.08),transparent 70%),
    var(--a-night);
}

/* заставка: плашка бренда и тонкая полоса вместо кольца с частицами */
#splash-screen{background:var(--a-hero-bg)!important}
.sp2{display:flex;flex-direction:column;align-items:center;gap:22px}
.sp2 .a-plate{height:64px;padding:0 26px;font-size:28px;border-radius:14px;box-shadow:0 20px 60px -20px rgba(138,79,232,.8);
  animation:sp2-in .7s var(--a-ease) both}
.sp2-bar{display:block;width:140px;height:2px;border-radius:2px;background:rgba(255,255,255,.12);overflow:hidden;position:relative}
.sp2-bar::after{content:'';position:absolute;inset:0;width:40%;background:var(--a-grad);animation:sp2-run 1.1s ease-in-out infinite}
@keyframes sp2-in{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}
@keyframes sp2-run{0%{transform:translateX(-100%)}100%{transform:translateX(250%)}}
@media (prefers-reduced-motion:reduce){.sp2 .a-plate,.sp2-bar::after{animation:none}}

/* ---------------------------------------------- шапка */
header{
  --hd-h:var(--a-hdr);
  height:var(--a-hdr)!important;padding:0 clamp(12px,2.2vw,28px)!important;gap:18px!important;
  background:rgba(13,10,28,.78)!important;border-bottom:1px solid rgba(255,255,255,.08)!important;
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
  transition:background-color .35s var(--a-ease),border-color .35s var(--a-ease),color .35s!important;
}
header.is-scrolled{box-shadow:none!important}
.header-logo,.header-wordmark,.header-divider{display:none!important}
.hdr-plate{cursor:pointer;flex:none;display:flex;border:0;background:none;padding:0}
.hdr-plate .a-plate{height:40px;font-size:17px;padding:0 14px}
header nav{gap:4px!important}
.nav-btn{font-size:15px!important;font-weight:500!important;color:rgba(255,255,255,.7)!important;padding:10px 14px!important;border-radius:10px!important}
.nav-btn:hover{color:#fff!important;background:rgba(255,255,255,.06)!important}
.nav-btn.active{color:#fff!important;font-weight:600!important}
/* ключевой свет у активного пункта — тонкая полоса градиента бренда */
.nav-light{height:3px!important;top:auto!important;bottom:-12px!important;transform:translateX(var(--lx,0px))!important;
  border-radius:3px!important;background:var(--a-grad)!important;box-shadow:0 0 14px rgba(192,132,252,.6)!important}
.header-right>*{height:38px!important;border-radius:10px!important;font-size:14px!important}
.balance-badge{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.12)!important;color:#fff!important;box-shadow:none!important}
.balance-badge::before{background:#c084fc!important;opacity:1!important}
.btn-topup,.btn-login{background:var(--a-violet)!important;border:0!important;color:#fff!important;box-shadow:none!important;padding:0 16px!important}
.btn-topup:hover,.btn-login:hover{background:var(--a-violet-dk)!important}
.btn-profile{background:rgba(255,255,255,.06)!important;color:#fff!important;border:1px solid rgba(255,255,255,.12)!important}
.btn-profile:hover{background:rgba(255,255,255,.12)!important;box-shadow:none!important}
.hamburger-line{background:#fff!important}
/* светлая шапка над светлыми секциями главной (home.js ставит класс) */
header.a-hdr--light{background:rgba(246,244,251,.9)!important;border-bottom-color:var(--a-line)!important}
header.a-hdr--light .nav-btn{color:rgba(22,19,31,.66)!important}
header.a-hdr--light .nav-btn:hover{color:var(--a-ink)!important;background:rgba(22,19,31,.05)!important}
header.a-hdr--light .nav-btn.active{color:var(--a-ink)!important}
header.a-hdr--light .balance-badge,header.a-hdr--light .btn-profile{background:#fff!important;color:var(--a-ink)!important;border-color:var(--a-line)!important}
header.a-hdr--light .hamburger-line{background:var(--a-ink)!important}
header.a-hdr--hero{background:rgba(11,9,24,.35)!important;border-bottom-color:rgba(255,255,255,.08)!important}

/* мобильное меню */
.mobile-nav-panel{background:var(--a-night-2)!important;border-left:1px solid rgba(255,255,255,.08)!important}
.mobile-nav-link{font-size:18px!important;font-weight:500!important;border-radius:12px!important}
.mobile-nav-link.active{background:rgba(109,63,240,.18)!important;color:#fff!important}

/* ---------------------------------------------- общие компоненты */
.card{
  background:var(--a-night-2)!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:18px!important;
  box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
.card:hover{border-color:rgba(192,132,252,.28)!important}
h1,h2,h3{letter-spacing:-.02em}
.card h2{font-size:24px!important;font-weight:600!important;-webkit-text-fill-color:currentColor!important;background:none!important;color:#fff!important}
label{color:rgba(255,255,255,.72)!important;font-weight:500!important}
input[type=text],input[type=email],input[type=number],input[type=search],input:not([type]),select,textarea{
  background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:12px!important;
  color:#fff!important;font-size:15px!important;
}
input:focus,select:focus,textarea:focus{border-color:#8a4fe8!important;box-shadow:0 0 0 3px rgba(138,79,232,.25)!important;outline:0!important}
select option{background:#15112b;color:#fff}
.btn-primary,#generate-btn,.modal-buy-btn,#modal-buy-btn{
  background:var(--a-violet)!important;border:0!important;border-radius:12px!important;color:#fff!important;
  font-weight:600!important;box-shadow:0 12px 30px -14px rgba(109,63,240,.9)!important;
}
.btn-primary:hover,#generate-btn:hover,#modal-buy-btn:hover{background:var(--a-violet-dk)!important}
.btn-primary:disabled,#generate-btn:disabled{opacity:.6}
.upload-area{border:1.5px dashed rgba(192,132,252,.4)!important;border-radius:14px!important;background:rgba(138,79,232,.06)!important}
.upload-area:hover{border-color:#c084fc!important;background:rgba(138,79,232,.1)!important}
.hint{color:rgba(255,255,255,.6)!important}

/* каталог и фотосессии */
.tag-btn{border-radius:999px!important;border:1px solid rgba(255,255,255,.14)!important;background:transparent!important;
  color:rgba(255,255,255,.78)!important;font-weight:500!important}
.tag-btn:hover{border-color:#c084fc!important;color:#fff!important}
.tag-btn.active{background:#fff!important;color:var(--a-ink)!important;border-color:#fff!important}
.grid-card{border-radius:16px!important;background:var(--a-night-2)!important;border:1px solid rgba(255,255,255,.07)!important;
  overflow:hidden;transition:transform .25s var(--a-ease),border-color .25s!important}
.grid-card:hover{transform:translateY(-3px);border-color:rgba(192,132,252,.45)!important;box-shadow:0 20px 40px -24px rgba(109,63,240,.6)!important}
.grid-card-title{font-weight:600!important}
.grid-card-price{background:rgba(13,10,28,.72)!important;border-radius:999px!important;backdrop-filter:blur(6px)}
.catalog-filter-toggle,.catalog-filter-dropdown{border-radius:12px!important;background:var(--a-night-2)!important;border:1px solid rgba(255,255,255,.12)!important}
.a-more-row{grid-column:1/-1;height:1px}

/* окно заказа */
.modal-card{background:var(--a-night-2)!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:22px!important}
.modal-price{color:#c084fc!important}

/* пополнение */
.topup-title{font-size:clamp(28px,3vw,40px)!important;font-weight:600!important;letter-spacing:-.03em!important;
  background:none!important;-webkit-text-fill-color:#fff!important;color:#fff!important}
.topup-info-item,.topup-card,.topup-package{border-radius:16px!important}

/* подвал приложения — только ссылки, спокойно */
.site-footer{border-top:1px solid rgba(255,255,255,.08)!important;background:transparent!important}
.lp-footer{display:none!important}
/* на главной свой подвал — общий подвал приложения прячем, иначе два подвала подряд */
#page-home:not(.hidden) ~ .site-footer{display:none!important}

/* окно входа */
.auth-card{background:var(--a-night-2)!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:22px!important}
.auth-card h1{font-weight:600!important;letter-spacing:-.03em}

/* печенье */
.cookie-banner{background:var(--a-night-2)!important;border-color:rgba(192,132,252,.35)!important}
.cookie-accept{background:var(--a-violet)!important}

/* пополнение: одна система вместо оранжевых цифр и разноцветных эмодзи */
.pkg-card{background:var(--a-night-2)!important;border:1px solid rgba(255,255,255,.09)!important;border-radius:18px!important}
.pkg-card::before{display:none!important}
.pkg-card:hover{border-color:rgba(192,132,252,.5)!important;background:var(--a-night-3)!important}
.pkg-featured{border-color:rgba(192,132,252,.55)!important;box-shadow:0 24px 50px -30px rgba(138,79,232,.8)!important}
.pkg-featured::after{display:none!important}
.pkg-icon{display:none!important}
.pkg-name{letter-spacing:.14em!important;color:rgba(255,255,255,.55)!important}
.pkg-coins-num{background:none!important;-webkit-text-fill-color:#fff!important;color:#fff!important;letter-spacing:-.03em}
.pkg-tag{background:var(--a-plate)!important;border-radius:999px!important}
.pkg-bonus{color:#6ee7b7!important}
.pkg-bonus-none{color:transparent!important}
.pkg-details{border-radius:12px!important}
.pkg-buy-btn{background:var(--a-violet)!important;border-radius:12px!important;box-shadow:none!important}
.pkg-card:hover .pkg-buy-btn{background:var(--a-violet-dk)!important}
.topup-info-item{background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.1)!important}

/* плавающие кнопки: компактнее; на главной ссылки на ботов уже на каждом экране — там только поддержка */
.floating-bot-btn{width:44px!important;height:44px!important;box-shadow:0 8px 22px -8px rgba(0,0,0,.6)!important}
.floating-bot-btn svg{width:20px;height:20px}
.floating-bot-btn.support-btn{background:var(--a-violet)!important;border-color:transparent!important}
body.a-on-home .floating-bots .tg-bot,body.a-on-home .floating-bots .vk-bot{display:none!important}
@media (max-width:640px){
  .floating-bots{right:12px!important;bottom:calc(14px + env(safe-area-inset-bottom))!important;gap:8px!important}
  .floating-bot-btn{width:40px!important;height:40px!important}
}

/* профиль */
.profile-topup-btn{background:var(--a-violet)!important;border-radius:12px!important;box-shadow:none!important}
.profile-topup-btn:hover{background:var(--a-violet-dk)!important}

/* низ мобильного меню */
.mobile-nav-topup{background:var(--a-violet)!important;border-radius:12px!important;box-shadow:none!important;color:#fff!important}
.mobile-nav-balance>*{height:36px!important;padding:0 12px!important;font-size:15px!important;border-radius:10px!important}
.mobile-nav-action{border-radius:12px!important}

/* появление блоков (как data-rise у VOKS): прячем, только если скрипт главной жив (класс a-js) */
.a-home.a-js [data-rise]{opacity:0;transform:translateY(22px);transition:opacity .7s var(--a-ease),transform .7s var(--a-ease)}
.a-home.a-js [data-rise].on{opacity:1;transform:none}
.a-home.a-js .a-mdl li:nth-child(2n)[data-rise],.a-home.a-js .a-pl li:nth-child(2)[data-rise],
.a-home.a-js .a-why__l li:nth-child(3n+2)[data-rise],.a-home.a-js .a-steps li:nth-child(2)[data-rise]{transition-delay:.08s}
.a-home.a-js .a-pl li:nth-child(3)[data-rise],.a-home.a-js .a-why__l li:nth-child(3n)[data-rise],.a-home.a-js .a-steps li:nth-child(3)[data-rise]{transition-delay:.16s}
.a-home.a-js .a-pl li:nth-child(4)[data-rise]{transition-delay:.24s}
.a-home.a-js .a-phone--b[data-rise]{transition-delay:.12s}

/* подсказки на пустом экране «Фото» (home.js) */
.a-ideas{margin-top:26px;width:100%;max-width:520px}
.a-ideas p{font-size:15px;color:rgba(255,255,255,.72);margin-bottom:12px}
.a-ideas ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;list-style:none;padding:0;margin:0}
.a-ideas button{position:relative;display:block;width:100%;padding:0;border:1px solid rgba(255,255,255,.08);border-radius:12px;
  overflow:hidden;background:#1d1733;cursor:pointer;aspect-ratio:3/4;transition:transform .25s var(--a-ease),border-color .25s}
.a-ideas button:hover{transform:translateY(-2px);border-color:rgba(192,132,252,.6)}
.a-ideas img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;display:block}
.a-ideas span{position:absolute;left:0;right:0;bottom:0;padding:22px 8px 7px;font-size:12px;font-weight:600;line-height:1.25;
  color:#fff;text-align:left;background:linear-gradient(to top,rgba(13,10,28,.9),rgba(13,10,28,0))}
.a-ideas .a-ideas__all{margin-top:12px;background:none;border:0;aspect-ratio:auto;color:#c084fc;font-weight:600;font-size:15px;padding:6px 0;text-align:left}
@media (max-width:640px){.a-ideas ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}}
@media (prefers-reduced-motion:reduce){.a-home.a-js [data-rise]{opacity:1;transform:none;transition:none}}
