/* =========================================================
   FLUX — общие стили всех страниц портфолио.
   Подключается на /, /sites/, /bots/, /ai/, /automation/,
   /solutions/, /works/.
   ========================================================= */
:root{
  --bg:#07060b; --bg2:#0f0e16; --card:#13121c; --ink:#f4f3f8; --muted:#8e8b9c; --line:#23212f;
  --lime:#c6ff3d; --violet:#8b5cff; --pink:#ff4fd8; --orange:#ff7a3d; --cyan:#3de0ff;
  --grad:linear-gradient(100deg,var(--lime),var(--cyan) 35%,var(--violet) 65%,var(--pink));
  --r:26px; --w:1280px; --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);overflow-x:hidden;overflow-x:clip}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{background:var(--bg);color:var(--ink);font:17px/1.6 Onest,system-ui,sans-serif;-webkit-font-smoothing:antialiased;width:100%;max-width:100%;overflow-x:hidden;overflow-x:clip;overscroll-behavior-x:none}
::selection{background:var(--lime);color:#000}
a{color:inherit;text-decoration:none}
h1,h2,h3,.disp{font-family:Unbounded,sans-serif;line-height:1.02;letter-spacing:-.03em;font-weight:800}
h2{font-size:clamp(34px,6vw,88px)}
@media(max-width:600px){h2{font-size:clamp(25px,7.2vw,34px)}}
h3{font-size:20px;font-weight:600;letter-spacing:-.01em;line-height:1.2}
.wrap{max-width:var(--w);margin:0 auto;padding:0 16px}
@media(min-width:700px){.wrap{padding:0 32px}}
section{position:relative;padding:clamp(80px,12vw,160px) 0}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 13px Onest;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:24px}
.eyebrow:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 16px var(--lime)}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:gradmove 6s linear infinite}
@keyframes gradmove{to{background-position:-200% 0}}
.lead{font-size:clamp(18px,1.7vw,22px);color:var(--muted);max-width:640px;margin-top:28px}
.split-line{overflow:hidden;display:block}

/* иконки: единый набор SVG вместо эмодзи */
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.ic{width:24px;height:24px;flex:none;display:inline-block;vertical-align:-.15em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ic--sm{width:19px;height:19px}

/* зерно поверх всего */
.grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-5%,4%)}40%{transform:translate(4%,-3%)}60%{transform:translate(-3%,-5%)}80%{transform:translate(5%,2%)}}

/* курсор */
.cursor{position:fixed;left:0;top:0;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fff;mix-blend-mode:difference;pointer-events:none;z-index:100;transition:width .3s var(--ease),height .3s var(--ease),margin .3s var(--ease)}
.cursor.is-big{width:80px;height:80px;margin:-40px 0 0 -40px}
.cursor span{position:absolute;inset:0;display:grid;place-items:center;font:700 11px Onest;color:#000;opacity:0;transition:.2s;letter-spacing:.05em}
.cursor.is-view span{opacity:1}
@media(hover:none){.cursor{display:none}}

/* кнопки */
.btn{position:relative;display:inline-flex;align-items:center;gap:12px;padding:18px 30px;border-radius:999px;background:var(--lime);color:#07060b;font:700 16px Onest;border:0;cursor:pointer;overflow:hidden;isolation:isolate;transition:transform .3s var(--ease)}
.btn:after{content:"";position:absolute;inset:0;background:#fff;border-radius:inherit;transform:translateY(101%);transition:transform .45s var(--ease);z-index:-1}
.btn:hover:after{transform:none}
.btn--ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn--ghost:hover{color:#07060b}
.btn .arr{display:inline-block;transition:transform .3s var(--ease)}
.btn:hover .arr{transform:translateX(4px) rotate(-45deg)}

/* шапка */
.top{position:fixed;inset:0 0 auto;padding:8px 16px;z-index:50;display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:12px;pointer-events:none}
.top:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:rgba(7,6,11,.86);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.07);box-shadow:0 10px 30px -18px rgba(0,0,0,.6);opacity:0;transition:opacity .5s var(--ease)}
.top.solid:before{opacity:1}
.top.solid .logo{mix-blend-mode:normal}
[data-theme="light"] .top:before{background:rgba(247,246,242,.9);border-bottom-color:rgba(20,18,30,.08);box-shadow:0 10px 30px -20px rgba(20,18,30,.25)}
.top>*{pointer-events:auto}
.logo{flex:0 0 auto;white-space:nowrap;font:800 22px Unbounded;letter-spacing:-.04em;display:flex;align-items:center;gap:8px;line-height:1;mix-blend-mode:difference}
.logo b{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--lime);box-shadow:0 0 20px var(--lime)}
.nav{display:flex;gap:2px;padding:6px;border-radius:999px;background:rgba(19,18,28,.6);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.06)}
.nav a{padding:10px 14px;border-radius:999px;font-size:14px;font-weight:500;color:var(--muted);transition:.2s;white-space:nowrap}
.nav a:hover{color:var(--ink);background:rgba(255,255,255,.06)}
.nav a.on{color:#07060b;background:var(--lime)}
.top .btn{flex:0 0 auto;white-space:nowrap;padding:13px 22px;font-size:14px}
.top .btn .lbl{margin-left:-12px}
@media(max-width:1220px){.nav a{padding:10px 11px;font-size:13px}}
@media(max-width:1080px){.nav{display:none}}

/* бургер и мобильное меню */
.burger{display:none;flex:0 0 auto;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:rgba(19,18,28,.7);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:var(--ink);cursor:pointer;align-items:center;justify-content:center}
.burger i{display:block;width:18px;height:2px;background:currentColor;border-radius:2px;position:relative;transition:.25s var(--ease)}
.burger i:before,.burger i:after{content:"";position:absolute;left:0;width:18px;height:2px;background:currentColor;border-radius:2px;transition:.25s var(--ease)}
.burger i:before{top:-6px}.burger i:after{top:6px}
.burger.on i{background:transparent}
.burger.on i:before{transform:translateY(6px) rotate(45deg)}
.burger.on i:after{transform:translateY(-6px) rotate(-45deg)}
@media(max-width:1080px){.burger{display:flex}}
.mnav{position:fixed;inset:0;z-index:49;background:rgba(7,6,11,.97);backdrop-filter:blur(20px);display:none;flex-direction:column;justify-content:center;gap:6px;padding:90px 24px 40px}
.mnav.on{display:flex}
.mnav a{font:700 clamp(26px,7vw,40px) Unbounded;letter-spacing:-.03em;padding:8px 0;color:var(--ink)}
.mnav a.on{color:var(--lime)}
.mnav .btn{margin-top:28px;align-self:flex-start;font:700 16px Onest;color:#07060b}

@media(max-width:600px){
  .top{padding:6px 12px;gap:10px}
  .logo{font-size:19px;gap:7px}
  .logo b{width:10px;height:10px}
  .top .btn{padding:11px 16px;font-size:13px;gap:8px}
  .top .btn .lbl{display:none}
  .burger{width:42px;height:42px}
}

/* HERO главной */
.hero{min-height:100svh;padding:0;display:flex;align-items:flex-start;overflow:hidden}
#gl{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,var(--bg));pointer-events:none}
.hero__in{position:relative;z-index:2;width:100%;padding-top:clamp(96px,15vh,150px);padding-bottom:130px}
.hero h1{font-size:clamp(30px,min(8.2vw,11.5vh),130px);line-height:.9;letter-spacing:-.05em}
.hero h1 .row{display:block;overflow:hidden;padding-bottom:.04em}
.hero h1 .row>span{display:inline-block}
.hero h1 .row>.rot{display:inline-grid;vertical-align:bottom;overflow:hidden;padding-bottom:.06em}
.rot>span{grid-area:1/1;display:block}
.hero__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:28px;margin-top:40px}
.hero__bottom p{max-width:520px;color:#cfccd9;font-size:18px}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px}
/* ===== фоны первого экрана (тест, 15 вариантов; переключатель — hero-bg.js) ===== */
.hbg{position:absolute;inset:0;width:100%;height:100%;display:none;overflow:hidden;background:var(--bg);pointer-events:none}
.hero[data-bg="2"] .hbg2,.hero[data-bg="3"] .hbg3,.hero[data-bg="4"] .hbg4,.hero[data-bg="5"] .hbg5,.hero[data-bg="6"] .hbg6,.hero[data-bg="7"] .hbg7,.hero[data-bg="8"] .hbg8,.hero[data-bg="9"] .hbg9,.hero[data-bg="10"] .hbg10,.hero[data-bg="11"] .hbg11,.hero[data-bg="12"] .hbg12,.hero[data-bg="13"] .hbg13,.hero[data-bg="14"] .hbg14,.hero[data-bg="15"] .hbg15{display:block}
.hero[data-bg]:not([data-bg="1"]) #gl{display:none}
.hero:is([data-bg="11"],[data-bg="13"],[data-bg="14"]):after{opacity:.35}

/* 2 — северное сияние */
.hbg2 i{position:absolute;border-radius:50%;filter:blur(80px);opacity:.7;mix-blend-mode:screen;will-change:transform}
.hbg2 i:nth-child(1){width:52vw;height:52vw;left:-10vw;top:-18vw;background:var(--violet);animation:au1 18s ease-in-out infinite alternate}
.hbg2 i:nth-child(2){width:40vw;height:40vw;right:-8vw;top:-6vw;background:var(--lime);opacity:.5;animation:au2 22s ease-in-out infinite alternate}
.hbg2 i:nth-child(3){width:44vw;height:44vw;left:30vw;bottom:-26vw;background:var(--pink);opacity:.55;animation:au3 20s ease-in-out infinite alternate}
.hbg2 i:nth-child(4){width:30vw;height:30vw;right:14vw;bottom:-6vw;background:var(--cyan);opacity:.45;animation:au1 26s ease-in-out infinite alternate-reverse}
@keyframes au1{to{transform:translate(18vw,12vw) scale(1.2)}}
@keyframes au2{to{transform:translate(-22vw,16vw) scale(.85)}}
@keyframes au3{to{transform:translate(-14vw,-14vw) scale(1.15)}}
.hbg2 b{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:64px 64px;-webkit-mask:radial-gradient(ellipse 70% 60% at 50% 40%,#000,transparent 75%);mask:radial-gradient(ellipse 70% 60% at 50% 40%,#000,transparent 75%)}
[data-theme="light"] .hbg2 i{mix-blend-mode:multiply;opacity:.32}
[data-theme="light"] .hbg2 i:nth-child(2){opacity:.3}
[data-theme="light"] .hbg2 b{background-image:linear-gradient(rgba(20,18,30,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(20,18,30,.06) 1px,transparent 1px)}

/* 3 — живая сеть (canvas) */
.hbg3{background:radial-gradient(70% 60% at 75% 25%,color-mix(in srgb,var(--violet) 16%,transparent),transparent 70%),radial-gradient(50% 50% at 15% 80%,color-mix(in srgb,var(--lime) 10%,transparent),transparent 70%),var(--bg)}

/* 4 — меш-градиент, без анимации */
.hbg4{background:radial-gradient(at 12% 18%,color-mix(in srgb,var(--violet) 55%,transparent) 0,transparent 48%),radial-gradient(at 85% 12%,color-mix(in srgb,var(--lime) 45%,transparent) 0,transparent 45%),radial-gradient(at 78% 82%,color-mix(in srgb,var(--pink) 45%,transparent) 0,transparent 50%),radial-gradient(at 18% 92%,color-mix(in srgb,var(--cyan) 40%,transparent) 0,transparent 45%),radial-gradient(at 50% 50%,color-mix(in srgb,var(--violet) 20%,transparent) 0,transparent 60%),var(--bg)}
[data-theme="light"] .hbg4{background:radial-gradient(at 12% 18%,color-mix(in srgb,var(--violet) 28%,transparent) 0,transparent 48%),radial-gradient(at 85% 12%,color-mix(in srgb,var(--lime) 26%,transparent) 0,transparent 45%),radial-gradient(at 78% 82%,color-mix(in srgb,var(--pink) 24%,transparent) 0,transparent 50%),radial-gradient(at 18% 92%,color-mix(in srgb,var(--cyan) 26%,transparent) 0,transparent 45%),var(--bg)}

/* 5 — сетка точек, под курсором «прожектор» подсвечивает их зелёным */
.hbg5{--d:rgba(255,255,255,.2);background:radial-gradient(circle,var(--d) 1.2px,transparent 1.7px) 0 0/26px 26px,var(--bg)}
.hbg5:before{content:"";position:absolute;inset:0;background:radial-gradient(circle,var(--lime) 1.6px,transparent 2.1px) 0 0/26px 26px;-webkit-mask:radial-gradient(260px circle at var(--mx,70%) var(--my,40%),#000,transparent 70%);mask:radial-gradient(260px circle at var(--mx,70%) var(--my,40%),#000,transparent 70%)}
.hbg5:after{content:"";position:absolute;inset:0;background:radial-gradient(520px circle at var(--mx,70%) var(--my,40%),color-mix(in srgb,var(--lime) 14%,transparent),transparent 70%)}
.hbg5 i{position:absolute;inset:0;background:radial-gradient(ellipse 60% 50% at 50% 0%,color-mix(in srgb,var(--violet) 22%,transparent),transparent 70%)}
[data-theme="light"] .hbg5{--d:rgba(20,18,30,.22)}

/* 6 — светящаяся сфера */
.hbg6 i{position:absolute;width:min(62vmin,640px);aspect-ratio:1;right:6vw;top:50%;margin-top:calc(min(62vmin,640px) / -2);border-radius:50%;background:conic-gradient(from 0deg,var(--lime),var(--cyan),var(--violet),var(--pink),var(--lime));filter:blur(38px);opacity:.85;animation:spin 14s linear infinite}
.hbg6 b{position:absolute;width:min(50vmin,520px);aspect-ratio:1;right:calc(6vw + min(6vmin,60px));top:50%;margin-top:calc(min(50vmin,520px) / -2);border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.35),transparent 30%),radial-gradient(circle at 50% 50%,var(--bg) 40%,transparent 72%);mix-blend-mode:normal}
[data-theme="light"] .hbg6 i{opacity:.55}
@media(max-width:700px){.hbg6 i,.hbg6 b{right:-20vw;top:30%}}

/* 7–9 — видео + затемнение/осветление, чтобы читался текст */
.hbgv video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hbgv:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,6,11,.82),rgba(7,6,11,.45) 60%,rgba(7,6,11,.25))}
[data-theme="light"] .hbgv:after{background:linear-gradient(90deg,rgba(247,246,242,.92),rgba(247,246,242,.7) 60%,rgba(247,246,242,.45))}
.hbg9 video{filter:contrast(1.1)}
[data-theme="dark"] .hbg9 video{filter:invert(1) hue-rotate(180deg) contrast(1.1)}

/* 10 — лучи света */
.hbg10{background:radial-gradient(ellipse 80% 60% at 70% -10%,color-mix(in srgb,var(--violet) 25%,transparent),transparent 70%),var(--bg)}
.hbg10 i{position:absolute;top:-30%;height:160%;width:9vw;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--lime) 55%,transparent) 45%,transparent);filter:blur(22px);opacity:.5;transform:rotate(28deg);animation:beam 9s ease-in-out infinite alternate}
.hbg10 i:nth-child(1){left:40%}
.hbg10 i:nth-child(2){left:55%;width:4vw;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--violet) 70%,transparent) 45%,transparent);animation-duration:11s;animation-delay:-3s}
.hbg10 i:nth-child(3){left:68%;width:12vw;opacity:.35;animation-duration:13s;animation-delay:-6s}
.hbg10 i:nth-child(4){left:82%;width:3vw;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--pink) 70%,transparent) 45%,transparent);animation-duration:8s;animation-delay:-2s}
.hbg10 i:nth-child(5){left:92%;width:7vw;animation-duration:12s;animation-delay:-8s}
@keyframes beam{0%{opacity:.15;transform:rotate(28deg) translateX(-4vw)}100%{opacity:.6;transform:rotate(22deg) translateX(4vw)}}
[data-theme="light"] .hbg10 i{mix-blend-mode:multiply}

