Update src/app/page.tsx

Merge version_24 into main

src/app/page.tsx

@@ -8,10 +8,11 @@ import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import HeroSplit from '@/components/sections/hero/HeroSplit';
 import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import ProductCardFour from '@/components/sections/product/ProductCardFour';
 import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
 import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import FaqDouble from '@/components/sections/faq/FaqDouble';
+import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
 import { Activity, Award, Feather, Heart, ShieldCheck, Sparkles, Quote } from "lucide-react";
 
 export default function LandingPage() {
@@ -40,6 +41,8 @@ export default function LandingPage() {
         name: "Portfolio",          id: "#products"},
         {
           name: "Testimonials",          id: "#testimonials"},
+        {
+          name: "FAQs",          id: "#faq"},
         {
           name: "Socials",          id: "#social-media"},
         {
@@ -84,17 +87,17 @@ export default function LandingPage() {
       avatarText="Join 500+ happy riders!"
       marqueeItems={[
         {
-          type: "text-icon",          text: "Precision Craftsmanship",          icon: Feather,
+          type: "text-icon",          text: "Precision Craftsmanship",          icon: Feather
         },
         {
           type: "text",          text: "Your Vision, Our Canvas"},
         {
-          type: "text-icon",          text: "Unmatched Durability",          icon: ShieldCheck,
+          type: "text-icon",          text: "Unmatched Durability",          icon: ShieldCheck
         },
         {
           type: "text",          text: "Hand-Painted Perfection"},
         {
-          type: "text-icon",          text: "Ride in Unique Style",          icon: Activity,
+          type: "text-icon",          text: "Ride in Unique Style",          icon: Activity
         },
       ]}
     />
@@ -119,6 +122,7 @@ export default function LandingPage() {
       useInvertedBackground={true}
       title="The MPY Craft Process"
       description="We turn your vision into a precision-crafted finish where artistry and technical mastery meet."
+      tag="Our Process"
       accordionItems={[
         {
           id: "process-1",          title: "1. Vision & Consultation",          content: "Share your ideas, inspirations, and desired aesthetics. We'll explore design concepts, color palettes, and material finishes to fully capture your vision."},
@@ -133,38 +137,37 @@ export default function LandingPage() {
       imageAlt="Bicycle frame being prepped for painting"
       mediaAnimation="blur-reveal"
       mediaPosition="right"
+      accordionContentClassName="h-auto"
     />
   </div>
 
   <div id="products" data-section="products">
-      <ProductCardFour
+      <FeatureCardTwentyFour
       textboxLayout="default"
-      gridVariant="bento-grid"
       useInvertedBackground={false}
-      carouselMode="buttons"
       animationType="slide-up"
-      products={[
+      title="Our Services: Crafting Your Ride"
+      description="We offer a range of services from custom paint designs to expert restoration, ensuring every bicycle frame is a unique masterpiece."
+      tag="Our Services"
+      features={[
         {
-          id: "product-1",          name: "Elves Bikes Frame",          price: "Repaint Project",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EWBlOfpaA3C8pfIkwG9Yg6pp65/uploaded-1780467729397-lqxx901e.jpg",          imageAlt: "Custom painted racing bike frame with geometric patterns",          variant: "Road Bike"
+          id: "feature-1",          title: "Custom Paint Designs",          author: "MPY Paint Jobs",          description: "Unleash your creativity with personalized graphics, vibrant color schemes, and unique finishes tailored to your style. Our expert designers work closely with you to transform your vision into a stunning visual reality, making your bike truly one-of-a-kind. From intricate patterns to bold statements, we cover every detail to ensure your frame reflects your personality and passion on every ride.",          tags: ["Design", "Personalization"],
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EWBlOfpaA3C8pfIkwG9Yg6pp65/uploaded-1780467729397-lqxx901e.jpg",          imageAlt: "Custom painted racing bike frame with geometric patterns"
         },
         {
-          id: "product-2",          name: "Ave Maldea Custom Frame",          price: "Restoration Project",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EWBlOfpaA3C8pfIkwG9Yg6pp65/uploaded-1780467713489-t0pr11a2.jpg",          imageAlt: "Restored vintage bicycle frame with new paint",          variant: "Fixed Gear"
+          id: "feature-2",          title: "Expert Restoration",          author: "MPY Paint Jobs",          description: "Bring your vintage or damaged frames back to life with meticulous repairs, flawless paint matching, and durable finishes. We carefully strip away old paint, repair any imperfections, and apply a fresh, resilient coat that restores your bike's original glory or gives it a completely new identity, ready for many more miles.",          tags: ["Restoration", "Repair"],
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EWBlOfpaA3C8pfIkwG9Yg6pp65/uploaded-1780467713489-t0pr11a2.jpg",          imageAlt: "Restored vintage bicycle frame with new paint"
         },
         {
-          id: "product-3",          name: "Specialized Works Frame",          price: "Repaint Project",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EWBlOfpaA3C8pfIkwG9Yg6pp65/uploaded-1780466560858-i0e9zcla.jpg?_wi=1",          imageAlt: "Custom painted mountain bike frame with artistic design",          variant: "Road Bike"
+          id: "feature-3",          title: "Premium Finishes",          author: "MPY Paint Jobs",          description: "Choose from a wide array of high-quality finishes, including matte, gloss, metallic, and specialty effects for a truly unique look. Our advanced techniques ensure a smooth, even application and a finish that is not only visually striking but also highly resistant to the elements and daily wear, providing long-lasting beauty and protection for your frame.",          tags: ["Finishing", "Quality"],
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EWBlOfpaA3C8pfIkwG9Yg6pp65/uploaded-1780466560858-i0e9zcla.jpg?_wi=1",          imageAlt: "Custom painted mountain bike frame with artistic design"
         },
         {
-          id: "product-4",          name: "Giant Frame",          price: "Repaint Project",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EWBlOfpaA3C8pfIkwG9Yg6pp65/uploaded-1780478634392-fiau9xji.jpg",          imageAlt: "Custom painted electric bike frame for urban commuting",          variant: "Road Bike"
+          id: "feature-4",          title: "Bulk & Team Orders",          author: "MPY Paint Jobs",          description: "Custom painting solutions for bike shops, racing teams, and group projects with consistent quality and competitive pricing. Whether you need a fleet of bikes with matching team colors or a series of frames with a consistent brand aesthetic, we handle large orders with the same attention to detail and precision as individual projects, delivering uniformity and excellence across the board.",          tags: ["Bulk", "Teams"],
-        },
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EWBlOfpaA3C8pfIkwG9Yg6pp65/uploaded-1780478634392-fiau9xji.jpg",          imageAlt: "Custom painted electric bike frame for urban commuting"
-        {
+        }
-          id: "product-5",          name: "Cinelli Mash Frame",          price: "Repaint Project",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EWBlOfpaA3C8pfIkwG9Yg6pp65/uploaded-1780479213950-wm0qmy6y.jpg",          imageAlt: "Custom painted track bike frame with bold graphics",          variant: "Fixed Gear"
-        },
-        {
-          id: "product-6",          name: "Specialized Frame",          price: "Repaint Project",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EWBlOfpaA3C8pfIkwG9Yg6pp65/uploaded-1780466560858-i0e9zcla.jpg?_wi=2",          imageAlt: "Bicycle frame with vibrant graffiti-style custom paint",          variant: "Road Bike"
-        },
       ]}
-      title="Our Masterpieces: A Gallery of Custom Frames"
+      cardDescriptionClassName="h-auto"
-      description="Explore a selection of our finest custom painted bicycle frames, showcasing unique designs, vibrant colors, and unparalleled attention to detail."
     />
   </div>
 
@@ -210,6 +213,35 @@ export default function LandingPage() {
     />
   </div>
 
+  <div id="faq" data-section="faq">
+      <FaqDouble
+      useInvertedBackground={true}
+      title="Frequently Asked Questions"
+      description="Find quick answers to common questions about our custom bicycle frame painting, refinishing, and restoration services."
+      tag="FAQs"
+      faqsAnimation="slide-up"
+      textboxLayout="default"
+      faqs={[
+        {
+          id: "faq-1",          title: "Where are you located?",          content: "Our shop is located in Salitran 1, Dasmariñas City, Cavite. You can pin your map at Total (Salitran), and our shop is directly in front of it—just look for the sliding door beside the helmet vending machine."
+        },
+        {
+          id: "faq-2",          title: "How much is the paint job service?",          content: "Prices vary depending on the frame material whether aluminum, steel, or carbon and the color or design you choose. Our custom paint jobs usually start at ₱7,500."
+        },
+        {
+          id: "faq-3",          title: "How long does it take?",          content: "A custom paint job usually takes 3–4 weeks, depending on the frame’s condition, weather, and any unexpected delays. We always make sure to give each frame the time and attention it deserves."
+        },
+        {
+          id: "faq-4",          title: "Do you scrape or strip off the old paint?",          content: "Yes! for aluminum and steel frames, we use a chemical paint stripper to fully remove the old paint. For carbon frames, we DON'T use chemicals, we sand it manually to avoid damaging the material and to keep the frame in good condition underneath the new paint."
+        },
+        {
+          id: "faq-6",          title: "Can we ship our frames if we're far from the shop?",          content: "Yes, you can! you can send your frames through couriers like Lalamove, J&T or any shipping company you trust. We accept shipped frames from anywhere, Worldwide."
+        }
+      ]}
+      accordionContentClassName="h-auto"
+    />
+  </div>
+
   <div id="social-media" data-section="social-media">
       <SocialProofOne
       useInvertedBackground={true}
@@ -217,13 +249,13 @@ export default function LandingPage() {
       description="Follow us on our social media platforms to see our latest custom paint projects, behind-the-scenes glimpses, and connect with our community of riders and enthusiasts."
       tag="Stay Connected"
       names={[
-        "Facebook",        "Instagram",        "YouTube",        "Twitter (X)"
+        "Facebook: mpycustompaintjobs",        "Instagram: mpypaintjobs_",        "YouTube",        "Twitter (X)"
       ]}
       buttons={[
         {
-          text: "Facebook",          href: "https://www.facebook.com/mpycustompaintjobs"},
+          text: "Facebook: mpycustompaintjobs"},
         {
-          text: "Instagram",          href: "https://www.instagram.com/mpypaintjobs_/"},
+          text: "Instagram: mpypaintjobs_"},
         {
           text: "YouTube",          href: "https://www.youtube.com/MPYPaintJobs"},
         {
@@ -243,10 +275,10 @@ export default function LandingPage() {
       description="Tell us about your vision. Our team will get back to you within 24 hours to discuss your project and provide a personalized quote."
       inputs={[
         {
-          name: "name",          type: "text",          placeholder: "Your Name",          required: true,
+          name: "name",          type: "text",          placeholder: "Your Name",          required: true
         },
         {
-          name: "email",          type: "email",          placeholder: "Your Email",          required: true,
+          name: "email",          type: "email",          placeholder: "Your Email",          required: true
         },
         {
           name: "phone",          type: "tel",          placeholder: "Phone Number (Optional)"},
@@ -257,7 +289,7 @@ export default function LandingPage() {
       }}
       textarea={{
         name: "projectDetails",        placeholder: "Tell us about your project vision (e.g., bike type, style, colors, desired date)",        rows: 5,
-        required: true,
+        required: true
       }}
       imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EWBlOfpaA3C8pfIkwG9Yg6pp65/uploaded-1780476585715-xxiwthkq.jpg"
       imageAlt="Close up of bicycle frame in a workshop"
@@ -281,7 +313,7 @@ export default function LandingPage() {
               label: "Refinishing",              href: "#features"},
             {
               label: "Restoration",              href: "#features"},
-          ],
+          ]
         },
         {
           title: "Studio",          items: [
@@ -291,11 +323,13 @@ export default function LandingPage() {
               label: "Our Process",              href: "#features"},
             {
               label: "Testimonials",              href: "#testimonials"},
+            {
+              label: "FAQs",              href: "#faq"},
             {
               label: "Socials",              href: "#social-media"},
             {
               label: "Contact",              href: "#contact"},
-          ],
+          ]
         },
         {
           title: "Legal",          items: [
@@ -303,7 +337,7 @@ export default function LandingPage() {
               label: "Privacy Policy",              href: "#"},
             {
               label: "Terms of Service",              href: "#"},
-          ],
+          ]
         },
       ]}
       copyrightText="© 2021 MPY Paint Jobs. All rights reserved."