.qn-demo{--demo-color:#ea580c;flex-direction:column;align-items:center;gap:16px;width:min(100%,360px);margin:0;display:flex}.qn-demo-heading{align-items:center;gap:8px;width:100%;font-size:14px;font-weight:700;display:flex}.qn-demo-heading>span:last-child{color:#a9b4cc;white-space:nowrap;margin-left:auto;font-size:12px}.qn-demo-dot{background:var(--demo-color);width:8px;height:8px;box-shadow:0 0 16px var(--demo-color);border-radius:50%}.qn-demo .qn-demo-phone{aspect-ratio:var(--demo-ratio,6 / 11);box-shadow:0 0 0 6px #ffffff05, 0 24px 70px #0008, 0 0 50px color-mix(in srgb, var(--demo-color) 18%, transparent);border:1px solid #ffffff20;border-radius:30px!important;width:100%!important;height:auto!important}.qn-demo video{object-fit:cover;width:100%;height:100%;display:block}.qn-demo .qn-demo-still{position:absolute;inset:0}.qn-demo-controls{gap:10px;width:100%;display:flex}.qn-demo-controls button{color:#fff;min-height:44px;font:inherit;cursor:pointer;background:#ffffff08;border:1px solid #ffffff25;border-radius:12px;flex:1;padding:10px 12px;font-size:14px}.qn-demo-controls button:hover,.qn-demo-controls button[aria-pressed=true]{background:color-mix(in srgb, var(--demo-color) 20%, #101426);border-color:var(--demo-color)}.qn-demo-controls button:focus-visible{outline-offset:4px;outline:3px solid #fff!important}.qn-demo-controls button:disabled{opacity:.5;cursor:default}.qn-demo-controls a{color:#fff;border:1px solid #ffffff25;border-radius:12px;justify-content:center;align-items:center;min-height:44px;padding:10px 14px;font-size:14px;text-decoration:none;display:flex}.qn-demo-controls a:hover{background:#ffffff12}.qn-demo-controls a:focus-visible{outline-offset:4px;outline:3px solid #fff}.qn-demo.qn-demo-wide{width:100%;min-width:0;max-width:920px}.qn-demo-wide .qn-demo-phone{border-radius:18px!important}.qn-mod-layout:has(>.qn-demo-wide){flex-flow:column;align-items:center;gap:24px;display:flex}.qn-demo figcaption{text-align:center;gap:8px;font-size:14px;line-height:1.6;display:grid}.qn-demo figcaption span{color:#bdc6da}.qn-demo figcaption small{color:#a9b4cc;font-size:12px}.qn-mod-layout>.qn-demo{position:static}@media (prefers-reduced-motion:reduce){.qn-feat-section{animation:none!important}}