diff --git a/src/app/page.tsx b/src/app/page.tsx
index d92f368..865e8c8 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -9,29 +9,32 @@ import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCar
 import FaqDouble from '@/components/sections/faq/FaqDouble';
 import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FooterMedia from '@/components/sections/footer/FooterMedia';
-import Link from "next/link";
 
 const navItems = [{ name: "Home", id: "/" }];
 
 export default function Page() {
   return (
-    <ThemeProvider>
+    <ThemeProvider defaultButtonVariant="hover-magnetic" 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">
-        <NavbarLayoutFloatingInline navItems={navItems} />
+        <NavbarLayoutFloatingInline navItems={navItems} button={{ text: "Contact" }} />
       </div>
       <div id="hero" data-section="hero">
         <HeroBillboardGallery 
           title="Delicious Moments"
           description="Experience the best culinary traditions in town."
           background={{ variant: "plain" }}
-          mediaItems={[{ imageSrc: "https://images.unsplash.com/photo-1504674900247-0877df9cc836?q=80&w=2000" }, { imageSrc: "https://images.unsplash.com/photo-1555396273-367ea4eb4db5?q=80&w=2000" }, { imageSrc: "https://images.unsplash.com/photo-1414235077428-338989a2e8c0?q=80&w=2000" }]} 
+          mediaItems={[
+            { imageSrc: "https://images.unsplash.com/photo-1504674900247-0877df9cc836?q=80&w=2000" }, 
+            { imageSrc: "https://images.unsplash.com/photo-1555396273-367ea4eb4db5?q=80&w=2000" }, 
+            { imageSrc: "https://images.unsplash.com/photo-1414235077428-338989a2e8c0?q=80&w=2000" }
+          ]} 
         />
       </div>
       <div id="social-strip" data-section="social-strip">
-        <SocialProofOne names={["Partner A", "Partner B"]} title="As Seen In" />
+        <SocialProofOne names={["Partner A", "Partner B"]} title="As Seen In" description="Trusted by industry leaders." textboxLayout="default" useInvertedBackground={false} />
       </div>
       <div id="about-tradition" data-section="about-tradition">
-        <SplitAbout title="Our Tradition" description="Authentic recipes passed down for generations." textboxLayout="default" />
+        <SplitAbout title="Our Tradition" description="Authentic recipes passed down for generations." textboxLayout="default" bulletPoints={[]} useInvertedBackground={false} />
       </div>
       <div id="signature-dishes" data-section="signature-dishes">
         <FeatureCardThree 
@@ -40,23 +43,24 @@ export default function Page() {
           gridVariant="bento-grid"
           animationType="slide-up"
           textboxLayout="default"
-          features={[{ title: "Dish 1", description: "Yummy", imageSrc: "" }, { title: "Dish 2", description: "Great", imageSrc: "" }]} 
+          useInvertedBackground={false}
+          features={[{ title: "Dish 1", description: "Yummy", imageSrc: "https://images.unsplash.com/photo-1504674900247-0877df9cc836?q=80&w=500" }, { title: "Dish 2", description: "Great", imageSrc: "https://images.unsplash.com/photo-1555396273-367ea4eb4db5?q=80&w=500" }]} 
         />
       </div>
       <div id="experience" data-section="experience">
-        <SplitAbout title="The Experience" description="Unforgettable dining for you and yours." textboxLayout="default" />
+        <SplitAbout title="The Experience" description="Unforgettable dining for you and yours." textboxLayout="default" bulletPoints={[]} useInvertedBackground={false} />
       </div>
       <div id="testimonials" data-section="testimonials">
-        <TestimonialCardSix title="Testimonials" animationType="slide-up" textboxLayout="default" testimonials={[{ id: "1", name: "Jane", handle: "@jane", testimonial: "Best food!" }, { id: "2", name: "Bob", handle: "@bob", testimonial: "Amazing service!" }]} />
+        <TestimonialCardSix title="Testimonials" description="What our guests say" animationType="slide-up" textboxLayout="default" useInvertedBackground={false} testimonials={[{ id: "1", name: "Jane", handle: "@jane", testimonial: "Best food!" }, { id: "2", name: "Bob", handle: "@bob", testimonial: "Amazing service!" }]} />
       </div>
       <div id="visitor-faq" data-section="visitor-faq">
-        <FaqDouble title="FAQ" faqsAnimation="slide-up" textboxLayout="default" faqs={[{ id: "1", title: "How to book?", content: "Call us!" }, { id: "2", title: "Is it vegan?", content: "Yes!" }]} />
+        <FaqDouble title="FAQ" description="Common questions" faqsAnimation="slide-up" textboxLayout="default" useInvertedBackground={false} faqs={[{ id: "1", title: "How to book?", content: "Call us!" }, { id: "2", title: "Is it vegan?", content: "Yes!" }]} />
       </div>
       <div id="find-rockys" data-section="find-rockys">
-        <ContactCTA tag="Contact" title="Visit Us" description="Join us for a meal." buttons={[{ text: "Book Now" }]} />
+        <ContactCTA tag="Contact" title="Visit Us" description="Join us for a meal." buttons={[{ text: "Book Now" }]} background={{ variant: "plain" }} useInvertedBackground={false} />
       </div>
       <div id="footer" data-section="footer">
-        <FooterMedia logoText="Rocky's" columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]} />
+        <FooterMedia logoText="Rocky's" videoSrc="https://www.w3schools.com/html/mov_bbb.mp4" columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]} />
       </div>
     </ThemeProvider>
   );