.live-demo{padding:46px 0 50px;border-top:1px solid rgba(37,99,235,.13);scroll-margin-top:20px;content-visibility:visible;contain-intrinsic-size:auto}.proof.proof-with-demo{content-visibility:visible!important;contain-intrinsic-size:auto!important}
.live-demo-copy{text-align:center;max-width:720px;margin:0 auto 24px}
.live-demo-eyebrow{margin:0 0 8px;color:#1D4ED8;font-size:.72rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.live-demo-copy h2{font-size:clamp(1.55rem,3.5vw,2.35rem);line-height:1.15;margin:0;text-wrap:balance}
.live-demo-copy>p:not(.live-demo-eyebrow){max-width:620px;margin:12px auto 0;color:#5A6A7A}
.live-demo-badges{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:17px}
.live-demo-badges span{border:1px solid rgba(37,99,235,.18);border-radius:999px;background:#fff;padding:6px 10px;color:#5A6A7A;font-size:.72rem;font-weight:700}
.live-demo-badges span:before{content:"\2713";margin-right:5px;color:#10B981}
.live-demo-frame-wrap{position:relative;width:min(470px,100%);margin-inline:auto;padding:15px;border:1px solid rgba(37,99,235,.10);border-radius:30px;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(239,246,255,.78));box-shadow:0 24px 60px rgba(15,24,39,.10)}
.live-demo-frame-wrap:before{content:"";position:absolute;inset:7px;border:1px solid rgba(255,255,255,.8);border-radius:24px;pointer-events:none}
.live-demo-loading{position:absolute;z-index:2;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:max-content;max-width:80%;padding:10px 14px;border-radius:999px;background:#fff;color:#5A6A7A;box-shadow:0 8px 28px rgba(15,24,39,.10);font-size:.78rem;font-weight:750;text-align:center}
.live-demo-loading:before{content:"";display:inline-block;width:10px;height:10px;margin-right:8px;border:2px solid rgba(37,99,235,.22);border-top-color:#2563EB;border-radius:50%;animation:live-demo-spin .8s linear infinite}
.live-demo iframe{position:relative;display:block;width:100%;height:1005px;border:0;border-radius:20px;background:#EEF0F4;pointer-events:none;touch-action:pan-y}.live-demo-frame-wrap.is-interactive iframe{pointer-events:auto}
.live-demo-open{display:inline-flex;align-items:center;gap:7px;margin-top:15px;color:#1D4ED8;font-size:.86rem;font-weight:750}
.live-demo-open:focus-visible{outline:3px solid rgba(37,99,235,.4);outline-offset:3px}
@media(max-width:700px){.live-demo{padding:34px 0 38px;contain-intrinsic-size:1080px}.live-demo-copy{margin-bottom:18px}.live-demo-frame-wrap{margin:0 -16px;padding:8px;border-radius:20px}.live-demo iframe{height:1005px;border-radius:14px}.live-demo-frame-wrap:before{display:none}}
@media(prefers-reduced-motion:reduce){.live-demo{scroll-behavior:auto}}
@keyframes live-demo-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.live-demo-loading:before{animation:none;border-color:#2563EB}}
.live-demo-activate,.live-demo-continue{position:absolute;z-index:4;border:0;border-radius:999px;box-shadow:0 10px 30px rgba(15,24,39,.24);font:inherit;font-size:.78rem;font-weight:850;cursor:pointer}.live-demo-activate{left:50%;top:48%;padding:12px 17px;display:flex;align-items:center;gap:7px;transform:translate(-50%,-50%);background:#0F1827;color:#fff;opacity:0;visibility:hidden;transition:opacity .18s ease,transform .18s ease}.live-demo-frame-wrap.is-loaded:not(.is-interactive) .live-demo-activate{opacity:1;visibility:visible}.live-demo-frame-wrap.is-interactive .live-demo-activate{display:none}.live-demo-continue{right:22px;bottom:24px;padding:10px 14px;background:#fff;color:#1D4ED8}.live-demo-continue[hidden]{display:none!important}.live-demo-frame-wrap.is-interactive:after{content:"";position:absolute;z-index:3;inset:15px;border:2px solid rgba(37,99,235,.55);border-radius:20px;pointer-events:none}.live-demo-frame-wrap:focus-within{outline:3px solid rgba(37,99,235,.22);outline-offset:4px}
@media(max-width:700px){.live-demo-frame-wrap{width:calc(100% + 32px)}.live-demo-continue{right:14px;bottom:16px}.live-demo-frame-wrap.is-interactive:after{inset:8px;border-radius:14px}}
@media(prefers-reduced-motion:reduce){.live-demo-activate{transition:none}}
.live-demo-activate{top:170px;transform:translateX(-50%)}.live-demo-continue{position:fixed;z-index:100;right:20px;bottom:20px}
@media(max-width:700px){.live-demo-activate{top:150px}.live-demo-continue{right:14px;bottom:14px}}