Merge version_13_1782135884185 into main

Merge version_13_1782135884185 into main

index.html

@@ -7,9 +7,9 @@
     <link href="https://fonts.googleapis.com/css2?family=Geist:wght@100..900&family=Inter+Tight:ital,wght@0,100..900;1,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap" rel="stylesheet">
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>ColorPro Supplies | Premium Paint &amp; Professional Tools</title>
-      <meta property="og:title" content="ColorPro Supplies | Premium Paint &amp; Professional Tools" />
-      <meta name="twitter:title" content="ColorPro Supplies | Premium Paint &amp; Professional Tools" />
+    <title>Comet Paints &amp; Allied Products</title>
+      <meta property="og:title" content="Comet Paints &amp; Allied Products" />
+      <meta name="twitter:title" content="Comet Paints &amp; Allied Products" />
       <meta name="description" content="Your local source for premium paints, primers, and professional painting tools. Visit our showroom or order online today." />
       <meta property="og:description" content="Your local source for premium paints, primers, and professional painting tools. Visit our showroom or order online today." />
       <meta name="twitter:description" content="Your local source for premium paints, primers, and professional painting tools. Visit our showroom or order online today." />

src/components/Layout.tsx

@@ -8,67 +8,64 @@ import { StyleProvider } from "@/components/ui/StyleProvider";
 
 export default function Layout() {
   const navItems = [
-  {
-    "name": "Home",
-    "href": "#hero"
-  },
-  {
-    "name": "Products",
-    "href": "#products"
-  },
-  {
-    "name": "Contact",
-    "href": "#contact"
-  },
-  {
-    "name": "About",
-    "href": "#about"
-  },
-  {
-    "name": "Pricing",
-    "href": "#pricing"
-  },
-  {
-    "name": "Testimonials",
-    "href": "#testimonials"
-  },
-  {
-    "name": "Faq",
-    "href": "#faq"
-  }
-];
+    {
+      "name": "Home",
+      "href": "#hero"
+    },
+    {
+      "name": "Products",
+      "href": "#products"
+    },
+    {
+      "name": "Contact",
+      "href": "#contact"
+    },
+    {
+      "name": "About",
+      "href": "#about"
+    },
+    {
+      "name": "Pricing",
+      "href": "#pricing"
+    },
+    {
+      "name": "Faq",
+      "href": "#faq"
+    }
+  ];
 
   return (
     <StyleProvider buttonVariant="expand" siteBackground="noise" heroBackground="cornerGlow">
       <SiteBackgroundSlot />
       <SectionErrorBoundary name="navbar">
         <NavbarFloating
-      logo="ColorPro Supplies"
-      ctaButton={{
-        text: "Order Now",
-        href: "#contact",
-      }}
-     navItems={navItems} />
+          logo="Comet Paints and Allied Products"
+          ctaButton={{
+            text: "Order Now",
+            href: "#contact",
+          }}
+          navItems={navItems} 
+        />
       </SectionErrorBoundary>
       <main className="flex-grow">
         <Outlet />
       </main>
       <SectionErrorBoundary name="footer">
         <FooterMinimal
-      brand="ColorPro Supplies"
-      copyright="© 2024 ColorPro Supplies. All rights reserved."
-      socialLinks={[
-        {
-          icon: Instagram,
-          href: "#",
-        },
-        {
-          icon: Facebook,
-          href: "#",
-        },
-      ]}
-    />
+          brand="Comet Paints and Allied Products"
+          copyright="© 2006-2024 Comet Paints and Allied Products. All rights reserved."
+          socialLinks={[
+            {
+              icon: Instagram,
+              href: "#",
+            },
+            {
+              icon: Facebook,
+              href: "#",
+            },
+          ]}
+        />
       </SectionErrorBoundary>
     </StyleProvider>
   );
-}
+}

src/index.css

