Merge version_2 into main

Merge version_2 into main

src/app/page.tsx

@@ -2,10 +2,10 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactText from '@/components/sections/contact/ContactText';
-import FaqBase from '@/components/sections/faq/FaqBase';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
+import FaqDouble from '@/components/sections/faq/FaqDouble';
 import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
-import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import FooterCard from '@/components/sections/footer/FooterCard';
 import HeroOverlay from '@/components/sections/hero/HeroOverlay';
 import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
 import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
@@ -154,8 +154,8 @@ export default function LandingPage() {
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqBase
-      textboxLayout="default"
+      <FaqDouble
+      textboxLayout="split"
       useInvertedBackground={true}
       faqs={[
         { id: "q1", title: "Are your products for human use?", content: "Our products are strictly for research purposes only and not intended for human consumption." },
@@ -169,27 +169,25 @@ export default function LandingPage() {
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactText
-      useInvertedBackground={false}
-      background={{ variant: "gradient-bars" }}
-      text="Need professional assistance? Our support team is here to help with all your lab inquiries."
+      <ContactCTA
+      tag="Get In Touch"
+      title="Ready to advance your research?"
+      description="Professional support for all your lab inquiries is just one click away."
       buttons={[
         { text: "Contact Support", href: "mailto:support@kapapepresearch.com" },
       ]}
+      background={{ variant: "sparkles-gradient" }}
+      useInvertedBackground={false}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBaseCard
+      <FooterCard
       logoText="Kapapep Research"
-      columns={[
-        { title: "Company", items: [{ label: "About", href: "#about" }, { label: "FAQ", href: "#faq" }] },
-        { title: "Store", items: [{ label: "Shop All", href: "#products" }, { label: "Shipping", href: "#" }] },
-        { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
-      ]}
+      copyrightText="© 2025 | Kapapep Research"
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}