Update src/app/page.tsx

Merge version_7 into main

src/app/page.tsx

@@ -2,11 +2,11 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCenter from '@/components/sections/contact/ContactCenter';
-import FaqBase from '@/components/sections/faq/FaqBase';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
+import FaqDouble from '@/components/sections/faq/FaqDouble';
 import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
-import FooterBase from '@/components/sections/footer/FooterBase';
-import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
 import MediaAbout from '@/components/sections/about/MediaAbout';
 import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
@@ -31,46 +31,25 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleCentered
       navItems={[
-        {
-          name: "About",          id: "#about"},
-        {
-          name: "Features",          id: "#features"},
-        {
-          name: "Pricing",          id: "#pricing"},
-        {
-          name: "Contact",          id: "#contact"},
+        { name: "About", id: "#about" },
+        { name: "Features", id: "#features" },
+        { name: "FAQ", id: "#faq" },
+        { name: "Contact", id: "#contact" },
       ]}
       brandName="AutoSchedule AI"
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroBillboardGallery
-      background={{
-        variant: "sparkles-gradient"}}
-      title="Let AI Master Your Calendar"
+      <HeroLogoBillboard
+      logoText="AutoSchedule AI"
       description="Stop chasing leads. Our AI appointment setter handles the conversation and schedules meetings while you sleep."
-      tag="Revolutionize Your Workflow"
       buttons={[
-        {
-          text: "Start Free Trial",          href: "#contact"},
-        {
-          text: "View Demo",          href: "#features"},
-      ]}
-      mediaItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/ai-powered-device-concept_23-2151924164.jpg",          imageAlt: "AI Scheduling Flow"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-businesswoman-with-headset-working-call-center-office_231208-320.jpg",          imageAlt: "Conversational AI"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/cyberpunk-space-tunnel_23-2151954719.jpg",          imageAlt: "Time Optimization"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/global-business-strategy-planning-icon-concept_53876-120444.jpg",          imageAlt: "CRM Integration"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139249.jpg",          imageAlt: "Workflow Automation"},
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/workspace-with-stationery-papers-with-smartphone_23-2147965724.jpg",          imageAlt: "Intelligent Scheduling"},
+        { text: "Start Free Trial", href: "#contact" },
+        { text: "View Demo", href: "#features" },
       ]}
+      background={{ variant: "sparkles-gradient" }}
+      imageSrc="http://img.b2bpic.net/free-photo/ai-powered-device-concept_23-2151924164.jpg"
       mediaAnimation="blur-reveal"
     />
   </div>
@@ -93,11 +72,14 @@ export default function LandingPage() {
       useInvertedBackground={false}
       features={[
         {
-          title: "Automated Outreach",          description: "AI-powered email sequences that engage your leads.",          imageSrc: "http://img.b2bpic.net/free-vector/flat-media-set_98292-969.jpg",          titleImageSrc: "http://img.b2bpic.net/free-photo/inbox-communication-notification-e-mail-mail-concept_53876-120057.jpg",          buttonText: "Learn More"},
+          title: "Automated Outreach",          description: "AI-powered email sequences that engage your leads.",          imageSrc: "http://img.b2bpic.net/free-vector/flat-media-set_98292-969.jpg",          titleImageSrc: "http://img.b2bpic.net/free-photo/inbox-communication-notification-e-mail-mail-concept_53876-120057.jpg",          buttonText: "Learn More"
+        },
         {
-          title: "Sync Everything",          description: "Connect your calendars for conflict-free scheduling.",          imageSrc: "http://img.b2bpic.net/free-photo/futuristic-technology-hologram_23-2151917417.jpg",          titleImageSrc: "http://img.b2bpic.net/free-photo/christmas-date-paper-craft_53876-47120.jpg",          buttonText: "Learn More"},
+          title: "Sync Everything",          description: "Connect your calendars for conflict-free scheduling.",          imageSrc: "http://img.b2bpic.net/free-photo/futuristic-technology-hologram_23-2151924174.jpg",          titleImageSrc: "http://img.b2bpic.net/free-photo/christmas-date-paper-craft_53876-47120.jpg",          buttonText: "Learn More"
+        },
         {
-          title: "Intelligent Lead Scoring",          description: "Prioritize high-value leads automatically.",          imageSrc: "http://img.b2bpic.net/free-photo/man-showing-light-bulb-icon_53876-47270.jpg",          titleImageSrc: "http://img.b2bpic.net/free-vector/seo-analytics-black-line-icon-25-business-outline-icon-set_1057-10180.jpg",          buttonText: "Learn More"},
+          title: "Intelligent Lead Scoring",          description: "Prioritize high-value leads automatically.",          imageSrc: "http://img.b2bpic.net/free-photo/man-showing-light-bulb-icon_53876-47270.jpg",          titleImageSrc: "http://img.b2bpic.net/free-vector/seo-analytics-black-line-icon-25-business-outline-icon-set_1057-10180.jpg",          buttonText: "Learn More"
+        },
       ]}
       title="Powerful AI Features"
       description="Enterprise-grade appointment scheduling that fits right into your business processes."
