diff --git a/src/app/page.tsx b/src/app/page.tsx
index a06ea01..28b48b5 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -8,13 +8,23 @@ import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
 import FaqBase from '@/components/sections/faq/FaqBase';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
-import { Zap, Target, Star, HelpCircle } from 'lucide-react';
 
 export default function Page() {
   const navItems = [{ name: 'Home', id: '/' }];
   
   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,7 +34,7 @@ export default function Page() {
       </div>
       
       <div id="about" data-section="about">
-        <TextAbout title="About Us" />
+        <TextAbout title="About Us" useInvertedBackground={false} />
       </div>
       
       <div id="menu" data-section="menu">
@@ -34,6 +44,7 @@ export default function Page() {
             gridVariant="uniform-all-items-equal"
             animationType="slide-up"
             textboxLayout="default"
+            useInvertedBackground={false}
             products={[
                 { id: '1', name: 'Item 1', price: '$10', imageSrc: 'https://images.unsplash.com/photo-1511556532299-8f662526c06a' },
                 { id: '2', name: 'Item 2', price: '$20', imageSrc: 'https://images.unsplash.com/photo-1511556532299-8f662526c06a' },
@@ -48,6 +59,7 @@ export default function Page() {
             cardTitle="Testimonials" 
             cardTag="Happy Users" 
             cardAnimation="slide-up" 
+            useInvertedBackground={false}
         />
       </div>
       
@@ -58,6 +70,7 @@ export default function Page() {
             faqs={[{ id: '1', title: 'Question', content: 'Answer' }]} 
             faqsAnimation="slide-up" 
             textboxLayout="default" 
+            useInvertedBackground={false}
         />
       </div>