diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index 3c00427..53748af 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -8,21 +8,22 @@ import FooterSimple from "@/components/sections/footer/FooterSimple";
 
 export default function ContactPage() {
   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">
       <ReactLenis root>
-        <NavbarStyleFullscreen
-            brandName="GreenScape"
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen
             navItems={[
-              { name: "Services", id: "/services" },
-              { name: "About", id: "/about" },
+              { name: "Home", id: "/" },
               { name: "Projects", id: "/projects" },
-              { name: "Testimonials", id: "/testimonials" },
-              { name: "Contact", id: "/contact" },
+              { name: "Contact", id: "/contact" }
             ]}
+            brandName="GreenScape"
             button={{ text: "Call Now", href: "/contact" }}
-        />
+          />
+        </div>
         
-        <ContactSplitForm
+        <div id="contact" data-section="contact">
+          <ContactSplitForm
             title="Contact Our Local Experts"
             description="Serving Los Angeles and surrounding areas. Get your professional landscaping estimate today."
             inputs={[
@@ -31,13 +32,17 @@ export default function ContactPage() {
               { name: "service", type: "text", placeholder: "Service Required" }
             ]}
             textarea={{ name: "message", placeholder: "How can we help with your landscape?" }}
-        />
+            useInvertedBackground={false}
+          />
+        </div>
 
-        <FooterSimple 
+        <div id="footer" data-section="footer">
+          <FooterSimple 
              columns={[]}
              bottomLeftText="© 2026 GreenScape Landscaping"
              bottomRightText="All rights reserved"
-        />
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
diff --git a/src/app/projects/page.tsx b/src/app/projects/page.tsx
index 09d32c1..8b314c0 100644
--- a/src/app/projects/page.tsx
+++ b/src/app/projects/page.tsx
@@ -8,38 +8,43 @@ import FooterSimple from "@/components/sections/footer/FooterSimple";
 
 export default function ProjectsPage() {
   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">
       <ReactLenis root>
-        <NavbarStyleFullscreen
-            brandName="GreenScape"
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen
             navItems={[
-              { name: "Services", id: "/services" },
-              { name: "About", id: "/about" },
+              { name: "Home", id: "/" },
               { name: "Projects", id: "/projects" },
-              { name: "Testimonials", id: "/testimonials" },
-              { name: "Contact", id: "/contact" },
+              { name: "Contact", id: "/contact" }
             ]}
+            brandName="GreenScape"
             button={{ text: "Call Now", href: "/contact" }}
-        />
+          />
+        </div>
         
-        <ProductCardOne 
+        <div id="projects" data-section="projects">
+          <ProductCardOne 
             title="Our Portfolio"
             description="Browse our recent projects and transformations."
             gridVariant="bento-grid"
             animationType="slide-up"
             textboxLayout="default"
+            useInvertedBackground={false}
             products={[
                 { id: "1", name: "Modern Garden Haven", price: "Completed", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/landscaping/img-2.jpg" },
                 { id: "2", name: "Luxury Stone Walkway", price: "Completed", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/landscaping/img-3.jpg" },
                 { id: "3", name: "Commercial Landscape Maintenance", price: "Completed", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/templates/landscaping/img-4.jpg" }
             ]}
-        />
+          />
+        </div>
 
-        <FooterSimple 
+        <div id="footer" data-section="footer">
+          <FooterSimple 
              columns={[]}
              bottomLeftText="© 2026 GreenScape Landscaping"
              bottomRightText="All rights reserved"
-        />
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );