/* The landing keeps its scroll assembly; the player owns all internal layout. */
.hero .hero-demo.guided-player{padding:0;display:block;background:#fff;border-radius:20px;max-width:min(1040px,calc((100svh - 160px)*16/9))}
.hero .guided-player .screen{border-radius:0;outline:0;background:#fafafa}
.hero .guided-player .screen video{height:auto;object-fit:fill}
.hero-scroll .hero-demo.guided-player{max-width:min(1120px,calc((100svh - 260px)*16/9))}
.hero .guided-player[data-variant=mobile]:not(:fullscreen):not(.is-expanded){max-width:430px}
.hero .guided-player[data-variant=mobile] .screen video{height:100%;object-fit:contain}
.hero .hero-demo.guided-player:is(:fullscreen,.is-expanded){display:grid;grid-template-rows:62px minmax(0,1fr) 68px;max-width:none;width:100%;height:100dvh;padding:0;border-radius:0;z-index:1000}
.hero .guided-player:is(:fullscreen,.is-expanded) .screen{aspect-ratio:auto;min-height:0}
.hero .hero-demo.guided-player.has-docked-callout:is(:fullscreen,.is-expanded){grid-template-rows:62px minmax(0,1fr) auto 68px}
.hero .hero-demo.guided-player.has-side-callout:is(:fullscreen,.is-expanded){grid-template-rows:62px minmax(0,1fr) 68px}
@media(max-width:640px){
 .hero .hero-demo.guided-player{max-width:430px;border-radius:15px}
 .hero .hero-demo.guided-player:is(:fullscreen,.is-expanded){grid-template-rows:54px minmax(0,1fr) 62px;max-width:none;border-radius:0}
 .hero .hero-demo.guided-player.has-docked-callout:is(:fullscreen,.is-expanded){grid-template-rows:54px minmax(0,1fr) auto 62px}
}