@@ -108,8 +90,7 @@ export default function LandingPage() {
       <SocialProofOne
       textboxLayout="default"
       useInvertedBackground={true}
-      names={[
-        "TechCorp",        "InnovateLab",        "GrowthCo",        "StartupXYZ",        "DigitalReach",        "FutureSystems",        "GlobalSolutions"]}
+      names={["TechCorp", "InnovateLab", "GrowthCo", "StartupXYZ", "DigitalReach", "FutureSystems", "GlobalSolutions"]}
       title="Trusted by Industry Leaders"
       description="Used by companies across the globe to drive appointment volume."
     />
@@ -122,12 +103,9 @@ export default function LandingPage() {
       gridVariant="uniform-all-items-equal"
       useInvertedBackground={false}
       metrics={[
-        {
-          id: "m1",          value: "400%",          description: "Meeting volume increase"},
-        {
-          id: "m2",          value: "15hrs",          description: "Saved per user/week"},
-        {
-          id: "m3",          value: "99.9%",          description: "Uptime & Reliability"},
+        { id: "m1", value: "400%", description: "Meeting volume increase" },
+        { id: "m2", value: "15hrs", description: "Saved per user/week" },
+        { id: "m3", value: "99.9%", description: "Uptime & Reliability" },
       ]}
       title="Proven Results"
       description="The numbers speak for themselves regarding our impact."
@@ -140,16 +118,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={true}
       testimonials={[
-        {
-          id: "t1",          name: "Sarah Johnson",          handle: "@sarahj",          testimonial: "This tool doubled my sales team efficiency overnight.",          imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-black-blazer-portrait_23-2152009548.jpg"},
-        {
-          id: "t2",          name: "Michael Chen",          handle: "@mchen",          testimonial: "Reliable and incredibly fast implementation.",          imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-business-people-holding-laptop-computer-office-desk_1150-10180.jpg"},
-        {
-          id: "t3",          name: "Emily Rodriguez",          handle: "@emilyr",          testimonial: "Best investment we made for our outreach.",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-labor-union-member_23-2150969905.jpg"},
-        {
-          id: "t4",          name: "David Kim",          handle: "@dkim",          testimonial: "Finally, an AI that actually schedules meetings right.",          imageSrc: "http://img.b2bpic.net/free-photo/farmer-examines-field-agronomist-farmer-examines-growth-wheat_1157-39743.jpg"},
-        {
-          id: "t5",          name: "Lisa Wang",          handle: "@lisaw",          testimonial: "The lead scoring feature changed our game.",          imageSrc: "http://img.b2bpic.net/free-photo/smiling-mechanic-standing-repair-shop_1170-1349.jpg"},
+        { id: "t1", name: "Sarah Johnson", handle: "@sarahj", testimonial: "This tool doubled my sales team efficiency overnight.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-black-blazer-portrait_23-2152009548.jpg" },
+        { id: "t2", name: "Michael Chen", handle: "@mchen", testimonial: "Reliable and incredibly fast implementation.", imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-business-people-holding-laptop-computer-office-desk_1150-10180.jpg" },
+        { id: "t3", name: "Emily Rodriguez", handle: "@emilyr", testimonial: "Best investment we made for our outreach.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-labor-union-member_23-2150969905.jpg" },
       ]}
       title="Client Success Stories"
       description="What business owners are saying about AutoSchedule AI."
@@ -157,63 +128,42 @@ export default function LandingPage() {
   </div>
 
   <div id="faq" data-section="faq">
-      <FaqBase
-      textboxLayout="default"
+      <FaqDouble
+      textboxLayout="split"
       useInvertedBackground={false}
       faqs={[
-        {
-          id: "q1",          title: "How does the AI work?",          content: "Our AI analyzes calendar data and interacts with prospects via natural language processing."},
-        {
-          id: "q2",          title: "Is it secure?",          content: "Yes, we prioritize end-to-end encryption for all scheduling activities."},
-        {
-          id: "q3",          title: "Can I integrate with my CRM?",          content: "Absolutely, we support all major CRM platforms natively."},
+        { id: "q1", title: "How does the AI handle cancellations?", content: "The AI automatically detects cancellations and proactively reaches out to reschedule based on the user's updated availability." },
+        { id: "q2", title: "Does it support multi-user teams?", content: "Yes, our platform includes comprehensive team calendar management with round-robin distribution." },
+        { id: "q3", title: "How secure is my calendar data?", content: "We utilize bank-grade encryption for all calendar integrations and never store your private calendar credentials." },
+        { id: "q4", title: "What if the AI misses a nuance?", content: "Every AI interaction is logged for human review, and you can easily jump in to manage any high-stakes conversation." },
       ]}
-      title="Frequently Asked Questions"
-      description="Common inquiries about our platform."
+      title="Common Questions"
+      description="Addressing the most frequent inquiries about AI appointment setting."
       faqsAnimation="slide-up"
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactCenter
+      <ContactSplit
+      tag="Contact"
       useInvertedBackground={true}
-      background={{
-        variant: "sparkles-gradient"}}
-      tag="Get Started"
-      title="Start Scheduling Automatically Today"
-      description="Join thousands of businesses streamlining their meeting workflow."
+      title="Ready to Automate Your Scheduling?"
+      description="Join top-performing teams and eliminate meeting friction today."
+      imageSrc="http://img.b2bpic.net/free-photo/business-people-discussing-plan-meeting-office-desk_1150-10180.jpg"
+      mediaAnimation="blur-reveal"
+      background={{ variant: "sparkles-gradient" }}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBase
-      columns={[
-        {
-          title: "Product",          items: [
-            {
-              label: "Features",              href: "#features"},
-            {
-              label: "Pricing",              href: "#pricing"},
-          ],
-        },
-        {
-          title: "Company",          items: [
-            {
-              label: "About",              href: "#about"},
-            {
-              label: "Contact",              href: "#contact"},
-          ],
-        },
-        {
-          title: "Legal",          items: [
-            {
-              label: "Privacy",              href: "#"},
-            {
-              label: "Terms",              href: "#"},
-          ],
-        },
-      ]}
+      <FooterBaseReveal
       logoText="AutoSchedule AI"
+      columns={[
+        { title: "Product", items: [{ label: "Features", href: "#features" }, { label: "Pricing", href: "#pricing" }] },
+        { title: "Company", items: [{ label: "About", href: "#about" }, { label: "Careers", href: "#" }] },
+        { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
+      ]}
+      copyrightText="© 2025 AutoSchedule AI. All rights reserved."
     />
   </div>
       </ReactLenis>

src/app/styles/variables.css

@@ -10,7 +10,7 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #020617;
+  --background: #02104c;
   --card: #0f172a;
   --foreground: #e2e8f0;
   --primary-cta: #1e3a8a;