/* 11 — перспективная сетка, едет на зрителя */
.hbg11{background:radial-gradient(ellipse 70% 40% at 50% 62%,color-mix(in srgb,var(--violet) 30%,transparent),transparent 70%),var(--bg)}
.hbg11 i{position:absolute;left:-50%;right:-50%;top:52%;bottom:-40%;background-image:linear-gradient(color-mix(in srgb,var(--lime) 55%,transparent) 1.5px,transparent 1.5px),linear-gradient(90deg,color-mix(in srgb,var(--lime) 55%,transparent) 1.5px,transparent 1.5px);background-size:70px 70px;transform:perspective(420px) rotateX(62deg);transform-origin:50% 0;animation:gridMove 2.4s linear infinite;-webkit-mask:linear-gradient(180deg,transparent,#000 30%);mask:linear-gradient(180deg,transparent,#000 30%)}
@keyframes gridMove{to{background-position:0 70px}}
.hbg11 b{position:absolute;left:0;right:0;top:51.5%;height:2px;background:linear-gradient(90deg,transparent,var(--lime),transparent);box-shadow:0 0 30px 6px color-mix(in srgb,var(--lime) 40%,transparent)}
[data-theme="light"] .hbg11 i{opacity:.6}

/* 12 — стеклянные фигуры поверх цветных пятен */
.hbg12{background:radial-gradient(40% 50% at 75% 30%,color-mix(in srgb,var(--violet) 55%,transparent),transparent 70%),radial-gradient(35% 45% at 60% 80%,color-mix(in srgb,var(--pink) 45%,transparent),transparent 70%),radial-gradient(30% 40% at 90% 70%,color-mix(in srgb,var(--lime) 40%,transparent),transparent 70%),var(--bg)}
.hbg12 i{position:absolute;border:1px solid rgba(255,255,255,.25);background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,.04));backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 30px 60px -30px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.35);animation:glassF 10s ease-in-out infinite alternate}
.hbg12 i:nth-child(1){width:22vw;height:22vw;max-width:300px;max-height:300px;border-radius:50%;right:12vw;top:14%}
.hbg12 i:nth-child(2){width:16vw;height:24vw;max-width:220px;max-height:330px;border-radius:32px;right:30vw;top:40%;animation-duration:12s;animation-delay:-4s}
.hbg12 i:nth-child(3){width:12vw;height:12vw;max-width:160px;max-height:160px;border-radius:28px;right:5vw;top:58%;animation-duration:9s;animation-delay:-2s}
.hbg12 i:nth-child(4){width:8vw;height:8vw;max-width:110px;max-height:110px;border-radius:50%;right:40vw;top:12%;animation-duration:14s;animation-delay:-7s}
@keyframes glassF{0%{transform:translateY(0) rotate(0)}100%{transform:translateY(-30px) rotate(12deg)}}
[data-theme="light"] .hbg12 i{border-color:rgba(255,255,255,.7);background:linear-gradient(135deg,rgba(255,255,255,.55),rgba(255,255,255,.15))}

/* 13 — волны из линий (canvas) */
.hbg13{background:radial-gradient(60% 50% at 70% 50%,color-mix(in srgb,var(--violet) 12%,transparent),transparent 70%),var(--bg)}

