#demo.demo-showcase{position:relative;overflow:hidden;padding:76px 0 42px;background:radial-gradient(ellipse at 82% 30%,#0f47714d,transparent 55%),radial-gradient(ellipse at 10% 90%,#6536e921,transparent 50%),#080f20;border-block:1px solid #213450}
#demo .demo-stage{display:grid;grid-template-columns:1fr 1.12fr;gap:56px;align-items:center}
#demo .demo-eyebrow{display:flex;align-items:center;gap:9px;color:#55e8dc;font-size:11px;font-weight:800;letter-spacing:1.7px;margin-bottom:22px}
#demo .demo-eyebrow>span,#demo .demo-screen i{display:inline-block;width:7px;height:7px;background:#3ce5bf;border-radius:50%;box-shadow:0 0 14px #3ce5bf80}
#demo h2{font-size:clamp(34px,3.5vw,52px);line-height:1.1;letter-spacing:-1.8px;margin:0 0 22px;color:#f4f8ff}
#demo h2 em{font-style:normal;color:#40e2d2}
#demo .demo-intro{font-size:16px;line-height:1.8;color:#b7c8df;max-width:440px;margin-bottom:26px}
#demo .demo-launch{display:inline-flex;align-items:center;gap:28px;font-size:16px;padding:15px 22px;border:1px solid #62f7df;color:#051521;background:linear-gradient(105deg,#35d6ff,#39edbf);box-shadow:0 8px 35px #23cfdf25;font-weight:800}
#demo.demo-showcase .btn.demo-launch{background:linear-gradient(105deg,#35d6ff,#39edbf);color:#051521;border-color:#62f7df;box-shadow:0 8px 35px #23cfdf25}
#demo.demo-showcase .btn.demo-launch:hover{background:linear-gradient(105deg,#69e5ff,#68f5d4);color:#051521;box-shadow:0 10px 38px #23cfdf55;transform:translateY(-2px)}
#demo .demo-launch span{font-size:24px;line-height:1}
#demo .demo-reassurance{font-size:11px;color:#b8c8dd;margin-top:17px;line-height:1.7}
#demo .demo-reassurance span{color:#49718a;padding:0 7px}
#demo .demo-screen{display:block;min-width:0;overflow:hidden;border:1px solid #36527a;border-radius:17px;background:#0c1529;color:#dce8ff;text-decoration:none;box-shadow:0 25px 70px #0006,0 0 60px #277cff12;transition:transform .2s,border-color .2s}
#demo .demo-screen:hover{transform:translateY(-4px);border-color:#43dbd3}
#demo .demo-screen-top,#demo .demo-screen-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px;font-size:10px;letter-spacing:.8px;background:#111f36}
#demo .demo-screen-top>span,#demo .demo-screen-bottom>span{display:flex;align-items:center;gap:8px}
#demo .demo-screen-top b{font-size:9px;padding:5px 7px;border:1px solid #9c824b;border-radius:5px;color:#f8cf73;background:#85621222}
#demo .demo-chart{height:265px;position:relative;background-image:linear-gradient(#577fa114 1px,transparent 1px),linear-gradient(90deg,#577fa114 1px,transparent 1px);background-size:42px 42px;overflow:hidden}
#demo .demo-chart svg{position:absolute;inset:38px 0 0;width:100%;height:220px;opacity:.8}
#demo .demo-chart-label{position:absolute;top:13px;left:17px;font-size:11px;font-weight:700}
#demo .demo-chart-label>span{font-size:9px;color:#9db3cf;font-weight:400;margin-left:9px}
#demo .demo-level{position:absolute;left:0;right:0;display:flex;align-items:center;justify-content:space-between;border-top:1px dashed;font-size:9px;letter-spacing:.5px}
#demo .demo-level>span,#demo .demo-level>b{padding:5px 8px;border-radius:4px;margin:-11px 13px 0;background:#101d30}
#demo .demo-target{top:89px;color:#63efc2}
#demo .demo-stop{top:212px;color:#ffa4b7}
#demo .demo-play{position:absolute;inset:112px 0 auto;display:flex;justify-content:center;align-items:center;gap:9px;font-size:12px;font-weight:700;text-shadow:0 2px 8px #000}
#demo .demo-play>span{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#197dc9;box-shadow:0 0 0 7px #238aff20,0 5px 20px #0006;font-size:24px}
#demo .demo-screen-bottom{background:#0c172b;font-size:9px;letter-spacing:0;border-top:1px solid #23364f}
#demo .demo-screen-bottom b{color:#65e8e0}
#demo .demo-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:42px}
#demo .demo-steps>a{display:flex;align-items:flex-start;gap:14px;padding:22px 18px;background:linear-gradient(125deg,#182644aa,#111d3399);border:1px solid #2b3c58;border-radius:11px;text-decoration:none;transition:border-color .2s,background .2s}
#demo .demo-steps>a:hover{background:#183348;border-color:#43d9ca}
#demo .demo-number{color:#55e6da;font:600 12px var(--mono,monospace);padding-top:4px}
#demo .demo-steps h3{font-size:15px;color:#f3f6ff;margin:0 0 7px}
#demo .demo-steps p{color:#b2c2db;font-size:12px;line-height:1.6;margin:0}
#demo .demo-step-arrow{margin-left:auto;color:#708cac;font-size:18px}
#demo .demo-disclaimer{text-align:center;font-size:10px;color:#9baecb;margin:22px 0 0;line-height:1.6}
#demo a:focus-visible{outline:3px solid #f3c76c;outline-offset:5px}
@media(max-width:800px){#demo.demo-showcase{padding:48px 0 32px}#demo .demo-stage{grid-template-columns:1fr;gap:32px}#demo .demo-copy{max-width:560px}#demo .demo-intro{max-width:none}#demo .demo-steps{grid-template-columns:1fr;margin-top:24px}#demo .demo-steps>a{padding:18px}#demo .demo-chart{height:245px}#demo .demo-eyebrow{font-size:10px;letter-spacing:1px}}
@media(prefers-reduced-motion:reduce){#demo a{transition:none!important;transform:none!important}}
