.product-demo-section{background:#fff;border-top:1px solid #eee9ef;padding:64px 0;scroll-margin-top:24px}
.product-demo-shell{background:#f4edf9;border:1px solid #e5d8ee;border-radius:22px;padding:35px 35px 19px;overflow:hidden;scroll-margin-top:24px}
.product-demo-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:32px;margin-bottom:29px}
.product-demo-section h2{font-size:clamp(34px,3.4vw,48px);font-weight:600;letter-spacing:-.05em;line-height:1.1;margin:0;color:#302438}
.product-demo-controls{display:flex;gap:7px;padding-top:6px;flex-shrink:0}
.product-demo-controls button{width:36px;height:36px;display:grid;place-items:center;border:1px solid #ddcde7;border-radius:50%;background:#fffa;color:#8a66a0;cursor:pointer;transition:background .2s,transform .2s}
.product-demo-controls button:hover{background:#fff;transform:translateY(-1px)}
.product-demo-controls svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.product-demo-controls .demo-play-icon{display:none}
.product-demo-controls [aria-pressed=true] .demo-play-icon{display:block}
.product-demo-controls [aria-pressed=true] .demo-pause-icon{display:none}
.product-demo-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:0 0 25px}
.product-demo-tab{position:relative;display:block;text-align:left;padding:0 0 17px;border:0;background:none;cursor:pointer;color:#8c7c96;font-family:inherit}
.product-demo-tab strong{display:flex;align-items:center;gap:11px;font-size:17px;font-weight:550;letter-spacing:-.02em;transition:color .25s}
.demo-step-number{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:24px;height:24px;border-radius:50%;border:1px solid #d8c8e2;font-size:11px;font-weight:500;transition:background .25s,color .25s}
.product-demo-tab p{font-size:12px;line-height:1.6;max-width:300px;margin:9px 0 0;color:#917e9e}
.product-demo-tab::before,.product-demo-tab::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:#e1d5e9;border-radius:5px}
.product-demo-tab::after{background:#9653dc;transform:scaleX(var(--chapter-progress,0));transform-origin:left}
.product-demo-tab[aria-selected=true] strong{color:#773db0}
.product-demo-tab[aria-selected=true] .demo-step-number{background:#8844c9;border-color:#8844c9;color:#fff}
.product-demo-tab:focus-visible,.product-demo-controls button:focus-visible{outline:2px solid #8644cc;outline-offset:5px}
.product-demo-stage{position:relative;border:1px solid #e0d1e9;border-radius:13px;background:#e8dff0;overflow:hidden;aspect-ratio:1100/620}
.product-demo-stage iframe{display:block;border:0;width:100%;height:100%;pointer-events:none}
.product-demo-footer{position:absolute;bottom:3.06%;left:2.55%;right:2.55%;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:10px;line-height:1.5;color:#9a84ab;pointer-events:none}
.product-demo-footer>span{display:flex;align-items:center;gap:7px}
.product-demo-footer>span::before{content:"";width:5px;height:5px;border-radius:50%;background:#a987c0;flex-shrink:0}
.product-demo-footer a{pointer-events:auto;color:#805699;text-decoration:none;font-size:11px;font-weight:500;display:flex;gap:9px;align-items:center;white-space:nowrap}
.product-demo-footer a:hover{color:#713aaa}
.product-demo-footer a:focus-visible{outline:2px solid #8644cc;outline-offset:4px;border-radius:2px}
@media(max-width:800px){.product-demo-shell{padding:26px 22px 18px}.product-demo-heading{gap:15px;margin-bottom:24px}.product-demo-tabs{gap:15px}.product-demo-tab strong{font-size:14px;gap:7px}.product-demo-tab p{font-size:11px}.product-demo-controls{gap:5px}.product-demo-controls button{width:31px;height:31px}}
@media(max-width:600px){.product-demo-section{padding:40px 0}.product-demo-shell{padding:23px 15px 16px;border-radius:17px}.product-demo-heading{display:block;position:relative;padding-right:4px;margin-bottom:23px}.product-demo-section h2{font-size:34px;max-width:290px;letter-spacing:-.05em}.product-demo-controls{position:absolute;right:0;top:-5px;transform:translateY(-2px)}.product-demo-section h2{padding-top:42px}.product-demo-tabs{gap:12px;margin-bottom:18px}.product-demo-tab{padding-bottom:12px}.product-demo-tab strong{display:block;font-size:12px;line-height:1.3;font-weight:550}.demo-step-number{display:flex;margin-bottom:8px;width:22px;height:22px;font-size:10px}.product-demo-tab p{display:none}.product-demo-stage{aspect-ratio:520/700;border-radius:9px}.product-demo-footer{bottom:2.14%;left:4.6%;right:4.6%;gap:10px;font-size:9px}.product-demo-footer a{font-size:10px;gap:5px}}
@media(prefers-reduced-motion:reduce){.product-demo-section *{transition:none!important}}

.article-demo{margin:6px 0 30px}
.article-demo .product-demo-heading{margin-bottom:22px}
.article-demo .product-demo-heading h3{font-size:clamp(24px,2.4vw,32px);font-weight:600;letter-spacing:-.04em;line-height:1.15;margin:0;color:#302438}
.article-demo .product-demo-heading p{margin:6px 0 0;color:#6b5a78;font-size:15px}
.article-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin:34px 0 10px}
.document-page .article-cta .btn{min-height:68px;padding:18px 38px;border-radius:7px;font-size:20px;font-weight:700;letter-spacing:-.01em}
.document-page .article-cta .btn-app{box-shadow:0 14px 32px #8b3ff045;transition:transform .15s,box-shadow .15s}
.document-page .article-cta .btn-app:hover{transform:translateY(-2px);box-shadow:0 18px 38px #8b3ff060}
.document-page .article-cta .btn-ghost{border-width:2px;background:#fff}
.article-limits{font-size:14px;line-height:1.6;color:#7a6c86;margin:4px 0 0}
@media(max-width:600px){.article-cta .btn{flex:1 1 100%}}
@media(max-width:600px){.product-demo-controls{gap:8px}.product-demo-controls button{width:40px;height:40px}.product-demo-footer{font-size:12px;gap:8px}.product-demo-footer>span{min-width:0}.product-demo-footer a{font-size:12px;gap:5px;padding-block:13px;margin-block:-13px}}
