.intro-video{min-width:0;background:var(--white);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 24px 60px #183f3212}
.video-heading{padding:24px 26px 20px}
.hero .video-heading .eyebrow{margin-bottom:12px;font-size:10px}
.video-heading h2{font-size:clamp(26px,2.5vw,37px);letter-spacing:-.04em}
.video-heading>p:last-child{font-size:14px;color:var(--muted);margin-top:12px}
.video-stage{aspect-ratio:16/9;background:#071a11;position:relative}
.video-preview{display:block;position:relative;width:100%;height:100%;color:var(--white);text-decoration:none}
.video-preview img{display:block;width:100%;height:100%;object-fit:cover}
.video-preview:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#00170df2)}
.video-load-label{position:absolute;z-index:1;bottom:20px;left:24px;right:24px;display:flex;align-items:center;gap:12px;font-weight:650;font-size:16px}
.video-load-label>span:first-child{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--lime);color:var(--ink);font-size:19px;flex-shrink:0}
.video-load-label small{font:11px var(--mono);margin-left:auto}
.video-preview:hover .video-load-label>span:first-child{background:#fff}
.video-preview:focus-visible{outline-offset:-5px;z-index:2}
.video-stage iframe{display:block;border:0;width:100%;height:100%;position:absolute;inset:0}
.video-footer{padding:16px 24px;display:flex;gap:18px;align-items:center;justify-content:space-between}
.hero .video-footer .micro{margin:0;max-width:300px;font-size:11px}
.video-footer .text-link{font-size:12px;white-space:nowrap}
.hero>.app-slideshow{grid-column:1/-1;width:100%;max-width:1000px;justify-self:center;margin-top:12px}
.hero>.app-slideshow .slide-image-link img{object-fit:contain;max-height:640px;background:#101720}
@media(max-width:1100px){.intro-video{width:100%;max-width:850px;justify-self:center}}
@media(max-width:700px){.video-heading{padding:20px 18px}.video-heading h2{font-size:29px}.video-heading>p:last-child{font-size:13px}.video-footer{padding:14px 18px;display:block}.video-footer .text-link{margin-top:10px}.video-load-label{left:16px;right:16px;bottom:12px;font-size:14px}.video-load-label>span:first-child{width:38px;height:38px;font-size:16px}.video-load-label small{font-size:10px}.hero>.app-slideshow{margin-top:0}}
/* Eight distinct views, with native-resolution video and readable stills. */
.hero>.showcase-eight{max-width:1240px}.showcase-eight .slideshow-top{gap:16px;flex-wrap:wrap}.showcase-eight .slide-version{font:10px var(--mono);color:var(--muted)}
.slide-video-stage{aspect-ratio:16/9;background:#101720}.slide-video{display:block;width:100%;height:100%;object-fit:contain;background:#101720}.motion-hint{margin:0;padding:10px 24px;background:#eaf0df;font-size:11px;color:#435c48}
.showcase-eight .slide-image-link{height:auto;aspect-ratio:16/9;background:#101720}.hero>.showcase-eight .slide-image-link img{display:block;width:100%;height:100%;max-height:none;object-fit:contain}.showcase-eight .app-slide-detail .slide-image-link img{padding:18px}.showcase-eight .app-slide figcaption{min-height:142px}.showcase-eight .app-slide figcaption p{max-width:900px;font-size:14px}.showcase-eight .slide-picker button:nth-child(-n+4){border-bottom:1px solid var(--line)}.showcase-eight .slide-picker button:nth-child(4n){border-right:0}.showcase-eight .slide-picker button{min-height:68px}.showcase-eight .slideshow-controls{padding-top:6px}
@media(max-width:700px){.showcase-eight .slideshow-top .eyebrow{font-size:8px}.showcase-eight .slide-version{font-size:9px}.motion-hint{padding:10px 17px}.showcase-eight .app-slide figcaption{min-height:190px}.showcase-eight .app-slide figcaption p{font-size:13px}.showcase-eight .app-slide-detail .slide-image-link{aspect-ratio:4/5}.showcase-eight .slide-picker button{min-height:64px}.showcase-eight .slide-picker button:nth-child(2n){border-right:0}}
.motion-hint{display:flex;align-items:center;justify-content:space-between;gap:14px}.clip-toggle{background:var(--ink);color:var(--white);border-radius:5px;padding:8px 14px;min-height:40px;white-space:nowrap;font-size:12px}.clip-toggle:hover{background:#285641}
.slide-video-stage{position:relative}.clip-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 24px;border:2px solid #ffffffc9;border-radius:20px;background:#123b30ed;color:#fff;box-shadow:0 8px 30px #0008;font:600 15px var(--sans);cursor:pointer;white-space:nowrap}.clip-play svg{width:64px;height:64px;background:var(--lime);color:var(--ink);border-radius:50%}.clip-play:hover{background:#20583f}.clip-play:focus-visible{outline:3px solid var(--lime);outline-offset:5px}.clip-play[hidden]{display:none}@media(max-width:700px){.clip-play{gap:5px;padding:10px 16px;border-radius:14px;font-size:12px}.clip-play svg{width:44px;height:44px}}
.showcase-eight .slideshow-controls{order:1;padding:10px 24px;border-top:1px solid var(--line)}.showcase-eight .slide-picker{order:2;border-bottom:1px solid var(--line)}.showcase-eight .slideshow-stage{order:3}.showcase-eight .slideshow-note{order:4}
@media(max-width:700px){.showcase-eight .slide-picker{grid-template-columns:repeat(4,minmax(0,1fr))}.showcase-eight .slide-picker button{font-size:10px;padding:10px 4px;min-height:62px;line-height:1.4}.showcase-eight .slide-picker button span{font-size:8px}.showcase-eight .slide-picker button:nth-child(2n){border-right:1px solid var(--line)}.showcase-eight .slide-picker button:nth-child(4n){border-right:0}}
