src/app/page.tsx

@@ -6,8 +6,12 @@ import HeroOverlay from "@/components/sections/hero/HeroOverlay";
 import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
 import ProductCardFour from "@/components/sections/product/ProductCardFour";
 import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
+import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
+import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
+import FaqBase from "@/components/sections/faq/FaqBase";
 import FooterBase from "@/components/sections/footer/FooterBase";
-import { Cloud, Package, Zap } from "lucide-react";
+import { Cloud, Package, Zap, TrendingUp, Users, Globe } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -121,6 +125,88 @@ export default function LandingPage() {
         />
       </div>
 
+      <div id="metrics" data-section="metrics">
+        <MetricCardThree
+          title="Our Impact"
+          description="Delivering results for FileMaker deployments worldwide"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          metrics={[
+            {
+              id: "1",              icon: TrendingUp,
+              title: "Uptime",              value: "99.99%"
+            },
+            {
+              id: "2",              icon: Users,
+              title: "Active Users",              value: "10K+"
+            },
+            {
+              id: "3",              icon: Globe,
+              title: "Global Coverage",              value: "50+"
+            },
+          ]}
+        />
+      </div>
+
+      <div id="testimonials" data-section="testimonials">
+        <TestimonialCardSix
+          title="What Our Customers Say"
+          description="Real feedback from FileMaker professionals using our cloud solutions"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          animationType="slide-up"
+          gridVariant="uniform-all-items-equal"
+          testimonials={[
+            {
+              id: "1",              name: "John Smith",              role: "Database Administrator",              company: "Enterprise Corp",              rating: 5,
+              imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=400&h=400&fit=crop",              imageAlt: "John Smith"
+            },
+            {
+              id: "2",              name: "Sarah Johnson",              role: "IT Director",              company: "Tech Solutions",              rating: 5,
+              imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=400&h=400&fit=crop",              imageAlt: "Sarah Johnson"
+            },
+            {
+              id: "3",              name: "Michael Chen",              role: "Development Lead",              company: "Digital Innovations",              rating: 5,
+              imageSrc: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=400&h=400&fit=crop",              imageAlt: "Michael Chen"
+            },
+          ]}
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactSplitForm
+          title="Get in Touch"
+          description="Ready to elevate your FileMaker deployment? Contact our team for a consultation."
+          buttonText="Send Message"
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="faq" data-section="faq">
+        <FaqBase
+          title="Frequently Asked Questions"
+          description="Find answers to common questions about our FileMaker cloud solutions"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          faqsAnimation="slide-up"
+          faqs={[
+            {
+              id: "1",              title: "What is FileMaker Cloud?",              content: "FileMaker Cloud is a secure, scalable cloud hosting solution specifically designed for FileMaker databases. It provides enterprise-grade infrastructure with 99.99% uptime guarantee and 24/7 dedicated support."
+            },
+            {
+              id: "2",              title: "How do I migrate my existing FileMaker database?",              content: "We offer seamless migration services at no additional cost. Our team will work with you to ensure a smooth transition with zero downtime. Contact us for a personalized migration plan."
+            },
+            {
+              id: "3",              title: "What security measures are in place?",              content: "We implement enterprise-grade security including SSL/TLS encryption, regular backups, compliance with industry standards (HIPAA, GDPR), and comprehensive access controls to protect your data."
+            },
+            {
+              id: "4",              title: "Can I scale my resources?",              content: "Yes, our plans are fully scalable. Start with any plan and upgrade or adjust your resources as your business grows. There are no long-term contracts required."
+            },
+          ]}
+        />
+      </div>
+
       <div id="footer" data-section="footer">
         <FooterBase
           columns={[
@@ -141,7 +227,7 @@ export default function LandingPage() {
             {
               title: "Support",              items: [
                 { label: "Documentation", href: "#" },
-                { label: "Contact", href: "#" },
+                { label: "Contact", href: "#contact" },
                 { label: "Status", href: "#" },
               ],
             },
@@ -151,4 +237,4 @@ export default function LandingPage() {
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #ffffff;
-  --card: #f9f9f9;
-  --foreground: #120a00e6;
-  --primary-cta: #ffdf00;
+  --background: #f5f5f5;
+  --card: #ffffff;
+  --foreground: #1c1c1c;
+  --primary-cta: #ffd700;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #f9f9f9;
+  --secondary-cta: #ffffff;
   --secondary-cta-text: #120a00e6;
-  --accent: #e2e2e2;
-  --background-accent: #c4c4c4;
+  --accent: #ffd700;
+  --background-accent: #2a2a2a;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);