Update src/app/pricing/page.tsx

src/app/pricing/page.tsx

@@ -8,23 +8,31 @@ import ReactLenis from "lenis/react";
 
 export default function PricingPage() {
   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">
       <ReactLenis root>
-        <NavbarLayoutFloatingOverlay
-            navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Services", id: "/#features" }, { name: "Projects", id: "/portfolio" }, { name: "Quote", id: "/pricing" }, { name: "Contact", id: "/#contact" }]}
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Services", id: "/services" }, { name: "Projects", id: "/portfolio" }, { name: "Quote", id: "/pricing" }, { name: "Contact", id: "/#contact" }]}
             brandName="DC Contracting"
-        />
-        <PricingCardEight
+          />
+        </div>
+        <div id="pricing" data-section="pricing">
+          <PricingCardEight
             title="Request a Quote"
             description="Get an estimate for your construction needs today."
             plans={[{ id: "basic", badge: "Residential", price: "Contact Us", subtitle: "Standard quote", buttons: [{ text: "Book Now" }], features: ["Site visit", "Planning", "Quote delivery"] }]}
             animationType="slide-up"
             useInvertedBackground={false}
-        />
-        <FooterMedia
+            textboxLayout="default"
+          />
+        </div>
+        <div id="footer" data-section="footer">
+          <FooterMedia
             logoText="DC Contracting"
+            videoSrc="https://videos.pexels.com/video-files/4253133/4253133-sd_506_960_24fps.mp4"
             columns={[{ title: "Company", items: [{ label: "About", href: "/about" }, { label: "Portfolio", href: "/portfolio" }] }, { title: "Support", items: [{ label: "Quote", href: "/pricing" }, { label: "Contact", href: "/#contact" }] }]}
-        />
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );