Bob AI: Add multiple fancy animations to testimonial cards: enhance

src/components/sections/testimonial/TestimonialCardSixteen.tsx

@@ -87,10 +87,33 @@ const TestimonialCard = memo(({
     companyClassName = "",
 }: TestimonialCardProps) => {
     return (
-        <div className={cls("relative h-full aspect-[8/10] rounded-theme-capped overflow-hidden group perspective", cardClassName)} style={{ perspective: "1000px" }}>
+        <div className={cls("relative h-full aspect-[8/10] rounded-theme-capped overflow-hidden group", cardClassName)} style={{animation: "cardEntrance 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards"}}>
-            <div className="relative w-full h-full transition-transform duration-500 ease-out group-hover:[transform:rotateY(180deg)]" style={{ transformStyle: "preserve-3d" }}>
+            <style>{`
+                @keyframes cardEntrance {
+                    from {
+                        opacity: 0;
+                        transform: translateY(30px) scale(0.95);
+                    }
+                    to {
+                        opacity: 1;
+                        transform: translateY(0) scale(1);
+                    }
+                }
+                @keyframes glowPulse {
+                    0%, 100% {
+                        box-shadow: 0 0 20px rgba(var(--accent-rgb), 0.3), 0 20px 40px rgba(0, 0, 0, 0.15);
+                    }
+                    50% {
+                        box-shadow: 0 0 40px rgba(var(--accent-rgb), 0.5), 0 25px 50px rgba(0, 0, 0, 0.2);
+                    }
+                }
+                .group:hover .testimonial-inner {
+                    animation: glowPulse 2s ease-in-out infinite;
+                }
+            `}</style>
+            <div className="testimonial-inner relative w-full h-full transition-all duration-500 ease-out group-hover:shadow-2xl group-hover:-translate-y-12 group-hover:scale-105 group-hover:[transform:perspective(1000px)_rotateX(2deg)_rotateY(-3deg)_translateY(-48px)_scale(1.05)]" style={{}}>
                 {/* Front of card */}
-                <div style={{ backfaceVisibility: "hidden" }} className="absolute w-full h-full">
+                <div className="absolute w-full h-full">
                     <MediaContent
                         imageSrc={testimonial.imageSrc}
                         videoSrc={testimonial.videoSrc}