.ui-stage{background:#071c2d;border-radius:28px;padding:18px;box-shadow:0 35px 90px rgba(8,36,58,.18);overflow:hidden}.ui-toolbar{display:flex;justify-content:space-between;align-items:center;padding:2px 2px 16px}.ui-tabs{display:flex;gap:7px}.ui-tabs button{background:#16334a;color:#94a9b8;border:1px solid #29465c;border-radius:8px;padding:9px 14px;font:700 11px 'DM Sans';cursor:pointer}.ui-tabs button.active{background:#fff;color:#0b2942;border-color:#fff}.live-pill{color:#9cafbc;font-size:10px;font-weight:700;display:flex;align-items:center;gap:7px}.live-pill i{width:7px;height:7px;background:#30c489;border-radius:50%;box-shadow:0 0 0 5px rgba(48,196,137,.12)}.ui-screen{position:relative;border-radius:15px;overflow:hidden;background:#172a3a;aspect-ratio:1.598/1}.ui-screen img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .25s,transform .5s}.ui-screen.changing img{opacity:.2;transform:scale(.985)}.screen-glow{position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);border-radius:inherit;pointer-events:none}.ui-caption{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:15px;color:white;padding:20px 8px 5px}.ui-caption>span{width:38px;height:38px;border:1px solid #3a5367;border-radius:10px;display:grid;place-items:center;color:#ff6525;font-size:11px;font-weight:800}.ui-caption b,.ui-caption small{display:block}.ui-caption b{font-size:13px}.ui-caption small{color:#8fa4b4;font-size:10px;margin-top:3px}.ui-progress{display:flex;gap:5px}.ui-progress i{width:22px;height:3px;background:#365066;border-radius:4px}.ui-progress i.active{background:#ff6525}
.motion-story{background:#071c2d;color:white;padding:30px 0 120px}.motion-heading{text-align:center;max-width:800px;margin:0 auto 75px}.motion-heading h2{font-size:clamp(36px,4vw,55px);letter-spacing:-.04em;margin:14px 0 25px}.motion-heading button{background:#17364e;border:1px solid #29485f;color:#a8bac7;border-radius:30px;padding:9px 15px;font:700 10px 'DM Sans';cursor:pointer}.motion-heading button span{color:#ff6525;margin-right:6px}.motion-track{display:grid;grid-template-columns:repeat(5,1fr);position:relative;gap:20px}.motion-line{position:absolute;left:9%;right:9%;top:34px;height:2px;background:#234158;overflow:hidden}.motion-line i{display:block;width:18%;height:100%;background:linear-gradient(90deg,transparent,#ff6525,transparent);animation:flow 4.5s linear infinite}.motion-story.paused .motion-line i{animation-play-state:paused}.motion-track article{text-align:center;position:relative}.motion-icon{width:70px;height:70px;margin:0 auto 20px;border:1px solid #36536a;border-radius:18px;background:#102d43;display:grid;place-items:center;font-size:22px;position:relative;transition:.3s}.motion-track article:hover .motion-icon{background:#ff6525;border-color:#ff6525;transform:translateY(-5px)}.motion-track small{color:#ff6525;font-weight:800}.motion-track h3{font-size:15px;margin:7px 0}.motion-track p{color:#8ea4b5;font-size:11px;margin:0 auto;max-width:160px}@keyframes flow{from{transform:translateX(-100%)}to{transform:translateX(560%)}}
.feature-network{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:16px}.feature-network article{border:1px solid #dfe4e7;border-radius:20px;padding:28px;overflow:hidden}.feature-large{grid-row:span 2;background:#0b2942;color:#fff;min-height:560px;display:flex;flex-direction:column}.feature-card{min-height:270px}.feature-card.whatsapp{background:#edf8f2}.feature-badge{color:#ff9a69;font-size:10px;font-weight:800;letter-spacing:.1em}.feature-network h3{font-size:25px;margin:22px 0 12px}.feature-network p{color:#66737d;font-size:13px}.feature-large p{color:#9eb1bf}.feature-symbol{width:43px;height:43px;background:#fff0e8;color:#ff6525;border-radius:12px;display:grid;place-items:center;font-size:20px}.mini-graph{display:flex;align-items:end;gap:11px;height:220px;margin-top:auto;padding-top:40px;border-bottom:1px solid #416078}.mini-graph span{flex:1;background:linear-gradient(#ff8854,#ff6525);border-radius:7px 7px 0 0;animation:bars 3s ease-in-out infinite alternate}.mini-graph span:nth-child(2n){animation-delay:.3s}.graph-label{display:flex;justify-content:space-between;padding-top:15px;font-size:12px}.graph-label b{color:#68d1a7}@keyframes bars{to{filter:brightness(1.2);transform:scaleY(.94);transform-origin:bottom}}.message-demo{display:grid;gap:7px;margin-top:20px}.message-demo span{background:white;border-radius:9px 9px 9px 2px;padding:8px 10px;font-size:9px;max-width:85%;box-shadow:0 4px 10px rgba(8,36,58,.05)}.message-demo .reply{background:#d5f6e2;margin-left:auto;border-radius:9px 9px 2px 9px}.qr-demo{display:flex;align-items:center;gap:14px;margin-top:28px;background:#f7f6f2;border-radius:13px;padding:13px}.fake-qr{width:50px;height:50px;background:repeating-conic-gradient(#132b3d 0 25%,#fff 0 50%) 50%/12px 12px;border:5px solid white;color:transparent}.qr-demo b,.qr-demo small{display:block;font-size:11px}.qr-demo small{color:#24946d;margin-top:5px}.qr-demo small i{display:inline-block;width:6px;height:6px;background:#2fc28a;border-radius:50%;margin-right:5px}.integration-grid span b,.integration-grid span small{display:block}.integration-grid span small{color:#66737d;font-size:9px;margin-top:3px;font-weight:500}
@media(max-width:900px){.feature-network{grid-template-columns:1fr 1fr}.feature-large{grid-row:auto;grid-column:1/-1;min-height:460px}.motion-track{grid-template-columns:repeat(3,1fr);row-gap:40px}.motion-line{display:none}}@media(max-width:620px){.ui-stage{padding:9px;border-radius:18px}.ui-toolbar{align-items:flex-start}.ui-tabs{overflow-x:auto;padding-bottom:3px}.ui-tabs button{white-space:nowrap;padding:8px 10px}.live-pill{display:none}.ui-caption{grid-template-columns:38px 1fr}.ui-progress{display:none}.motion-track{grid-template-columns:1fr 1fr}.motion-track article:last-child{grid-column:1/-1}.feature-network{grid-template-columns:1fr}.feature-large{grid-column:auto;min-height:500px}}