/* Native video surfaces and controls for the authored motion walkthroughs. */
.with-motion .hero-layout{padding-block:99px 32px}
.video-stack{max-width:900px;padding-top:46px;margin-top:0}
.video-stack .stack-tab{top:0;height:27px;left:30px;font-size:12px}
.video-stack .stack-tab-middle{top:23px;left:15px}
.hero-video-frame{padding-bottom:9px}
.hero-video-player{overflow:hidden;border:1px solid #ffffffb8;border-radius:5px;background:#fff;box-shadow:0 15px 40px #02061719;color:var(--ink)}
.hero-workflow-video{display:block;width:100%;height:auto;aspect-ratio:8/5;object-fit:contain;background:#f8f9fe}
.video-controls{display:flex;align-items:center;gap:9px;min-height:38px;padding:5px 10px;background:#fff;border-top:1px solid #eceef5}
.video-controls button{display:inline-flex;align-items:center;justify-content:center;gap:3px;min-width:40px;min-height:27px;background:none;padding:4px 5px;border-radius:4px;font-size:12px;font-weight:600;color:#7d849d;white-space:nowrap}
.video-controls button:hover{color:var(--indigo);background:#f5f3ff}
.video-controls [data-video-toggle]{color:var(--indigo);background:#f1efff;min-width:46px}
.video-controls .icon{width:12px;height:12px}
.video-controls input[type=range]{flex:1;width:0;min-width:35px;height:19px;accent-color:var(--indigo);margin-inline:2px;cursor:pointer}
.video-time{font-family:var(--mono);font-size:12px;color:#929bb0;white-space:nowrap;min-width:66px;text-align:center}
.video-chapters{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px;padding:6px 7px 8px;background:#fcfcff;border-top:1px solid #f0f1f6}
.video-chapters button{display:flex;align-items:center;justify-content:center;gap:5px;padding:5px 2px;min-height:27px;line-height:1.2;border-radius:4px;background:none;color:#989eb3;font-size:12px;font-weight:500;white-space:nowrap}
.video-chapters button>span{display:grid;place-items:center;width:15px;height:15px;flex-shrink:0;border-radius:50%;background:#f0f1f7;font-size:12px;font-weight:600;color:#a5acc0}
.video-chapters button[aria-current=true]{color:var(--indigo);background:#f1eeff}
.video-chapters button[aria-current=true]>span{color:#fff;background:var(--indigo)}
.video-chapters button:hover{color:var(--indigo);background:#f6f3ff}
.video-example-note{font-size:12px;color:#e0e1f4;margin-top:8px;line-height:1.5;text-align:center}
.hero-video-transcript{position:relative;margin-top:8px;font-size:12px;color:#d9dcee}
.hero-video-transcript summary{width:max-content;margin-left:auto;cursor:pointer;list-style:none;text-decoration:underline;text-underline-offset:3px;color:#c6cbdf}
.hero-video-transcript>p{position:absolute;z-index:5;right:0;width:min(450px,100%);margin-top:8px;padding:18px 20px;border:1px solid #e1e4ee;border-radius:5px;background:#fff;box-shadow:0 10px 40px #02061730;color:#7e89a0;font-size:12px;line-height:1.9}
.video-showcase{padding:0;background:#f5f6fc;isolation:isolate}
.showcase-video{display:block;width:100%;height:100%;object-fit:cover;background:#f5f6fc}
.showcase-video-open{width:100%;cursor:pointer;text-align:left;transition:background .2s}
.showcase-video-open:hover{background:linear-gradient(transparent,#161443d9 48%,#161443ed)}
.video-watch-mark{display:grid;place-items:center;width:24px;height:24px;border:1px solid #ffffff40;border-radius:50%;flex-shrink:0}
.video-watch-mark .icon{width:13px;height:13px;fill:currentColor;stroke-width:1}
.clip-play-toggle{position:absolute;top:9px;right:9px;z-index:4;min-width:42px;min-height:27px;border:1px solid #dedff2;border-radius:4px;padding:4px 8px;background:#fffffff2;color:#8175b3;font-size:12px;font-weight:600;box-shadow:0 3px 12px #02061708}
.clip-play-toggle:hover{background:#f1edff;color:var(--indigo)}
.hero-film-dialog{max-width:1180px;padding-top:32px}
.hero-film-dialog h2{font-size:26px;margin-block:10px 20px}
.hero-film-dialog video{display:block;width:100%;height:auto;max-height:68svh;aspect-ratio:8/5;object-fit:contain;background:#f5f6fc;border:1px solid #e6e9f2;border-radius:6px}
.video-dialog-note{color:#9ba2b3;font-size:12px;line-height:1.8;margin-top:17px}
.process-video-detail{width:min(330px,100%);margin:24px auto;border:1px solid #e5e8f0;border-radius:6px;overflow:hidden;background:#f5f6fc}
.process-video-detail video{display:block;width:100%;height:auto;max-height:61svh;aspect-ratio:2/3;object-fit:contain;background:#f5f6fc}
.process-video-detail figcaption{padding:10px 14px;font-size:12px;line-height:1.7;color:#929bb0;background:#fff;text-align:center}
@media(min-width:1650px){.video-stack{max-width:900px}.video-stack .frame-caption{height:31px;font-size:12px}.with-motion .hero-layout{padding-top:99px;padding-bottom:32px}}
@media(max-width:1200px){.video-stack{max-width:900px}.video-controls{gap:5px}.video-controls button{font-size:12px}.video-chapters{gap:1px}.video-chapters button{font-size:12px;gap:3px}.video-example-note{font-size:12px}}
@media(max-width:950px){.with-motion .hero-layout{padding-top:128px;padding-bottom:64px}.video-stack{max-width:750px;margin-top:40px}.video-controls button{font-size:12px;min-height:30px}.video-time{font-size:12px}.video-chapters button{font-size:12px;min-height:29px}.video-example-note{font-size:12px}.hero-video-transcript{font-size:12px}}
@media(max-width:640px){.with-motion .hero-layout{padding-top:99px;padding-bottom:36px}.video-stack{margin-top:27px;padding-top:32px}.video-stack .stack-tab{height:19px;left:20px;font-size:12px}.video-stack .stack-tab-middle{top:16px;left:10px}.hero-video-frame{padding-bottom:7px}.hero-video-frame .frame-caption{font-size:12px;height:21px}.hero-video-player{border-radius:3px}.video-controls{padding:5px;gap:4px;min-height:36px}.video-controls button{min-width:34px;min-height:28px;font-size:12px;padding:4px}.video-controls [data-video-toggle]{min-width:39px}.video-controls [data-video-restart]{display:none}.video-time{font-size:12px;min-width:60px}.video-controls input[type=range]{height:22px;min-width:30px}.video-controls .icon{width:10px;height:10px}.video-chapters{grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;padding:5px}.video-chapters button{font-size:12px;min-height:28px;gap:5px}.video-chapters button>span{width:15px;height:15px;font-size:12px}.video-example-note{font-size:12px;margin-top:7px}.hero-video-transcript{font-size:12px;margin-top:8px}.hero-video-transcript>p{font-size:12px;width:100%;padding:17px}.clip-play-toggle{font-size:12px;min-height:28px;top:9px;right:9px}.hero-film-dialog{padding:43px 14px 20px}.hero-film-dialog h2{font-size:22px;line-height:1.25}.hero-film-dialog video{max-height:70svh}.video-dialog-note{font-size:12px}.process-video-detail{width:min(300px,100%)}.process-video-detail video{max-height:63svh}}
@media(prefers-reduced-motion:reduce){.video-showcase,.video-showcase *{transition:none}}