From 3206659f83d84899a16bd63e2ff418a91b8ea012 Mon Sep 17 00:00:00 2001
From: kudindmitriy <kudin.dima@gmail.com>
Date: Tue, 24 Feb 2026 15:01:02 +0000
Subject: [PATCH] Bob AI: Add multiple fancy animations to testimonial cards:
 enhance

---
 .../testimonial/TestimonialCardSixteen.tsx    | 27 +++++++++++++++++--
 1 file changed, 25 insertions(+), 2 deletions(-)

diff --git a/src/components/sections/testimonial/TestimonialCardSixteen.tsx b/src/components/sections/testimonial/TestimonialCardSixteen.tsx
index f38f4d9..65c65bc 100644
--- a/src/components/sections/testimonial/TestimonialCardSixteen.tsx
+++ b/src/components/sections/testimonial/TestimonialCardSixteen.tsx
@@ -87,8 +87,31 @@ const TestimonialCard = memo(({
     companyClassName = "",
 }: TestimonialCardProps) => {
     return (
-        <div className={cls("relative h-full aspect-[8/10] rounded-theme-capped overflow-hidden group", cardClassName)}>
-            <div className="relative w-full h-full transition-all duration-500 ease-out group-hover:shadow-xl group-hover:-translate-y-8" style={{}}>
+        <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"}}>
+            <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 className="absolute w-full h-full">
                     <MediaContent