/* Lumenix Work — sitio v3 */
@property --a{syntax:'<angle>';initial-value:0deg;inherits:false}
:root{
  --bg:#050509;--bg2:#08080f;--bg3:#0d0d18;
  --line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.14);
  --tx:#f2f3fb;--mute:#9a98ab;--dim:#6b6a80;
  --b:#4f6bff;--v:#7c5cff;--m:#c750e0;--c:#22d3ee;--gold:#e3c691;--ok:#34e0a1;--wa:#25d366;
  --g:linear-gradient(115deg,#4f6bff 0%,#7c5cff 48%,#c750e0 100%);
  --g2:linear-gradient(115deg,#22d3ee,#4f6bff 45%,#c750e0);
  --disp:'Space Grotesk','Inter',sans-serif;--ui:'Inter',system-ui,sans-serif;
  --r:22px;--max:1240px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--tx);font:400 16px/1.6 var(--ui);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
::selection{background:#7c5cff;color:#fff}
.wrap{width:min(var(--max),100% - 40px);margin-inline:auto}
.grad{background:var(--g);-webkit-background-clip:text;background-clip:text;color:transparent}
.grad2{background:var(--g2);-webkit-background-clip:text;background-clip:text;color:transparent}
.gold{color:var(--gold)}
.disp{font-family:var(--disp);letter-spacing:-.03em}
.mute{color:var(--mute)}

/* ambient */
.bgfx{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.bgfx i{position:absolute;border-radius:50%;filter:blur(120px);opacity:.34;will-change:transform}
.bgfx i:nth-child(1){width:700px;height:700px;left:-200px;top:-200px;background:radial-gradient(#5b3cf0,transparent 68%);animation:drift1 26s ease-in-out infinite alternate}
.bgfx i:nth-child(2){width:620px;height:620px;right:-180px;top:30%;background:radial-gradient(#1f5bff,transparent 68%);opacity:.26;animation:drift2 32s ease-in-out infinite alternate}
.bgfx i:nth-child(3){width:560px;height:560px;left:30%;bottom:-260px;background:radial-gradient(#c750e0,transparent 70%);opacity:.18;animation:drift1 38s ease-in-out infinite alternate-reverse}
@keyframes drift1{to{transform:translate(120px,90px) scale(1.15)}}
@keyframes drift2{to{transform:translate(-140px,-60px) scale(1.2)}}
.grain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.045;mix-blend-mode:overlay;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='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.spot{position:fixed;left:0;top:0;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(rgba(124,92,255,.13),transparent 65%);transition:opacity .4s;opacity:0}
.progress{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--g);z-index:100;box-shadow:0 0 18px #7c5cff}
main,footer{position:relative;z-index:2}

/* nav */
.nav{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:80;width:min(1180px,100% - 24px);display:flex;align-items:center;gap:8px;padding:9px 10px 9px 20px;border-radius:99px;background:rgba(10,10,18,.55);border:1px solid var(--line);backdrop-filter:blur(22px) saturate(1.5);-webkit-backdrop-filter:blur(22px) saturate(1.5);box-shadow:0 20px 60px -20px rgba(0,0,0,.8),0 1px 0 rgba(255,255,255,.06) inset;transition:.4s}
.nav.sm{top:8px;background:rgba(8,8,14,.78)}
.logo{display:flex;align-items:center;gap:10px;font:700 22px var(--disp);letter-spacing:-.04em}
.logo .mk{width:30px;height:30px;flex:none}
.logo b{font-weight:700}
.nav ul{display:flex;gap:2px;list-style:none;margin:0 auto}
.nav ul a{display:block;padding:9px 15px;border-radius:99px;font-size:14px;color:var(--mute);font-weight:500;transition:.25s}
.nav ul a:hover,.nav ul a.on{color:#fff;background:rgba(255,255,255,.07)}
.burger{display:none;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid var(--line);place-items:center;margin-left:auto}
.burger i{display:block;width:18px;height:2px;background:#fff;border-radius:2px;position:relative}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:18px;height:2px;background:#fff;border-radius:2px;transition:.3s}
.burger i::before{top:-6px}.burger i::after{top:6px}
.nav.open .burger i{background:transparent}.nav.open .burger i::before{transform:translateY(6px) rotate(45deg)}.nav.open .burger i::after{transform:translateY(-6px) rotate(-45deg)}

/* buttons — relieve, glow, sheen, rotating border */
.btn{--h:52px;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;height:var(--h);padding:0 28px;border-radius:99px;font:600 15px var(--ui);color:#fff;white-space:nowrap;isolation:isolate;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s;overflow:hidden;cursor:pointer}
.btn svg{width:18px;height:18px;flex:none}
.btn.p{background:linear-gradient(180deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,0) 46%),var(--g);box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 -3px 8px rgba(0,0,0,.28) inset,0 12px 36px -8px rgba(124,92,255,.85),0 2px 0 #3b2bb3,0 0 0 1px rgba(255,255,255,.1)}
.btn.p::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:sheen 4.2s ease-in-out infinite;z-index:-1}
@keyframes sheen{0%,55%{left:-70%}100%{left:140%}}
.btn.p:hover{transform:translateY(-3px);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 -3px 8px rgba(0,0,0,.28) inset,0 20px 50px -8px rgba(124,92,255,1),0 2px 0 #3b2bb3}
.btn.p:active{transform:translateY(0);box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 6px 20px -6px rgba(124,92,255,.8),0 0 0 #3b2bb3}
.btn.g{background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.02));box-shadow:0 1px 0 rgba(255,255,255,.16) inset,0 10px 30px -12px rgba(0,0,0,.8)}
.btn.g::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--a),transparent 0 62%,#7c5cff,#22d3ee,transparent);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:rot 5s linear infinite;z-index:-1}
.btn.g:hover{transform:translateY(-3px);background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.04))}
@keyframes rot{to{--a:360deg}}
.btn.wa{background:linear-gradient(180deg,rgba(255,255,255,.3),rgba(255,255,255,0) 46%),linear-gradient(115deg,#1ea952,#25d366);box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 -3px 8px rgba(0,0,0,.25) inset,0 12px 36px -8px rgba(37,211,102,.7),0 2px 0 #11793a}
.btn.wa:hover{transform:translateY(-3px)}
.btn.sm{--h:44px;padding:0 22px;font-size:14px}
.btn.xl{--h:62px;padding:0 38px;font-size:17px}

/* type */
.eyebrow{display:inline-flex;align-items:center;gap:10px;padding:7px 16px;border-radius:99px;font:600 12px var(--ui);letter-spacing:.14em;text-transform:uppercase;color:#c9c2ff;background:rgba(124,92,255,.1);border:1px solid rgba(124,92,255,.28)}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--c);box-shadow:0 0 12px var(--c);animation:pulse 2s infinite}
@keyframes pulse{50%{opacity:.35;transform:scale(.7)}}
h1,h2,h3{font-family:var(--disp);letter-spacing:-.035em;line-height:1.04;font-weight:700}
h2{font-size:clamp(34px,5.2vw,64px)}
h3{font-size:22px;letter-spacing:-.02em;line-height:1.2}
.sec{padding:clamp(80px,11vw,150px) 0;position:relative}
.sec-h{max-width:820px;margin:0 auto 64px;text-align:center}
.sec-h h2{margin:22px 0 18px}
.sec-h p{color:var(--mute);font-size:clamp(16px,1.6vw,19px)}
.reveal{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.16,.8,.24,1),transform .9s cubic-bezier(.16,.8,.24,1);transition-delay:calc(var(--i,0)*70ms)}
.reveal.in{opacity:1;transform:none}

/* hero */
.hero{position:relative;padding:150px 0 40px;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg video{width:100%;height:100%;object-fit:cover;opacity:.5}
.hero-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 30%,transparent,var(--bg) 85%),linear-gradient(180deg,rgba(5,5,9,.55),var(--bg) 96%)}
.hero .wrap{position:relative;z-index:2;text-align:center}
.hero h1{font-size:clamp(40px,7.4vw,98px);max-width:1100px;margin:26px auto 24px;line-height:1}
.hero .lead{max-width:720px;margin:0 auto 38px;color:#b4b2c4;font-size:clamp(17px,1.9vw,21px)}
.cta-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.chips{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:34px;color:var(--mute);font-size:13.5px}
.chips span{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:99px;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.chips svg{width:15px;height:15px;color:var(--c)}
.swap{display:inline-block;position:relative}
.swap span{display:inline-block;animation:swapIn .6s cubic-bezier(.2,.8,.2,1) both}
@keyframes swapIn{from{opacity:0;transform:translateY(.5em) scale(.96);filter:blur(8px)}}

.stage{position:relative;z-index:3;margin:70px auto 0;width:min(1180px,100% - 24px);perspective:1800px}
.stage .glow{position:absolute;left:8%;right:8%;top:30%;bottom:-6%;background:radial-gradient(60% 60% at 50% 50%,rgba(124,92,255,.5),transparent 70%);filter:blur(60px);z-index:0}
.bframe{position:relative;z-index:1;border-radius:20px;padding:10px;background:linear-gradient(160deg,rgba(255,255,255,.2),rgba(255,255,255,.04) 40%,rgba(124,92,255,.25));box-shadow:0 60px 120px -30px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.07);transform:rotateX(calc(22deg*(1 - var(--p,0)))) scale(calc(.9 + .1*var(--p,0)));transform-origin:50% 100%;will-change:transform}
.bbar{display:flex;align-items:center;gap:8px;padding:2px 8px 10px}
.bbar i{width:11px;height:11px;border-radius:50%;background:#ff5f57}.bbar i:nth-child(2){background:#febc2e}.bbar i:nth-child(3){background:#28c840}
.bbar .url{margin:0 auto;font:500 12px var(--ui);color:var(--mute);background:rgba(255,255,255,.05);padding:5px 40px;border-radius:99px;display:flex;align-items:center;gap:8px}
.bbar .url svg{width:12px;height:12px;color:var(--ok)}
.screen{position:relative;border-radius:12px;overflow:hidden;background:#05050a;aspect-ratio:1440/860}
.screen iframe{position:absolute;left:0;top:0;width:1440px;height:860px;border:0;transform-origin:0 0;background:#05050a}
.screen .shield{position:absolute;inset:0;z-index:3}
.float{position:absolute;z-index:5;display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;border-radius:16px;background:rgba(14,14,26,.82);border:1px solid var(--line2);backdrop-filter:blur(14px);box-shadow:0 20px 50px -15px rgba(0,0,0,.8);font-size:13px;text-align:left;animation:bob 6s ease-in-out infinite}
.float b{display:block;font-size:13.5px;line-height:1.2}.float small{color:var(--mute);font-size:11.5px}
.float .ic{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--g);flex:none}
.float .ic svg{width:19px;height:19px}
.float.f1{left:-2%;top:22%}.float.f2{right:-3%;top:12%;animation-delay:-2s}.float.f3{right:3%;bottom:10%;animation-delay:-4s}.float.f4{left:2%;bottom:6%;animation-delay:-1s}
.float.f2 .ic{background:linear-gradient(135deg,#25d366,#128c7e)}.float.f3 .ic{background:linear-gradient(135deg,#f5c76b,#e3993e)}.float.f4 .ic{background:linear-gradient(135deg,#22d3ee,#4f6bff)}
@keyframes bob{50%{transform:translateY(-14px)}}

/* marquee */
.marq{position:relative;z-index:2;padding:46px 0;overflow:hidden;border-block:1px solid var(--line);background:rgba(255,255,255,.015);margin-top:70px}
.marq .t{display:flex;gap:56px;width:max-content;animation:marq 42s linear infinite;font:600 26px var(--disp);letter-spacing:-.02em;color:#c9c8d8}
.marq .t span{display:flex;align-items:center;gap:56px;white-space:nowrap}
.marq .t span::after{content:"✦";color:var(--v);font-size:18px}
.marq:hover .t{animation-play-state:paused}
@keyframes marq{to{transform:translateX(-50%)}}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--line)}
.stat{padding:38px 28px;background:var(--bg2);text-align:center}
.stat b{display:block;font:700 clamp(40px,5vw,64px) var(--disp);letter-spacing:-.04em;line-height:1}
.stat span{display:block;margin-top:10px;color:var(--mute);font-size:14px}

/* problem → solution */
.vs{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:stretch}
.vs .col{position:relative;border-radius:var(--r);padding:34px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01))}
.vs .col.bad{background:linear-gradient(180deg,rgba(255,80,100,.05),rgba(255,255,255,.01))}
.vs .col.good{border-color:rgba(124,92,255,.4);background:linear-gradient(180deg,rgba(124,92,255,.12),rgba(34,211,238,.03));box-shadow:0 0 80px -30px rgba(124,92,255,.7)}
.vs h3{margin-bottom:22px;font-size:26px}
.vs ul{list-style:none;display:grid;gap:12px}
.vs li{display:flex;align-items:center;gap:12px;padding:13px 16px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid var(--line);font-size:15px}
.vs li svg{width:18px;height:18px;flex:none}
.bad li{color:#c7a4ac;text-decoration:line-through;text-decoration-color:rgba(255,100,120,.5)}.bad li svg{color:#ff6b81}
.good li svg{color:var(--ok)}

/* bento */
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.bc{position:relative;border-radius:var(--r);padding:26px;min-height:300px;display:flex;flex-direction:column;border:1px solid var(--line);background:linear-gradient(180deg,rgba(20,20,36,.7),rgba(10,10,20,.85));overflow:hidden;transition:transform .5s cubic-bezier(.2,.8,.2,1),border-color .4s}
.bc::before{content:"";position:absolute;inset:0;background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(124,92,255,.22),transparent 55%);opacity:0;transition:opacity .4s;pointer-events:none}
.bc:hover{border-color:rgba(124,92,255,.5);transform:translateY(-6px)}
.bc:hover::before{opacity:1}
.bc.w2{grid-column:span 2}
.bc .vis{flex:1;min-height:130px;margin:-6px -6px 18px;display:grid;place-items:center;position:relative}
.bc h3{font-size:20px;margin-bottom:8px}
.bc p{color:var(--mute);font-size:14.5px;line-height:1.55}
.tag{position:absolute;top:18px;right:18px;font:600 10.5px var(--ui);letter-spacing:.12em;text-transform:uppercase;color:#bdb4ff;padding:5px 11px;border-radius:99px;background:rgba(124,92,255,.14);border:1px solid rgba(124,92,255,.3)}

/* mini visuals */
.mv{width:100%;max-width:300px;position:relative}
.mv .row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid var(--line);font-size:12px;margin-bottom:8px}
.mv .row i{width:22px;height:22px;border-radius:50%;background:var(--g);flex:none}
.mv .row .l{flex:1;height:7px;border-radius:5px;background:rgba(255,255,255,.14)}.mv .row .s{width:38px;height:7px;border-radius:5px;background:rgba(52,224,161,.55)}
.mv .row{animation:rowIn 5s infinite both}
.mv .row:nth-child(2){animation-delay:.5s}.mv .row:nth-child(3){animation-delay:1s}.mv .row:nth-child(4){animation-delay:1.5s}
@keyframes rowIn{0%{opacity:0;transform:translateX(-14px)}12%,88%{opacity:1;transform:none}100%{opacity:0}}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;width:100%;max-width:270px}
.cal span{aspect-ratio:1;border-radius:8px;background:rgba(255,255,255,.05);display:grid;place-items:center;font-size:11px;color:var(--dim)}
.cal span.b{background:var(--g);color:#fff;animation:pop 4s infinite}
.cal span.b:nth-child(2n){animation-delay:.8s}.cal span.b:nth-child(3n){animation-delay:1.6s}
@keyframes pop{0%,100%{transform:scale(1)}50%{transform:scale(1.18);box-shadow:0 0 16px #7c5cff}}
.bub{display:flex;flex-direction:column;gap:8px;width:100%;max-width:280px;font-size:12px}
.bub div{padding:9px 13px;border-radius:14px;max-width:84%;animation:bub 7s infinite both}
.bub .u{background:rgba(255,255,255,.08);align-self:flex-start;border-bottom-left-radius:4px}
.bub .a{background:var(--g);align-self:flex-end;border-bottom-right-radius:4px}
.bub div:nth-child(2){animation-delay:1s}.bub div:nth-child(3){animation-delay:2s}
@keyframes bub{0%{opacity:0;transform:translateY(10px) scale(.95)}8%,86%{opacity:1;transform:none}100%{opacity:0}}
.flow{display:flex;align-items:center;gap:0;width:100%;max-width:290px;justify-content:center}
.flow i{width:34px;height:34px;border-radius:11px;background:rgba(255,255,255,.06);border:1px solid var(--line2);display:grid;place-items:center;flex:none;position:relative}
.flow i svg{width:16px;height:16px;color:#c9c2ff}
.flow u{flex:1;height:2px;background:linear-gradient(90deg,transparent,rgba(124,92,255,.7),transparent);background-size:200% 100%;animation:run 1.8s linear infinite;max-width:30px}
@keyframes run{to{background-position:-200% 0}}
.flow i:nth-of-type(odd){box-shadow:0 0 18px rgba(124,92,255,.5)}
.bars{display:flex;align-items:flex-end;gap:7px;height:110px;width:100%;max-width:260px}
.bars i{flex:1;border-radius:6px 6px 2px 2px;background:var(--g);transform-origin:bottom;animation:grow 3.6s ease-in-out infinite alternate}
.bars i:nth-child(1){height:38%}.bars i:nth-child(2){height:55%;animation-delay:.2s}.bars i:nth-child(3){height:46%;animation-delay:.4s}.bars i:nth-child(4){height:72%;animation-delay:.6s}.bars i:nth-child(5){height:62%;animation-delay:.8s}.bars i:nth-child(6){height:92%;animation-delay:1s}.bars i:nth-child(7){height:80%;animation-delay:1.2s}
@keyframes grow{from{transform:scaleY(.55);opacity:.7}}
.prod{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;max-width:250px}
.prod div{aspect-ratio:1;border-radius:14px;background:linear-gradient(145deg,rgba(124,92,255,.35),rgba(34,211,238,.15));border:1px solid var(--line2);position:relative}
.prod div:nth-child(2){background:linear-gradient(145deg,rgba(199,80,224,.35),rgba(245,199,107,.15))}.prod div:nth-child(3){background:linear-gradient(145deg,rgba(34,211,238,.3),rgba(79,107,255,.2))}.prod div:nth-child(4){background:linear-gradient(145deg,rgba(245,199,107,.3),rgba(199,80,224,.18))}
.prod div::after{content:"+";position:absolute;right:8px;bottom:8px;width:24px;height:24px;border-radius:50%;background:#fff;color:#111;font-weight:700;display:grid;place-items:center;font-size:15px}
.prod div:first-child::after{animation:pop 3s infinite}
.phone-mini{width:96px;height:178px;border-radius:20px;border:2px solid rgba(255,255,255,.22);background:linear-gradient(180deg,#14142a,#0a0a14);padding:10px 8px;box-shadow:0 20px 40px -10px rgba(124,92,255,.5);position:relative}
.phone-mini::before{content:"";position:absolute;top:5px;left:50%;width:30px;height:5px;border-radius:5px;background:#000;transform:translateX(-50%)}
.phone-mini i{display:block;height:34px;border-radius:9px;background:var(--g);margin:14px 0 8px;opacity:.85}.phone-mini b{display:block;height:8px;border-radius:5px;background:rgba(255,255,255,.14);margin-bottom:6px}.phone-mini b:last-child{width:60%}
.pay{width:230px;height:140px;border-radius:18px;background:linear-gradient(135deg,#4f6bff,#7c5cff 55%,#c750e0);padding:18px;position:relative;box-shadow:0 20px 50px -12px rgba(124,92,255,.7);transform:rotate(-6deg)}
.pay::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);background-size:250% 100%;animation:run 3s linear infinite}
.pay small{opacity:.8;font-size:11px}.pay b{display:block;margin-top:50px;font:600 15px var(--ui);letter-spacing:.14em}
.chk{position:absolute;right:-12px;top:-14px;width:44px;height:44px;border-radius:50%;background:var(--ok);display:grid;place-items:center;box-shadow:0 0 30px rgba(52,224,161,.7);animation:pop 3s infinite;z-index:2}
.chk svg{width:22px;height:22px;color:#06261a;stroke-width:3}
.web{width:100%;max-width:280px;border-radius:12px;border:1px solid var(--line2);overflow:hidden;background:#0b0b16}
.web .h{height:78px;background:linear-gradient(120deg,rgba(79,107,255,.6),rgba(199,80,224,.6));position:relative}
.web .h::after{content:"";position:absolute;left:14px;bottom:14px;width:90px;height:10px;border-radius:6px;background:#fff;box-shadow:0 -16px 0 -2px rgba(255,255,255,.8)}
.web .b{padding:12px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.web .b i{height:36px;border-radius:7px;background:rgba(255,255,255,.07)}
.reelmini{width:100px;aspect-ratio:9/16;border-radius:18px;background:conic-gradient(from var(--a),#4f6bff,#c750e0,#22d3ee,#4f6bff);animation:rot 6s linear infinite;display:grid;place-items:center;box-shadow:0 20px 50px -12px rgba(124,92,255,.7)}
.reelmini span{width:calc(100% - 4px);height:calc(100% - 4px);border-radius:16px;background:#0a0a16;display:grid;place-items:center}
.reelmini svg{width:34px;height:34px;color:#fff}
.nodes{position:relative;width:100%;max-width:270px;height:120px}
.nodes i{position:absolute;width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid var(--line2);display:grid;place-items:center}.nodes i svg{width:17px;height:17px;color:#c9c2ff}
.nodes i.c{left:50%;top:50%;margin:-26px 0 0 -26px;width:52px;height:52px;background:var(--g);box-shadow:0 0 40px rgba(124,92,255,.8)}.nodes i.c svg{color:#fff;width:24px;height:24px}
.nodes svg.ln{position:absolute;inset:0;width:100%;height:100%}
.nodes i:nth-of-type(1){left:0;top:4px}.nodes i:nth-of-type(2){right:0;top:4px}.nodes i:nth-of-type(3){left:0;bottom:4px}.nodes i:nth-of-type(4){right:0;bottom:4px}

/* reels */
.reels{display:flex;gap:26px;justify-content:center;align-items:flex-start;flex-wrap:wrap}
.rp{position:relative;width:min(300px,100%);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.rp:nth-child(2){margin-top:-30px}
.rp:hover{transform:translateY(-10px) rotate(-1deg)}
.rp .ph{position:relative;border-radius:44px;padding:9px;background:linear-gradient(160deg,#2a2a44,#0c0c18 50%,#2a1f55);box-shadow:0 50px 90px -26px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.12),0 0 80px -20px rgba(124,92,255,.5)}
.rp .ph::before{content:"";position:absolute;top:18px;left:50%;width:84px;height:24px;border-radius:20px;background:#000;transform:translateX(-50%);z-index:4}
.rp video,.rp .poster{width:100%;aspect-ratio:9/16;border-radius:36px;object-fit:cover;background:#0a0a14;display:block}
.rp .snd{position:absolute;right:24px;bottom:24px;z-index:5;width:46px;height:46px;border-radius:50%;background:rgba(10,10,20,.7);backdrop-filter:blur(10px);border:1px solid var(--line2);display:grid;place-items:center;transition:.3s}
.rp .snd:hover{background:var(--v)}.rp .snd svg{width:19px;height:19px}
.rp .cap{margin-top:22px;text-align:center}.rp .cap b{display:block;font:700 18px var(--disp)}.rp .cap span{color:var(--mute);font-size:14px}
.ig-line{display:flex;justify-content:center;margin-top:50px}

/* demo lab */
.tabs{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:44px}
.tab{display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:99px;font:600 14px var(--ui);color:var(--mute);background:rgba(255,255,255,.04);border:1px solid var(--line);transition:.3s}
.tab svg{width:17px;height:17px}
.tab:hover{color:#fff;border-color:var(--line2)}
.tab.on{color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,0) 50%),var(--g);border-color:transparent;box-shadow:0 10px 30px -8px rgba(124,92,255,.8),0 1px 0 rgba(255,255,255,.4) inset}
.lab{display:grid;grid-template-columns:380px 1fr;gap:40px;align-items:center;padding:42px;border-radius:32px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(18,18,34,.7),rgba(8,8,16,.85));position:relative;overflow:hidden}
.lab::before{content:"";position:absolute;width:600px;height:600px;left:-120px;top:-200px;background:radial-gradient(var(--hue,#7c5cff),transparent 65%);opacity:.18;transition:background .6s;pointer-events:none}
.pw{display:grid;place-items:center;position:relative}
.pw .hint{position:absolute;top:-14px;left:50%;transform:translateX(-50%);z-index:6;font:600 12px var(--ui);padding:6px 14px;border-radius:99px;background:var(--g);box-shadow:0 8px 24px -6px rgba(124,92,255,.8);animation:bob 3s ease-in-out infinite;white-space:nowrap}
.phone{position:relative;width:330px;height:660px;border-radius:50px;padding:10px;background:linear-gradient(160deg,#34345a,#0c0c18 45%,#2f2260);box-shadow:0 60px 100px -30px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.14),0 0 100px -20px var(--hue,#7c5cff)}
.phone::before{content:"";position:absolute;top:20px;left:50%;width:92px;height:26px;border-radius:20px;background:#000;transform:translateX(-50%);z-index:9}
.pscr{position:relative;width:100%;height:100%;border-radius:42px;overflow:hidden;background:#0a0a12;display:flex;flex-direction:column}
.pst{height:46px;flex:none}
.pbody{flex:1;overflow:hidden;position:relative}
.pg{position:absolute;inset:0;padding:6px 18px 18px;display:flex;flex-direction:column;opacity:0;transform:translateX(30px);pointer-events:none;transition:.5s cubic-bezier(.2,.8,.2,1);overflow:auto;scrollbar-width:none}
.pg::-webkit-scrollbar{display:none}
.pg.on{opacity:1;transform:none;pointer-events:auto}
.pg.back{transform:translateX(-30px)}
.ph-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.ph-top .br{display:flex;align-items:center;gap:9px;font:700 16px var(--disp)}
.ph-top .br i{width:30px;height:30px;border-radius:10px;background:var(--hg);display:grid;place-items:center}.ph-top .br svg{width:16px;height:16px;color:#fff}
.ph-hero{border-radius:22px;padding:20px;min-height:150px;background:var(--hg);position:relative;overflow:hidden;margin-bottom:18px;display:flex;flex-direction:column;justify-content:flex-end}
.ph-hero::before{content:"";position:absolute;right:-30px;top:-30px;width:160px;height:160px;border-radius:50%;background:rgba(255,255,255,.2);filter:blur(4px)}
.ph-hero::after{content:"";position:absolute;right:20px;top:14px;width:70px;height:70px;border-radius:50%;border:2px solid rgba(255,255,255,.3)}
.ph-hero small{opacity:.85;font-size:11px;letter-spacing:.12em;text-transform:uppercase;position:relative}.ph-hero b{display:block;font:700 22px/1.1 var(--disp);margin-top:4px;position:relative}
.ph-hero .big{position:absolute;right:22px;top:20px;width:42px;height:42px;color:#fff;opacity:.95;z-index:1}
.ph-h{font:600 13px var(--ui);color:var(--mute);margin:2px 0 10px;letter-spacing:.04em}
.it{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;background:rgba(255,255,255,.045);border:1px solid var(--line);margin-bottom:9px;text-align:left;width:100%;transition:.25s}
.it:hover{background:rgba(255,255,255,.08);border-color:var(--line2)}
.it.sel{border-color:var(--hc);background:rgba(255,255,255,.09);box-shadow:0 0 0 1px var(--hc),0 10px 26px -10px var(--hc)}
.it .th{width:46px;height:46px;border-radius:14px;background:var(--hg);display:grid;place-items:center;flex:none}.it .th svg{width:21px;height:21px;color:#fff}
.it .tx{flex:1;min-width:0}.it .tx b{display:block;font:600 14px var(--ui)}.it .tx span{color:var(--mute);font-size:12px}
.it .pr{font:700 14px var(--ui)}
.it .add{width:30px;height:30px;border-radius:50%;background:#fff;color:#111;display:grid;place-items:center;font-weight:700;flex:none;transition:.25s}.it .add.on{background:var(--ok)}
.it .q{font:700 13px var(--ui);min-width:18px;text-align:center}
.pcta{margin-top:auto;padding-top:12px;position:sticky;bottom:0}
.pbtn{width:100%;height:50px;border-radius:16px;font:700 15px var(--ui);color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.25),rgba(255,255,255,0) 50%),var(--hg);box-shadow:0 1px 0 rgba(255,255,255,.45) inset,0 12px 28px -10px var(--hc);transition:.25s}
.pbtn:disabled{opacity:.35;box-shadow:none}.pbtn:not(:disabled):hover{transform:translateY(-2px)}
.pback{display:flex;align-items:center;gap:6px;color:var(--mute);font-size:13px;margin-bottom:14px;padding:4px 0}.pback svg{width:16px;height:16px}
.days{display:flex;gap:8px;overflow:auto;padding:2px 0 12px;scrollbar-width:none}
.day{flex:none;width:52px;padding:10px 0;border-radius:15px;text-align:center;background:rgba(255,255,255,.05);border:1px solid var(--line);transition:.25s}
.day small{display:block;color:var(--mute);font-size:10.5px;text-transform:uppercase}.day b{font:700 17px var(--ui)}
.day.sel{background:var(--hg);border-color:transparent;box-shadow:0 8px 22px -8px var(--hc)}.day.sel small{color:#fff;opacity:.8}
.slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.slot{padding:12px 0;border-radius:13px;background:rgba(255,255,255,.05);border:1px solid var(--line);font:600 13px var(--ui);transition:.25s}
.slot.sel{background:var(--hg);border-color:transparent}.slot.off{opacity:.3;text-decoration:line-through;pointer-events:none}
.sum{padding:16px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid var(--line);margin-bottom:14px}
.sum .r{display:flex;justify-content:space-between;font-size:13.5px;padding:5px 0}.sum .r span{color:var(--mute)}.sum .r.t{border-top:1px dashed var(--line2);margin-top:6px;padding-top:12px;font:700 16px var(--ui)}
.fld{display:block;margin-bottom:10px}.fld small{display:block;color:var(--mute);font-size:11.5px;margin-bottom:5px}
.fld input{width:100%;height:46px;border-radius:13px;background:rgba(255,255,255,.06);border:1px solid var(--line2);padding:0 14px;outline:0;transition:.25s}.fld input:focus{border-color:var(--hc);box-shadow:0 0 0 3px color-mix(in srgb,var(--hc) 30%,transparent)}
.done{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;flex:1;gap:10px}
.done .ok{width:92px;height:92px;border-radius:50%;background:var(--ok);display:grid;place-items:center;box-shadow:0 0 0 0 rgba(52,224,161,.6),0 0 60px rgba(52,224,161,.5);animation:okp 1.8s ease-out infinite}.done .ok svg{width:46px;height:46px;color:#06261a;stroke-width:3}
@keyframes okp{70%{box-shadow:0 0 0 26px rgba(52,224,161,0),0 0 60px rgba(52,224,161,.5)}100%{box-shadow:0 0 0 0 rgba(52,224,161,0)}}
.done h4{font:700 24px var(--disp)}.done p{color:var(--mute);font-size:14px;max-width:240px}

.biz{min-width:0}
.biz .hd{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.biz h3{font-size:clamp(26px,3vw,38px)}
.biz .sub{color:var(--mute);margin-bottom:26px;max-width:560px}
.dash{border-radius:22px;border:1px solid var(--line2);background:rgba(7,7,14,.8);overflow:hidden;box-shadow:0 30px 70px -30px rgba(0,0,0,.9)}
.dtop{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);font:600 13px var(--ui)}
.dtop .lv{margin-left:auto;display:flex;align-items:center;gap:7px;color:var(--ok);font-size:12px}.dtop .lv i{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:pulse 1.6s infinite}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
.kpi{padding:16px 18px;background:#0a0a14}.kpi small{color:var(--mute);font-size:11.5px}.kpi b{display:block;font:700 26px var(--disp);letter-spacing:-.03em;margin-top:2px}.kpi b.bump{animation:bump .7s}
@keyframes bump{40%{transform:scale(1.25);color:var(--ok)}}
.feed{padding:12px 14px;display:grid;gap:8px;min-height:208px;align-content:start}
.ev{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid var(--line);font-size:13px;animation:evIn .6s cubic-bezier(.2,.8,.2,1)}
.ev.new{border-color:rgba(52,224,161,.5);background:rgba(52,224,161,.07)}
.ev i{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;flex:none;background:var(--hg)}.ev i svg{width:15px;height:15px;color:#fff}
.ev b{display:block;font-weight:600;font-size:13px}.ev span{color:var(--mute);font-size:11.5px}.ev em{margin-left:auto;font-style:normal;color:var(--dim);font-size:11px;white-space:nowrap}
@keyframes evIn{from{opacity:0;transform:translateY(-14px) scale(.97)}}
.wam{margin:0 14px 14px;padding:14px;border-radius:16px;background:#0b1511;border:1px solid rgba(37,211,102,.25);min-height:104px}
.wam .h{display:flex;align-items:center;gap:8px;font:600 12px var(--ui);color:#7fe3a9;margin-bottom:10px}.wam .h svg{width:15px;height:15px}
.wam .m{background:#12301f;border-radius:12px 12px 12px 3px;padding:10px 13px;font-size:13px;max-width:90%;animation:evIn .5s;line-height:1.45}
.wam .m + .m{margin-top:6px}
.wam .ty{display:inline-flex;gap:4px;padding:12px 14px;background:#12301f;border-radius:12px}.wam .ty i{width:6px;height:6px;border-radius:50%;background:#7fe3a9;animation:ty 1s infinite}.wam .ty i:nth-child(2){animation-delay:.15s}.wam .ty i:nth-child(3){animation-delay:.3s}
@keyframes ty{50%{transform:translateY(-5px);opacity:.4}}
.toast{position:absolute;left:50%;top:18px;transform:translate(-50%,-140%);z-index:20;display:flex;align-items:center;gap:12px;padding:12px 18px 12px 12px;border-radius:16px;background:rgba(14,14,26,.94);border:1px solid rgba(52,224,161,.5);backdrop-filter:blur(14px);box-shadow:0 20px 50px -10px rgba(0,0,0,.8);font-size:13px;transition:transform .6s cubic-bezier(.2,.8,.2,1);white-space:nowrap}
.toast.on{transform:translate(-50%,0)}.toast i{width:34px;height:34px;border-radius:10px;background:var(--ok);display:grid;place-items:center}.toast svg{width:17px;height:17px;color:#06261a}
.lab-foot{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-top:24px}
.lab-foot span{color:var(--mute);font-size:13.5px}

/* crm full */
.crm-wrap{position:relative}
.crm-tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:26px}
.crm-tabs button{padding:9px 16px;border-radius:99px;font:600 13.5px var(--ui);color:var(--mute);background:rgba(255,255,255,.04);border:1px solid var(--line);transition:.25s}
.crm-tabs button.on,.crm-tabs button:hover{color:#fff;border-color:rgba(124,92,255,.6);background:rgba(124,92,255,.15)}
.crm-note{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:28px;color:var(--mute);font-size:14px}
.crm-note span{display:inline-flex;align-items:center;gap:8px}.crm-note kbd{font:600 12px var(--ui);padding:3px 9px;border-radius:7px;background:rgba(255,255,255,.08);border:1px solid var(--line2)}
.crm-note svg{width:16px;height:16px;color:var(--c)}
.only-m{display:none!important}
@media(max-width:820px){.only-m{display:inline-flex!important}.no-m{display:none!important}}
.try{position:absolute;inset:0;z-index:4;display:grid;place-items:center;background:rgba(5,5,9,.45);backdrop-filter:blur(3px);transition:.4s}
.try.off{opacity:0;pointer-events:none}

/* ai */
.ai{display:grid;grid-template-columns:1fr 440px;gap:60px;align-items:center}
.ai-list{display:grid;gap:14px;margin-top:34px}
.ai-list .li{display:flex;gap:16px;padding:18px 20px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.03);transition:.3s}
.ai-list .li:hover{border-color:rgba(124,92,255,.5);background:rgba(124,92,255,.07);transform:translateX(6px)}
.ai-list .li i{width:44px;height:44px;border-radius:13px;background:var(--g);display:grid;place-items:center;flex:none;box-shadow:0 8px 22px -8px #7c5cff}.ai-list .li svg{width:20px;height:20px}
.ai-list b{display:block;font:600 16px var(--ui);margin-bottom:2px}.ai-list span{color:var(--mute);font-size:14px}
.wa{position:relative;border-radius:32px;border:1px solid var(--line2);overflow:hidden;background:#0a0f0d;box-shadow:0 50px 100px -30px rgba(0,0,0,.9),0 0 90px -30px rgba(37,211,102,.5)}
.wa-h{display:flex;align-items:center;gap:12px;padding:16px 18px;background:#0f1f18;border-bottom:1px solid rgba(255,255,255,.06)}
.wa-h .av{width:42px;height:42px;border-radius:50%;background:var(--g);display:grid;place-items:center;font:700 14px var(--ui);position:relative}
.wa-h .av::after{content:"";position:absolute;right:0;bottom:0;width:11px;height:11px;border-radius:50%;background:var(--wa);border:2px solid #0f1f18}
.wa-h b{display:block;font-size:15px}.wa-h small{color:#7fe3a9;font-size:12px}
.wa-b{height:410px;padding:18px;display:flex;flex-direction:column;gap:9px;overflow:hidden;justify-content:flex-end;background:radial-gradient(circle at 20% 10%,rgba(37,211,102,.06),transparent 50%)}
.msg{max-width:82%;padding:10px 14px;border-radius:16px;font-size:14px;line-height:1.45;animation:evIn .5s cubic-bezier(.2,.8,.2,1)}
.msg.u{align-self:flex-start;background:#1c2b24;border-bottom-left-radius:4px}
.msg.a{align-self:flex-end;background:linear-gradient(135deg,#1e6b42,#168a4f);border-bottom-right-radius:4px}
.msg small{display:block;margin-top:4px;opacity:.55;font-size:10.5px;text-align:right}
.msg.ty{padding:13px 16px}.msg.ty i{display:inline-block;width:7px;height:7px;margin:0 2px;border-radius:50%;background:#7fe3a9;animation:ty 1s infinite}.msg.ty i:nth-child(2){animation-delay:.15s}.msg.ty i:nth-child(3){animation-delay:.3s}
.wa-q{display:flex;gap:8px;flex-wrap:wrap;padding:14px 16px;border-top:1px solid rgba(255,255,255,.06);background:#0c1511}
.wa-q button{padding:9px 14px;border-radius:99px;font:500 13px var(--ui);background:rgba(37,211,102,.1);border:1px solid rgba(37,211,102,.35);color:#9af0bf;transition:.25s}
.wa-q button:hover,.wa-q button.on{background:rgba(37,211,102,.25);color:#fff}

/* automation */
.auto{position:relative;border-radius:30px;border:1px solid var(--line);padding:50px 34px;background:linear-gradient(180deg,rgba(18,18,34,.6),rgba(8,8,16,.8));overflow:hidden}
.pipe{display:grid;grid-template-columns:repeat(6,1fr);gap:0;position:relative}
.pipe::before{content:"";position:absolute;left:8%;right:8%;top:38px;height:2px;background:rgba(255,255,255,.08)}
.pipe::after{content:"";position:absolute;left:8%;top:38px;height:2px;width:calc(var(--w,0)*84%);background:var(--g);box-shadow:0 0 16px #7c5cff;transition:width .9s cubic-bezier(.2,.8,.2,1)}
.pn{position:relative;z-index:2;text-align:center;padding:0 8px;cursor:pointer}
.pn .d{width:76px;height:76px;margin:0 auto 18px;border-radius:24px;display:grid;place-items:center;background:#0d0d1a;border:1px solid var(--line2);transition:.5s}
.pn .d svg{width:30px;height:30px;color:#8e8ca3;transition:.4s}
.pn.on .d{background:var(--g);border-color:transparent;box-shadow:0 0 0 8px rgba(124,92,255,.14),0 16px 40px -8px rgba(124,92,255,.9);transform:translateY(-6px) scale(1.06)}.pn.on .d svg{color:#fff}
.pn.done .d{border-color:rgba(124,92,255,.6)}.pn.done .d svg{color:#bdb4ff}
.pn b{display:block;font:600 14.5px var(--ui);margin-bottom:4px}.pn span{color:var(--mute);font-size:12.5px;line-height:1.4;display:block}
.auto-out{margin-top:40px;padding:20px 24px;border-radius:18px;background:rgba(124,92,255,.08);border:1px solid rgba(124,92,255,.3);display:flex;gap:16px;align-items:center;min-height:84px}
.auto-out i{width:42px;height:42px;border-radius:13px;background:var(--g);display:grid;place-items:center;flex:none}.auto-out i svg{width:20px;height:20px}
.auto-out b{display:block;font-size:16px}.auto-out span{color:var(--mute);font-size:14px}

/* industries */
.ind{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.ib{display:flex;align-items:center;gap:14px;padding:20px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.03);transition:.35s;text-align:left;width:100%}
.ib:hover{border-color:rgba(124,92,255,.6);background:rgba(124,92,255,.09);transform:translateY(-4px)}
.ib i{width:44px;height:44px;border-radius:13px;background:rgba(124,92,255,.14);display:grid;place-items:center;flex:none;color:#c9c2ff;transition:.35s}.ib:hover i{background:var(--g);color:#fff}
.ib svg{width:21px;height:21px}.ib b{font:600 15px var(--ui)}.ib small{display:block;color:var(--mute);font-size:12px}
.ib.dm::after{content:"Demo";margin-left:auto;font:600 10px var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--ok);padding:3px 8px;border-radius:99px;border:1px solid rgba(52,224,161,.4)}

/* cotizador */
.quote{display:grid;grid-template-columns:1.25fr 1fr;gap:26px;align-items:start}
.q-l,.q-r{border-radius:28px;border:1px solid var(--line);padding:34px;background:linear-gradient(180deg,rgba(18,18,34,.7),rgba(8,8,16,.85))}
.q-r{position:sticky;top:96px;border-color:rgba(124,92,255,.4);box-shadow:0 0 90px -30px rgba(124,92,255,.7)}
.q-l h4{font:600 13px var(--ui);color:var(--mute);letter-spacing:.14em;text-transform:uppercase;margin:0 0 14px}
.q-l h4:not(:first-child){margin-top:30px}
.mods{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.mod{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.03);text-align:left;transition:.25s;position:relative}
.mod i{width:36px;height:36px;border-radius:11px;background:rgba(255,255,255,.06);display:grid;place-items:center;flex:none;transition:.25s}.mod svg{width:17px;height:17px}
.mod b{font:600 14px var(--ui);display:block}.mod small{color:var(--mute);font-size:12px}
.mod::after{content:"";margin-left:auto;width:22px;height:22px;border-radius:50%;border:2px solid var(--line2);flex:none;transition:.25s}
.mod:hover{border-color:var(--line2)}
.mod.on{border-color:rgba(124,92,255,.7);background:rgba(124,92,255,.12)}.mod.on i{background:var(--g)}.mod.on::after{background:var(--ok) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2306261a' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/13px no-repeat;border-color:var(--ok)}
.bsel{display:flex;flex-wrap:wrap;gap:8px}
.bsel button{padding:9px 16px;border-radius:99px;font:500 13.5px var(--ui);color:var(--mute);border:1px solid var(--line);background:rgba(255,255,255,.03);transition:.25s}
.bsel button.on{color:#fff;background:var(--g);border-color:transparent}
.q-r .pl{font:600 12px var(--ui);color:#bdb4ff;letter-spacing:.14em;text-transform:uppercase}
.q-r .big{font:700 clamp(38px,4.5vw,56px) var(--disp);letter-spacing:-.04em;margin:8px 0 2px;line-height:1.05}
.q-r .usd{color:var(--mute);margin-bottom:20px}
.meter{height:8px;border-radius:8px;background:rgba(255,255,255,.07);overflow:hidden;margin:18px 0 22px}.meter i{display:block;height:100%;width:0;background:var(--g);border-radius:8px;transition:width .8s cubic-bezier(.2,.8,.2,1);box-shadow:0 0 16px #7c5cff}
.q-r ul{list-style:none;display:grid;gap:9px;margin-bottom:24px;font-size:14px}.q-r li{display:flex;gap:10px;align-items:flex-start;color:#c8c6d8}.q-r li svg{width:17px;height:17px;color:var(--ok);flex:none;margin-top:3px}
.q-r small{display:block;margin-top:14px;color:var(--dim);font-size:12px;line-height:1.5}

/* plans */
.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;align-items:stretch}
.plan{position:relative;border-radius:26px;padding:30px 26px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(18,18,34,.7),rgba(8,8,16,.85));display:flex;flex-direction:column;transition:.4s}
.plan:hover{transform:translateY(-8px);border-color:rgba(124,92,255,.5)}
.plan.hot{border-color:transparent;background:linear-gradient(180deg,#14112d,#0a0a18);box-shadow:0 0 90px -20px rgba(124,92,255,.8)}
.plan.hot::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--a),#4f6bff,#c750e0,#22d3ee,#4f6bff);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:rot 6s linear infinite}
.plan .bd{position:absolute;top:-13px;left:50%;transform:translateX(-50%);padding:5px 16px;border-radius:99px;background:var(--g);font:700 11px var(--ui);letter-spacing:.1em;text-transform:uppercase;box-shadow:0 8px 24px -6px #7c5cff;white-space:nowrap}
.plan .k{font:600 12px var(--ui);letter-spacing:.14em;color:var(--mute);text-transform:uppercase}
.plan h3{font-size:30px;margin:6px 0 8px}.plan .d{color:var(--mute);font-size:14px;min-height:42px}
.plan .pr{margin:22px 0 4px}.plan .pr small{color:var(--dim);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;display:block}.plan .pr b{font:700 38px var(--disp);letter-spacing:-.04em}.plan .pr span{color:var(--mute);font-size:14px;margin-left:4px}
.plan .ap{color:var(--dim);font-size:13px;margin-bottom:22px}
.plan ul{list-style:none;display:grid;gap:11px;margin-bottom:26px;flex:1;font-size:14px;color:#cfcde0}.plan li{display:flex;gap:10px;align-items:flex-start}.plan li svg{width:17px;height:17px;color:var(--ok);flex:none;margin-top:3px}
.plan .no{font-size:12.5px;color:var(--dim);margin-bottom:20px;line-height:1.5}
.plan .btn{width:100%}

/* trust + process */
.trust{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.tr{padding:26px 22px;border-radius:20px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.tr i{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:rgba(124,92,255,.14);color:#c9c2ff;margin-bottom:16px;font:700 14px var(--disp);font-style:normal}
.tr b{display:block;font:600 16px var(--ui);margin-bottom:6px}.tr span{color:var(--mute);font-size:13.5px;line-height:1.5}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:s}
.stp{position:relative;padding:30px;border-radius:24px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(18,18,34,.6),rgba(8,8,16,.8));overflow:hidden}
.stp::before{counter-increment:s;content:"0" counter(s);position:absolute;right:20px;top:6px;font:700 90px var(--disp);letter-spacing:-.06em;color:rgba(255,255,255,.04);line-height:1}
.stp i{display:grid;place-items:center;width:50px;height:50px;border-radius:15px;background:var(--g);margin-bottom:20px;box-shadow:0 10px 28px -8px #7c5cff}.stp i svg{width:23px;height:23px}
.stp h3{margin-bottom:8px}.stp p{color:var(--mute);font-size:14.5px}

/* faq */
.faq{max-width:860px;margin:0 auto;display:grid;gap:12px}
.fq{border-radius:20px;border:1px solid var(--line);background:rgba(255,255,255,.03);overflow:hidden;transition:.3s}
.fq.on{border-color:rgba(124,92,255,.5);background:rgba(124,92,255,.07)}
.fq button{width:100%;display:flex;align-items:center;gap:16px;padding:22px 26px;text-align:left;font:600 17px var(--ui)}
.fq button svg{margin-left:auto;width:22px;height:22px;color:#bdb4ff;transition:.4s;flex:none}.fq.on button svg{transform:rotate(45deg)}
.fq .a{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.2,.8,.2,1)}.fq .a p{padding:0 26px 24px;color:var(--mute);font-size:15.5px}

/* cta final */
.cta{position:relative;border-radius:40px;padding:clamp(50px,8vw,110px) 28px;text-align:center;overflow:hidden;border:1px solid rgba(124,92,255,.4);background:radial-gradient(70% 90% at 50% 0%,rgba(124,92,255,.35),transparent 70%),linear-gradient(180deg,#0f0d24,#07070f)}
.cta video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.18;mix-blend-mode:screen}
.cta>*{position:relative;z-index:2}
.cta h2{max-width:900px;margin:22px auto 20px}.cta p{max-width:600px;margin:0 auto 40px;color:#b4b2c4;font-size:18px}
.cta small{display:block;margin-top:26px;color:var(--dim);font-size:13px;max-width:520px;margin-inline:auto}
footer{padding:60px 0 40px;border-top:1px solid var(--line);margin-top:100px}
.ft{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}
.ft p{color:var(--mute);font-size:14px;margin-top:14px;max-width:320px}
.ft h5{font:600 12px var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:16px}
.ft a{display:block;color:#c8c6d8;font-size:14.5px;padding:5px 0;transition:.2s}.ft a:hover{color:#fff;transform:translateX(4px)}
.copy{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:50px;padding-top:26px;border-top:1px solid var(--line);color:var(--dim);font-size:13px}

/* floating */
.fab{position:fixed;right:18px;bottom:18px;z-index:70;display:flex;flex-direction:column;gap:12px;align-items:flex-end}
.fab button,.fab a{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;position:relative;transition:.3s;box-shadow:0 14px 34px -8px rgba(0,0,0,.8)}
.fab .ai-b{background:linear-gradient(180deg,rgba(255,255,255,.3),transparent 50%),var(--g);box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 14px 34px -8px rgba(124,92,255,.9)}
.fab .wa-b{background:linear-gradient(180deg,rgba(255,255,255,.3),transparent 50%),#25d366;box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 14px 34px -8px rgba(37,211,102,.8)}
.fab svg{width:26px;height:26px}
.fab button:hover,.fab a:hover{transform:translateY(-4px) scale(1.06)}
.fab .ai-b::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid #7c5cff;animation:ring 2.4s infinite;opacity:0}
@keyframes ring{0%{transform:scale(.8);opacity:.9}100%{transform:scale(1.5);opacity:0}}
.chatp{position:fixed;right:18px;bottom:156px;z-index:75;width:min(380px,100% - 36px);border-radius:26px;overflow:hidden;background:rgba(10,10,20,.96);border:1px solid var(--line2);backdrop-filter:blur(20px);box-shadow:0 40px 90px -20px rgba(0,0,0,.95),0 0 60px -20px rgba(124,92,255,.6);transform:translateY(20px) scale(.96);opacity:0;pointer-events:none;transition:.4s cubic-bezier(.2,.8,.2,1);transform-origin:100% 100%}
.chatp.on{transform:none;opacity:1;pointer-events:auto}
.chatp .ch{display:flex;align-items:center;gap:12px;padding:16px 18px;background:linear-gradient(120deg,rgba(79,107,255,.35),rgba(199,80,224,.25));border-bottom:1px solid var(--line)}
.chatp .ch .orb{width:38px;height:38px;border-radius:50%;background:conic-gradient(from var(--a),#4f6bff,#c750e0,#22d3ee,#4f6bff);animation:rot 5s linear infinite;position:relative;flex:none}.chatp .ch .orb::after{content:"";position:absolute;inset:4px;border-radius:50%;background:#0b0b18}
.chatp .ch b{display:block;font-size:15px}.chatp .ch small{color:#b7e9cd;font-size:12px}.chatp .ch .x{margin-left:auto;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.08);display:grid;place-items:center}.chatp .ch .x svg{width:16px;height:16px}
.chatp .cb{height:300px;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:9px;scrollbar-width:thin}
.chatp .m{max-width:86%;padding:10px 14px;border-radius:16px;font-size:14px;line-height:1.45;animation:evIn .4s}
.chatp .m.b{background:rgba(255,255,255,.07);border-bottom-left-radius:4px;align-self:flex-start}.chatp .m.me{background:var(--g);align-self:flex-end;border-bottom-right-radius:4px}
.chatp .qs{display:flex;gap:7px;flex-wrap:wrap;padding:0 16px 12px}.chatp .qs button{padding:8px 13px;border-radius:99px;font:500 12.5px var(--ui);border:1px solid rgba(124,92,255,.5);color:#c9c2ff;background:rgba(124,92,255,.1);transition:.2s}.chatp .qs button:hover{background:var(--v);color:#fff}
.chatp form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line)}.chatp form input{flex:1;height:44px;border-radius:99px;background:rgba(255,255,255,.06);border:1px solid var(--line);padding:0 16px;outline:0}.chatp form input:focus{border-color:var(--v)}
.chatp form button{width:44px;height:44px;border-radius:50%;background:var(--g);display:grid;place-items:center}.chatp form svg{width:19px;height:19px}

/* responsive */
@media(max-width:1100px){
  .bento{grid-template-columns:repeat(2,1fr)}.bc.w2{grid-column:span 2}
  .lab{grid-template-columns:1fr;padding:28px}
  .ai{grid-template-columns:1fr}.quote{grid-template-columns:1fr}.q-r{position:static}
  .plans{grid-template-columns:repeat(2,1fr)}.trust{grid-template-columns:repeat(2,1fr)}.ind{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .float{display:none}
  .pipe{grid-template-columns:repeat(3,1fr);row-gap:34px}.pipe::before,.pipe::after{display:none}
}
@media(max-width:820px){
  .nav ul{position:absolute;top:calc(100% + 10px);left:0;right:0;flex-direction:column;padding:12px;border-radius:26px;background:rgba(8,8,16,.96);border:1px solid var(--line2);transform:translateY(-10px);opacity:0;pointer-events:none;transition:.3s}
  .nav.open ul{transform:none;opacity:1;pointer-events:auto}.nav ul a{padding:14px 18px}
  .burger{display:grid}.nav .btn.sm{display:none}
  .stats{grid-template-columns:repeat(2,1fr)}.vs{grid-template-columns:1fr}
  .ft{grid-template-columns:1fr 1fr}
  .rp:nth-child(2){margin-top:0}
}
@media(max-width:600px){
  .wrap{width:calc(100% - 32px)}
  .hero{padding-top:120px}
  .bento{grid-template-columns:1fr}.bc.w2{grid-column:span 1}.bc{min-height:260px}
  .plans,.trust,.steps,.ind,.mods{grid-template-columns:1fr}
  .ind .ib{grid-column:auto!important}
  .phone{width:min(330px,100%);height:640px}.lab{padding:20px;border-radius:26px}
  .kpis{grid-template-columns:repeat(3,1fr)}.kpi b{font-size:20px}
  .pipe{grid-template-columns:repeat(2,1fr)}
  .q-l,.q-r{padding:22px}
  .btn.xl{--h:56px;padding:0 26px;font-size:16px}
  .fab{right:12px;bottom:12px}.fab button,.fab a{width:54px;height:54px}
  .chatp{right:12px;bottom:140px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.bframe{transform:none}}
