.demo-video{--demo-ink: #15171a;--demo-accent: #e65e20;color:var(--demo-ink);width:min(100% - 48px,1080px);margin:0 auto;padding:clamp(32px,5vw,72px) 0;scroll-margin-top:112px}.demo-video [hidden]{display:none!important}.demo-video__intro{max-width:720px;margin:0 auto 28px;text-align:center}.demo-video__intro h2{margin:10px 0 14px;font-size:clamp(28px,4vw,44px);line-height:1.12;letter-spacing:-.04em;text-wrap:balance}.demo-video__intro p:not(.demo-video__eyebrow){margin:0;font-size:clamp(16px,2vw,19px);line-height:1.6;color:#555b63;text-wrap:pretty}.demo-video__eyebrow{margin:0;color:#15171a;font-size:12px;line-height:1.5;font-weight:700;letter-spacing:.12em}.demo-video__frame{position:relative;aspect-ratio:16 / 9;overflow:hidden;border:1px solid #f4f5f6;border-radius:24px;background:#fff;box-shadow:0 18px 55px #15171a0d}.demo-video__art{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,3vw,36px);padding:clamp(20px,4vw,54px);background:#f4f5f6}.demo-video__brand{display:block;width:clamp(90px,12vw,136px);height:auto}.demo-video__headline{display:block;max-width:740px;font-size:clamp(23px,4.5vw,54px);font-weight:700;line-height:1.08;text-align:center;letter-spacing:-.045em;text-wrap:balance}.demo-video__steps{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 24px;list-style:none;padding:0;margin:0}.demo-video__steps li{display:flex;align-items:center;gap:8px;font-size:clamp(12px,1.6vw,16px);font-weight:600}.demo-video__steps li span{color:#15171a;font-size:.8em}.demo-video__platforms{color:#555b63;font-size:clamp(11px,1.4vw,14px)}.demo-video__poster{width:100%;height:100%;object-fit:contain;display:block}.demo-video__play{position:absolute;bottom:7%;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;gap:12px;min-height:50px;padding:12px 22px;border:0;border-radius:100px;background:var(--demo-ink);color:#fff;font:inherit;font-weight:600;cursor:pointer;white-space:nowrap;box-shadow:0 4px 20px #0002}.demo-video__play:hover{background:#15171a}.demo-video__play-icon{font-size:13px}.demo-video__duration{color:#f4f5f6;font-size:13px}.demo-video__mount{position:absolute;inset:0;background:#15171a}.demo-video__mount :is(video,iframe){display:block;width:100%;height:100%;border:0;object-fit:contain}.demo-video__message{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;align-content:center;gap:12px;padding:clamp(20px,5vw,64px);text-align:center;background:#fffffffa;overflow:auto}.demo-video__message p{flex:0 0 100%;max-width:660px;margin:0;line-height:1.6;font-size:clamp(14px,2vw,18px)}.demo-video__message a{flex:0 0 100%;margin-bottom:8px;color:inherit;text-underline-offset:4px}.demo-video__message button{border:1px solid var(--demo-ink);border-radius:100px;padding:12px 20px;min-height:44px;background:var(--demo-ink);color:#fff;font:inherit;font-weight:600;cursor:pointer}.demo-video__message button:last-child{background:transparent;color:var(--demo-ink)}.demo-video__stop{display:block;margin:14px auto 0;min-height:44px;padding:8px 16px;background:transparent;border:0;color:inherit;font:inherit;text-decoration:underline;text-underline-offset:4px;cursor:pointer}.demo-video__transcript{margin:14px 0 0;text-align:center;line-height:1.6}.demo-video__transcript a{color:inherit;text-underline-offset:4px}.demo-video :is(button,a,video,iframe):focus-visible{outline:3px solid #15171a;outline-offset:5px}.demo-video__mount :is(video,iframe):focus-visible{outline-offset:-5px}.demo-video__no-script{position:absolute;inset:auto 0 0;margin:0;padding:12px;background:#fff;text-align:center;font-size:14px}@media(max-width:600px){.demo-video{width:calc(100% - 32px);scroll-margin-top:88px}.demo-video__frame{border-radius:16px}.demo-video__art{gap:12px;padding:16px}.demo-video__headline{font-size:clamp(19px,5.5vw,30px)}.demo-video__steps{gap:6px 12px}.demo-video__steps li{font-size:11px}.demo-video__platforms{font-size:10px}.demo-video__play{bottom:12px;min-height:44px;padding:10px 16px}.demo-video__frame:has(.demo-video__play:not([hidden])) .demo-video__steps,.demo-video__frame:has(.demo-video__play:not([hidden])) .demo-video__platforms{visibility:hidden}.demo-video__message{padding:16px;gap:8px}.demo-video__message p{font-size:13px;line-height:1.4}.demo-video__message a{font-size:12px;margin:0}.demo-video__message button{font-size:13px;padding:8px 12px}}
