src/app/page.tsx

@@ -6,7 +6,7 @@ import AboutMetric from '@/components/sections/about/AboutMetric';
 import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FaqDouble from '@/components/sections/faq/FaqDouble';
 import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
-import FooterSimple from '@/components/sections/footer/FooterSimple';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
 import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import ProductCardThree from '@/components/sections/product/ProductCardThree';
@@ -16,16 +16,16 @@ import { Award, CheckCircle, Star } from "lucide-react";
 export default function LandingPage() {
   return (
     <ThemeProvider
-        defaultButtonVariant="directional-hover"
-        defaultTextAnimation="entrance-slide"
-        borderRadius="pill"
-        contentWidth="mediumSmall"
-        sizing="large"
-        background="circleGradient"
-        cardStyle="gradient-radial"
-        primaryButtonStyle="radial-glow"
-        secondaryButtonStyle="radial-glow"
-        headingFontWeight="extrabold"
+        defaultButtonVariant="elastic-effect"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="soft"
+        contentWidth="medium"
+        sizing="largeSizeMediumTitles"
+        background="aurora"
+        cardStyle="glass-elevated"
+        primaryButtonStyle="primary-glow"
+        secondaryButtonStyle="glass"
+        headingFontWeight="semibold"
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
@@ -64,7 +64,7 @@ export default function LandingPage() {
         { icon: CheckCircle, label: "Projects Completed", value: "500+" },
       ]}
       metricsAnimation="slide-up"
-      useInvertedBackground={false}
+      useInvertedBackground={true}
     />
   </div>
 
@@ -87,7 +87,7 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="default"
       gridVariant="bento-grid"
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       products={[
         { id: "g1", name: "Modern Roof Build", price: "Portfolio", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-beautiful-wooden-house-with-new-roof_23-2149343703.jpg" },
         { id: "g2", name: "Shingle Restoration", price: "Portfolio", imageSrc: "http://img.b2bpic.net/free-photo/old-rural-house-with-wild-grape-covering-part-yard_1268-15653.jpg" },
@@ -116,7 +116,7 @@ export default function LandingPage() {
   <div id="faq" data-section="faq">
       <FaqDouble
       textboxLayout="default"
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       faqs={[{ id: "q1", title: "How long does a project take?", content: "Typically 1-3 days depending on complexity." }]}
       title="Frequently Asked Questions"
       description="Answers to your common project questions."
@@ -135,13 +135,21 @@ export default function LandingPage() {
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterSimple
+      <FooterMedia
+      logoText="Hemlock Roofing"
       columns={[{ title: "Company", items: [{ label: "About Us", href: "#about" }] }, { title: "Support", items: [{ label: "Contact", href: "#contact" }] }]}
-      bottomLeftText="© 2024 Hemlock Roofing."
-      bottomRightText="All rights reserved."
+      copyrightText="© 2025 Hemlock Roofing. All rights reserved."
+      imageSrc="http://img.b2bpic.net/free-photo/close-up-professional-roofer-holding-hammer_23-2149343657.jpg"
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
+}"
+    }
+  ],
+  "theme": {
+    "--background": "#010912",    "--card": "#152840",    "--foreground": "#e6f0ff",    "--primary-cta": "#cee7ff",    "--secondary-cta": "#0e1a29",    "--accent": "#3f5c79",    "--background-accent": "#004a93"
+  },
+  "rawPlan": "I've elevated the website's design with a refined, luxury-focused aesthetic. The new theme uses a deep, premium blue palette, improved spacing, and glass-like card styling for a more sophisticated look. I've also redesigned the footer to include branded visual imagery and clearer links for a more cohesive professional presence."
 }