.stage{aspect-ratio:5/4;perspective:1400px;isolation:isolate;position:relative}.stage:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(closest-side, color-mix(in srgb, var(--c-violet) 34%, transparent), transparent), repeating-linear-gradient(0deg, color-mix(in srgb, var(--c-cream) 7%, transparent) 0 1px, transparent 1px 48px), repeating-linear-gradient(90deg, color-mix(in srgb, var(--c-cream) 7%, transparent) 0 1px, transparent 1px 48px);position:absolute;inset:-8%;mask:radial-gradient(closest-side,#000 55%,#0000)}.stage:after{content:"";background:var(--violet-light);height:2px;box-shadow:0 0 24px 4px var(--c-violet);opacity:0;pointer-events:none;z-index:3;position:absolute;top:0;left:4%;right:4%}.stage.swap:after{animation:scan .9s var(--ease) both}@keyframes scan{0%{opacity:0;top:6%}15%{opacity:1}to{opacity:0;top:94%}}.stage-tilt{transform-style:preserve-3d;transform:rotateY(calc(var(--px,0) * 10deg + var(--sy,0) * 16deg)) rotateX(calc(var(--py,0) * -8deg));transition:transform .4s var(--ease);place-items:center;display:grid;position:absolute;inset:0}.device{background:color-mix(in srgb, var(--c-violet) 22%, var(--c-graphite));width:90%;height:86%;transition:width .9s var(--ease), height .9s var(--ease), border-radius .9s var(--ease), transform .9s var(--ease), opacity .6s, background-color .6s;border-radius:16px;grid-area:1/1}[data-shape=web_app] .device{border-radius:10px;width:94%;height:84%}[data-shape=mobile_app] .device{border-radius:52px;width:36%;height:96%;transform:rotate(-4deg)}[data-shape=desktop_app] .device{border-radius:8px;width:86%;height:80%;transform:translate(4%,6%)}[data-shape=cloud] .device{opacity:.45;border-radius:999px;width:100%;height:76%}[data-shape=integrations] .device{opacity:.45;border-radius:50%;width:64%;height:80%}.screen{width:86%;height:82%;font:400 14px/1.35 var(--text);color:var(--ink);opacity:0;clip-path:inset(0 0 100%);transition:opacity .5s var(--ease), transform .7s var(--ease), clip-path .7s var(--ease);pointer-events:none;grid-area:1/1;place-items:center;display:grid;position:relative;transform:translateZ(-80px)scale(.94)}.screen.on{opacity:1;clip-path:inset(0);pointer-events:auto;transform:translateZ(0)}.screen svg{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.screen svg path{fill:none;stroke:color-mix(in srgb, var(--c-cream) 26%, var(--c-black));stroke-width:2px;stroke-dasharray:5 7}.screen svg .pk circle{fill:var(--violet-light)}.screen.on svg path{animation:1s linear infinite dash}@keyframes dash{to{stroke-dashoffset:-24px}}.win{background:var(--c-cream);border-radius:10px;flex-direction:column;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.win-bar{background:color-mix(in srgb, var(--c-graphite) 8%, var(--c-cream));color:var(--muted);align-items:center;gap:6px;padding:10px 12px;font-size:13px;display:flex}.win-bar i{background:color-mix(in srgb, var(--c-graphite) 22%, var(--c-cream));border-radius:50%;width:10px;height:10px}.win-bar i:first-child{background:var(--c-violet)}.win-bar>span{margin-left:10px}.url{background:var(--c-cream);border-radius:99px;padding:3px 12px;display:inline-block}.url span{white-space:nowrap;vertical-align:bottom;display:inline-block;overflow:hidden}.sc-web.on .url span{animation:1s steps(20,end) both typing}@keyframes typing{0%{max-width:0}to{max-width:20ch}}.load{background:var(--c-violet);transform-origin:0;height:4px;transform:scaleX(0)}.sc-web.on .load{animation:load 1.4s var(--ease) .6s both, fadeout .3s 2.1s both}@keyframes load{to{transform:scaleX(1)}}@keyframes fadeout{to{opacity:0}}.web-page{flex:1;grid-template-rows:1fr auto;gap:14px;padding:18px;display:grid}.web-hero{grid-template-columns:1.1fr 1fr;align-items:center;gap:16px;display:grid}.web-copy{justify-items:start;gap:8px;display:grid}.web-copy b{font:900 clamp(18px, 1.7vw, 28px)/1 var(--display);letter-spacing:-.03em}.web-copy span{color:var(--muted)}.web-cta{background:var(--c-violet);color:var(--c-cream);padding:8px 16px;font-style:normal;font-weight:500}.web-art{background:var(--c-violet-deep);height:100%;min-height:110px;position:relative;overflow:hidden}.sun{background:#f3c86a;border-radius:50%;width:46px;height:46px;position:absolute;top:18%;right:18%}.hill{background:var(--c-violet);border-radius:50%;height:80%;position:absolute;bottom:-40%;left:-10%;right:20%}.hill.two{background:var(--violet-light);bottom:-55%;left:35%;right:-20%}.web-cards{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.web-cards div{background:color-mix(in srgb, var(--c-graphite) 6%, var(--c-cream));gap:6px;padding:10px;display:grid}.web-cards span{background:color-mix(in srgb, var(--c-violet) 22%, var(--c-cream));height:38px}.web-cards b{font-size:13px;font-weight:500}.sc-web.on .web-copy>*{animation:rise-in .6s var(--ease) both}.sc-web.on .web-copy>:first-child{animation-delay:1s}.sc-web.on .web-copy>:nth-child(2){animation-delay:1.15s}.sc-web.on .web-copy>:nth-child(3){animation-delay:1.3s}.sc-web.on .web-art{animation:wipe .8s var(--ease) 1.1s both}.sc-web.on .sun{animation:sunrise 1.6s var(--ease) 1.5s both}.sc-web.on .web-cards div{animation:rise-in .5s var(--ease) both}.sc-web.on .web-cards div:first-child{animation-delay:1.6s}.sc-web.on .web-cards div:nth-child(2){animation-delay:1.7s}.sc-web.on .web-cards div:nth-child(3){animation-delay:1.8s}@keyframes rise-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes wipe{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@keyframes sunrise{0%{transform:translateY(80px)}to{transform:none}}.cursor{background:var(--c-graphite);clip-path:polygon(0 0,0 100%,30% 72%,52% 100%,66% 92%,45% 66%,85% 64%);opacity:0;width:18px;height:18px;position:absolute;top:85%;left:70%}.sc-web.on .cursor{animation:point 1.6s var(--ease) 2.2s both}.sc-web.on .web-cta{animation:rise-in .6s var(--ease) 1.3s both, press .3s ease 3.5s both}@keyframes point{0%{opacity:0;top:90%;left:75%}30%{opacity:1}to{opacity:1;top:44%;left:14%}}@keyframes press{50%{background:var(--c-violet-deep);transform:scale(.92)}}.app{flex-direction:row}.app aside{background:var(--c-graphite);align-content:start;gap:12px;width:52px;padding:14px 12px;display:grid}.app aside b{background:var(--c-violet);border-radius:6px;height:26px}.app aside i{background:color-mix(in srgb, var(--c-cream) 25%, var(--c-graphite));border-radius:4px;height:8px}.app aside i.on{background:var(--violet-light)}.app-main{flex:1;grid-template-rows:auto 1fr auto;gap:12px;min-width:0;padding:16px;display:grid}.app-head{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.app-head b{font:900 22px/1 var(--display);letter-spacing:-.02em}.kpi{color:var(--muted);font-size:13px}.kpi strong{color:var(--c-violet);font:900 20px/1 var(--display)}.chart{grid-template-columns:repeat(7,1fr);align-items:end;gap:8px;min-height:90px;display:grid}.bar{grid-template-rows:1fr auto;gap:4px;height:100%;display:grid}.bar span{height:var(--h);background:color-mix(in srgb, var(--c-violet) 35%, var(--c-cream));transform-origin:bottom;border-radius:4px 4px 0 0;align-self:end}.bar:nth-child(5) span{background:var(--c-violet)}.bar small{color:var(--muted);text-align:center;font-size:13px}.sc-app.on .bar span{animation:grow .8s var(--ease) calc(.3s + var(--i) * 80ms) both}@keyframes grow{0%{transform:scaleY(0)}to{transform:scaleY(1)}}.rows{gap:6px;margin:0;padding:0;list-style:none;display:grid}.rows li{background:#fff;border-radius:6px;grid-template-columns:52px 1fr auto;align-items:center;gap:8px;padding:7px 10px;display:grid}.rows span{color:var(--muted);font-variant-numeric:tabular-nums}.rows mark{background:color-mix(in srgb, var(--c-violet) 18%, #fff);color:var(--c-violet-deep);border-radius:99px;padding:2px 10px;font-size:13px}.rows li.flip mark{color:var(--muted);background:#ececec}.sc-app.on .rows li{animation:slide-in .5s var(--ease) calc(1s + var(--i) * .12s) both}.sc-app.on .rows li.flip{animation:slide-in .5s var(--ease) 1.12s both, confirm .6s ease 2.6s both}.sc-app.on .rows li.flip mark{animation:.4s 2.6s both confirm-mark}@keyframes slide-in{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:none}}@keyframes confirm{50%{background:color-mix(in srgb, var(--c-violet) 20%, #fff)}}@keyframes confirm-mark{to{background:var(--c-violet);color:#fff}}.sc-phone{perspective:900px}.phone{aspect-ratio:9/17;background:var(--c-cream);border:8px solid var(--c-graphite);border-radius:36px;height:100%;position:relative;overflow:hidden;transform:rotate(-4deg)}.sc-phone.on .phone{animation:5s ease-in-out infinite bob}@keyframes bob{50%{transform:rotate(-2deg)translateY(-8px)}}.notch{background:var(--c-graphite);z-index:3;border-radius:99px;width:34%;height:16px;position:absolute;top:6px;left:50%;translate:-50%}.notif{z-index:2;background:var(--c-graphite);color:var(--c-cream);border-radius:14px;align-items:center;gap:8px;padding:10px;font-size:13px;display:flex;position:absolute;top:30px;left:8px;right:8px;transform:translateY(-260%)}.notif b{font-weight:500}.app-dot{background:var(--c-violet);border-radius:6px;flex:none;width:22px;height:22px}.sc-phone.on .notif{animation:drop 4.8s var(--ease) 1.4s infinite}@keyframes drop{0%,to{transform:translateY(-260%)}10%,45%{transform:none}55%{transform:translateY(-260%)}}.slides{width:300%;display:flex;position:absolute;inset:24px 0 52px}.slide{align-content:start;gap:6px;width:33.3333%;padding:44px 16px 16px;display:grid}.slide b{font:900 20px/1.05 var(--display);letter-spacing:-.02em}.slide span{color:var(--muted)}.sc-phone.on .slides{animation:swipe 7.2s var(--ease) infinite}@keyframes swipe{0%,28%{transform:none}36%,62%{transform:translate(-33.3333%)}70%,94%{transform:translate(-66.6667%)}to{transform:none}}.tabbar{height:52px;color:var(--muted);background:#fff;grid-template-columns:repeat(3,1fr);place-items:center;font-size:13px;display:grid;position:absolute;bottom:0;left:0;right:0}.ind{place-items:center;width:33.3333%;height:4px;display:grid;position:absolute;bottom:8px;left:0}.ind:after{content:"";background:var(--c-violet);border-radius:4px;width:28px;height:4px}.sc-phone.on .ind{animation:tabs 7.2s var(--ease) infinite}@keyframes tabs{0%,28%{transform:none}36%,62%{transform:translate(100%)}70%,94%{transform:translate(200%)}to{transform:none}}.orders{gap:8px;margin:14px 0 0;padding:0;list-style:none;display:grid}.orders li{background:#fff;border-radius:12px;align-items:center;gap:10px;padding:12px;font-weight:500;display:flex}.orders i{background:color-mix(in srgb, var(--c-violet) 25%, #fff);border-radius:8px;width:26px;height:26px}.orders li:last-child i{background:var(--c-violet)}.sc-phone.on .orders li{animation:rise-in .5s var(--ease) calc(.4s + var(--i) * .12s) both}.ready{aspect-ratio:1;background:var(--c-violet);border-radius:18px;place-items:center;margin-top:18px;display:grid}.ready svg{width:46%;height:auto;position:static}.ready circle,.ready path{fill:none;stroke:var(--c-cream);stroke-width:4px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:140;stroke-dashoffset:140px}.sc-phone.on .ready circle,.sc-phone.on .ready path{animation:7.2s infinite draw}@keyframes draw{0%,30%{stroke-dashoffset:140px}45%,to{stroke-dashoffset:0}}.map{aspect-ratio:1;background:color-mix(in srgb, var(--c-graphite) 8%, var(--c-cream));border-radius:18px;margin-top:18px;overflow:hidden}.map svg{width:100%;height:100%;position:static}.screen .map path{stroke:var(--c-violet);stroke-width:5px;stroke-dasharray:none;stroke-linecap:round}.map circle{fill:var(--c-violet-deep)}.map .me{fill:var(--c-violet)}.timer{background:color-mix(in srgb, var(--c-cream) 15%, var(--c-black));opacity:0;height:3px;transition:opacity .3s;position:absolute;bottom:3.5%;left:7%;right:7%}.timer:after{content:"";background:var(--violet-light);transform-origin:0;position:absolute;inset:0;transform:scaleX(0)}.stage.auto .timer{opacity:1}.stage.auto .timer.run:after{animation:3.8s linear both load}.desk-body{flex:1;grid-template-columns:110px 1fr;min-height:0;display:grid}.desk-side{background:color-mix(in srgb, var(--c-graphite) 5%, var(--c-cream));align-content:start;gap:4px;margin:0;padding:12px;list-style:none;display:grid}.desk-side li{border-radius:6px;padding:6px 10px}.desk-side li.on{background:var(--c-violet);color:var(--c-cream)}.desk-main{align-content:center;gap:12px;padding:18px;display:grid}.drop{border:2px dashed color-mix(in srgb, var(--c-graphite) 30%, var(--c-cream));height:120px;color:var(--muted);border-radius:10px;place-items:center;transition:background-color .3s;display:grid}.sc-desk.on .drop{animation:2.4s 1s both hot}@keyframes hot{30%,60%{background:color-mix(in srgb, var(--c-violet) 16%, var(--c-cream));border-color:var(--c-violet)}}.progress{background:color-mix(in srgb, var(--c-graphite) 10%, var(--c-cream));border-radius:8px;height:8px;overflow:hidden}.progress span{background:var(--c-violet);transform-origin:0;height:100%;display:block;transform:scaleX(0)}.sc-desk.on .progress span{animation:load 1.4s var(--ease) 2s both}.reading,.saved{margin:0;font-weight:500}.reading{color:var(--muted)}.saved{color:var(--c-violet-deep);opacity:0}.sc-desk.on .reading{animation:.3s 3.4s both fadeout}.sc-desk.on .saved{animation:rise-in .5s var(--ease) 3.5s both}.file{width:76px;height:96px;color:var(--ink);background:#fff;border-radius:6px;align-content:end;gap:2px;padding:10px;display:grid;position:absolute;top:6%;left:4%;transform:rotate(-8deg)}.file .fold{background:color-mix(in srgb, var(--c-graphite) 15%, #fff);clip-path:polygon(0 0,100% 100%,0 100%);width:20px;height:20px;position:absolute;top:0;right:0}.file b{font:900 18px/1 var(--display);color:var(--c-violet)}.file small{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.sc-desk.on .file{animation:fly 1.8s var(--ease) .4s both}@keyframes fly{0%{opacity:0;transform:translate(-60px,-40px)rotate(-18deg)}25%{opacity:1}70%{opacity:1;transform:translate(clamp(140px,22vw,300px),clamp(80px,9vw,130px))rotate(4deg)scale(1.05)}to{opacity:0;transform:translate(clamp(140px,22vw,300px),clamp(90px,10vw,140px))scale(.4)}}.cn{background:var(--c-graphite);color:var(--c-cream);white-space:nowrap;border-radius:8px;padding:10px 14px;font-weight:500;position:absolute;translate:-50% -50%}.n-users{top:50%;left:10%}.n-lb{background:var(--c-violet);top:50%;left:41.6%}.n-i1{top:23.3%;left:70.8%}.n-i2{top:50%;left:70.8%}.n-i3{top:76.6%;left:70.8%}.n-db{top:50%;left:92%}.sc-cloud .late{opacity:0}.sc-cloud svg.v{display:none}.sc-cloud.on .cn.late{animation:pop .5s var(--ease) 2.2s both}.sc-cloud.on circle.late{animation:.1s 2.6s both show}@keyframes pop{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}@keyframes show{to{opacity:1}}.scaling{text-align:center;color:var(--violet-light);opacity:0;margin:0;font-weight:500;position:absolute;top:2%;left:0;right:0}.sc-cloud.on .scaling{animation:rise-in .5s var(--ease) 2s both}.hosts{justify-content:center;gap:8px;display:flex;position:absolute;bottom:2%;left:0;right:0}.hosts b{background:var(--c-graphite);color:var(--c-cream);border-radius:99px;padding:6px 14px;font-weight:500}.sc-cloud.on .hosts b{animation:4.5s infinite host}.sc-cloud.on .hosts b:nth-child(2){animation-delay:1.5s}.sc-cloud.on .hosts b:nth-child(3){animation-delay:3s}@keyframes host{0%,30%{background:var(--c-violet)}34%,to{background:var(--c-graphite)}}.tile{background:var(--c-cream);border-radius:12px;justify-items:center;gap:8px;padding:12px 16px;font-weight:500;display:grid;position:absolute;translate:-50% -50%}.t-shop{top:23.3%;left:19.8%}.t-crm{top:23.3%;left:80.2%}.t-books{top:76%;left:19.8%}.glyph{background:var(--c-violet);border-radius:8px;width:34px;height:34px}.g-shop{clip-path:polygon(10% 30%,90% 30%,80% 100%,20% 100%);border-radius:0}.g-crm{border-radius:50%}.g-books{clip-path:polygon(0 0,70% 0,100% 30%,100% 100%,0 100%);border-radius:0}.hub{background:var(--c-violet);color:var(--c-cream);font:900 18px/1 var(--display);border-radius:99px;padding:12px 18px;position:absolute;top:50%;left:50%;translate:-50% -50%}.sc-int.on .hub{animation:1.6s infinite beat}@keyframes beat{50%{transform:scale(1.08)}}.sc-int.on .tile{animation:pop .5s var(--ease) both}.sc-int.on .t-crm{animation-delay:.15s}.sc-int.on .t-books{animation-delay:.3s}.log{gap:4px;width:46%;margin:0;padding:0;list-style:none;display:grid;position:absolute;bottom:0;right:0}.log li{background:var(--c-graphite);color:var(--c-cream);border-radius:6px;gap:8px;padding:6px 10px;font-size:13px;display:flex}.log span{color:var(--violet-light);font-variant-numeric:tabular-nums}.sc-int.on .log li{animation:slide-in .5s var(--ease) calc(1s + var(--i) * .5s) both}@media (width<=1100px){.stage{aspect-ratio:16/11;order:-1}}@media (width<=760px){.stage{aspect-ratio:4/5}[data-shape=mobile_app] .device{width:66%}.screen{width:92%;height:88%;font-size:13px}.web-hero{grid-template-columns:1fr}.web-art{min-height:70px}.web-cards span{height:24px}.app aside{display:none}.desk-body{grid-template-columns:1fr}.desk-side{display:none}.cn{padding:8px 10px;font-size:13px}.sc-cloud svg.h{display:none}.sc-cloud svg.v{display:block}.n-users{top:14%;left:50%}.n-lb{top:30%;left:50%}.n-i1{top:55%;left:20%}.n-i2{top:55%;left:50%}.n-i3{top:55%;left:80%}.n-db{top:82%;left:50%}.scaling{top:0}.tile{padding:8px 10px}.log{width:58%}}@media (prefers-reduced-motion:reduce){.stage:after{display:none}.screen,.screen *{animation-duration:.01ms!important;animation-iteration-count:1!important}.screen svg .pk{display:none}}