src/app/page.tsx

@@ -13,7 +13,18 @@ export default function Page() {
   const footerColumns = [{ title: "Company", items: [{ label: "About", href: "/about" }] }];
   
   return (
-    <ThemeProvider>
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
       <div id="nav" data-section="nav">
         <NavbarStyleApple navItems={navItems} />
       </div>
@@ -24,13 +35,13 @@ export default function Page() {
         <TextAbout title="About Us" useInvertedBackground={false} />
       </div>
       <div id="menu" data-section="menu">
-        <ProductCardOne title="Our Menu" gridVariant="bento-grid" animationType="slide-up" textboxLayout="default" />
+        <ProductCardOne title="Our Menu" description="Discover our selection" gridVariant="bento-grid" animationType="slide-up" textboxLayout="default" useInvertedBackground={false} />
       </div>
       <div id="testimonials" data-section="testimonials">
-        <TestimonialCardTwelve testimonials={[]} cardTitle="Reviews" cardAnimation="slide-up" />
+        <TestimonialCardTwelve testimonials={[]} cardTitle="Reviews" cardTag="Feedback" cardAnimation="slide-up" useInvertedBackground={false} />
       </div>
       <div id="faq" data-section="faq">
-        <FaqBase title="FAQ" faqs={[]} faqsAnimation="slide-up" textboxLayout="default" />
+        <FaqBase title="FAQ" description="Common questions" faqs={[]} faqsAnimation="slide-up" textboxLayout="default" useInvertedBackground={false} />
       </div>
       <div id="footer" data-section="footer">
         <FooterBaseCard columns={footerColumns} />