/* Hero with the real 3D cube (assets/hero-3d/stocktrace360.glb), rendered with three.js: it tumbles slowly in every direction and can be turned by hand */
.hero-cube{position:relative;justify-self:center;width:min(100%,clamp(260px,32vw,500px),62vh);aspect-ratio:1}
.hero-cube::before{content:"";position:absolute;inset:4%;border-radius:50%;background:radial-gradient(closest-side,rgb(226 69 155 / .24),rgb(117 82 214 / .16) 55%,transparent);filter:blur(26px);pointer-events:none}
.hero-cube-canvas{position:relative;display:block;width:100%;height:100%;opacity:0;transform:scale(.92);transition:opacity .9s ease-out,transform 1.2s cubic-bezier(.16,1,.3,1);touch-action:pan-y}
.hero-cube.is-ready .hero-cube-canvas{opacity:1;transform:none}
.hero-cube.is-draggable .hero-cube-canvas{cursor:grab}
.hero-cube.is-dragging .hero-cube-canvas{cursor:grabbing}
.hero-cube.is-failed .hero-cube-canvas{background:url("../assets/hero-3d/cube-fallback.svg") center/62% no-repeat;opacity:1;transform:none}
@media(max-width:800px){
.hero-cube{order:-1;justify-self:start;width:clamp(96px,15vh,200px)}
}
@media(max-width:800px) and (max-height:700px){.hero-cube{width:76px}}
@media(prefers-reduced-motion:reduce){.hero-cube-canvas{transition:none;transform:none}}
