.product-preview{position:absolute;inset:0;pointer-events:none;z-index:1}.product-preview canvas{display:block;width:100%;height:100%}.playground>.product-preview{left:auto;right:0;width:76%;height:100%}.live-product>img{opacity:0!important}.scene-card,.make-visual>span,.playground-caption,.palette,.visual-note{z-index:2}.scene-card{position:absolute}.make-visual>span{position:absolute}.product-preview:after{content:'';position:absolute;left:14%;right:10%;bottom:12%;height:14%;border-radius:50%;background:radial-gradient(ellipse,#405f9924,transparent 70%);filter:blur(12px);z-index:-1;transform:scaleY(.4)}
.reveal-on .reveal-item{opacity:0;transform:translateY(24px);transition:opacity .7s ease var(--reveal-delay,0ms),transform .8s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms)}.reveal-on .reveal-item.is-shown{opacity:1;transform:translateY(0)}
@media(max-width:760px){.playground>.product-preview{top:17%;height:80%;left:0;width:100%}.reveal-on .reveal-item{transform:translateY(16px)}}
@media(prefers-reduced-motion:reduce){.reveal-on .reveal-item{opacity:1;transform:none;transition:none}}

@media(max-width:760px){.hero h1>span{display:inline-block;white-space:nowrap}}

/* Keep product art centered in the space above its caption, at every width. */
.scene-panel{--preview-bottom:112px}.make-visual{--preview-bottom:92px}
.scene-panel>.product-preview,.make-visual>.product-preview{bottom:var(--preview-bottom)}
.scene-panel>img,.make-visual>img{position:absolute;inset:0 0 auto;width:100%;height:calc(100% - var(--preview-bottom));object-fit:contain;object-position:center}
.contact-address{color:var(--action-ink);font-size:13px;overflow-wrap:anywhere;display:inline-block;margin-top:6px}.contact-address:focus-visible{outline:2px solid currentColor;outline-offset:4px}
:root[data-mode=dark] .contact-address{color:var(--action-night)}