/* 14 — огромный контурный текст бегущей строкой */
.hbg14{display:none;flex-direction:column;justify-content:center;gap:2vh;background:radial-gradient(60% 50% at 80% 30%,color-mix(in srgb,var(--lime) 10%,transparent),transparent 70%),var(--bg)}
.hero[data-bg="14"] .hbg14{display:flex}
.hbg14 div{display:flex;width:max-content;white-space:nowrap;font:800 clamp(90px,17vw,260px)/1 Unbounded;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px color-mix(in srgb,var(--ink) 16%,transparent);animation:bigRun 60s linear infinite}
.hbg14 div:nth-child(2){animation-direction:reverse;-webkit-text-stroke-color:color-mix(in srgb,var(--lime) 35%,transparent)}
.hbg14 span{padding-right:.3em}
@keyframes bigRun{to{transform:translateX(-50%)}}

/* 15 — минимализм: чистый фон, мягкая виньетка и зерно */
.hbg15{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.09'/%3E%3C/svg%3E"),radial-gradient(ellipse 80% 70% at 50% 0%,color-mix(in srgb,var(--ink) 5%,transparent),transparent 70%),var(--bg)}

@media(prefers-reduced-motion:reduce){.hbg *,.hbg:before,.hbg:after{animation:none!important}}

/* переключатель */
.bgsw{position:absolute;right:16px;bottom:16px;z-index:4;display:flex;flex-direction:column;gap:6px;width:min(360px,calc(100vw - 24px));padding:8px;border-radius:18px;background:rgba(19,18,28,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.1);font:600 12px Onest;color:var(--ink)}
.bgsw__top{display:flex;align-items:center;gap:6px}
.bgsw__name{flex:1;text-align:center;font:700 13px Onest;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bgsw__arr{flex:none;width:30px;height:30px;border-radius:50%;border:0;background:rgba(255,255,255,.08);color:var(--ink);font:700 18px/1 Onest;cursor:pointer}
.bgsw__nums{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth}
.bgsw__nums::-webkit-scrollbar{display:none}
.bgsw__nums button{flex:none;width:28px;height:28px;border-radius:50%;border:0;background:transparent;color:var(--muted);font:700 12px Onest;cursor:pointer;transition:.2s}
.bgsw__nums button:hover{color:var(--ink);background:rgba(255,255,255,.08)}
.bgsw__nums button.on{background:var(--lime);color:#07060b}
[data-theme="light"] .bgsw{background:rgba(255,255,255,.88);border-color:rgba(20,18,30,.08);box-shadow:0 10px 30px -18px rgba(20,18,30,.3)}
[data-theme="light"] .bgsw__arr{background:rgba(20,18,30,.06)}
[data-theme="light"] .bgsw__nums button.on{color:#fff}
@media(max-width:700px){.bgsw{right:12px;left:12px;width:auto;bottom:12px}.hero .scrollhint{bottom:104px}.hero .hero__in{padding-bottom:210px}}

/* подсказка «листайте вниз»: мышка с колёсиком + прыгающая стрелка */
.scrollhint{position:absolute;left:50%;bottom:clamp(20px,4vh,40px);z-index:3;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--muted);text-decoration:none;font:600 11px Onest;letter-spacing:.2em;text-transform:uppercase;transition:color .3s}
.scrollhint:hover{color:var(--ink)}
.scrollhint__m{position:relative;width:24px;height:38px;border:2px solid currentColor;border-radius:14px;opacity:.85}
.scrollhint__m:before{content:"";position:absolute;left:50%;top:7px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--lime);animation:shWheel 1.8s var(--ease) infinite}
.scrollhint svg{width:18px;height:18px;margin-top:-2px;color:var(--lime);animation:shDown 1.8s var(--ease) infinite}
@keyframes shWheel{0%{opacity:0;transform:translateY(-3px)}30%{opacity:1}70%,100%{opacity:0;transform:translateY(12px)}}
@keyframes shDown{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(7px);opacity:1}}
@media(hover:none){.scrollhint__m{display:none}.scrollhint svg{width:26px;height:26px}}
@media(prefers-reduced-motion:reduce){.scrollhint *,.scrollhint *:before{animation:none!important}}

/* компактный первый экран внутренних страниц */
.phero{position:relative;padding:clamp(120px,16vh,190px) 0 clamp(130px,14vw,170px);overflow:hidden}
.phero:before{content:"";position:absolute;right:-10%;top:-30%;width:min(720px,80vw);aspect-ratio:1;border-radius:50%;background:conic-gradient(from 0deg,var(--lime),var(--cyan),var(--violet),var(--pink),var(--lime));filter:blur(130px);opacity:.22;pointer-events:none;animation:spin 20s linear infinite}
.phero h1{font-size:clamp(36px,6.4vw,92px);line-height:.98}
.phero .lead{max-width:720px}
.phero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:14px;color:var(--muted);margin-bottom:22px}
.crumbs a:hover{color:var(--lime)}

/* бегущая строка */
.marquee{padding:28px 0;border-block:1px solid var(--line);overflow:hidden;white-space:nowrap;background:var(--bg)}
.marquee__t{display:inline-flex;gap:48px;font:600 clamp(28px,4vw,56px) Unbounded;letter-spacing:-.03em;animation:mq 30s linear infinite}
.marquee__t i{font-style:normal;color:var(--lime)}
.marquee__t .o{-webkit-text-stroke:1.5px var(--ink);color:transparent}
@keyframes mq{to{transform:translateX(-50%)}}

/* манифест и цифры */
.manifest p{font:600 clamp(26px,4.2vw,60px)/1.12 Unbounded;letter-spacing:-.03em}
.manifest .w{opacity:.14;transition:opacity .2s}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-top:80px}
.stat{background:var(--bg);padding:32px 26px}
.stat b{display:block;font:800 clamp(40px,5vw,72px) Unbounded;letter-spacing:-.05em;line-height:1}
.stat span{color:var(--muted);font-size:15px;display:block;margin-top:10px}
@media(max-width:800px){.stats{grid-template-columns:1fr 1fr}}