@@ -1,4 +1,4 @@
-@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;500;600;700&display=swap');
 @import "tailwindcss";
 @import "./styles/masks.css";
 @import "./styles/animations.css";
@@ -88,7 +88,7 @@
   --color-background-accent: var(--background-accent);
 
   /* Fonts */
-  --font-sans: 'Inter', sans-serif;
+  --font-sans: 'Lato', sans-serif;
   --font-tight: "Inter Tight", sans-serif;
   --font-mono: monospace;
 
@@ -137,7 +137,7 @@ body {
   margin: 0;
   background-color: var(--background);
   color: var(--foreground);
-  font-family: 'Inter', sans-serif;
+  font-family: 'Lato', sans-serif;
   position: relative;
   min-height: 100vh;
   overscroll-behavior: none;
@@ -150,7 +150,7 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: 'Inter', sans-serif;
+  font-family: 'Lato', sans-serif;
 }
 
 /* Default card/button styles. Template theme.css imports come after this file

src/pages/HomePage.tsx

@@ -1,264 +1,24 @@
-import AboutText from '@/components/sections/about/AboutText';
-import ContactCta from '@/components/sections/contact/ContactCta';
-import FaqSimple from '@/components/sections/faq/FaqSimple';
-import FeaturesRevealCardsBento from '@/components/sections/features/FeaturesRevealCardsBento';
-import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
-import PricingMediaCards from '@/components/sections/pricing/PricingMediaCards';
-import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
-import TestimonialOverlayCards from '@/components/sections/testimonial/TestimonialOverlayCards';
-import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+import React from 'react';
+import HeroSection from './HomePage/sections/Hero';
+import AboutSection from './HomePage/sections/About';
+import ProductsSection from './HomePage/sections/Products';
+import PricingSection from './HomePage/sections/Pricing';
+import FaqSection from './HomePage/sections/Faq';
+import SocialProofSection from './HomePage/sections/SocialProof';
+import ContactSection from './HomePage/sections/Contact';
+import GallerySection from './HomePage/sections/Gallery';
 
-export default function HomePage() {
+export default function HomePage(): React.JSX.Element {
   return (
     <>
-  <div id="hero" data-section="hero">
-    <SectionErrorBoundary name="hero">
-          <HeroBillboardCarousel
-      tag="Your Project, Our Paint"
-      title="Professional Quality Paint & Allied Supplies"
-      description="Transform your space with our premium selection of paints, primers, and essential professional tools."
-      primaryButton={{
-        text: "Browse Products",
-        href: "#products",
-      }}
-      secondaryButton={{
-        text: "Contact Us",
-        href: "#contact",
-      }}
-      items={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/colorful-metallic-paint-cans_23-2151934755.jpg",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/artists-using-paint-from-cans-with-brush_23-2148591278.jpg",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-worker-spraying-powder-paint-from-gun_23-2149878745.jpg",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-composition-paint-materials_23-2147989678.jpg",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-paint-can_23-2149705362.jpg",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/artistic-easel-canvas-studio_23-2148372231.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
-
-  <div id="about" data-section="about">
-    <SectionErrorBoundary name="about">
-          <AboutText
-      title="Since 1985, ColorPro has been serving the community with high-performance paint solutions and expert advice for every renovation project."
-    />
-    </SectionErrorBoundary>
-  </div>
-
-  <div id="products" data-section="products">
-    <SectionErrorBoundary name="products">
-          <FeaturesRevealCardsBento
-      tag="Our Catalog"
-      title="Comprehensive Paint Solutions"
-      description="Explore our curated range of paints, stains, and protective coatings."
-      items={[
-        {
-          title: "Interior Paints",
-          description: "High-durability latex and acrylic finishes.",
-          href: "#contact",
-          imageSrc: "http://img.b2bpic.net/free-photo/white-metallic-paint-can-indoors_23-2151934738.jpg",
-        },
-        {
-          title: "Exterior Paints",
-          description: "Weather-resistant, durable outdoor formulas.",
-          href: "#contact",
-          imageSrc: "http://img.b2bpic.net/free-photo/white-metallic-paint-can-indoors_23-2151934739.jpg",
-        },
-        {
-          title: "Wood Stains",
-          description: "Premium finishes for decks and furniture.",
-          href: "#contact",
-          imageSrc: "http://img.b2bpic.net/free-photo/tools-art-repairing-paint-top-view_185193-108873.jpg",
-        },
-        {
-          title: "Surface Primers",
-          description: "Professional adhesion for every surface.",
-          href: "#contact",
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-worker-pouring-paint_23-2149878807.jpg",
-        },
-        {
-          title: "Decorative Textures",
-          description: "Create unique interior feature walls.",
-          href: "#contact",
-          imageSrc: "http://img.b2bpic.net/free-photo/photo-wall-texture-pattern_58702-16141.jpg",
-        },
-        {
-          title: "Ceiling Solutions",
-          description: "Ultra-matte finishes for flawless ceilings.",
-          href: "#contact",
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-arrangement-with-roller-brush-paint-container_23-2148391846.jpg",
-        },
-        {
-          title: "Specialty Spray",
-          description: "Industrial grade aerosol applications.",
-          href: "#contact",
-          imageSrc: "http://img.b2bpic.net/free-photo/abstract-hard-metallic-background_23-2148744328.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
-
-  <div id="pricing" data-section="pricing">
-    <SectionErrorBoundary name="pricing">
-          <PricingMediaCards
-      tag="How to Order"
-      title="Ordering Simplified"
-      description="Choose the volume that suits your project needs."
-      plans={[
-        {
-          tag: "Project Starter",
-          price: "$120",
-          period: "Small Area",
-          features: [
-            "1-2 Interior Rooms",
-            "Basic Primers Included",
-            "Standard Brushes",
-          ],
-          primaryButton: {
-            text: "Contact for Order",
-            href: "#contact",
-          },
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-painting-wall_23-2149098984.jpg",
-        },
-        {
-          tag: "Contractor Pack",
-          price: "$850",
-          period: "Bulk Volume",
-          features: [
-            "Large Surface Coverage",
-            "Heavy Duty Primers",
-            "Professional Equipment Rental",
-          ],
-          primaryButton: {
-            text: "Contact for Bulk",
-            href: "#contact",
-          },
-          imageSrc: "http://img.b2bpic.net/free-photo/car-mechanic-painting-car-with-spray-gun_1303-28158.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
-
-  <div id="testimonials" data-section="testimonials">
-    <SectionErrorBoundary name="testimonials">
-          <TestimonialOverlayCards
-      tag="Happy Painters"
-      title="Client Success Stories"
-      description="Hear what our loyal community says about their renovations."
-      testimonials={[
-        {
-          name: "Elena Rodriguez",
-          role: "Architect",
-          company: "Urban Living",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/couple-having-fun-while-painting-walls_23-2147782322.jpg",
-        },
-        {
-          name: "David Wu",
-          role: "Site Manager",
-          company: "BuildRight",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-curly-brunette-dark-skinned-fashion-designer-poses-office-leans-table_197531-24106.jpg",
-        },
-        {
-          name: "Sarah Miller",
-          role: "Homeowner",
-          company: "DIY Projects",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/married-couple-singing-renovation-tools-dipped-blue-paint-cheerful-married-couple-home-makeover-home-decoration-renovation-cozy-apartment-flat-repair-makeover_482257-3631.jpg",
-        },
-        {
-          name: "Marcus Thorne",
-          role: "General Contractor",
-          company: "Prime Build",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/overweight-man-glasses-wearing-black-t-shirt-showing-paint-brush-with-smile-face-pink_141793-58551.jpg",
-        },
-        {
-          name: "Linda Chen",
-          role: "Interior Designer",
-          company: "Studio Lush",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-safety-helmet-giving-hand-shake_23-2148242884.jpg",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
-
-  <div id="faq" data-section="faq">
-    <SectionErrorBoundary name="faq">
-          <FaqSimple
-      tag="Common Questions"
-      title="Frequently Asked Questions"
-      description="Everything you need to know about our services."
-      items={[
-        {
-          question: "Where are you located?",
-          answer: "We are located at 123 Paint Street, Design District. Our shop is open Monday-Saturday from 8am to 6pm.",
-        },
-        {
-          question: "Do you offer delivery?",
-          answer: "Yes! We offer local delivery for all orders over $300 within a 20-mile radius.",
-        },
-        {
-          question: "Can I color match?",
-          answer: "Absolutely. Bring in any sample and our digital color matching service will match it perfectly.",
-        },
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
-
-  <div id="social-proof" data-section="social-proof">
-    <SectionErrorBoundary name="social-proof">
-          <SocialProofMarquee
-      tag="Trusted Brands"
-      title="Industry Partners"
-      description="We source the best quality materials from world-class manufacturers."
-      names={[
-        "Benjamin Moore",
-        "Sherwin-Williams",
-        "Behr",
-        "PPG",
-        "Valspar",
-        "Glidden",
-        "Kilz",
-      ]}
-    />
-    </SectionErrorBoundary>
-  </div>
-
-  <div id="contact" data-section="contact">
-    <SectionErrorBoundary name="contact">
-          <ContactCta
-      tag="Ready to Start?"
-      text="Get in touch for custom orders, quotes, or to visit our showroom located at 123 Paint Street."
-      primaryButton={{
-        text: "Contact Us Now",
-        href: "mailto:hello@colorpro.com",
-      }}
-      secondaryButton={{
-        text: "Call Shop",
-        href: "tel:+1234567890",
-      }}
-    />
-    </SectionErrorBoundary>
-  </div>
+      <HeroSection />
+      <AboutSection />
+      <ProductsSection />
+      <PricingSection />
+      <FaqSection />
+      <SocialProofSection />
+      <ContactSection />
+      <GallerySection />
     </>
   );
-}
+}

src/pages/HomePage/sections/About.tsx

@@ -0,0 +1,18 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "about" section.
+
+import React from 'react';
+import AboutText from '@/components/sections/about/AboutText';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function AboutSection(): React.JSX.Element {
+  return (
+    <div id="about" data-section="about">
+        <SectionErrorBoundary name="about">
+              <AboutText
+        title="Since 2006, Comet Paints and Allied Products has been serving the comunity with high-performance paint solutions and expert advice for every renovation project."
+      />
+        </SectionErrorBoundary>
+      </div>
+  );
+}

src/pages/HomePage/sections/Contact.tsx

@@ -0,0 +1,27 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "contact" section.
+
+import React from 'react';
+import ContactCta from '@/components/sections/contact/ContactCta';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function ContactSection(): React.JSX.Element {
+  return (
+    <div id="contact" data-section="contact">
+        <SectionErrorBoundary name="contact">
+              <ContactCta
+          tag="Ready to Start?"
+          text="Get in touch for custom orders, quotes, or to visit our showroom. ."
+          primaryButton={{
+            text: "Contact Us Now",
+            href: "mailto:hello@cometpaints.com",
+          }}
+          secondaryButton={{
+            text: "Call Shop",
+            href: "tel:+1234567890",
+          }}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}

src/pages/HomePage/sections/Faq.tsx

@@ -0,0 +1,34 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "faq" section.
+
+import React from 'react';
+import FaqSimple from '@/components/sections/faq/FaqSimple';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function FaqSection(): React.JSX.Element {
+  return (
+    <div id="faq" data-section="faq">
+        <SectionErrorBoundary name="faq">
+              <FaqSimple
+          tag="Common Questions"
+          title="Frequently Asked Questions"
+          description="Everything you need to know about our services."
+          items={[
+            {
+              question: "Where are you located?",
+              answer: "We are located at 123 Paint Street, Design District. Our shop is open Monday-Saturday from 8am to 6pm.",
+            },
+            {
+              question: "Do you offer delivery?",
+              answer: "Yes! We offer local delivery for all orders over $300 within a 20-mile radius.",
+            },
+            {
+              question: "Can I color match?",
+              answer: "Absolutely. Bring in any sample and our digital color matching service will match it perfectly.",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}

src/pages/HomePage/sections/Gallery.tsx

@@ -0,0 +1,83 @@
+import { motion } from "motion/react";
+import ScrollReveal from "@/components/ui/ScrollReveal";
+import TextAnimation from "@/components/ui/TextAnimation";
+import Tag from "@/components/ui/Tag";
+import ImageOrVideo from "@/components/ui/ImageOrVideo";
+
+export default function GallerySection() {
+  const projects = [
+    {
+      title: "Residential Painting",
+      description: "Exterior and interior painting for modern homes.",
+      imageSrc: "https://images.unsplash.com/photo-1589939705384-5185137a7f0f?auto=format&fit=crop&q=80&w=800",
+    },
+    {
+      title: "Commercial Spaces",
+      description: "Durable coatings for high-traffic commercial buildings.",
+      imageSrc: "https://images.unsplash.com/photo-1504307651254-35680f356dfd?auto=format&fit=crop&q=80&w=800",
+    },
+    {
+      title: "Industrial Projects",
+      description: "Specialized protective paints for industrial facilities.",
+      imageSrc: "https://images.unsplash.com/photo-1581092160562-40aa08e78837?auto=format&fit=crop&q=80&w=800",
+    },
+    {
+      title: "Interior Decor",
+      description: "Premium finishes for elegant interior spaces.",
+      imageSrc: "https://images.unsplash.com/photo-1562663474-6cbb3eaa4d14?auto=format&fit=crop&q=80&w=800",
+    },
+    {
+      title: "Exterior Facades",
+      description: "Weather-resistant paints for long-lasting exterior beauty.",
+      imageSrc: "https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&q=80&w=800",
+    },
+    {
+      title: "Custom Finishes",
+      description: "Unique textures and colors tailored to client needs.",
+      imageSrc: "https://images.unsplash.com/photo-1513694203232-719a280e022f?auto=format&fit=crop&q=80&w=800",
+    }
+  ];
+
+  return (
+    <section data-webild-section="gallery" id="gallery" className="relative w-full py-24 bg-background">
+      <div className="w-content-width mx-auto">
+        <div className="flex flex-col items-center text-center mb-16">
+          <ScrollReveal variant="fade">
+            <Tag text="Gallery" className="mb-4" />
+          </ScrollReveal>
+          <TextAnimation
+            text="Our Real-Life Projects"
+            variant="fade-blur"
+            tag="h2"
+            gradientText={false}
+            className="text-4xl md:text-5xl font-bold text-foreground mb-6"
+          />
+          <ScrollReveal variant="fade" delay={0.2}>
+            <p className="text-lg text-accent max-w-2xl mx-auto">
+              Take a look at some of the projects we've completed using Comet Paints and Allied Products.
+            </p>
+          </ScrollReveal>
+        </div>
+
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+          {projects.map((project, index) => (
+            <ScrollReveal variant="fade" key={index} delay={0.1 * index}>
+              <div className="card overflow-hidden group h-full flex flex-col">
+                <div className="relative aspect-[4/3] overflow-hidden">
+                  <ImageOrVideo
+                    imageSrc={project.imageSrc}
+                    className="w-full h-full object-cover transition-transform duration-500 group-hover:scale-105"
+                  />
+                </div>
+                <div className="p-6 flex-1 flex flex-col">
+                  <h3 className="text-xl font-semibold text-foreground mb-2">{project.title}</h3>
+                  <p className="text-accent">{project.description}</p>
+                </div>
+              </div>
+            </ScrollReveal>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}

src/pages/HomePage/sections/Hero.tsx

@@ -0,0 +1,48 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "hero" section.
+
+import React from 'react';
+import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function HeroSection(): React.JSX.Element {
+  return (
+    <div id="hero" data-section="hero">
+        <SectionErrorBoundary name="hero">
+              <HeroBillboardCarousel
+        tag="Your Project, Our Paint"
+        title="Comet Paints and Allied Products"
+        description="Transform your space with our premium selection of paints, primers, and essential professional tools."
+        primaryButton={{
+            text: "Browse Products",
+            href: "#products",
+          }}
+        secondaryButton={{
+            text: "Contact Us",
+            href: "#contact",
+          }}
+        items={[
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/colorful-metallic-paint-cans_23-2151934755.jpg",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/artists-using-paint-from-cans-with-brush_23-2148591278.jpg",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/side-view-worker-spraying-powder-paint-from-gun_23-2149878745.jpg",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/top-view-composition-paint-materials_23-2147989678.jpg",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/top-view-paint-can_23-2149705362.jpg",
+            },
+            {
+              imageSrc: "http://img.b2bpic.net/free-photo/artistic-easel-canvas-studio_23-2148372231.jpg",
+            },
+          ]}
+      />
+        </SectionErrorBoundary>
+      </div>
+  );
+}

src/pages/HomePage/sections/Pricing.tsx

@@ -0,0 +1,52 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "pricing" section.
+
+import React from 'react';
+import PricingMediaCards from '@/components/sections/pricing/PricingMediaCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function PricingSection(): React.JSX.Element {
+  return (
+    <div id="pricing" data-section="pricing">
+        <SectionErrorBoundary name="pricing">
+              <PricingMediaCards
+          tag="How to Order"
+          title="Ordering Simplified"
+          description="Choose the volume that suits your project needs."
+          plans={[
+            {
+              tag: "Project Starter",
+              price: "$120",
+              period: "Small Area",
+              features: [
+                "1-2 Interior Rooms",
+                "Basic Primers Included",
+                "Standard Brushes",
+              ],
+              primaryButton: {
+                text: "Contact for Order",
+                href: "#contact",
+              },
+              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-painting-wall_23-2149098984.jpg",
+            },
+            {
+              tag: "Contractor Pack",
+              price: "$850",
+              period: "Bulk Volume",
+              features: [
+                "Large Surface Coverage",
+                "Heavy Duty Primers",
+                "Professional Equipment Rental",
+              ],
+              primaryButton: {
+                text: "Contact for Bulk",
+                href: "#contact",
+              },
+              imageSrc: "http://img.b2bpic.net/free-photo/car-mechanic-painting-car-with-spray-gun_1303-28158.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}

src/pages/HomePage/sections/Products.tsx

@@ -0,0 +1,64 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "products" section.
+
+import React from 'react';
+import FeaturesRevealCardsBento from '@/components/sections/features/FeaturesRevealCardsBento';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function ProductsSection(): React.JSX.Element {
+  return (
+    <div id="products" data-section="products">
+        <SectionErrorBoundary name="products">
+              <FeaturesRevealCardsBento
+          tag="Our Catalog"
+          title="Comprehensive Paint Solutions"
+          description="Explore our curated range of paints, stains, and protective coatings."
+          items={[
+            {
+              title: "Interior Paints",
+              description: "High-durability latex and acrylic finishes.",
+              href: "#contact",
+              imageSrc: "http://img.b2bpic.net/free-photo/white-metallic-paint-can-indoors_23-2151934738.jpg",
+            },
+            {
+              title: "Exterior Paints",
+              description: "Weather-resistant, durable outdoor formulas.",
+              href: "#contact",
+              imageSrc: "http://img.b2bpic.net/free-photo/white-metallic-paint-can-indoors_23-2151934739.jpg",
+            },
+            {
+              title: "Wood Stains",
+              description: "Premium finishes for decks and furniture.",
+              href: "#contact",
+              imageSrc: "http://img.b2bpic.net/free-photo/tools-art-repairing-paint-top-view_185193-108873.jpg",
+            },
+            {
+              title: "Surface Primers",
+              description: "Professional adhesion for every surface.",
+              href: "#contact",
+              imageSrc: "http://img.b2bpic.net/free-photo/side-view-worker-pouring-paint_23-2149878807.jpg",
+            },
+            {
+              title: "Decorative Textures",
+              description: "Create unique interior feature walls.",
+              href: "#contact",
+              imageSrc: "http://img.b2bpic.net/free-photo/photo-wall-texture-pattern_58702-16141.jpg",
+            },
+            {
+              title: "Ceiling Solutions",
+              description: "Ultra-matte finishes for flawless ceilings.",
+              href: "#contact",
+              imageSrc: "http://img.b2bpic.net/free-photo/top-view-arrangement-with-roller-brush-paint-container_23-2148391846.jpg",
+            },
+            {
+              title: "Specialty Spray",
+              description: "Industrial grade aerosol applications.",
+              href: "#contact",
+              imageSrc: "http://img.b2bpic.net/free-photo/abstract-hard-metallic-background_23-2148744328.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}

src/pages/HomePage/sections/SocialProof.tsx

@@ -0,0 +1,29 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "social-proof" section.
+
+import React from 'react';
+import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function SocialProofSection(): React.JSX.Element {
+  return (
+    <div id="social-proof" data-section="social-proof">
+        <SectionErrorBoundary name="social-proof">
+              <SocialProofMarquee
+          tag="Trusted Brands"
+          title="Industry Partners"
+          description="We source the best quality materials from world-class manufacturers."
+          names={[
+            "Benjamin Moore",
+            "Sherwin-Williams",
+            "Behr",
+            "PPG",
+            "Valspar",
+            "Glidden",
+            "Kilz",
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}

src/pages/HomePage/sections/Testimonials.tsx

@@ -0,0 +1,57 @@
+// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
+// file as the canonical source for the "testimonials" section.
+
+import React from 'react';
+import TestimonialOverlayCards from '@/components/sections/testimonial/TestimonialOverlayCards';
+import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
+
+export default function TestimonialsSection(): React.JSX.Element {
+  return (
+    <div id="testimonials" data-section="testimonials">
+        <SectionErrorBoundary name="testimonials">
+              <TestimonialOverlayCards
+          tag="Happy Painters"
+          title="Client Success Stories"
+          description="Hear what our loyal community says about their renovations."
+          testimonials={[
+            {
+              name: "Elena Rodriguez",
+              role: "Architect",
+              company: "Urban Living",
+              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/couple-having-fun-while-painting-walls_23-2147782322.jpg",
+            },
+            {
+              name: "David Wu",
+              role: "Site Manager",
+              company: "BuildRight",
+              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-curly-brunette-dark-skinned-fashion-designer-poses-office-leans-table_197531-24106.jpg",
+            },
+            {
+              name: "Sarah Miller",
+              role: "Homeowner",
+              company: "DIY Projects",
+              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/married-couple-singing-renovation-tools-dipped-blue-paint-cheerful-married-couple-home-makeover-home-decoration-renovation-cozy-apartment-flat-repair-makeover_482257-3631.jpg",
+            },
+            {
+              name: "Marcus Thorne",
+              role: "General Contractor",
+              company: "Prime Build",
+              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/overweight-man-glasses-wearing-black-t-shirt-showing-paint-brush-with-smile-face-pink_141793-58551.jpg",
+            },
+            {
+              name: "Linda Chen",
+              role: "Interior Designer",
+              company: "Studio Lush",
+              rating: 5,
+              imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-safety-helmet-giving-hand-shake_23-2148242884.jpg",
+            },
+          ]}
+        />
+        </SectionErrorBoundary>
+      </div>
+  );
+}