.home .qmt-hero__diagram { min-width:0; perspective:1000px; padding-right:24px; }
.home .qmt-hero__dashboard {
 display:block; width:100%; height:auto; border-radius:8px; background:#050506;
 transform:rotateY(-35deg); transform-origin:center;
 box-shadow:1px 0 0 #1c1f24,2px 0 0 #1c1f24,3px 0 0 #1c1f24,4px 0 0 #1c1f24,40px 40px 60px rgba(0,0,0,.55);
}
.home .qmt-hero__demo-note { margin:44px 0 0; text-align:center; font-size:11px; line-height:1.4; color:#7e848c; }
.home .qmt-hero__hypothetical { font-size:10px; line-height:1.5; color:#6b7078; margin:8px auto 0; max-width:560px; text-align:center; }
@media(max-width:900px) {
 .home .qmt-hero__diagram { max-width:824px; perspective:none; padding-right:0; }
 .home .qmt-hero__dashboard { transform:none; }
 .home .qmt-hero__demo-note { margin-top:12px; }
}

/* The still image establishes geometry and stays visible if playback cannot start. */
.home .qmt-hero__dashboard { position:relative; overflow:hidden; }
.home .qmt-dashboard-still { display:block; width:100%; height:auto; }
.home #qmt-home-dashboard { position:absolute; inset:0; width:100%; height:100%; opacity:0; }
.home .qmt-hero__dashboard.is-playing #qmt-home-dashboard { opacity:1; }
.home .qmt-hero__dashboard.is-playing .qmt-dashboard-still { visibility:hidden; }

.home .qmt-dashboard-play {
 position:absolute; z-index:2; left:50%; top:50%; transform:translate(-50%,-50%);
 min-height:44px; padding:12px 20px; border:1px solid #d6ad32; border-radius:4px;
 background:#d6ad32; color:#101010; font:inherit; font-weight:600; cursor:pointer;
}
.home .qmt-dashboard-play[hidden] { display:none; }
.home .qmt-dashboard-play:focus-visible { outline:3px solid #fff; outline-offset:4px; }