/* Optional 3D product previews on template guides. */
.scene-viewport { position: absolute; inset: 0; }
.scene-viewport canvas { display: block; width: 100%; height: 100%; }
.template-scene { position: relative; min-height: 380px; border-radius: 20px; background: #edf3f8; overflow: hidden; display: grid; place-items: center; }
.template-scene .scene-viewport { display: none; }
.template-scene.scene-ready:not(.flat-view) .scene-viewport { display: block; }
.template-scene.scene-ready:not(.flat-view) .lp-label { visibility: hidden; }
.template-scene .lp-label { position: relative; z-index: 1; max-height: 290px; max-width: 75%; transform: none; margin: 30px; box-shadow: 0 20px 40px -20px #31557660; }
.template-view-controls { display: inline-flex; align-items: center; padding: 4px; margin: 14px auto 0; gap: 3px; border: 1px solid #dce6ee; border-radius: 25px; background: #fff; }
.template-view-controls button { min-height: 44px; border: 0; background: none; padding: 7px 15px; border-radius: 20px; color: #5a7285; font: 400 11px/1.5 var(--font); cursor: pointer; }
.template-view-controls button[aria-pressed=true] { background: #eaf2ff; color: #0b5fca; }
.lp-figure { text-align: center; }
.template-scene.flat-view .lp-label { max-height: min(70vh,620px); max-width: calc(100% - 24px); width: auto; height: auto; margin: 20px 12px; }
@media(max-width:600px) {
  .template-scene { min-height: 310px; }
  .template-scene .lp-label { max-height: 240px; }
}
/* Pause control attached to the moving preview, like the homepage gallery's; shown only while the 3D scene is on screen. */
.site .scene-motion { position: absolute; right: 14px; bottom: 14px; z-index: 2; width: 40px; height: 40px; min-height: 0; padding: 0; border-radius: 50%; color: var(--ink); }
.site .scene-motion:hover:not(:disabled) { border-color: var(--blue); color: var(--blue-deep); background: #f0f6ff; }
.site .template-scene:not(.scene-ready) .scene-motion,.site .template-scene.flat-view .scene-motion { display: none; }
@media(max-width:760px) { .site .scene-motion { width: 44px; height: 44px; right: 10px; bottom: 10px; } }