/* Live product demo: [db_visual kind="demo-full|demo-short"]
   Played by assets/js/demo.js. Loaded only on pages that use it. */
.dbd{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:20px;font-family:inherit;color:#141b3a;
  background:radial-gradient(60% 65% at 85% 10%,rgba(150,140,255,.28),transparent 60%),radial-gradient(45% 55% at 5% 95%,rgba(255,170,200,.22),transparent 60%),linear-gradient(160deg,#f3f5ff 0%,#e7ebfc 55%,#e9e6fb 100%);
  box-shadow:0 30px 70px -30px rgba(8,27,54,.35)}
.dbd.dbd--m{aspect-ratio:4/5}
.dbd__stage{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0}
.dbd--m .dbd__stage{width:800px;height:1000px}
.dbd *{box-sizing:border-box;margin:0;padding:0}
.dbd{line-height:1.25;text-align:left;letter-spacing:normal}
.dbd h2,.dbd p{font-family:inherit;text-transform:none}
.dbd img{max-width:none}
.dbd-scene{position:absolute;inset:0;opacity:0}
.dbd-card{position:absolute;background:#fff;border-radius:18px;box-shadow:0 18px 50px rgba(40,50,120,.14),0 2px 6px rgba(40,50,120,.06);overflow:hidden}
.dbd-cap{position:absolute;left:0;right:0;top:70px;text-align:center;padding:0 40px;line-height:1.1}
.dbd-cap h2{font-size:58px;font-weight:800;letter-spacing:-1.5px;color:#141b3a;line-height:1.1;margin:0}
.dbd-cap p{font-size:26px;color:#5a6390;margin-top:12px;font-weight:500;line-height:1.45}
.dbd--m .dbd-cap{top:44px;padding:0 30px}
.dbd--m .dbd-cap h2{font-size:46px}
.dbd--m .dbd-cap p{font-size:24px;margin-top:10px}
.dbd-brand{position:absolute;right:42px;top:34px;background:#fff;border-radius:12px;padding:8px 14px;box-shadow:0 6px 20px rgba(40,50,120,.12);z-index:50}
.dbd--m .dbd-brand{display:none}
.dbd-cursor{position:absolute;width:34px;height:34px;z-index:60;opacity:0}
.dbd-kpi{color:#fff;padding:22px 26px}
.dbd-kpi .l{font-size:20px;opacity:.85;font-weight:500}
.dbd-kpi .v{font-size:46px;font-weight:800;margin-top:6px;letter-spacing:-1px}
.dbd-kpi .d{font-size:17px;margin-top:4px;color:#9ff0c9;font-weight:600}
.dbd--m .dbd-kpi{padding:18px 22px}
.dbd--m .dbd-kpi .l{font-size:22px}
.dbd--m .dbd-kpi .v{font-size:44px}
.dbd-ct{font-size:19px;font-weight:700;padding:18px 22px 0;color:#1b2340}
.dbd--m .dbd-ct{font-size:22px}
.dbd-pill{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:10px 20px;font-weight:600;font-size:20px;white-space:nowrap}
.dbd-btnp{background:linear-gradient(90deg,#6260f4,#8352e8);color:#fff;box-shadow:0 8px 22px rgba(98,96,244,.35)}
.dbd-mono{font-family:var(--db-mono,"JetBrains Mono",ui-monospace,monospace)}
.dbd-tile{display:flex;align-items:center;gap:14px;padding:0 20px;font-weight:700;font-size:21px}
.dbd-ico{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:18px;flex:0 0 46px}
.dbd-menu div{padding:15px 24px;font-size:22px;font-weight:600;display:flex;align-items:center;gap:14px;border-radius:10px;margin:4px 10px}
.dbd--m .dbd-menu div{padding:9px 20px;font-size:22px}
.dbd-live{display:inline-flex;align-items:center;gap:8px;background:#ffe9ec;color:#e0334f;font-weight:800;font-size:17px;border-radius:999px;padding:6px 14px;vertical-align:middle}
.dbd-dot{width:11px;height:11px;border-radius:50%;background:#e0334f}
.dbd-ctrl{position:absolute;right:14px;bottom:14px;z-index:5;width:40px;height:40px;border-radius:50%;border:0;background:rgba(20,27,58,.72);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:.85;transition:opacity .2s}
.dbd-ctrl:hover,.dbd-ctrl:focus-visible{opacity:1}
.dbd-ctrl svg{width:18px;height:18px;fill:#fff}
.dbd-prog{position:absolute;left:0;bottom:0;height:3px;background:linear-gradient(90deg,#6260f4,#8352e8);width:0;z-index:5}
.dbd--still .dbd-ctrl,.dbd--still .dbd-prog{display:none}
.banner-image-wrapper .dbd{max-width:100%}
/* reserve the right height before the script runs (avoids layout shift) */
@media (max-width:760px){.dbd{aspect-ratio:4/5}}
.banner-image-wrapper .dbd{aspect-ratio:1/1}
