/* Perspective stays on the scene; tilt and floating use separate layers. */
.hero-art{perspective:1100px;isolation:isolate}
.hero-card-tilt{width:100%;min-width:0;transform-style:preserve-3d;transform:rotateX(var(--card-x,7deg)) rotateY(var(--card-y,-12deg));transition:transform .45s cubic-bezier(.2,.7,.2,1);position:relative;z-index:1}
.hero-card-tilt::before{content:'';position:absolute;inset:auto 8% -6px;height:35px;border-radius:50%;background:#192b453b;filter:blur(18px);transform:translateZ(-50px)}
.hero-card-tilt .showcase-card{width:100%;box-sizing:border-box;rotate:none;scale:none;overflow:hidden;transform:translateY(0) rotate(-4deg);animation:card-3d-float 6s ease-in-out 3;box-shadow:1px 2px 0 #6381a1,2px 4px 0 #3d5878,3px 6px 0 #203752,0 24px 42px #192b4530,inset 0 1px 1px #ffffff66;border:1px solid #ffffff35}
.hero-card-tilt .showcase-card:hover{rotate:none;scale:none}
.hero-card-tilt .showcase-card::after{inset:0;transform:none;animation:none;background:radial-gradient(ellipse at var(--shine-x,25%) var(--shine-y,15%),#ffffff30,transparent 65%),linear-gradient(115deg,transparent 20%,#ffffff0c 42%,transparent 65%);border-radius:inherit}
.hero-card-tilt .showcase-top,.hero-card-tilt .showcase-bottom{position:relative;z-index:1}
.hero-art .floating-note{z-index:3}
.card-motion-toggle{position:absolute;right:16px;top:16px;z-index:4;background:#faf7f2d9;color:#29476b;border:1px solid #29476b26;border-radius:20px;padding:7px 11px;font-size:11px;cursor:pointer}
.hero-art.motion-paused .showcase-card,.hero-art.motion-offscreen .showcase-card{animation-play-state:paused}
.hero-art.motion-paused .hero-card-tilt{transform:rotateX(7deg) rotateY(-12deg)}
@keyframes card-3d-float{0%,100%{transform:translateY(0) rotate(-4deg) rotateY(0)}50%{transform:translateY(-12px) rotate(-2deg) rotateY(9deg)}}
@media(max-width:700px){.hero-card-tilt .showcase-card{max-width:none}.hero-card-tilt{transform:rotateX(6deg) rotateY(-8deg)}}
@media(prefers-reduced-motion:reduce){.hero-card-tilt{transform:rotate(-3deg)!important;transition:none}.hero-card-tilt .showcase-card{animation:none!important;transform:none}.card-motion-toggle{display:none}}