Update src/app/page.tsx

Merge version_6 into main

src/app/calculator/page.tsx

@@ -0,0 +1,103 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+
+export default function CalculatorPage() {
+  const handleCalculate = (data: Record<string, string>) => {
+    // Extract numerical values from the form data
+    const avgCallsPerDay = parseFloat(data.avgCallsPerDay || '0');
+    const avgConversionRate = parseFloat(data.avgConversionRate || '0') / 100; // Convert percentage to decimal
+    const avgValuePerCustomer = parseFloat(data.avgValuePerCustomer || '0');
+    const currentAnswerRate = parseFloat(data.currentAnswerRate || '0') / 100; // Convert percentage to decimal
+
+    if (isNaN(avgCallsPerDay) || isNaN(avgConversionRate) || isNaN(avgValuePerCustomer) || isNaN(currentAnswerRate)) {
+      alert("Please enter valid numbers for all fields.");
+      return;
+    }
+
+    // Assume maximum potential answer rate is 100%
+    const potentialMaxAnswerRate = 1; 
+
+    // Calculate missed calls per day
+    const missedCallsPerDay = avgCallsPerDay * (potentialMaxAnswerRate - currentAnswerRate);
+
+    // Calculate potential additional conversions per day
+    const additionalConversionsPerDay = missedCallsPerDay * avgConversionRate;
+
+    // Calculate potential additional revenue per day
+    const additionalRevenuePerDay = additionalConversionsPerDay * avgValuePerCustomer;
+
+    // Calculate potential annual revenue increase (assuming 365 days a year)
+    const annualRevenueIncrease = additionalRevenuePerDay * 365;
+
+    alert(
+      `Based on your inputs:\n` +
+      `  Average Calls Per Day: ${avgCallsPerDay}\n` +
+      `  Average Conversion Rate: ${avgConversionRate * 100}%\n` +
+      `  Average Value Per Customer: $${avgValuePerCustomer.toFixed(2)}\n` +
+      `  Current Call Answer Rate: ${currentAnswerRate * 100}%\n\n` +
+      `Potential Missed Calls Per Day: ${missedCallsPerDay.toFixed(0)}\n` +
+      `Potential Additional Annual Revenue: $${annualRevenueIncrease.toFixed(2)}\n\n` +
+      `This is a rough estimate. elevai8 can help you significantly reduce missed calls and recover this lost revenue!`
+    );
+  };
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="elastic-effect"
+      defaultTextAnimation="reveal-blur"
+      borderRadius="soft"
+      contentWidth="small"
+      sizing="largeSmallSizeLargeTitles"
+      background="noise"
+      cardStyle="subtle-shadow"
+      primaryButtonStyle="flat"
+      secondaryButtonStyle="layered"
+      headingFontWeight="bold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Solutions", id: "/#solutions" },
+              { name: "Impact", id: "/#impact" },
+              { name: "Calculator", id: "/calculator" },
+              { name: "Pricing", id: "/#pricing" },
+              { name: "Testimonials", id: "/#testimonials" },
+              { name: "Contact", id: "/#contact" }
+            ]}
+            logoSrc="asset://1_1709403332503_group-19-1-svg"
+            logoAlt="elevai8 Logo"
+            brandName="elevai8"
+            button={{ text: "Get Free Demo", href: "/#contact" }}
+            animateOnLoad={true}
+          />
+        </div>
+
+        <div id="calculator" data-section="calculator">
+          <ContactSplitForm
+            useInvertedBackground={true}
+            mediaAnimation="slide-up"
+            mediaPosition="left"
+            imageSrc="http://img.b2bpic.net/free-photo/financial-calculation-business-concept_23-2149150036.jpg" 
+            imageAlt="Calculator and financial data"
+            title="Discover Your Hidden Revenue Loss"
+            description="Input a few details about your business to estimate the revenue you might be losing due to unanswered calls and how much you could recover with elevai8."
+            inputs={[
+              { name: "avgCallsPerDay", type: "number", placeholder: "Avg. Calls Per Day", required: true },
+              { name: "avgConversionRate", type: "number", placeholder: "Avg. Conversion Rate (%)", required: true },
+              { name: "avgValuePerCustomer", type: "number", placeholder: "Avg. Value Per Customer ($)", required: true },
+              { name: "currentAnswerRate", type: "number", placeholder: "Current Call Answer Rate (%)", required: true }
+            ]}
+            buttonText="Calculate My Annual Loss"
+            onSubmit={handleCalculate}
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -13,6 +13,7 @@ import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
 import ProductCardFour from '@/components/sections/product/ProductCardFour';
 import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
 import TextAbout from '@/components/sections/about/TextAbout';
