.demo-section{padding:96px 0;background:linear-gradient(180deg,#fff,#f8f2ff)}.demo-heading{display:grid;grid-template-columns:1fr .72fr;align-items:end;gap:55px;margin-bottom:38px}.demo-heading h2{max-width:800px;margin:10px 0 0;font-size:clamp(2.4rem,4.5vw,4.9rem);line-height:1.02}.demo-heading p{margin:0;font-size:.82rem}.product-demo{display:grid;grid-template-columns:245px minmax(0,1fr);min-height:650px;overflow:hidden;border:1px solid #dfd3ea;border-radius:26px;background:#fff;box-shadow:0 32px 90px rgba(84,36,132,.13)}.demo-nav{display:flex;flex-direction:column;gap:6px;padding:20px;border-right:1px solid #e8dfef;background:#fcf9ff}.demo-brand{display:flex;align-items:center;gap:10px;padding:5px 7px 20px}.demo-brand img{width:34px;height:34px}.demo-brand span,.demo-nav button span,.demo-safety span{display:grid}.demo-brand strong{font-size:.72rem}.demo-brand small,.demo-nav button small,.demo-safety small{color:var(--muted);font-size:.53rem}.demo-nav button{display:flex;align-items:center;gap:11px;width:100%;padding:12px;border:0;border-radius:12px;background:transparent;color:var(--muted);text-align:left;cursor:pointer;transition:.2s ease}.demo-nav button:hover{background:#f4edfb;color:var(--text)}.demo-nav button.active{background:linear-gradient(110deg,#eee3ff,#f8f3ff);color:var(--purple);box-shadow:inset 0 0 0 1px #e2d3f5}.demo-nav button span{color:inherit;font-size:.68rem;font-weight:800}.demo-safety{display:flex;align-items:center;gap:10px;margin-top:auto;padding:12px;border:1px solid #e4d9ed;border-radius:12px;color:var(--purple)}.demo-safety span{color:var(--text);font-size:.62rem;font-weight:750}.demo-stage{display:flex;min-width:0;flex-direction:column;padding:30px;background:radial-gradient(circle at 88% 10%,rgba(166,66,245,.1),transparent 28%),#fff}.demo-stage-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:26px}.demo-stage-head span:first-child{color:var(--purple);font-size:.59rem;font-weight:850;text-transform:uppercase;letter-spacing:.09em}.demo-stage-head h3{margin:7px 0 0;font-size:1.6rem}.demo-badge{padding:6px 9px;border:1px solid #ddccef;border-radius:8px;background:#faf5ff;color:var(--purple);font-size:.57rem;font-weight:800}.demo-panel{flex:1}.demo-panel.active{animation:demoPanelIn .45s var(--ease)}.demo-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.demo-metrics article{position:relative;overflow:hidden;padding:19px;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:var(--shadow-sm)}.demo-metrics article:after{content:"";position:absolute;right:-18px;bottom:-24px;width:70px;height:70px;border-radius:50%;background:#f3e9ff}.demo-metrics small{display:block;color:var(--muted);font-size:.59rem}.demo-metrics strong{display:block;margin:14px 0 5px;font-family:Sora;font-size:2rem}.demo-metrics span{color:var(--purple);font-size:.54rem;font-weight:800}.demo-summary-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:12px;margin-top:12px}.demo-chart-card,.demo-explainer{padding:20px;border:1px solid var(--line);border-radius:16px;background:#fff}.demo-chart-card>div:first-child{display:flex;justify-content:space-between}.demo-chart-card strong{font-size:.7rem}.demo-chart-card small{color:var(--muted);font-size:.56rem}.demo-bars{display:flex;align-items:flex-end;gap:9px;height:185px;padding-top:30px}.demo-bars i{flex:1;height:var(--h);border-radius:7px 7px 2px 2px;background:linear-gradient(#bc6cff,#8131ee);transform-origin:bottom;animation:demoBar 1s var(--ease) both}.demo-bars i:nth-child(2){animation-delay:.08s}.demo-bars i:nth-child(3){animation-delay:.16s}.demo-bars i:nth-child(4){animation-delay:.24s}.demo-bars i:nth-child(5){animation-delay:.32s}.demo-bars i:nth-child(6){animation-delay:.4s}.demo-bars i:nth-child(7){animation-delay:.48s}.demo-explainer{background:linear-gradient(145deg,#f7efff,#fff)}.demo-explainer>span,.demo-explainer>div>span{color:var(--purple);font-size:.56rem;font-weight:850;text-transform:uppercase;letter-spacing:.09em}.demo-explainer h4{margin:10px 0 8px;font-size:1rem}.demo-explainer p{font-size:.69rem;line-height:1.65}.demo-explainer.horizontal{display:grid;grid-template-columns:.75fr 1.25fr;align-items:center;gap:25px;margin-top:14px}.demo-explainer.horizontal p{margin:0}.demo-table{overflow:hidden;border:1px solid var(--line);border-radius:15px}.demo-table>div{display:grid;grid-template-columns:1.6fr .5fr .7fr .4fr;align-items:center;gap:10px;padding:17px;border-bottom:1px solid var(--line);font-size:.66rem}.demo-table>div:last-child{border-bottom:0}.demo-table-head{background:#faf8fc;color:var(--muted);font-size:.53rem!important;font-weight:850;text-transform:uppercase;letter-spacing:.07em}.demo-table code{font-size:.6rem}.demo-state{width:max-content;padding:5px 7px;border-radius:7px;background:#efe7fb;color:#7736c6;font-size:.54rem;font-weight:800}.demo-state.draft{background:#f2f1f4;color:#77717d}.demo-sign-flow{display:flex;align-items:center;justify-content:center;gap:12px;min-height:245px;padding:30px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,#fcfaff,#fff)}.demo-sign-flow>div{display:grid;justify-items:center;gap:8px;text-align:center}.demo-sign-flow i{display:grid;place-items:center;width:50px;height:50px;border:1px solid #dac8ef;border-radius:16px;background:#fff;color:var(--purple);font-style:normal;font-weight:850}.demo-sign-flow .done i{background:#f0e4ff}.demo-sign-flow .current i{background:var(--purple);color:#fff;box-shadow:0 0 0 8px rgba(145,56,244,.1);animation:demoPulse 2.5s ease-in-out infinite}.demo-sign-flow span{display:grid;font-size:.64rem;font-weight:800}.demo-sign-flow small{color:var(--muted);font-size:.52rem}.demo-sign-flow b{width:90px;height:2px;background:linear-gradient(90deg,#d6c4e9,#9845ef)}.demo-evidence-row{display:grid;grid-template-columns:1.5fr .6fr .8fr;gap:10px;margin-top:12px}.demo-evidence-row article{display:grid;gap:6px;padding:14px;border:1px solid var(--line);border-radius:12px}.demo-evidence-row span{color:var(--muted);font-size:.54rem}.demo-evidence-row strong,.demo-evidence-row code{font-size:.65rem}.demo-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:20px;padding-top:17px;border-top:1px solid var(--line)}.demo-footer>div{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:.58rem}.demo-footer i{display:block;width:110px;height:4px;overflow:hidden;border-radius:4px;background:#eee8f3}.demo-footer b{display:block;width:var(--demo-progress,33.33%);height:100%;border-radius:inherit;background:var(--purple);transition:width .35s var(--ease)}
@keyframes demoPanelIn{from{opacity:0;transform:translateY(12px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}@keyframes demoBar{from{transform:scaleY(.05);opacity:.2}to{transform:scaleY(1);opacity:1}}@keyframes demoPulse{50%{box-shadow:0 0 0 14px rgba(145,56,244,.04)}}
@media(max-width:1024px){.demo-heading{grid-template-columns:1fr}.product-demo{grid-template-columns:1fr}.demo-nav{display:grid;grid-template-columns:repeat(3,1fr);border-right:0;border-bottom:1px solid var(--line)}.demo-brand,.demo-safety{grid-column:1/-1}.demo-safety{margin-top:5px}.demo-summary-grid{grid-template-columns:1fr}}
@media(max-width:768px){.demo-section{padding:75px 0}.demo-nav{grid-template-columns:1fr}.demo-brand,.demo-safety{grid-column:auto}.demo-nav button small{display:none}.demo-stage{padding:20px}.demo-stage-head{flex-direction:column}.demo-metrics{grid-template-columns:1fr 1fr}.demo-metrics article:last-child{grid-column:1/-1}.demo-explainer.horizontal{grid-template-columns:1fr}.demo-table{overflow-x:auto}.demo-table>div{min-width:590px}.demo-sign-flow{align-items:stretch;flex-direction:column}.demo-sign-flow>div{grid-template-columns:auto 1fr;text-align:left}.demo-sign-flow b{width:2px;height:28px;margin-left:24px}.demo-evidence-row{grid-template-columns:1fr}.demo-footer{align-items:stretch;flex-direction:column}.demo-footer .button{justify-content:center}}
