Update src/app/page.tsx

src/app/page.tsx

@@ -4,7 +4,7 @@ import { Award, Clock, Heart, Sparkles, Star, Users } from "lucide-react";
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
 import AboutMetric from '@/components/sections/about/AboutMetric';
-import FaqBase from '@/components/sections/faq/FaqBase';
+import FeatureCardTwentyTwo from '@/components/sections/feature/FeatureCardTwentyTwo';
 import ProductCardThree from '@/components/sections/product/ProductCardThree';
 import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
 import ContactCenter from '@/components/sections/contact/ContactCenter';
@@ -95,44 +95,34 @@ export default function RestaurantPage() {
       </div>
 
       <div id="features-section" data-section="features-section">
-        <FaqBase
-          faqs={[
+        <FeatureCardTwentyTwo
+          features={[
             {
-              id: "faq-1",
-              title: "What are your operating hours?",
-              content: "We're open Monday to Thursday from 11am to 10pm, Friday and Saturday from 11am to 11pm, and Sunday from 12pm to 9pm. We're closed on major holidays."
+              id: "feature-1",              category: ["Cuisine", "Experience"],
+              title: "Authentic Homemade Recipes",              imageSrc: "https://img.b2bpic.net/free-photo/top-view-brown-wooden-plate-with-vegetables-eggs-seasonings-dark-background-sugar-color-cake-white-tea-cookie-salad-food-biscuit_140725-160796.jpg",              imageAlt: "Delicious homemade pasta dish"
             },
             {
-              id: "faq-2",
-              title: "Do you accommodate dietary restrictions?",
-              content: "Absolutely! We offer vegetarian, vegan, gluten-free, and dairy-free options. Please inform your server of any allergies or dietary preferences when ordering."
+              id: "feature-2",              category: ["Ambiance", "Comfort"],
+              title: "Cozy & Inviting Atmosphere",              imageSrc: "https://img.b2bpic.net/free-photo/table-setting-romantic-dinner-wedding-any-occasion-with-candles-dried-flowers-as-decor_169016-11025.jpg?_wi=1",              imageAlt: "Warm and cozy restaurant interior"
             },
             {
-              id: "faq-3",
-              title: "Can I make a reservation online?",
-              content: "Yes, you can book a table through our website or call us directly at (555) 123-4567. We recommend reservations during peak hours on weekends."
-            },
-            {
-              id: "faq-4",
-              title: "Do you offer catering services?",
-              content: "Yes! We provide catering for events of all sizes. Contact our catering team at catering@warmbite.com or call (555) 123-4568 for custom quotes and menu options."
+              id: "feature-3",              category: ["Service", "Quality"],
+              title: "Exceptional Customer Service",              imageSrc: "https://img.b2bpic.net/free-photo/small-group-happy-friends-laughing-having-fun-while-eating-dinner-dining-table-home_637285-10338.jpg",              imageAlt: "Friendly staff serving customers"
             }
           ]}
-          title="Frequently Asked Questions"
-          description="Find answers to common questions about WarmBite Restaurant, our services, and dining experience."
-          tag="Got Questions?"
+          animationType="slide-up"
+          title="Why Choose Our Restaurant"
+          description="We blend traditional flavors with modern techniques to create unforgettable dining experiences that warm your heart and satisfy your taste buds."
+          textboxLayout="inline-image"
+          useInvertedBackground={false}
+          tag="Special Features"
+          tagIcon={Sparkles}
           tagAnimation="blur-reveal"
           buttons={[
-            { text: "Contact Us", href: "#contact-section", dataWebildId: "faq_contact_btn" },
-            { text: "View Menu", href: "#menu-section", dataWebildId: "faq_menu_btn" }
+            { text: "View Menu", href: "#product-section" },
+            { text: "Book a Table", href: "#contact-section" }
           ]}
           buttonAnimation="opacity"
-          faqsAnimation="slide-up"
-          textboxLayout="inline-image"
-          useInvertedBackground={true}
-          animationType="smooth"
-          showCard={true}
-          ariaLabel="Restaurant FAQ section"
         />
       </div>
 

src/components/sections/hero/HeroSplitKpi.tsx

@@ -130,6 +130,8 @@ interface HeroSplitKpiProps {
     imagePosition?: "left" | "right";
     className?: string;
     containerClassName?: string;
+    enableTextAnimation?: boolean;
+    textAnimationType?: "fade-in" | "slide-in-up" | "slide-in-down";
     textBoxClassName?: string;
     titleClassName?: string;
     descriptionClassName?: string;
@@ -209,7 +211,7 @@ const HeroSplitKpi = ({
                 mediaWrapperClassName
             )}
         >
-            <div ref={mediaContainerRef} className="relative h-full scale-75 w-full overflow-hidden rounded-theme-capped card p-4">
+            <div ref={mediaContainerRef} className="relative h-full w-full overflow-hidden rounded-theme-capped">
                 <MediaContent
                     imageSrc={imageSrc}
                     videoSrc={videoSrc}