+import TimelineProcessFlow from '@/components/cardStack/layouts/timelines/TimelineProcessFlow';
 import { Award, Sparkles, Star, Zap } from "lucide-react";
 
 export default function LandingPage() {
@@ -34,23 +35,27 @@ export default function LandingPage() {
       <NavbarLayoutFloatingInline
       navItems={[
         {
-          name: "Home",          id: "#home"},
+          name: "Home",          id: "/"},
         {
-          name: "Solutions",          id: "#solutions"},
+          name: "Solutions",          id: "/#solutions"},
         {
-          name: "Impact",          id: "#impact"},
+          name: "Impact",          id: "/#impact"},
         {
-          name: "Pricing",          id: "#pricing"},
+          name: "How it Works",          id: "/#how-it-works"},
         {
-          name: "Testimonials",          id: "#testimonials"},
+          name: "Calculator",          id: "/calculator"},
         {
-          name: "Contact",          id: "#contact"},
+          name: "Pricing",          id: "/#pricing"},
+        {
+          name: "Testimonials",          id: "/#testimonials"},
+        {
+          name: "Contact",          id: "/#contact"},
       ]}
-      logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3EbnErbzSdeKWK9EfEOzxxh1KWC/uploaded-1780456419902-s8rwp7do.png"
+      logoSrc="asset://1_1709403332503_group-19-1-svg"
       logoAlt="elevai8 Logo"
       brandName="elevai8"
       button={{
-        text: "Get Free Demo",        href: "#contact"}}
+        text: "Get Free Demo",          href: "/#contact"}}
       animateOnLoad={true}
     />
   </div>
@@ -65,9 +70,9 @@ export default function LandingPage() {
       tagAnimation="slide-up"
       buttons={[
         {
-          text: "Get Free Demo",          href: "#contact"},
+          text: "Get Free Demo",          href: "/#contact"},
         {
-          text: "See Solutions",          href: "#solutions"},
+          text: "See Solutions",          href: "/#solutions"},
       ]}
       buttonAnimation="slide-up"
       mediaItems={[
@@ -100,8 +105,8 @@ export default function LandingPage() {
         {
           title: "24/7 Availability & Support",          description: "Your AI receptionist never sleeps. Provide round-the-clock service to your clients, booking appointments and answering queries anytime.",          imageSrc: "http://img.b2bpic.net/free-photo/angry-customer-service-operator-talking-phone-office_1301-7545.jpg",          imageAlt: "24/7 AI availability",          titleImageSrc: "http://img.b2bpic.net/free-photo/wooden-man-figurine-blue-wall_169016-5177.jpg",          buttonText: "Explore Benefits"},
       ]}
-      title="Seamless AI Solutions for Every Small Business"
-      description="Discover how elevai8's AI streamlines your operations, enhances customer experience, and drives conversions across diverse industries."
+      title="AI & Automation: Scaling Service Businesses with Smarter Systems"
+      description="Explore how elevai8's AI streamlines operations, enhances customer experience, and drives conversions, covering AI receptionists, business automation, and real business acquisitions and sales."
     />
   </div>
 
@@ -125,6 +130,49 @@ export default function LandingPage() {
     />
   </div>
 
+  <div id="how-it-works" data-section="how-it-works">
+    <TimelineProcessFlow
+      title="How elevai8 Transforms Your Business"
+      description="Discover the seamless process of automating your client interactions, from initial contact to follow-up, ensuring every opportunity is captured."
+      animationType="slide-up"
+      textboxLayout="default"
+      items={[
+        {
+          content: (
+            <div className="space-y-4">
+              <h3 className="text-2xl font-semibold">The Problem: Missed Opportunities</h3>
+              <p className="text-lg text-foreground-secondary">Every missed call is a potential client lost. Without a 24/7 answering system, your business is constantly bleeding revenue, especially outside of standard operating hours. Leads slip through the cracks, leading to frustrated customers and untapped growth.</p>
+            </div>
+          ),
+          media: (
+            <img
+              src="http://img.b2bpic.net/free-photo/phone-with-missed-call-notifications_23-2149539070.jpg"
+              alt="Phone with missed call notifications"
+              className="w-full h-auto object-cover rounded-lg shadow-lg"
+            />
+          ),
+          reverse: false,
+        },
+        {
+          content: (
+            <div className="space-y-4">
+              <h3 className="text-2xl font-semibold">The Solution: AI-Powered Call Activity</h3>
+              <p className="text-lg text-foreground-secondary">Our AI receptionist ensures every call is answered, every query is addressed, and every lead is engaged. From booking appointments to providing instant information, the AI works tirelessly, capturing interactions that would otherwise be missed and syncing directly with your CRM and calendar.</p>
+            </div>
+          ),
+          media: (
+            <img
+              src="http://img.b2bpic.net/free-photo/headset-with-microphone-on-desk_23-2149531584.jpg"
+              alt="AI call activity dashboard"
+              className="w-full h-auto object-cover rounded-lg shadow-lg"
+            />
+          ),
+          reverse: true,
+        },
+      ]}
+    />
+  </div>
+
   <div id="products" data-section="products">
       <ProductCardFour
       animationType="slide-up"
@@ -160,7 +208,7 @@ export default function LandingPage() {
           id: "starter",          badge: "Essential",          badgeIcon: Sparkles,
           price: "$99/month",          subtitle: "Perfect for solo practitioners & startups",          buttons: [
             {
-              text: "Start Free Trial",              href: "#contact"},
+              text: "Start Free Trial",              href: "/#contact"},
           ],
           features: [
             "AI Call Assistant (up to 200 calls/month)",            "Basic CRM Integration",            "Smart Appointment Booking",            "Missed Call Recovery"],
@@ -169,7 +217,7 @@ export default function LandingPage() {
           id: "professional",          badge: "Popular",          badgeIcon: Zap,
           price: "$199/month",          subtitle: "Ideal for growing small businesses",          buttons: [
             {
-              text: "Get Started",              href: "#contact"},
+              text: "Get Started",              href: "/#contact"},
           ],
           features: [
             "AI Call Assistant (up to 500 calls/month)",            "Advanced CRM Integration",            "Customizable AI Persona",            "Enhanced Missed Call Recovery",            "Performance Analytics Dashboard"],
@@ -178,7 +226,7 @@ export default function LandingPage() {
           id: "enterprise",          badge: "Premium",          badgeIcon: Award,
           price: "Custom",          subtitle: "Tailored for larger practices & chains",          buttons: [
             {
-              text: "Contact Us",              href: "#contact"},
+              text: "Contact Us",              href: "/#contact"},
           ],
           features: [
             "Unlimited AI Call Assistant",            "Full CRM Integration Suite",            "Dedicated Account Manager",            "Priority Support",            "Bespoke AI Customization",            "Advanced Reporting & Insights"],
@@ -208,7 +256,7 @@ export default function LandingPage() {
           id: "t4",          name: "David Kim",          handle: "@SolarSolutions",          testimonial: "Implementing elevai8 was incredibly fast – we were live in under a week! The impact on our lead management has been immediate and significant.",          imageSrc: "http://img.b2bpic.net/free-photo/person-near-alternative-energy-plant_23-2149192768.jpg",          imageAlt: "Portrait of David Kim",          icon: Star,
         },
         {
-          id: "t5",          name: "Jessica Lee",          handle: "@LocalSpa",          testimonial: "Our clients love the 24/7 booking. It’s convenient for them and means we're never missing an opportunity, even outside business hours.",          imageSrc: "http://img.b2bpic.net/free-photo/excited-cheerful-blond-girl-rejoicing-camera-with-copy-space-text-promotional-content-near-yellow-background_574295-2365.jpg",          imageAlt: "Portrait of Jessica Lee",          icon: Star,
+          id: "t5",          name: "Jessica Lee",          handle: "@LocalSpa",          testimonial: "Our clients love the 24/7 booking. It’s convenient for them and means we're never missing an opportunity, even outside business hours.",          imageAlt: "Portrait of Jessica Lee",          icon: Star,
         },
       ]}
       title="What Our Clients Say"
