.hero-showcase-section{perspective:1200px;padding:2rem 0}.hero-showcase-glow{pointer-events:none;background:radial-gradient(60% 40% at 50% 30%,#8b5cf614 0%,#0000 70%);position:absolute;inset:0}.hero-showcase-frame{transform-style:preserve-3d;transition:transform .4s;position:relative;transform:rotateX(2deg)}.hero-showcase-frame:hover{transform:rotateX(0)}.hero-showcase-border{-webkit-mask-composite:xor;opacity:.6;background:linear-gradient(135deg,#8b5cf666 0%,#3b82f64d 25%,#10b9814d 50%,#3b82f64d 75%,#8b5cf666 100%) 0 0/300% 300%;border-radius:.875rem;padding:1px;transition:opacity .3s;animation:8s infinite gradient-shift;position:absolute;inset:-1px;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0)}.hero-showcase-frame:hover .hero-showcase-border{opacity:1}@keyframes gradient-shift{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.hero-showcase-grid{background-image:linear-gradient(#ffffff05 1px,#0000 1px),linear-gradient(90deg,#ffffff05 1px,#0000 1px);background-size:40px 40px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(#000 30%,#0000 70%);mask-image:radial-gradient(#000 30%,#0000 70%)}.hero-play-ring{border:1px solid #fff3;border-radius:9999px;animation:2s ease-out infinite pulse-ring;position:absolute;inset:-4px}@keyframes pulse-ring{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.5)}}.hero-showcase-content:after{content:"";pointer-events:none;background:radial-gradient(50% 80% at 50% 100%,#8b5cf60d 0%,#0000 60%);position:absolute;inset:0}.hero-showcase-placeholder{z-index:10;position:relative}@media (prefers-reduced-motion:reduce){.hero-showcase-border,.hero-play-ring{animation:none}.hero-showcase-frame,.hero-showcase-frame:hover{transform:none}}