Update src/app/contact/page.tsx

Merge version_6 into main

src/app/contact/page.tsx

@@ -2,17 +2,14 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
-import HeroBillboard from "@/components/sections/hero/HeroBillboard";
-import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
-import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
-import ProductCardFour from "@/components/sections/product/ProductCardFour";
-import PricingCardThree from "@/components/sections/pricing/PricingCardThree";
-import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
-import TestimonialCardTwo from "@/components/sections/testimonial/TestimonialCardTwo";
-import ContactSplit from "@/components/sections/contact/ContactSplit";
-import FooterBase from "@/components/sections/footer/FooterBase";
-import FooterCard from "@/components/sections/footer/FooterCard";
-import { Phone, Mail, MapPin, Sparkles } from "lucide-react";
+import HeroOverlay from "@/components/sections/hero/HeroOverlay";
+import SplitAbout from "@/components/sections/about/SplitAbout";
+import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
+import FeatureCardTwentyThree from "@/components/sections/feature/FeatureCardTwentyThree";
+import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
+import ContactCTA from "@/components/sections/contact/ContactCTA";
+import FooterMedia from "@/components/sections/footer/FooterMedia";
+import { Linkedin, Twitter, Mail, CheckCircle, Zap, Shield } from "lucide-react";
 
 export default function ContactPage() {
   return (
@@ -33,9 +30,10 @@ export default function ContactPage() {
           brandName="OW HomeShield Inc."
           navItems={[
             { name: "Home", id: "/" },
-            { name: "Contact", id: "/contact" },
-            { name: "About", id: "#about" },
-            { name: "Pricing", id: "#pricing" }
+            { name: "Membership Plans", id: "pricing" },
+            { name: "Why Choose Us", id: "benefits" },
+            { name: "How It Works", id: "how-it-works" },
+            { name: "Contact", id: "final-cta" }
           ]}
           button={{
             text: "Call Now: 226-224-3573",            href: "tel:226-224-3573"
@@ -44,211 +42,164 @@ export default function ContactPage() {
       </div>
 
       <div id="hero" data-section="hero">
-        <HeroBillboard
+        <HeroOverlay
           title="Get in Touch with OW HomeShield"
-          description="Have questions about our membership plans or need immediate service? We're here to help. Contact our team today."
+          description="Have questions about our membership plans or need immediate assistance? We're here to help."
           tag="Contact Us"
           tagAnimation="slide-up"
-          background={{ variant: "plain" }}
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkUVlKQx6CGDwb0ad68ywE0VM3/uploaded-1773157790240-ol9uxz1g.jpg"
+          imageAlt="Contact our team"
+          showBlur={true}
+          showDimOverlay={false}
           buttons={[
             { text: "Call Now", href: "tel:226-224-3573" },
             { text: "Email Us", href: "mailto:info@owhomeshield.com" }
           ]}
           buttonAnimation="slide-up"
-          imageSrc="http://img.b2bpic.net/free-photo/high-angle-young-man-taking-break_23-2148384545.jpg"
-          imageAlt="Contact support team"
         />
       </div>
 
-      <div id="about" data-section="about">
-        <TextSplitAbout
-          title="Why Contact OW HomeShield?"
-          description="Our dedicated team is ready to assist you with any questions about our services, membership plans, or to schedule urgent repairs. We pride ourselves on fast response times and professional service."
-          imageSrc="http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-home_23-2149412549.jpg"
-          imageAlt="Happy homeowner"
-          features={[
-            { title: "Fast Response", description: "Get assistance within hours", videoSrc: "" },
-            { title: "Expert Team", description: "Licensed and certified professionals", videoSrc: "" },
-            { title: "24/7 Available", description: "Emergency support anytime", videoSrc: "" }
-          ]}
-          animationType="blur-reveal"
-          useInvertedBackground={false}
-        />
-      </div>
-
-      <div id="features" data-section="features">
-        <FeatureCardOne
-          title="Our Service Offerings"
-          description="Comprehensive home maintenance and repair services designed for your needs"
-          animationType="slide-up"
+      <div id="benefits" data-section="benefits">
+        <SplitAbout
+          title="Why Choose OW HomeShield?"
+          description="We pride ourselves on delivering exceptional service across all areas"
           textboxLayout="default"
           useInvertedBackground={false}
-          features={[
+          imagePosition="right"
+          mediaAnimation="blur-reveal"
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkUVlKQx6CGDwb0ad68ywE0VM3/uploaded-1773157790240-ol9uxz1g.jpg"
+          imageAlt="Why choose us"
+          bulletPoints={[
             {
-              title: "Emergency Repairs",              description: "24/7 emergency service for urgent home repairs"
+              title: "Expert Technicians",              description: "Licensed and insured professionals with years of experience",              icon: Shield
             },
             {
-              title: "Consultation",              description: "Free consultation to assess your home maintenance needs"
+              title: "Fast Response",              description: "Quick turnaround times for all service requests",              icon: Zap
             },
             {
-              title: "Local Service",              description: "Serving your community with professional local technicians"
-            }
-          ]}
-        />
-      </div>
-
-      <div id="products" data-section="products">
-        <ProductCardFour
-          title="Featured Services"
-          description="Explore our most popular home maintenance and repair services"
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          gridVariant="four-items-2x2-equal-grid"
-          products={[
-            {
-              id: "1",              name: "Plumbing Repairs",              description: "Expert plumbing solutions",              imageSrc: "http://img.b2bpic.net/free-vector/protect-against-cyber-attacks-infographic_23-2148534111.jpg",              imageAlt: "Plumbing service",              price: "$99",              variant: "standard"
-            },
-            {
-              id: "2",              name: "Electrical Work",              description: "Safe electrical installations",              imageSrc: "http://img.b2bpic.net/free-vector/flat-labor-day-labels-collection_23-2149037530.jpg",              imageAlt: "Electrical service",              price: "$129",              variant: "standard"
-            },
-            {
-              id: "3",              name: "Home Inspections",              description: "Thorough home assessments",              imageSrc: "http://img.b2bpic.net/free-vector/bank-service-concept-labels-template_23-2150487023.jpg",              imageAlt: "Home inspection",              price: "$149",              variant: "standard"
-            },
-            {
-              id: "4",              name: "Preventative Maintenance",              description: "Regular maintenance plans",              imageSrc: "http://img.b2bpic.net/free-photo/cheerful-pretty-businesswoman-near-business-plan-showing-it_171337-8559.jpg",              imageAlt: "Maintenance service",              price: "$79",              variant: "standard"
+              title: "Satisfaction Guaranteed",              description: "We stand behind our work with quality assurance",              icon: CheckCircle
             }
           ]}
         />
       </div>
 
       <div id="pricing" data-section="pricing">
-        <PricingCardThree
-          title="Membership Pricing"
+        <PricingCardEight
+          title="Our Membership Plans"
           description="Choose the perfect plan for your home protection needs"
           animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
           plans={[
             {
-              id: "silver",              name: "Basic plan",              badge: "Basic",              price: "$44/mo",              buttons: [
-                { text: "Get Started", href: "tel:226-224-3573" },
-                { text: "Learn More", href: "#" }
-              ],
-              features: ["1 service visit/month", "Minor repairs", "10% discount"]
+              id: "basic",              badge: "Basic",              price: "$44/month",              subtitle: "Essential coverage",              buttons: [{ text: "Choose Plan", href: "tel:226-224-3573" }],
+              features: ["1 service visit per month", "10% renovation discount", "Email support"]
             },
             {
-              id: "gold",              name: "Business plan",              badge: "Popular",              badgeIcon: Sparkles,
-              price: "$59/mo",              buttons: [
-                { text: "Get Started", href: "tel:226-224-3573" },
-                { text: "Learn More", href: "#" }
-              ],
-              features: ["2 service visits/month", "Priority booking", "15% discount"]
+              id: "standard",              badge: "Most Popular",              price: "$59/month",              subtitle: "Popular choice",              buttons: [{ text: "Choose Plan", href: "tel:226-224-3573" }],
+              features: ["2 service visits per month", "15% renovation discount", "Priority booking", "Phone support"]
             },
             {
-              id: "platinum",              name: "Premium plan",              badge: "Premium",              price: "$84/mo",              buttons: [
-                { text: "Get Started", href: "tel:226-224-3573" },
-                { text: "Learn More", href: "#" }
-              ],
-              features: ["Unlimited visits", "24/7 support", "20% discount"]
+              id: "premium",              badge: "Premium",              price: "$84/month",              subtitle: "Full coverage",              buttons: [{ text: "Choose Plan", href: "tel:226-224-3573" }],
+              features: ["Unlimited service requests", "24/7 emergency support", "Priority scheduling", "Dedicated account manager"]
             }
           ]}
         />
       </div>
 
-      <div id="pricing2" data-section="pricing2">
-        <PricingCardTwo
-          title="Additional Services"
-          description="Specialized services available for your home"
+      <div id="how-it-works" data-section="how-it-works">
+        <FeatureCardTwentyThree
+          title="How Our Service Works"
+          description="Simple steps to get your home protected"
           animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
-          plans={[
+          features={[
             {
-              id: "annual",              price: "$299/year",              subtitle: "Annual Check-up",              badge: "Value",              buttons: [
-                { text: "Book Now", href: "tel:226-224-3573" }
-              ],
-              features: ["Full system check", "Detailed report", "Recommendations"]
+              id: "1",              title: "Choose Your Plan",              tags: ["Step 1"],
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkUVlKQx6CGDwb0ad68ywE0VM3/uploaded-1773157790240-ol9uxz1g.jpg",              imageAlt: "Choose your plan"
             },
             {
-              id: "emergency",              price: "$149",              subtitle: "Emergency Service",              badge: "Priority",              buttons: [
-                { text: "Call Now", href: "tel:226-224-3573" }
-              ],
-              features: ["24/7 availability", "Fast response", "Professional service"]
+              id: "2",              title: "Sign Up Online",              tags: ["Step 2"],
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkUVlKQx6CGDwb0ad68ywE0VM3/uploaded-1773157790240-ol9uxz1g.jpg",              imageAlt: "Sign up online"
+            },
+            {
+              id: "3",              title: "Get Immediate Service",              tags: ["Step 3"],
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkUVlKQx6CGDwb0ad68ywE0VM3/uploaded-1773157790240-ol9uxz1g.jpg",              imageAlt: "Get immediate service"
             }
           ]}
         />
       </div>
 
-      <div id="testimonials" data-section="testimonials">
-        <TestimonialCardTwo
-          title="What Our Clients Say"
-          description="Real feedback from satisfied homeowners"
-          animationType="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
+      <div id="trust" data-section="trust">
+        <TestimonialCardTwelve
           testimonials={[
             {
-              id: "1",              name: "Sarah Johnson",              role: "Homeowner",              testimonial: "OW HomeShield has been incredible. Their team is professional, reliable, and always responsive to our needs.",              imageSrc: "http://img.b2bpic.net/free-photo/cheerful-excited-businesswoman-blue-blouse-showing-thumb-up_1262-14826.jpg",              imageAlt: "Sarah Johnson"
+              id: "1",              name: "John Smith",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkUVlKQx6CGDwb0ad68ywE0VM3/uploaded-1773157790240-ol9uxz1g.jpg",              imageAlt: "John Smith"
             },
             {
-              id: "2",              name: "Michael Chen",              role: "Property Manager",              testimonial: "We trust OW HomeShield to maintain our properties. Their attention to detail and quick response times are unmatched.",              imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1644.jpg",              imageAlt: "Michael Chen"
+              id: "2",              name: "Sarah Johnson",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkUVlKQx6CGDwb0ad68ywE0VM3/uploaded-1773157790240-ol9uxz1g.jpg",              imageAlt: "Sarah Johnson"
+            },
+            {
+              id: "3",              name: "Mike Davis",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkUVlKQx6CGDwb0ad68ywE0VM3/uploaded-1773157790240-ol9uxz1g.jpg",              imageAlt: "Mike Davis"
+            },
+            {
+              id: "4",              name: "Emily Chen",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkUVlKQx6CGDwb0ad68ywE0VM3/uploaded-1773157790240-ol9uxz1g.jpg",              imageAlt: "Emily Chen"
             }
           ]}
+          cardTitle="Over 500+ satisfied customers trust us to keep their homes protected"
+          cardTag="Customer Testimonials"
+          cardAnimation="slide-up"
+          useInvertedBackground={false}
         />
       </div>
 
-      <div id="contact-form" data-section="contact-form">
-        <ContactSplit
-          tag="Contact Us"
-          title="Contact Our Team"
-          description="Fill out the form below and we'll get back to you as soon as possible. For emergencies, please call us directly."
+      <div id="final-cta" data-section="final-cta">
+        <ContactCTA
+          tag="Ready to Get Started?"
+          title="Join OW HomeShield Today"
+          description="Experience the peace of mind that comes with reliable home maintenance and emergency support available 24/7."
+          buttons={[
+            { text: "Start Free Trial", href: "tel:226-224-3573" },
+            { text: "Call Us Now", href: "tel:226-224-3573" }
+          ]}
+          buttonAnimation="slide-up"
           background={{ variant: "plain" }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-home_23-2149412549.jpg"
-          imageAlt="Contact our team"
-          inputPlaceholder="Your email address"
-          buttonText="Send Message"
-          termsText="We'll respond within 24 hours. For emergencies, call 226-224-3573."
-          mediaAnimation="slide-up"
-          onSubmit={(email) => console.log('Contact form submitted:', email)}
         />
       </div>
 
       <div id="footer" data-section="footer">
-        <FooterBase
+        <FooterMedia
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkUVlKQx6CGDwb0ad68ywE0VM3/uploaded-1773157790240-ol9uxz1g.jpg"
+          imageAlt="OW HomeShield"
+          logoText="OW HomeShield Inc."
           copyrightText="© 2025 OW HomeShield Inc. All rights reserved."
           columns={[
             {
               title: "Company",              items: [
                 { label: "Home", href: "/" },
-                { label: "Contact", href: "/contact" },
-                { label: "About", href: "#about" }
+                { label: "About", href: "#benefits" },
+                { label: "Contact", href: "#final-cta" }
               ]
             },
             {
               title: "Services",              items: [
-                { label: "Repairs", href: "#services" },
-                { label: "Maintenance", href: "#services" },
-                { label: "Inspections", href: "#services" }
+                { label: "Membership Plans", href: "#pricing" },
+                { label: "How It Works", href: "#how-it-works" },
+                { label: "Emergency Support", href: "tel:226-224-3573" }
               ]
             },
             {
-              title: "Support",              items: [
-                { label: "Emergency", href: "tel:226-224-3573" },
-                { label: "FAQ", href: "#faq" },
-                { label: "Contact", href: "#contact" }
+              title: "Contact",              items: [
+                { label: "Call: 226-224-3573", href: "tel:226-224-3573" },
+                { label: "Email: info@owhomeshield.com", href: "mailto:info@owhomeshield.com" },
+                { label: "Available 24/7", href: "#" }
               ]
             }
           ]}
         />
       </div>
-
-      <div id="footer-simple" data-section="footer-simple">
-        <FooterCard
-          copyrightText="© 2025 OW HomeShield Inc. All rights reserved."
-        />
-      </div>
     </ThemeProvider>
   );
-}
+}

src/app/dashboard/page.tsx

@@ -0,0 +1,84 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import ContactText from "@/components/sections/contact/ContactText";
+import FooterBase from "@/components/sections/footer/FooterBase";
+
+export default function DashboardPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="mediumLarge"
+      background="circleGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingInline
+          brandName="OW HomeShield"
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Services", id: "services" },
+            { name: "Pricing", id: "pricing" },
+            { name: "About", id: "about" }
+          ]}
+          button={{
+            text: "Get Started",            href: "tel:226-224-3573"
+          }}
+          animateOnLoad={true}
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactText
+          text="Access your member dashboard to manage your home maintenance requests, view service history, and update your membership preferences."
+          animationType="entrance-slide"
+          buttons={[
+            { text: "Go to Dashboard", href: "#" },
+            { text: "Need Help?", href: "tel:226-224-3573" }
+          ]}
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterBase
+          logoText="OW HomeShield"
+          columns={[
+            {
+              title: "Services",              items: [
+                { label: "Plumbing", href: "services" },
+                { label: "HVAC", href: "services" },
+                { label: "Electrical", href: "services" },
+                { label: "General Repairs", href: "services" }
+              ]
+            },
+            {
+              title: "Company",              items: [
+                { label: "About Us", href: "about" },
+                { label: "Contact", href: "contact" },
+                { label: "Pricing", href: "pricing" },
+                { label: "Blog", href: "#" }
+              ]
+            },
+            {
+              title: "Support",              items: [
+                { label: "Emergency", href: "tel:226-224-3573" },
+                { label: "FAQ", href: "#" },
+                { label: "Terms", href: "#" },
+                { label: "Privacy", href: "#" }
+              ]
+            }
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/membership/page.tsx

@@ -0,0 +1,130 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import PricingCardThree from "@/components/sections/pricing/PricingCardThree";
+import ContactText from "@/components/sections/contact/ContactText";
+import FooterBase from "@/components/sections/footer/FooterBase";
+import { Sparkles, Package } from "lucide-react";
+
+export default function MembershipPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="mediumLarge"
+      background="circleGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingInline
+          brandName="OW HomeShield"
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Services", id: "services" },
+            { name: "Pricing", id: "pricing" },
+            { name: "About", id: "about" }
+          ]}
+          button={{
+            text: "Get Started",            href: "tel:226-224-3573"
+          }}
+          animateOnLoad={true}
+        />
+      </div>
+
+      <div id="pricing" data-section="pricing">
+        <PricingCardThree
+          title="Membership Plans"
+          description="Choose the perfect plan for your home protection needs"
+          tag="Pricing"
+          tagIcon={Package}
+          plans={[
+            {
+              id: "basic",              price: "$44/month",              name: "Basic Plan",              buttons: [
+                { text: "Get Started", href: "tel:226-224-3573" },
+                { text: "Learn More", href: "#" }
+              ],
+              features: [
+                "1 service visit per month",                "10% renovation discount",                "Email support",                "Basic emergency response"
+              ]
+            },
+            {
+              id: "standard",              badge: "Most Popular",              badgeIcon: Sparkles,
+              price: "$59/month",              name: "Standard Plan",              buttons: [
+                { text: "Get Started", href: "tel:226-224-3573" },
+                { text: "Learn More", href: "#" }
+              ],
+              features: [
+                "2 service visits per month",                "15% renovation discount",                "Priority booking",                "Phone & email support",                "24/7 emergency support"
+              ]
+            },
+            {
+              id: "premium",              price: "$84/month",              name: "Premium Plan",              buttons: [
+                { text: "Get Started", href: "tel:226-224-3573" },
+                { text: "Learn More", href: "#" }
+              ],
+              features: [
+                "Unlimited service requests",                "20% renovation discount",                "Premium scheduling",                "Priority phone support",                "24/7 emergency coverage",                "Annual home inspection"
+              ]
+            }
+          ]}
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          tagAnimation="slide-up"
+          buttonAnimation="slide-up"
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactText
+          text="Ready to join OW HomeShield and protect your home? Select a membership plan that works best for you and start receiving expert care today."
+          animationType="entrance-slide"
+          buttons={[
+            { text: "Start Your Membership", href: "tel:226-224-3573" },
+            { text: "Contact Us", href: "tel:226-224-3573" }
+          ]}
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterBase
+          logoText="OW HomeShield"
+          columns={[
+            {
+              title: "Services",              items: [
+                { label: "Plumbing", href: "services" },
+                { label: "HVAC", href: "services" },
+                { label: "Electrical", href: "services" },
+                { label: "General Repairs", href: "services" }
+              ]
+            },
+            {
+              title: "Company",              items: [
+                { label: "About Us", href: "about" },
+                { label: "Contact", href: "contact" },
+                { label: "Pricing", href: "pricing" },
+                { label: "Blog", href: "#" }
+              ]
+            },
+            {
+              title: "Support",              items: [
+                { label: "Emergency", href: "tel:226-224-3573" },
+                { label: "FAQ", href: "#" },
+                { label: "Terms", href: "#" },
+                { label: "Privacy", href: "#" }
+              ]
+            }
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -1,92 +1,109 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
-import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
-import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";
+import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
+import HeroBillboardTestimonial from "@/components/sections/hero/HeroBillboardTestimonial";
+import AboutMetric from "@/components/sections/about/AboutMetric";
+import FeatureCardTwentyFour from "@/components/sections/feature/FeatureCardTwentyFour";
 import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
+import TeamCardOne from "@/components/sections/team/TeamCardOne";
 import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
-import ContactCTA from "@/components/sections/contact/ContactCTA";
-import FooterCard from "@/components/sections/footer/FooterCard";
-import { Crown, Home, Sparkles } from "lucide-react";
+import ContactCenter from "@/components/sections/contact/ContactCenter";
+import FooterSimple from "@/components/sections/footer/FooterSimple";
+import { TrendingUp, ShoppingCart, Users, Globe } from "lucide-react";
 
-export default function LandingPage() {
+export default function HomePage() {
   return (
     <ThemeProvider
-      defaultButtonVariant="hover-bubble"
+      defaultButtonVariant="hover-magnetic"
       defaultTextAnimation="entrance-slide"
-      borderRadius="rounded"
-      contentWidth="small"
+      borderRadius="soft"
+      contentWidth="mediumLarge"
       sizing="largeSmallSizeLargeTitles"
-      background="circleGradient"
-      cardStyle="inset"
-      primaryButtonStyle="radial-glow"
-      secondaryButtonStyle="layered"
-      headingFontWeight="medium"
+      background="aurora"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
     >
       <div id="nav" data-section="nav">
-        <NavbarLayoutFloatingOverlay
-          brandName="OW HomeShield Inc."
+        <NavbarStyleCentered
+          brandName="Webuild"
           navItems={[
             { name: "Home", id: "/" },
-            { name: "Membership Plans", id: "#pricing" },
-            { name: "Request Service", id: "#request-service" },
             { name: "About", id: "#about" },
-            { name: "Contact", id: "/contact" }
+            { name: "Features", id: "#features" },
+            { name: "Pricing", id: "#pricing" },
+            { name: "Contact", id: "#contact" }
           ]}
           button={{
-            text: "Call Now: 226-224-3573",            href: "tel:226-224-3573"
+            text: "Get Started",            href: "contact"
           }}
         />
       </div>
 
       <div id="hero" data-section="hero">
-        <HeroSplitKpi
-          title="Protect Your Home with Reliable Monthly Maintenance"
-          description="Repairs • Inspections • Preventative Maintenance"
-          tag="Emergency Service Available"
+        <HeroBillboardTestimonial
+          title="Build Modern Web Experiences"
+          description="Create stunning, responsive websites with our comprehensive component library and modern design system."
+          tag="New Release"
           tagAnimation="slide-up"
-          background={{ variant: "plain" }}
-          kpis={[
-            { value: "24/7", label: "Emergency Support" },
-            { value: "Licensed", label: "Certified Technicians" },
-            { value: "Local", label: "Service Team" }
+          background={{ variant: "glowing-orb" }}
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AkUVlKQx6CGDwb0ad68ywE0VM3/uploaded-1773157790240-ol9uxz1g.jpg"
+          imageAlt="Webuild platform showcase"
+          mediaAnimation="slide-up"
+          testimonials={[
+            {
+              name: "Sarah Johnson",              handle: "CEO, TechCorp",              testimonial: "This platform transformed how we build web experiences. Incredibly intuitive and powerful.",              rating: 5,
+              imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=100&h=100&fit=crop"
+            },
+            {
+              name: "Michael Chen",              handle: "Product Designer, InnovateLabs",              testimonial: "The component library saved us months of development time. Highly recommended!",              rating: 5,
+              imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100&h=100&fit=crop"
+            }
           ]}
-          enableKpiAnimation={true}
+          testimonialRotationInterval={5000}
           buttons={[
-            { text: "NEW CLIENT – JOIN MEMBERSHIP", href: "#membership-signup" },
-            { text: "EXISTING MEMBER – REQUEST SERVICE", href: "#member-request" }
+            { text: "Get Started", href: "contact" },
+            { text: "Learn More", href: "#features" }
           ]}
-          mediaAnimation="blur-reveal"
           buttonAnimation="slide-up"
-          imageSrc="http://img.b2bpic.net/free-photo/high-angle-young-man-taking-break_23-2148384545.jpg"
-          imageAlt="Professional home maintenance service"
         />
       </div>
 
-      <div id="benefits" data-section="benefits">
-        <FeatureCardSeven
-          title="Affordable Home Maintenance Made Easy"
-          description="Protect your investment with preventative care and expert repairs"
-          animationType="blur-reveal"
+      <div id="about" data-section="about">
+        <AboutMetric
+          title="Empowering developers to create amazing experiences with a comprehensive design system"
+          metrics={[
+            { icon: TrendingUp, label: "Performance", value: "99.9%" },
+            { icon: ShoppingCart, label: "Trusted Since", value: "2020" },
+            { icon: Users, label: "Active Users", value: "50K+" },
+            { icon: Globe, label: "Global Reach", value: "120+" }
+          ]}
+          metricsAnimation="slide-up"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="features" data-section="features">
+        <FeatureCardTwentyFour
+          title="Powerful Features"
+          description="Everything you need to build beautiful, scalable web applications"
+          animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
-          buttons={[
-            { text: "Start Your Membership", href: "#pricing" }
-          ]}
-          buttonAnimation="slide-up"
           features={[
             {
-              id: 1,
-              title: "Keep Your Home Protected",              description: "Regular inspections and preventative maintenance catch problems before they become expensive repairs. Our expert technicians identify and address issues early.",              imageSrc: "http://img.b2bpic.net/free-vector/protect-against-cyber-attacks-infographic_23-2148534111.jpg",              imageAlt: "Home protection"
+              id: "1",              title: "Component Library",              author: "By Webuild Team",              description: "Access 100+ pre-built, customizable components ready for production use.",              tags: ["Design", "Components"],
+              imageSrc: "https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=600&h=400&fit=crop"
             },
             {
-              id: 2,
-              title: "Skilled Technicians On-Demand",              description: "Fast and reliable repairs from experienced professionals. Our licensed and insured team handles everything from plumbing and electrical to doors, windows, and drywall.",              imageSrc: "http://img.b2bpic.net/free-vector/flat-labor-day-labels-collection_23-2149037530.jpg",              imageAlt: "Professional technicians"
+              id: "2",              title: "Design System",              author: "By Webuild Team",              description: "Consistent design tokens and guidelines for scalable applications.",              tags: ["Design", "System"],
+              imageSrc: "https://images.unsplash.com/photo-1561070791-2526d30994b5?w=600&h=400&fit=crop"
             },
             {
-              id: 3,
-              title: "Save Time & Money",              description: "Prevent costly breakdowns before they happen. Our membership plans offer incredible value with discounts on repairs and priority scheduling.",              imageSrc: "http://img.b2bpic.net/free-vector/bank-service-concept-labels-template_23-2150487023.jpg",              imageAlt: "Cost savings"
+              id: "3",              title: "Developer Tools",              author: "By Webuild Team",              description: "Powerful CLI tools and integrations to streamline your workflow.",              tags: ["Tools", "Development"],
+              imageSrc: "https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=600&h=400&fit=crop"
             }
           ]}
         />
@@ -94,108 +111,131 @@ export default function LandingPage() {
 
       <div id="pricing" data-section="pricing">
         <PricingCardOne
-          title="Choose Your Membership Plan"
-          description="Select the perfect plan to protect your home and save money on repairs"
+          title="Simple, Transparent Pricing"
+          description="Choose the perfect plan for your needs"
           animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
           plans={[
             {
-              id: "silver",              badge: "Basic Protection",              price: "$44/month",              subtitle: "Perfect for small homes",              features: [
-                "1 service visit per month",                "Minor plumbing and electrical repairs",                "Door adjustments and small fixes",                "10% renovation discount",                "+$95 one-time enrollment fee"
+              id: "starter",              badge: "Starter",              price: "$29/mo",              subtitle: "Perfect for individuals",              features: [
+                "Unlimited projects",                "20 component variations",                "Community support",                "Basic analytics"
               ]
             },
             {
-              id: "gold",              badge: "Most Popular",              badgeIcon: Sparkles,
-              price: "$59/month",              subtitle: "Enhanced coverage for growing needs",              features: [
-                "2 service visits per month",                "Priority booking",                "Annual preventative inspection",                "15% renovation discount",                "+$95 one-time enrollment fee"
+              id: "professional",              badge: "Most Popular",              badgeIcon: undefined,
+              price: "$79/mo",              subtitle: "For growing teams",              features: [
+                "Everything in Starter",                "100+ components",                "Priority email support",                "Advanced analytics",                "Team collaboration"
               ]
             },
             {
-              id: "platinum",              badge: "Advanced Protection",              price: "$84/month",              subtitle: "Comprehensive home care",              features: [
-                "Unlimited minor service requests",                "24/7 emergency phone support",                "Seasonal home checkups",                "Priority scheduling",                "+$95 one-time enrollment fee"
-              ]
-            },
-            {
-              id: "vip",              badge: "VIP Ultimate",              badgeIcon: Crown,
-              price: "$109/month",              subtitle: "Premium protection and support",              features: [
-                "Same-day priority scheduling",                "Dedicated account manager",                "29% renovation discount",                "Unlimited minor service visits",                "Annual full home inspection report",                "+$95 one-time enrollment fee"
+              id: "enterprise",              badge: "Enterprise",              price: "Custom",              subtitle: "For large organizations",              features: [
+                "Everything in Professional",                "Custom components",                "24/7 phone support",                "Dedicated account manager",                "On-premise deployment"
               ]
             }
           ]}
         />
       </div>
 
-      <div id="how-it-works" data-section="how-it-works">
-        <FeatureCardSeven
-          title="How OW HomeShield Works"
-          description="Simple steps to protect your home and get expert service"
-          animationType="slide-up"
+      <div id="team" data-section="team">
+        <TeamCardOne
+          title="Meet Our Team"
+          description="The talented people behind Webuild"
           textboxLayout="default"
+          gridVariant="four-items-2x2-equal-grid"
+          animationType="slide-up"
           useInvertedBackground={false}
-          features={[
+          members={[
             {
-              id: 1,
-              title: "Choose a Membership Plan",              description: "Select the perfect plan that matches your home maintenance needs. Compare features and benefits to find the right fit for your budget.",              imageSrc: "http://img.b2bpic.net/free-photo/cheerful-pretty-businesswoman-near-business-plan-showing-it_171337-8559.jpg",              imageAlt: "Step 1: Choose membership"
+              id: "1",              name: "Emily Watson",              role: "Creative Director",              imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=300&h=300&fit=crop"
             },
             {
-              id: 2,
-              title: "Schedule Your Inspection",              description: "Book an appointment with our team. We'll assess your home and create a customized maintenance plan based on your specific needs.",              imageSrc: "http://img.b2bpic.net/free-vector/appointment-booking-mobile-concept_23-2148570788.jpg",              imageAlt: "Step 2: Schedule inspection"
+              id: "2",              name: "James Rodriguez",              role: "Lead Developer",              imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=300&h=300&fit=crop"
             },
             {
-              id: 3,
-              title: "Receive Priority Maintenance & Repairs",              description: "Enjoy priority service from our licensed technicians. Get fast repairs, preventative maintenance, and peace of mind knowing your home is protected.",              imageSrc: "http://img.b2bpic.net/free-vector/labor-day-badges-collection_23-2147547884.jpg",              imageAlt: "Step 3: Priority service"
+              id: "3",              name: "Sophia Lee",              role: "UX Designer",              imageSrc: "https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=300&h=300&fit=crop"
+            },
+            {
+              id: "4",              name: "Marcus Johnson",              role: "Product Manager",              imageSrc: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=300&h=300&fit=crop"
             }
           ]}
         />
       </div>
 
-      <div id="trust" data-section="trust">
+      <div id="testimonial" data-section="testimonial">
         <TestimonialCardFifteen
-          testimonial="OW HomeShield has transformed how we maintain our home. The professional team is reliable, efficient, and truly cares about customer satisfaction. Highly recommended!"
+          testimonial="Webuild has completely revolutionized how we approach web development. The components are beautifully designed, well-documented, and save us incredible amounts of time. Our team productivity has increased by 40%."
           rating={5}
-          author="Local Homeowners Trust OW HomeShield"
-          ratingAnimation="blur-reveal"
-          avatarsAnimation="blur-reveal"
-          useInvertedBackground={false}
+          author="David Park, CTO at StartupHub"
           avatars={[
             {
-              src: "http://img.b2bpic.net/free-photo/cheerful-excited-businesswoman-blue-blouse-showing-thumb-up_1262-14826.jpg",              alt: "happy customer satisfied homeowner"
+              src: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=50&h=50&fit=crop",              alt: "David Park"
             },
             {
-              src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-home_23-2149412549.jpg",              alt: "professional business portrait"
+              src: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=50&h=50&fit=crop",              alt: "Team member"
             },
             {
-              src: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1644.jpg",              alt: "diverse customer testimonial photo"
-            },
-            {
-              src: "http://img.b2bpic.net/free-photo/young-blonde-woman-with-white-t-shirt_273609-7217.jpg",              alt: "customer review professional portrait"
+              src: "https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=50&h=50&fit=crop",              alt: "Team member"
             }
           ]}
+          ratingAnimation="slide-up"
+          avatarsAnimation="slide-up"
+          useInvertedBackground={false}
         />
       </div>
 
-      <div id="final-cta" data-section="final-cta">
-        <ContactCTA
-          tag="Ready to Protect Your Home?"
-          tagIcon={Home}
-          tagAnimation="slide-up"
-          title="Worry-Free Home Maintenance Starts Here"
-          description="Join thousands of homeowners who trust OW HomeShield for reliable maintenance and repairs. Contact us today to get started."
-          buttons={[
-            { text: "Join Membership", href: "#pricing" },
-            { text: "Book Free Consultation", href: "tel:226-224-3573" }
-          ]}
-          buttonAnimation="slide-up"
-          background={{ variant: "plain" }}
+      <div id="contact" data-section="contact">
+        <ContactCenter
+          tag="Newsletter"
+          title="Stay Updated with the Latest Features"
+          description="Subscribe to our newsletter to get exclusive updates, tips, and early access to new components."
+          background={{ variant: "rotated-rays-animated-grid" }}
           useInvertedBackground={false}
+          inputPlaceholder="Enter your email"
+          buttonText="Subscribe"
+          termsText="We respect your privacy. Unsubscribe at any time."
+          onSubmit={(email) => console.log("Subscribed:", email)}
         />
       </div>
 
       <div id="footer" data-section="footer">
-        <FooterCard
-          logoText="OW HomeShield Inc."
-          copyrightText="© 2025 OW HomeShield Inc. | Emergency Service Available 24/7"
+        <FooterSimple
+          columns={[
+            {
+              title: "Product",              items: [
+                { label: "Components", href: "#features" },
+                { label: "Pricing", href: "#pricing" },
+                { label: "Documentation", href: "#" },
+                { label: "Updates", href: "#" }
+              ]
+            },
+            {
+              title: "Company",              items: [
+                { label: "About", href: "#about" },
+                { label: "Team", href: "#team" },
+                { label: "Blog", href: "#" },
+                { label: "Careers", href: "#" }
+              ]
+            },
+            {
+              title: "Resources",              items: [
+                { label: "Support", href: "#contact" },
+                { label: "Community", href: "#" },
+                { label: "Status", href: "#" },
+                { label: "Contact", href: "#contact" }
+              ]
+            },
+            {
+              title: "Legal",              items: [
+                { label: "Privacy", href: "#" },
+                { label: "Terms", href: "#" },
+                { label: "License", href: "#" },
+                { label: "Cookie Policy", href: "#" }
+              ]
+            }
+          ]}
+          bottomLeftText="© 2025 Webuild. All rights reserved."
+          bottomRightText="Made with Webuild"
         />
       </div>
     </ThemeProvider>

src/app/service-request/page.tsx

@@ -0,0 +1,84 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import ContactText from "@/components/sections/contact/ContactText";
+import FooterBase from "@/components/sections/footer/FooterBase";
+
+export default function ServiceRequestPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="medium"
+      sizing="mediumLarge"
+      background="circleGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingInline
+          brandName="OW HomeShield"
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Services", id: "services" },
+            { name: "Pricing", id: "pricing" },
+            { name: "About", id: "about" }
+          ]}
+          button={{
+            text: "Get Started",            href: "tel:226-224-3573"
+          }}
+          animateOnLoad={true}
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactText
+          text="Request a service visit from our expert technicians. Whether it's an emergency or scheduled maintenance, we're here to help keep your home in perfect condition."
+          animationType="entrance-slide"
+          buttons={[
+            { text: "Request Service", href: "tel:226-224-3573" },
+            { text: "View Pricing", href: "pricing" }
+          ]}
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterBase
+          logoText="OW HomeShield"
+          columns={[
+            {
+              title: "Services",              items: [
+                { label: "Plumbing", href: "services" },
+                { label: "HVAC", href: "services" },
+                { label: "Electrical", href: "services" },
+                { label: "General Repairs", href: "services" }
+              ]
+            },
+            {
+              title: "Company",              items: [
+                { label: "About Us", href: "about" },
+                { label: "Contact", href: "contact" },
+                { label: "Pricing", href: "pricing" },
+                { label: "Blog", href: "#" }
+              ]
+            },
+            {
+              title: "Support",              items: [
+                { label: "Emergency", href: "tel:226-224-3573" },
+                { label: "FAQ", href: "#" },
+                { label: "Terms", href: "#" },
+                { label: "Privacy", href: "#" }
+              ]
+            }
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #ffffff;
-  --card: #f9f9f9;
-  --foreground: #000612e6;
-  --primary-cta: #106EFB;
+  --background: #f7f6f7;
+  --card: #ffffff;
+  --foreground: #1a1a1a;
+  --primary-cta: #0798ff;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #f9f9f9;
+  --secondary-cta: #ffffff;
   --secondary-cta-text: #000612e6;
-  --accent: #e2e2e2;
-  --background-accent: #106EFB;
+  --accent: #93c7ff;
+  --background-accent: #a8cde8;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);