@@ -232,7 +280,7 @@ export default function LandingPage() {
           id: "faq4",          title: "How long does it take to set up elevai8's AI solutions?",          content: "Typically, our clients can go live with their customized AI solution in as little as 5 days. Our streamlined onboarding process ensures a quick and efficient setup with minimal disruption to your business."},
       ]}
       sideTitle="Frequently Asked Questions"
-      sideDescription="Find quick answers to common questions about elevai8's AI receptionist and missed call solutions."
+      sideDescription="Find quick answers to common questions about elevai8's AI receptionist, automation, and business growth solutions."
       faqsAnimation="slide-up"
       textPosition="left"
       showCard={true}
@@ -263,25 +311,25 @@ export default function LandingPage() {
         {
           items: [
             {
-              label: "Home",              href: "#home"},
+              label: "Home",              href: "/#home"},
             {
-              label: "Solutions",              href: "#solutions"},
+              label: "Solutions",              href: "/#solutions"},
             {
-              label: "Pricing",              href: "#pricing"},
+              label: "Pricing",              href: "/#pricing"},
             {
-              label: "Impact",              href: "#impact"},
+              label: "Impact",              href: "/#impact"},
           ],
         },
         {
           items: [
             {
-              label: "About Us",              href: "#about"},
+              label: "About Us",              href: "/#about"},
             {
-              label: "Testimonials",              href: "#testimonials"},
+              label: "Testimonials",              href: "/#testimonials"},
             {
-              label: "FAQ",              href: "#faq"},
+              label: "FAQ",              href: "/#faq"},
             {
-              label: "Contact",              href: "#contact"},
+              label: "Contact",              href: "/#contact"},
           ],
         },
         {
@@ -301,4 +349,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}