/* услуги: bento */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:64px}
.tile{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:32px;overflow:hidden;min-height:300px;display:flex;flex-direction:column;isolation:isolate}
.tile:before{content:"";position:absolute;inset:0;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(198,255,61,.14),transparent 60%);opacity:0;transition:opacity .3s;z-index:-1}
.tile:hover:before{opacity:1}
.tile__n{font:600 13px Onest;color:var(--muted);letter-spacing:.1em;max-width:calc(100% - 66px)}
.tile>.ico{position:absolute;right:26px;top:26px;width:46px;height:46px;padding:11px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--lime);box-sizing:border-box}
.t2>.ico{background:rgba(7,6,11,.1);border-color:rgba(7,6,11,.18);color:#07060b}
.tile .from{display:inline-block;align-self:flex-start;margin-top:18px;font:600 15px Onest;color:var(--lime)}
.t2 .from{color:#07060b}
.tile h3{font:700 clamp(24px,2.4vw,34px) Unbounded;letter-spacing:-.03em;margin:auto 0 14px;padding-top:40px}
.tile p{color:var(--muted);font-size:16px}
.tile .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.tile .tags span{font-size:13px;padding:6px 12px;border-radius:999px;border:1px solid var(--line);color:#cfccd9}
.t1{grid-column:span 4}.t2{grid-column:span 2}.t3{grid-column:span 2}.t4{grid-column:span 2}.t5{grid-column:span 2}
.t1 .orb{position:absolute;right:-80px;top:-80px;width:340px;height:340px;border-radius:50%;background:conic-gradient(from 0deg,var(--lime),var(--cyan),var(--violet),var(--pink),var(--lime));filter:blur(50px);opacity:.5;animation:spin 12s linear infinite;z-index:-2}
@keyframes spin{to{transform:rotate(360deg)}}
.t2{background:var(--lime);color:#07060b;border-color:var(--lime)}
.t2 p,.t2 .tile__n{color:rgba(7,6,11,.7)}.t2 .tags span{border-color:rgba(7,6,11,.25);color:#07060b}
.t4 .ai{position:absolute;right:24px;top:24px;font:800 64px Unbounded;letter-spacing:-.05em;opacity:.9}
@media(max-width:1000px){.bento{grid-template-columns:1fr 1fr}.t1{grid-column:span 2}.t2,.t3,.t4,.t5{grid-column:span 1}}
@media(max-width:640px){.bento{grid-template-columns:1fr}.t1,.t2,.t3,.t4,.t5{grid-column:span 1}}

/* путь клиента: горизонтальный скролл */
.hs{padding:0;overflow:hidden}
.hs__pin{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:100px 0 60px}
.hs__track{display:flex;gap:20px;padding:0 32px;margin-top:56px;will-change:transform}
.fcard{flex:none;width:min(420px,82vw);min-height:460px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:34px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.fcard__n{font:800 120px/1 Unbounded;letter-spacing:-.06em;-webkit-text-stroke:1.5px var(--line);color:transparent;position:absolute;right:20px;top:14px}
.fcard .ico{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:rgba(198,255,61,.1);color:var(--lime)}
.fcard .ico .ic{width:27px;height:27px}
.fcard h3{font:700 32px Unbounded;letter-spacing:-.03em;margin-top:auto}
.fcard .who{color:var(--lime);font-weight:600;margin:10px 0 12px}
.fcard p{color:var(--muted)}
.fcard .m{margin-top:22px;padding-top:18px;border-top:1px dashed var(--line);font-size:14px;color:#cfccd9}
.fcard .m b{color:var(--muted);font-weight:500;margin-right:6px}
.fcard--end{background:var(--grad);border:0;color:#07060b;justify-content:center}
.fcard--end h3{margin:0 0 20px;font-size:40px}
.fcard--end .btn{background:#07060b;color:var(--ink);align-self:flex-start}
.hs__bar{height:2px;background:var(--line);margin:40px 32px 0;border-radius:2px;overflow:hidden}
.hs__bar i{display:block;height:100%;width:100%;background:var(--lime);transform-origin:left;transform:scaleX(0)}
@media(max-width:899px){.hs__track{flex-direction:column;padding:0 16px}.fcard{width:100%;min-height:0}.fcard h3{margin-top:60px}.hs__bar{display:none}}
@media(max-width:600px){
  .phero h1{font-size:clamp(26px,7.6vw,36px)}
  .fcard{padding:26px}
  .fcard h3{font-size:26px}
  .fcard--end h3{font-size:28px}
}

/* этапы */
.proc{display:grid;grid-template-columns:1fr 1.4fr;gap:60px;margin-top:40px}
.proc__side{position:sticky;top:120px;align-self:start}
.proc__list{position:relative;padding-left:40px;overflow-x:hidden;overflow-x:clip}
.proc__line{position:absolute;left:6px;top:8px;bottom:8px;width:2px;background:var(--line)}
.proc__line i{position:absolute;inset:0;background:var(--grad);transform-origin:top;transform:scaleY(0)}
.pstep{position:relative;padding:0 0 56px}
.pstep:before{content:"";position:absolute;left:-40px;top:8px;width:14px;height:14px;border-radius:50%;background:var(--bg);border:2px solid var(--lime)}
.pstep small{font-weight:600;color:var(--lime);letter-spacing:.08em;text-transform:uppercase;font-size:12px}
.pstep h3{font:700 clamp(24px,2.6vw,34px) Unbounded;letter-spacing:-.03em;margin:8px 0 10px}
.pstep p{color:var(--muted)}
.pstep .res{margin-top:14px;display:inline-block;padding:10px 16px;border-radius:14px;background:var(--card);border:1px solid var(--line);font-size:15px}
.pstep .res b{color:var(--lime)}
@media(max-width:900px){.proc{grid-template-columns:1fr}.proc__side{position:static}}

/* работы */
.more{display:flex;flex-wrap:wrap;gap:10px;margin-top:40px}
.more a{padding:10px 18px;border-radius:999px;border:1px solid var(--line);font-size:15px;transition:.2s}
.more a:hover{background:var(--ink);color:var(--bg)}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin:40px 0 28px}
.tab{padding:12px 20px;border-radius:999px;border:1px solid var(--line);background:var(--card);font:600 15px Onest;color:var(--muted);cursor:pointer;transition:.2s}
.tab:hover{color:var(--ink)}
.tab.on{background:var(--lime);border-color:var(--lime);color:#07060b}
.works{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.work{display:flex;flex-direction:column;border-radius:var(--r);overflow:hidden;background:var(--card);border:1px solid var(--line);transition:transform .3s var(--ease),border-color .3s}
.work:hover{transform:translateY(-6px);border-color:var(--lime)}
.work__img{aspect-ratio:16/10;background-size:cover;background-position:center;position:relative}
.work__img:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(7,6,11,.75))}
.work__tag{position:absolute;z-index:2;left:14px;top:14px;font-size:12px;font-weight:600;padding:6px 12px;border-radius:999px;background:rgba(7,6,11,.7);backdrop-filter:blur(8px)}
.work__b{padding:22px;display:flex;flex-direction:column;gap:8px;flex:1}
.work__b h3{font:700 20px Unbounded;letter-spacing:-.02em}
.work__b p{color:var(--muted);font-size:14px}
.work__b span{margin-top:auto;padding-top:12px;font-size:13px;color:var(--lime)}
.work[hidden]{display:none}
@media(max-width:1000px){.works{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.works{grid-template-columns:1fr}}

/* отрасли: ленты */
.lanes{display:grid;gap:16px;margin-top:56px;transform:rotate(-2deg)}
.lane{display:flex;overflow:hidden;white-space:nowrap}
.lane__t{display:flex;gap:14px;padding-right:14px;animation:mq 40s linear infinite}
.lane:nth-child(2) .lane__t{animation-direction:reverse;animation-duration:46s}
.lane:nth-child(3) .lane__t{animation-duration:52s}
.pill{padding:18px 28px;border-radius:999px;background:var(--card);border:1px solid var(--line);font:600 clamp(16px,1.6vw,22px) Onest;display:flex;gap:10px;align-items:center}
.pill .ic{width:23px;height:23px;color:var(--lime)}
.pill--l{background:var(--lime);color:#07060b;border-color:var(--lime)}
.pill--l .ic{color:#07060b}
.pill--v{background:var(--violet);border-color:var(--violet)}
.pill--v .ic{color:#fff}

/* стили */
.styles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:64px}
.st{border-radius:20px;overflow:hidden;border:1px solid var(--line);background:var(--card);transition:transform .4s var(--ease)}
.st:hover{transform:translateY(-8px) rotate(-1deg)}
.st__sw{height:150px;display:grid;place-items:center;font:800 28px Unbounded;letter-spacing:-.04em}
.st__t{padding:18px 20px}
.st__t b{display:block;font-weight:600}
.st__t span{font-size:14px;color:var(--muted)}
@media(max-width:1000px){.styles{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.styles{grid-template-columns:1fr}}

/* цены */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:64px}
.plan{border-radius:var(--r);background:var(--card);border:1px solid var(--line);padding:36px;display:flex;flex-direction:column}
.plan--hot{background:linear-gradient(var(--card),var(--card)) padding-box,var(--grad) border-box;border:2px solid transparent;transform:translateY(-16px)}
.plan__name{font-weight:600;color:var(--muted)}
.plan__p{font:800 clamp(34px,3.4vw,46px) Unbounded;letter-spacing:-.04em;margin:14px 0 4px}
.plan__t{color:var(--muted);font-size:14px}
.plan ul{list-style:none;display:grid;gap:12px;margin:28px 0 32px}
.plan li{padding-left:28px;position:relative;color:#cfccd9}
.plan li:before{content:"✦";position:absolute;left:0;color:var(--lime)}
.plan .btn{margin-top:auto;justify-content:center}
@media(max-width:900px){.plans{grid-template-columns:1fr}.plan--hot{transform:none}}
.plan__note{margin-top:18px;font-size:14px;color:var(--muted)}

/* что входит */
.incl{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-top:28px}
.incl>div{background:var(--bg);padding:26px 24px;display:flex;flex-direction:column;gap:10px}
.incl .ic{color:var(--lime)}
.incl b{font-weight:600;font-size:16px}
.incl span{color:var(--muted);font-size:14px;line-height:1.5}
@media(max-width:900px){.incl{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.incl{grid-template-columns:1fr}}

/* отдельные услуги */
.extras{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:20px}
.ex{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:6px}
.ex .ic{color:var(--lime)}
.ex b{font-weight:600;margin-top:4px}
.ex span{color:var(--muted);font-size:14px}
.ex i{font-style:normal;font:700 18px Unbounded;letter-spacing:-.03em;margin-top:10px}
@media(max-width:900px){.extras{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.extras{grid-template-columns:1fr}}

/* карточки аудитории / направлений */
.aud{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:64px}
.aud--4{grid-template-columns:repeat(4,1fr)}
.auc{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:30px;display:flex;flex-direction:column;gap:12px;transition:border-color .3s,transform .4s var(--ease)}
.auc:hover{border-color:var(--lime);transform:translateY(-6px)}
.auc .ico{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;background:rgba(198,255,61,.1);color:var(--lime);margin-bottom:6px}
.auc .ico .ic{width:26px;height:26px}
.auc h3{font:700 21px Unbounded;letter-spacing:-.02em}
.auc .who{font-size:14px;color:var(--lime);font-weight:600}
.auc p{color:var(--muted);font-size:15px}
.auc ul{list-style:none;display:grid;gap:9px;font-size:14px;color:#cfccd9;margin-top:2px}
.auc li{padding-left:20px;position:relative}
.auc li:before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:2px;background:var(--lime);opacity:.6}
.auc .price{margin-top:auto;padding-top:20px;border-top:1px dashed var(--line);font-size:14px;color:var(--muted)}
.auc .price b{display:block;color:var(--ink);font:700 20px Unbounded;letter-spacing:-.03em;margin-top:4px}
@media(max-width:1100px){.aud--4{grid-template-columns:1fr 1fr}}
@media(max-width:1000px){.aud{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.aud,.aud--4{grid-template-columns:1fr}}

/* кнопка внизу карточки-направления */
.auc__btn{margin-top:auto;padding-top:20px}
.auc__btn .from{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;background:rgba(198,255,61,.1);border:1px solid rgba(198,255,61,.35);color:var(--lime);font:700 14px Onest;white-space:nowrap;transition:.25s var(--ease)}
.auc__btn .arr{transition:transform .25s var(--ease)}
.auc:hover .auc__btn .from{background:var(--lime);border-color:var(--lime);color:#07060b}
.auc:hover .auc__btn .arr{transform:translateX(3px)}
#next .auc .who{font:700 18px Unbounded;letter-spacing:-.03em;color:var(--ink)}
/* низ карточки «для кого»: цена слева, ссылка на пример справа */
.auc__foot{margin-top:auto;padding-top:18px;border-top:1px dashed var(--line);display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.auc__foot .p{font:700 18px Unbounded;letter-spacing:-.03em}
.auc__foot .lnk{font:600 14px Onest;color:var(--lime)}
.auc:hover .auc__foot .lnk{text-decoration:underline}

/* «посмотреть все работы» — заметный блок под сеткой примеров */
.showall{margin-top:48px;border-radius:var(--r);padding:clamp(28px,4.5vw,52px);position:relative;overflow:hidden;
  background:linear-gradient(var(--card),var(--card)) padding-box,var(--grad) border-box;border:2px solid transparent;
  display:grid;grid-template-columns:1fr auto;gap:clamp(24px,4vw,56px);align-items:center}
.showall:before{content:"";position:absolute;width:520px;height:520px;right:-140px;top:-220px;border-radius:50%;background:radial-gradient(var(--violet),transparent 65%);opacity:.3;pointer-events:none}
.showall>*{position:relative}
.showall h3{font:700 clamp(24px,3.2vw,42px) Unbounded;letter-spacing:-.03em;margin-bottom:12px}
.showall p{color:var(--muted);max-width:520px}
.showall__cta{display:flex;flex-wrap:wrap;gap:12px}
.bigbtn{display:flex;align-items:center;gap:16px;padding:20px 26px;border-radius:22px;background:var(--bg2);border:1px solid var(--line);transition:.3s var(--ease);min-width:250px}
.bigbtn:hover{border-color:var(--lime);transform:translateY(-4px)}
.bigbtn__n{font:800 clamp(30px,3vw,40px) Unbounded;letter-spacing:-.05em;line-height:1;color:var(--lime)}
.bigbtn__t b{display:block;font-weight:600;font-size:16px}
.bigbtn__t span{font-size:13px;color:var(--muted)}
.bigbtn .arr{margin-left:auto;transition:transform .3s var(--ease);color:var(--muted)}
.bigbtn:hover .arr{transform:translateX(4px);color:var(--lime)}
@media(max-width:1100px){.showall{grid-template-columns:1fr}.showall__cta .bigbtn{flex:1 1 260px}}
@media(max-width:520px){.bigbtn{min-width:0;width:100%;padding:18px 20px;gap:12px}.showall__cta{width:100%}}

/* почему дёшево / акцентный блок */
.why{margin-top:64px;border-radius:var(--r);border:1px solid var(--line);background:var(--card);padding:clamp(28px,5vw,56px);display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;position:relative;overflow:hidden}
.why:before{content:"";position:absolute;width:520px;height:520px;right:-180px;top:-240px;border-radius:50%;background:radial-gradient(var(--lime),transparent 65%);opacity:.14;pointer-events:none}
.why h3{font:700 clamp(24px,3vw,40px) Unbounded;letter-spacing:-.03em;margin-bottom:16px}
.why p{color:var(--muted)}
.why p+p{margin-top:14px}
.cmp{display:grid;gap:10px;position:relative}
.cmp div{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:16px 20px;border-radius:18px;background:var(--bg2);border:1px solid var(--line);font-size:15px}
.cmp div b{font:700 18px Unbounded;letter-spacing:-.03em;white-space:nowrap}
.cmp div.hot{background:rgba(198,255,61,.08);border-color:var(--lime)}
.cmp div.hot b{color:var(--lime)}
.cmp .sum{background:transparent;border-style:dashed}
@media(max-width:900px){.why{grid-template-columns:1fr}}

/* FAQ */
.faq{margin-top:48px}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:28px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;font:600 clamp(18px,2vw,24px) Onest}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-style:normal;font-size:22px;transition:.3s var(--ease)}
.faq details[open] summary i{transform:rotate(45deg);background:var(--lime);color:#000;border-color:var(--lime)}
.faq details p{color:var(--muted);padding:0 0 28px;max-width:760px}

/* форма / квиз */
.quiz{display:grid;grid-template-columns:1fr 1.2fr;gap:48px;background:var(--card);border:1px solid var(--line);border-radius:36px;padding:clamp(24px,5vw,64px);position:relative;overflow:hidden}
.quiz:before{content:"";position:absolute;width:600px;height:600px;left:-200px;bottom:-300px;border-radius:50%;background:radial-gradient(var(--violet),transparent 65%);opacity:.35;pointer-events:none}
.quiz>*{position:relative}
.quiz h2{font-size:clamp(34px,4.6vw,64px)}
@media(max-width:900px){.quiz{grid-template-columns:1fr}}
.qhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;font-size:14px;color:var(--muted)}
.qbar{height:4px;border-radius:4px;background:var(--line);overflow:hidden;margin-bottom:32px}
.qbar i{display:block;height:100%;width:20%;background:var(--grad);transition:width .5s var(--ease)}
.qstep{display:none}
.qstep.on{display:block;animation:qin .5s var(--ease)}
@keyframes qin{from{opacity:0;transform:translateX(30px)}}
.qstep h3{font:700 clamp(22px,2.4vw,30px) Unbounded;letter-spacing:-.03em;margin-bottom:24px}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:520px){.opts{grid-template-columns:1fr}}
.opts input{position:absolute;opacity:0;pointer-events:none}
.opts label{display:flex;gap:12px;align-items:center;padding:18px 20px;border-radius:18px;border:1.5px solid var(--line);background:var(--bg2);cursor:pointer;font-weight:500;transition:.2s}
.opts label:hover{border-color:#3b384b}
.opts label .ic{width:22px;height:22px;color:var(--lime)}
.opts input:checked+label{border-color:var(--lime);background:rgba(198,255,61,.08);box-shadow:0 0 0 4px rgba(198,255,61,.08)}
.opts input:focus-visible+label{outline:2px solid var(--lime);outline-offset:2px}
.inp{width:100%;padding:18px 20px;border-radius:18px;border:1.5px solid var(--line);background:var(--bg2);color:var(--ink);font:500 17px Onest;margin-bottom:10px;transition:border-color .2s}
.inp:focus{outline:0;border-color:var(--lime)}
.inp.err{border-color:var(--pink)}
textarea.inp{min-height:100px;resize:vertical}
.qnav{display:flex;justify-content:space-between;gap:12px;margin-top:28px}
.qback{background:none;border:0;color:var(--muted);font:600 15px Onest;cursor:pointer;padding:0 8px}
.qback[hidden]{visibility:hidden;display:block}
.note{font-size:13px;color:var(--muted);margin-top:14px}
.done{display:none;text-align:center;padding:40px 0}
.done b{display:block;font:800 72px Unbounded;margin-bottom:12px}
/* короткая форма + переключатель на полный квиз */
.qshort{display:grid;gap:10px}
.qmode{margin-top:22px;font-size:15px;color:var(--muted)}
.qmode a{color:var(--lime);font-weight:600;border-bottom:1px dashed rgba(198,255,61,.5)}
.qfull{display:none}
.quiz.is-full .qshort-wrap{display:none}
.quiz.is-full .qfull{display:block}

/* ====== КАТАЛОГ РЕШЕНИЙ ====== */
.filters{display:grid;gap:18px;margin:48px 0 8px}
.fgroup{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.fgroup>b{flex:0 0 auto;font:600 13px Onest;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-right:6px;min-width:96px}
.fchip{padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:var(--card);font:600 14px Onest;color:var(--muted);cursor:pointer;transition:.2s;white-space:nowrap}
.fchip:hover{color:var(--ink);border-color:#3b384b}
.fchip.on{background:var(--lime);border-color:var(--lime);color:#07060b}
.fcount{margin:22px 0 26px;color:var(--muted);font-size:15px}
.fcount b{color:var(--ink);font-weight:600}
.fcount .reset{margin-left:14px;color:var(--lime);cursor:pointer;border-bottom:1px dashed rgba(198,255,61,.5)}
.scards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:1100px){.scards{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.scards{grid-template-columns:1fr}.fgroup>b{min-width:100%;margin-bottom:2px}}
.scard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:12px;transition:border-color .3s,transform .4s var(--ease)}
.scard:hover{border-color:var(--lime);transform:translateY(-5px)}
.scard[hidden]{display:none}
.scard__top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.scard__cat{font:600 12px Onest;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.scard__lv{font-size:13px;color:var(--muted);white-space:nowrap}
.scard h3{font:700 20px Unbounded;letter-spacing:-.02em;line-height:1.15}
.scard__problem{color:var(--muted);font-size:15px}
.scard__does{list-style:none;display:grid;gap:8px;font-size:14px;color:#cfccd9}
.scard__does li{padding-left:20px;position:relative}
.scard__does li:before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:2px;background:var(--lime);opacity:.6}
.scard__how{font-size:14px;color:#cfccd9;background:var(--bg2);border:1px dashed var(--line);border-radius:16px;padding:14px 16px}
.scard__how b{color:var(--muted);font-weight:500;display:block;margin-bottom:4px;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.scard__int{display:flex;flex-wrap:wrap;gap:6px}
.scard__int span{font-size:12px;padding:5px 10px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.scard__foot{margin-top:auto;padding-top:20px;border-top:1px dashed var(--line);display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.scard__price b{display:block;font:700 20px Unbounded;letter-spacing:-.03em}
.scard__price span{font-size:13px;color:var(--muted)}
.scard__cta{flex:0 0 auto;font:600 14px Onest;color:var(--lime);cursor:pointer;background:none;border:0;padding:0;white-space:nowrap}
.scard__cta:hover{text-decoration:underline}
.fempty{padding:60px 0;text-align:center;color:var(--muted)}
.fempty[hidden]{display:none}

/* ====== ПЛАШКИ-ФАКТЫ В ПЕРВОМ ЭКРАНЕ ====== */
.facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.facts span{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;background:rgba(7,6,11,.55);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font:600 14px Onest;color:#e8e6ef}
.facts .ic{width:17px;height:17px;color:var(--lime)}

/* ====== СЦЕНКИ-ПЕРЕПИСКИ «ЗНАКОМО?» ====== */
.scenes{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:56px}
@media(max-width:1100px){.scenes{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.scenes{grid-template-columns:1fr}}
.scene{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:10px}
.scene__head{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;margin-bottom:4px}
.msg{max-width:88%;padding:10px 14px;border-radius:16px;font-size:14px;line-height:1.45}
.msg--in{background:#1d1b29;border-bottom-left-radius:4px;align-self:flex-start}
.msg--out{background:#2a3a14;color:#eaffc4;border-bottom-right-radius:4px;align-self:flex-end}
.msg--sys{align-self:center;font-size:12px;color:var(--muted);padding:2px 0}
.msg small{display:block;font-size:11px;opacity:.55;margin-top:3px;text-align:right}
.scene__lost{margin-top:auto;padding-top:14px;border-top:1px dashed var(--line);font-size:14px;color:var(--pink);font-weight:600}
.serp{background:#fff;color:#1a1a1a;border-radius:12px;padding:12px 14px;font-size:13px;display:grid;gap:10px}
.serp b{display:block;color:#1a0dab;font-weight:600;font-size:14px}
.serp i{font-style:normal;color:#006621;font-size:12px}
.serp .you{opacity:.35}
.punch{margin-top:48px;font:700 clamp(22px,3vw,40px) Unbounded;letter-spacing:-.03em;max-width:900px}

/* ====== БЫЛО / СТАЛО ====== */
.vs{margin-top:56px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.vs__row{display:grid;grid-template-columns:200px 1fr 1fr;border-top:1px solid var(--line)}
.vs__row:first-child{border-top:0}
.vs__row>div{padding:18px 22px;font-size:15px}
.vs__row>div:first-child{font-weight:600;color:var(--muted);background:var(--bg2)}
.vs__row>div:nth-child(2){color:#b9b6c6}
.vs__row>div:nth-child(2):before{content:"✕ ";color:var(--pink);font-weight:700}
.vs__row>div:nth-child(3){background:rgba(198,255,61,.05);color:var(--ink)}
.vs__row>div:nth-child(3):before{content:"✓ ";color:var(--lime);font-weight:700}
.vs__row--head>div{font:700 13px Onest!important;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)!important;background:var(--bg2)!important}
.vs__row--head>div:before{content:none!important}
.vs__row--head>div:nth-child(3){color:var(--lime)!important}
@media(max-width:760px){
  .vs__row{grid-template-columns:1fr 1fr}
  .vs__row>div:first-child{grid-column:1/-1;padding:12px 16px 4px;background:transparent;font-size:13px;letter-spacing:.06em;text-transform:uppercase}
  .vs__row>div{padding:8px 16px 14px;font-size:14px}
  .vs__row--head>div:first-child{display:none}
}

/* ====== 3 ШАГА ====== */
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:56px;counter-reset:s}
@media(max-width:900px){.steps3{grid-template-columns:1fr}}
.step3{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:30px;position:relative}
.step3:before{counter-increment:s;content:counter(s);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--lime);color:#07060b;font:800 18px Unbounded;margin-bottom:18px}
.step3 h3{font:700 22px Unbounded;letter-spacing:-.02em;margin-bottom:10px}
.step3 p{color:var(--muted);font-size:15px}
.guarantee{margin-top:16px;display:flex;align-items:center;gap:14px;padding:20px 24px;border-radius:20px;border:1px dashed rgba(198,255,61,.4);background:rgba(198,255,61,.05);font-size:15px}
.guarantee .ic{color:var(--lime);width:28px;height:28px}

/* ====== «ПРОСТЫМИ СЛОВАМИ» + ЧАТ-ПРИМЕР ====== */
.explain{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;margin-top:56px}
@media(max-width:900px){.explain{grid-template-columns:1fr}}
.explain__text p{font-size:clamp(18px,1.6vw,21px);color:#cfccd9}
.explain__text p+p{margin-top:16px}
.explain__text b{color:var(--ink)}
.chatbox{background:#0e1621;border:1px solid #1f2b3a;border-radius:var(--r);overflow:hidden;max-width:460px;width:100%;justify-self:center}
.chatbox__top{padding:14px 18px;background:#17212b;display:flex;align-items:center;gap:12px}
.chatbox__top i{width:36px;height:36px;border-radius:50%;background:var(--grad);flex:none}
.chatbox__top b{display:block;font-size:15px}
.chatbox__top span{font-size:12px;color:#7d8b99}
.chatbox__body{padding:16px;display:flex;flex-direction:column;gap:8px;min-height:360px}
.chatbox .msg--in{background:#182533}
.chatbox .msg--out{background:#2b5278;color:#fff}
.chatbox .kbd{display:flex;flex-wrap:wrap;gap:6px;align-self:flex-start;max-width:88%}
.chatbox .kbd span{padding:8px 12px;border-radius:10px;background:#1f3246;color:#8fc2ff;font-size:13px}
.chatbox .msg,.chatbox .kbd{opacity:0;transform:translateY(8px);transition:.4s var(--ease)}
.chatbox.play .msg,.chatbox.play .kbd{opacity:1;transform:none}
.yesno{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:56px}
@media(max-width:800px){.yesno{grid-template-columns:1fr}}
.yesno>div{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:28px}
.yesno h3{font:700 20px Unbounded;margin-bottom:14px}
.yesno ul{list-style:none;display:grid;gap:10px;color:#cfccd9;font-size:15px}
.yesno li{padding-left:26px;position:relative}
.yesno .y li:before{content:"✓";position:absolute;left:0;color:var(--lime);font-weight:700}
.yesno .n li:before{content:"—";position:absolute;left:0;color:var(--muted)}

/* лестница роста: пример реплики внутри карточки */
.auc .quote{font-size:14px;color:#cfccd9;background:var(--bg2);border-left:3px solid var(--lime);border-radius:0 12px 12px 0;padding:10px 14px}

/* ====== ЭТАПЫ ГЛАВНОЙ: чередование фона, номер, навигатор ====== */
.stage{position:relative;padding:clamp(90px,11vw,150px) 0;border-top:1px solid var(--line);overflow:hidden}
.stage--alt{background:
  radial-gradient(900px 420px at 85% 0%,rgba(139,92,255,.10),transparent 60%),
  radial-gradient(700px 380px at 0% 100%,rgba(198,255,61,.05),transparent 60%),
  #0d0c14}
.stage--final{background:radial-gradient(900px 500px at 50% 0%,rgba(198,255,61,.09),transparent 60%),#0d0c14}
.stage--after{background:#0a0910}
/* светлая граница между экранами: линия + свечение + точка по центру */
.stage{border-top:0}
.stage:before{content:"";position:absolute;left:0;right:0;top:0;height:1px;z-index:2;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.18) 15%,rgba(214,255,120,.85) 50%,rgba(255,255,255,.18) 85%,transparent)}
.stage:after{content:"";position:absolute;left:50%;top:0;width:min(900px,90vw);height:120px;transform:translateX(-50%);pointer-events:none;z-index:0;
  background:radial-gradient(50% 100% at 50% 0%,rgba(198,255,61,.13),transparent 70%)}
.stage--alt{background-color:#12111c!important}
.stage--alt,.stage--final{box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.stage>.wrap{position:relative;z-index:1}
.stage .eyebrow{padding:8px 14px 8px 12px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.stage .eyebrow b{color:var(--lime);font-weight:700}
.stage-cta{margin-top:40px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px;padding:22px 26px;border-radius:22px;
  background:linear-gradient(100deg,rgba(198,255,61,.10),rgba(139,92,255,.08));border:1px solid rgba(198,255,61,.25)}
.stage-cta b{display:block;font:700 clamp(17px,1.6vw,21px) Unbounded;letter-spacing:-.02em}
.stage-cta span{font-size:14px;color:var(--muted)}

/* навигатор по этапам (слева на широких экранах) */
.rail{position:fixed;left:18px;top:50%;transform:translateY(-50%);z-index:40;display:none;flex-direction:column;gap:4px;opacity:0;transition:opacity .4s}
.rail.show{opacity:1}
.rail a{display:flex;align-items:center;gap:10px;padding:4px 0;font:600 11px Onest;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.rail a i{width:8px;height:8px;border-radius:50%;border:1.5px solid #3b384b;flex:none;transition:.3s var(--ease)}
.rail a span{opacity:0;transform:translateX(-6px);transition:.3s var(--ease);white-space:nowrap}
.rail:hover a span,.rail a.on span{opacity:1;transform:none}
.rail a.on{color:var(--ink)}
.rail a.on i{background:var(--lime);border-color:var(--lime);box-shadow:0 0 12px var(--lime);transform:scale(1.3)}
.rail a.done i{background:#3b384b}
@media(min-width:1440px){.rail{display:flex}}
/* на телефоне — плашка «этап N из 8» */
.stage-chip{position:fixed;left:50%;bottom:14px;z-index:40;transform:translate(-50%,140%);padding:9px 14px;border-radius:999px;background:rgba(19,18,28,.9);backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.1);font:600 12px Onest;white-space:nowrap;transition:transform .45s var(--ease);display:flex;gap:10px;align-items:center}
.stage-chip b{color:var(--lime)}
.stage-chip i{display:block;width:60px;height:3px;border-radius:3px;background:#2b2938;overflow:hidden}
.stage-chip i:after{content:"";display:block;height:100%;width:var(--p,0%);background:var(--lime);transition:width .4s}
.stage-chip.show{transform:translate(-50%,0)}
@media(min-width:1440px){.stage-chip{display:none}}
/* переключатель вариантов портфолио */
.variant{position:fixed;left:18px;bottom:18px;z-index:45;display:flex;gap:2px;padding:4px;border-radius:999px;background:rgba(19,18,28,.85);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1)}
.variant a{padding:8px 14px;border-radius:999px;font:600 12px Onest;color:var(--muted);white-space:nowrap}
.variant a.on{background:var(--lime);color:#07060b}
@media(max-width:1080px){.variant{left:50%;transform:translateX(-50%);bottom:auto;top:74px}}
@media(max-width:600px){.variant{top:64px}.variant a{padding:6px 11px;font-size:11px}}

/* футер */
footer{padding:80px 0 32px;border-top:1px solid var(--line);overflow:hidden}
.bigname{font:800 clamp(56px,15vw,240px)/.9 Unbounded;letter-spacing:-.07em;text-align:center;margin:40px 0 20px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:gradmove 8s linear infinite}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;color:var(--muted);font-size:15px}
.foot a:hover{color:var(--lime)}
.foot nav{display:flex;flex-wrap:wrap;gap:16px}

@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.reel__frame{clip-path:none}}

/* ====== KamaLAB: подсказки «?» ====== */
.q{position:relative;display:inline-grid;place-items:center;width:20px;height:20px;margin-left:6px;vertical-align:2px;border-radius:50%;border:1px solid rgba(198,255,61,.5);background:rgba(198,255,61,.1);color:var(--lime);font:700 12px Onest;cursor:pointer;padding:0}
.q .q__tip{position:absolute;left:50%;bottom:calc(100% + 10px);width:min(280px,78vw);transform:translate(-50%,6px);opacity:0;pointer-events:none;z-index:30;
  padding:14px 16px;border-radius:16px;background:#1b1a27;border:1px solid rgba(198,255,61,.35);box-shadow:0 18px 50px rgba(0,0,0,.55);
  font:400 14px/1.5 Onest;color:#d9d6e4;text-align:left;letter-spacing:0;text-transform:none;transition:.25s var(--ease)}
.q .q__tip b{display:block;color:var(--ink);font-weight:600;font-size:14px;margin-bottom:4px}
.q .q__tip i{display:block;margin-top:8px;font-style:normal;color:var(--lime);font-size:13px}
.q:hover .q__tip,.q:focus-visible .q__tip,.q.open .q__tip{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.incl>div{overflow:visible}.incl{overflow:visible}
@media(max-width:520px){.q__tip{left:auto;right:-10px;transform:translateY(6px)}.q:hover .q__tip,.q.open .q__tip{transform:none}}

/* ====== таймер цены ====== */
.deadline{margin:20px 0 18px;padding:18px 20px;border-radius:20px;background:rgba(255,79,216,.07);border:1px solid rgba(255,79,216,.35)}
.deadline__t{display:flex;align-items:center;gap:10px;font:600 15px Onest;color:var(--ink)}
.deadline__t i{width:9px;height:9px;border-radius:50%;background:var(--pink);box-shadow:0 0 0 0 rgba(255,79,216,.6);animation:dlpulse 1.6s infinite}
@keyframes dlpulse{70%{box-shadow:0 0 0 10px rgba(255,79,216,0)}100%{box-shadow:0 0 0 0 rgba(255,79,216,0)}}
.deadline__timer{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:14px}
.deadline__timer div{text-align:center;padding:10px 4px;border-radius:14px;background:var(--bg2);border:1px solid var(--line)}
.deadline__timer b{display:block;font:700 clamp(22px,2.6vw,30px) Unbounded;letter-spacing:-.03em;color:var(--ink);font-variant-numeric:tabular-nums}
.deadline__timer small{font-size:12px;color:var(--muted)}

/* ====== контакты иконками ====== */
.cicons{display:flex;justify-content:center;flex-wrap:wrap;gap:clamp(18px,4vw,40px);margin-top:44px}
.cicon{display:flex;flex-direction:column;align-items:center;gap:12px;font:600 14px Onest;color:var(--muted);transition:color .3s}
.cicon__ico{position:relative;width:74px;height:74px;border-radius:24px;display:grid;place-items:center;color:#fff;transition:transform .4s var(--ease),box-shadow .4s}
.cicon__ico svg{width:34px;height:34px}
.cicon__ico:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(160deg,rgba(255,255,255,.35),transparent 45%);pointer-events:none}
.cicon--tel .cicon__ico{background:linear-gradient(145deg,#4ade80,#16a34a);box-shadow:0 12px 30px rgba(34,197,94,.3)}
.cicon--tg .cicon__ico{background:linear-gradient(145deg,#37bbfe,#007dbb);box-shadow:0 12px 30px rgba(41,169,235,.3)}
.cicon--max .cicon__ico{background:linear-gradient(40deg,#00c8ff 0%,#1d6bff 45%,#6a1cff 80%,#9a14ff 100%);box-shadow:0 12px 30px rgba(90,60,255,.4)}.cicon--max .cicon__ico svg{width:38px;height:38px}.cicon--max .cicon__ico:after{display:none}
.cicon:hover{color:var(--ink)}
.cicon:hover .cicon__ico{transform:translateY(-6px) scale(1.06)}

/* ====== «Дальше»: счётчик решений и «Одна ночь» ====== */
.auc .cnt{font-size:13px;line-height:1.45;color:#b9b6c8;margin-top:-4px}
.auc .cnt b{color:var(--lime);font:700 15px Unbounded;margin-right:2px}
#next .auc .who{font-size:16px}
/* витрина: обложка для сайтов, которые нельзя показать в окне */
.sc-cover{position:absolute;inset:0;z-index:3;display:flex;align-items:flex-end;background:#111 center/cover;overflow:hidden}
.sc-cover[hidden]{display:none}
.sc-cover:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(7,6,11,.9),rgba(7,6,11,.2) 60%)}
.sc-cover__in{position:relative;width:100%;box-sizing:border-box;min-width:0;padding:clamp(18px,4vw,40px);display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.sc-cover__in b{font:700 clamp(20px,2.6vw,34px)/1.15 Unbounded;letter-spacing:-.02em;color:#fff;max-width:min(620px,100%);font-size:clamp(18px,2.2vw,30px)}
.sc-cover:hover .btn:after{transform:none}
/* ====== переход «сайт → масштаб» ====== */
#next{padding-top:clamp(120px,14vw,190px)}
#next:before,#next:after{display:none}
.bridge{position:absolute;left:50%;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;z-index:2}
.bridge i{display:block;width:2px;height:clamp(60px,8vw,100px);background:linear-gradient(var(--lime),var(--violet));position:relative;overflow:hidden}
.bridge i:after{content:"";position:absolute;left:0;right:0;height:30%;background:#fff;filter:blur(1px);animation:bridge 2.2s linear infinite}
@keyframes bridge{from{top:-30%}to{top:100%}}
.bridge span{font:600 11px Onest;letter-spacing:.18em;text-transform:uppercase;color:var(--lime);padding:6px 12px;border-radius:999px;border:1px solid rgba(198,255,61,.35);background:rgba(198,255,61,.06);white-space:nowrap}
#next h2,#next>.wrap>.lead{text-align:center;margin-left:auto;margin-right:auto}
.ladder{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:48px 0 56px;position:relative}
.ladder:before{content:"";position:absolute;left:8%;right:8%;top:34px;height:2px;background:linear-gradient(90deg,var(--lime),var(--violet),var(--pink));opacity:.5}
.ladder__s{position:relative;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:24px 22px;display:flex;flex-direction:column;gap:6px}
.ladder__s:nth-child(2){transform:translateY(-10px)}.ladder__s:nth-child(3){transform:translateY(-20px)}
.ladder__s em{font:700 12px 'JetBrains Mono';font-style:normal;color:var(--muted)}
.ladder__s b{font:700 clamp(18px,1.8vw,22px) Unbounded;letter-spacing:-.02em}
.ladder__s span{font-size:14px;color:var(--muted);line-height:1.45}
.ladder__s i{margin-top:8px;align-self:flex-start;font:700 11px Onest;font-style:normal;letter-spacing:.08em;text-transform:uppercase;padding:5px 10px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.ladder__s.is-done{border-color:rgba(198,255,61,.5);background:linear-gradient(160deg,rgba(198,255,61,.1),var(--card) 60%)}
.ladder__s.is-done i{background:var(--lime);border-color:var(--lime);color:#07060b}
@media(max-width:760px){.ladder{grid-template-columns:1fr}.ladder:before{display:none}.ladder__s:nth-child(n){transform:none}}

/* ====== приложения для бизнеса ====== */
.apps{margin-top:18px;display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(18px,4vw,48px);border-radius:var(--r);position:relative;overflow:hidden;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);
  background:linear-gradient(var(--card),var(--card)) padding-box,linear-gradient(120deg,rgba(198,255,61,.6),rgba(139,92,255,.6),rgba(255,79,216,.5)) border-box;border:1.5px solid transparent}
.apps:before{content:"";position:absolute;width:560px;height:560px;right:-160px;bottom:-280px;border-radius:50%;background:radial-gradient(var(--violet),transparent 65%);opacity:.22;pointer-events:none}
.apps__txt{position:relative;min-width:0}
.apps .ico{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;background:rgba(198,255,61,.1);color:var(--lime);margin-bottom:14px}
.apps h3{font:700 clamp(21px,3vw,38px) Unbounded;overflow-wrap:break-word;letter-spacing:-.03em}
.apps .cnt{font-size:14px;color:#b9b6c8;margin:8px 0 12px}
.apps .cnt b{color:var(--lime);font:700 16px Unbounded}
.apps__txt>p{color:var(--muted);max-width:600px}
.apps__grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}
.apps__grid div{display:grid;grid-template-columns:22px 1fr;gap:2px 12px;padding:14px 16px;border-radius:16px;background:var(--bg2);border:1px solid var(--line);transition:border-color .3s,transform .3s var(--ease);min-width:0}
.apps__grid div:hover{border-color:var(--lime);transform:translateY(-3px)}
.apps__grid .ic{grid-row:span 2;color:var(--lime);width:22px;height:22px;margin-top:2px}
.apps__grid b{font-weight:600;font-size:15px;line-height:1.3}
.apps__grid span{font-size:13px;color:var(--muted);line-height:1.4}
@media(max-width:1000px){.apps{grid-template-columns:minmax(0,1fr)}.apps__phone{order:-1}}
@media(max-width:560px){.apps__grid{grid-template-columns:1fr}}
.apps__phone{position:relative;display:flex;justify-content:center}
.aph{width:min(260px,100%);height:520px;border-radius:44px;background:#0b0a12;border:9px solid #1d1b28;box-shadow:0 40px 80px -30px rgba(139,92,255,.55),inset 0 0 0 1px rgba(255,255,255,.06);padding:34px 16px 16px;display:flex;flex-direction:column;gap:12px;position:relative;overflow:hidden;animation:aphFloat 6s ease-in-out infinite}
@keyframes aphFloat{50%{transform:translateY(-10px) rotate(-1deg)}}
.aph:before{content:"";position:absolute;left:50%;top:10px;width:78px;height:20px;border-radius:12px;background:#000;transform:translateX(-50%)}
.aph__top b{display:block;font:700 18px Unbounded;letter-spacing:-.02em}
.aph__top span{font-size:13px;color:var(--muted)}
.aph__card{border-radius:18px;padding:16px;background:var(--grad);color:#07060b;position:relative;overflow:hidden}
.aph__card small{font-size:12px;font-weight:600}
.aph__card b{display:block;font:800 30px Unbounded;letter-spacing:-.04em}
.aph__card i{position:absolute;right:-20px;top:-20px;width:80px;height:80px;border-radius:50%;background:rgba(255,255,255,.3)}
.aph__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.aph__grid span{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 0;border-radius:14px;background:var(--card);font-size:18px}
.aph__grid em{font-style:normal;font-size:9.5px;color:var(--muted)}
.aph__row{padding:12px 14px;border-radius:14px;background:var(--card);border:1px solid var(--line)}
.aph__row b{display:block;font-size:13px}
.aph__row span{font-size:12px;color:var(--lime)}
.aph__push{position:absolute;left:10px;right:10px;padding:11px 13px;border-radius:14px;background:rgba(40,38,56,.92);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);font-size:12px;font-weight:600;box-shadow:0 10px 30px rgba(0,0,0,.4);opacity:0;transform:translateY(-20px);animation:push 9s infinite}
.aph__push.p1{top:40px}.aph__push.p2{top:40px;animation-delay:3s}.aph__push.p3{top:40px;animation-delay:6s}
@keyframes push{0%{opacity:0;transform:translateY(-20px)}5%,28%{opacity:1;transform:none}33%,100%{opacity:0;transform:translateY(-20px)}}
@media(prefers-reduced-motion:reduce){.aph__push{display:none}}
.aud>*{min-width:0}.auc h3{overflow-wrap:break-word;hyphens:auto}
@media(max-width:640px){.auc{padding:22px}.auc h3{font-size:19px}}

/* ====== iPhone 17 Pro (Cosmic Orange) с приложением ====== */
.apps__phone{position:relative;display:flex;justify-content:center;align-items:center;min-height:600px;perspective:1400px}
.ip17{--w:272px;position:relative;z-index:2;width:var(--w);aspect-ratio:71.9/150;border-radius:calc(var(--w)*.19);padding:calc(var(--w)*.03);
  background:linear-gradient(135deg,#f4a36f 0%,#d9652b 22%,#b24a1a 48%,#e07a3f 70%,#f6b286 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35),inset 0 0 0 3px rgba(0,0,0,.25),0 50px 90px -30px rgba(0,0,0,.8),0 30px 80px -40px rgba(232,116,59,.6);
  transform:rotateY(-14deg) rotateX(4deg);animation:ip17 7s ease-in-out infinite}
@keyframes ip17{50%{transform:rotateY(-8deg) rotateX(2deg) translateY(-10px)}}
.ip17:before{content:"";position:absolute;inset:calc(var(--w)*.012);border-radius:inherit;background:#050505;z-index:0}
.ip17__b{position:absolute;width:3px;border-radius:2px;background:linear-gradient(90deg,#8a3a14,#e8854c);z-index:-1}
.ip17__b--act{left:-2px;top:19%;height:5%}
.ip17__b--vu{left:-2px;top:27%;height:9%}.ip17__b--vd{left:-2px;top:38%;height:9%}
.ip17__b--pw{right:-2px;top:30%;height:14%}
.ip17__b--cc{right:-2px;top:56%;height:8%;background:linear-gradient(90deg,#e8854c,#6d2c0e)}
.ip17__scr{position:relative;z-index:1;height:100%;border-radius:calc(var(--w)*.16);overflow:hidden;background:#0b0b0f;color:#fff;font-family:-apple-system,"SF Pro Text",Onest,system-ui,sans-serif}
.ip17__scr:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.12),transparent 35%);z-index:5}
.ip17__st{position:absolute;inset:0 0 auto;height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 22px 0 28px;z-index:4;font-weight:600;font-size:13px;color:#fff}
.ip17__ic{display:flex;gap:4px;align-items:center}.ip17__ic svg{fill:currentColor}
.ip17__isl{position:absolute;left:50%;top:10px;transform:translateX(-50%);width:31%;height:25px;border-radius:14px;background:#000}
.ip17__home{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);width:36%;height:4px;border-radius:3px;background:rgba(255,255,255,.8);z-index:4}
.app2{height:100%;display:flex;flex-direction:column;gap:9px;padding-bottom:10px}
.app2__hero{position:relative;height:42%;flex:none;overflow:hidden}
.app2__hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.12);transition:opacity 1s,transform 4s linear}
.app2__hero img.on{opacity:1;transform:scale(1)}
.app2__hero:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0b0b0f 2%,rgba(11,11,15,.1) 55%,rgba(11,11,15,.55))}
.app2__hero-t{position:absolute;left:14px;bottom:18px;z-index:2}
.app2__hero-t small{font-size:11px;color:#f6a36e;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.app2__hero-t b{display:block;font-size:17px}
.app2__dots{position:absolute;right:14px;bottom:22px;z-index:2;display:flex;gap:4px}
.app2__dots i{width:5px;height:5px;border-radius:3px;background:rgba(255,255,255,.4);transition:width .4s}
.app2__dots i.on{width:14px;background:#fff}
.app2__bonus{margin:0 12px;padding:11px 13px;border-radius:16px;background:linear-gradient(120deg,#f08a4b,#c2461a);display:flex;justify-content:space-between;align-items:center}
.app2__bonus small{font-size:10px;opacity:.85}
.app2__bonus b{display:block;font:800 22px/1 Unbounded;letter-spacing:-.04em}
.app2__bonus span{font-size:10px;font-weight:700;padding:5px 8px;border-radius:999px;background:rgba(0,0,0,.2)}
.app2__svc{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:0 12px}
.app2__svc div{border-radius:12px;overflow:hidden;background:#17171d}
.app2__svc img{width:100%;aspect-ratio:1;object-fit:cover}
.app2__svc b{display:block;font-size:9.5px;padding:5px 6px 0;line-height:1.2}
.app2__svc span{display:block;font-size:9px;color:#f6a36e;padding:1px 6px 6px}
.app2__rec{margin:0 12px;padding:9px 12px;border-radius:12px;background:#17171d}
.app2__rec b{display:block;font-size:11px}.app2__rec span{font-size:10px;color:#9fe870}
.app2__tab{margin:auto 12px 8px;display:flex;justify-content:space-around;padding:8px;border-radius:999px;background:rgba(40,40,48,.8);font-style:normal}
.app2__tab i{font-style:normal;font-size:14px;opacity:.5}.app2__tab i.on{opacity:1}
.ip17 .aph__push{z-index:6;top:48px!important;font-size:11px}
/* задняя крышка: плато камеры на всю ширину */
.ip17-back{--w:250px;position:absolute;z-index:1;width:var(--w);aspect-ratio:71.9/150;border-radius:calc(var(--w)*.19);right:calc(50% - var(--w)*.8);top:50%;
  transform:translateY(-52%) rotateY(20deg) rotateZ(8deg);background:linear-gradient(150deg,#f2a06a,#d4602a 40%,#b8501f 70%,#e2834c);box-shadow:inset 0 0 0 2px rgba(255,255,255,.25),0 40px 80px -30px rgba(0,0,0,.8)}
.ip17-back__plateau{position:absolute;left:4%;right:4%;top:3%;height:27%;border-radius:calc(var(--w)*.15) calc(var(--w)*.15) calc(var(--w)*.06) calc(var(--w)*.06);background:linear-gradient(160deg,#f7ad7b,#cf5b25);box-shadow:inset 0 -2px 6px rgba(0,0,0,.25),0 4px 10px rgba(0,0,0,.2)}
.ip17-back__plateau i{position:absolute;width:24%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 50%,#1a2a44 0 22%,#050608 30% 55%,#2c2c30 58% 66%,#111 70%);box-shadow:0 0 0 3px #9c3f14,0 2px 4px rgba(0,0,0,.5)}
.ip17-back__plateau .c1{left:7%;top:8%}.ip17-back__plateau .c2{left:7%;top:52%}.ip17-back__plateau .c3{left:35%;top:30%}
.ip17-back__plateau b{position:absolute;right:12%;top:18%;width:9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(#fff6d8,#d8b36a)}
.ip17-back__plateau s{position:absolute;right:13%;top:58%;width:7%;aspect-ratio:1;border-radius:50%;background:#1b1b1f}
.ip17-back__logo{position:absolute;left:50%;top:58%;width:16%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50% 50% 45% 45%;background:rgba(255,255,255,.18)}
@media(max-width:1000px){.apps__phone{min-height:560px}.ip17-back{right:calc(50% - var(--w)*.85)}}
@media(max-width:420px){.ip17-back{display:none}.ip17{transform:none;animation:none}.apps__phone{min-height:0;padding:10px 0}}@media(max-width:360px){.apps__phone{zoom:.8}}.app2__bonus span,.app2__svc b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(prefers-reduced-motion:reduce){.ip17{animation:none}}
/* скриншоты реальных приложений в iPhone */
.apps{margin-top:40px}
.apps__phone{flex-direction:column;gap:22px}
.ip17__shots{position:absolute;inset:0;background:#fff}
.ip17__shots img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;opacity:0;transform:scale(1.04);transition:opacity .9s ease,transform 1.2s cubic-bezier(.2,.8,.2,1)}
.ip17__shots img.on{opacity:1;transform:none}
.ip17__isl{z-index:4;top:9px;height:24px}
.ip17__home{background:rgba(0,0,0,.35)}
.ip17__names{position:relative;z-index:2;height:34px;width:260px}
.ip17__names span{position:absolute;left:50%;top:0;transform:translate(-50%,8px);white-space:nowrap;padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--line);font:600 13px Onest;color:var(--ink);opacity:0;transition:.6s cubic-bezier(.2,.8,.2,1)}
.ip17__names span.on{opacity:1;transform:translate(-50%,0)}
/* единый фон первого экрана «Живая сеть» (net-bg.js) */
.netbg{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;z-index:0}
.phero>.wrap{position:relative;z-index:1}
.hero #gl,.bgsw{display:none!important}
