Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -2,16 +2,18 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
+import { LayoutDashboard, BarChart3, Package, TrendingUp, Clock } from "lucide-react";
 import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
 import ContactText from '@/components/sections/contact/ContactText';
 import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
 import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
 import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
-import HeroOverlay from '@/components/sections/hero/HeroOverlay';
+import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
 import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
 import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
 
 export default function LandingPage() {
   return (
@@ -31,41 +33,37 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleCentered
       navItems={[
-        {
+        { name: "About", id: "#about" },
-          name: "About",          id: "#about"},
+        { name: "Features", id: "#features" },
-        {
+        { name: "Metrics", id: "#metrics" },
-          name: "Features",          id: "#features"},
+        { name: "Testimonials", id: "#testimonials" },
-        {
+        { name: "Coming Soon", id: "#coming-soon" },
-          name: "Metrics",          id: "#metrics"},
-        {
-          name: "Testimonials",          id: "#testimonials"},
       ]}
       brandName="ECommerce OS"
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroOverlay
+      <HeroBillboardDashboard
-      title="Your entire store, one operating system"
+      title="Unify your store operations in one operating system"
       description="Stop juggling spreadsheets and disconnected apps. ECommerce OS gives you realtime stock and financial visibility—so you can grow without the chaos."
-      buttons={[
+      background={{ variant: "plain" }}
-        {
+      buttons={[{ text: "Start free dashboard", href: "#contact" }]}
-          text: "Start free dashboard",          href: "#contact"},
+      dashboard={{
-      ]}
+        title: "Store Overview",        logoIcon: LayoutDashboard,
-      imageSrc="http://img.b2bpic.net/free-photo/business-investor-analyzing-stock-market-trend-monitor-trading-capital-profit-exchange-investment-young-broker-investing-funds-using-financial-forex-market-sales-close-up-handheld-shot_482257-40948.jpg"
+        sidebarItems: [{ icon: LayoutDashboard, active: true }, { icon: Package }, { icon: BarChart3 }],
-      avatars={[
+        buttons: [{ text: "Start free dashboard", href: "#contact" }],
-        {
+        stats: [
-          src: "http://img.b2bpic.net/free-photo/portrait-mature-woman-smiling_23-2148407645.jpg",          alt: "Portrait of mature woman smiling"},
+          { title: "Revenue", values: [12500, 14200, 15800], description: "This month" },
-        {
+          { title: "Orders", values: [45, 52, 60], description: "Today" },
-          src: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg",          alt: "Young Businesswoman Portrait in Office"},
+          { title: "Returns", values: [2, 1, 3], description: "This week" }
-        {
+        ],
-          src: "http://img.b2bpic.net/free-photo/confident-young-businesswoman-with-folded-arms_1262-1775.jpg",          alt: "Confident Young Businesswoman with Folded Arms"},
+        listTitle: "Recent Transfers",        listItems: [
-        {
+          { icon: TrendingUp, title: "Supplier Payment", status: "Completed" },
-          src: "http://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg",          alt: "Happy professional"},
+          { icon: TrendingUp, title: "Order Refund", status: "Pending" }
-        {
+        ],
-          src: "http://img.b2bpic.net/free-photo/shot-beautiful-young-businesswoman-wearing-blue-chiffon-shirt-while-standing-with-folded-arms-gray-marble-wall_158595-6769.jpg",          alt: "Shot of beautiful young businesswoman wearing blue chiffon shirt"},
+        imageSrc: "http://img.b2bpic.net/free-photo/financial-software-ui-pc-screen-apartment-office-desk_482257-122945.jpg?_wi=1"
-      ]}
+      }}
-      avatarText="Trusted by 500+ store owners"
     />
   </div>
 
@@ -74,7 +72,8 @@ export default function LandingPage() {
       useInvertedBackground={true}
       title="Built for the small team doing big things"
       description={[
-        "For 1–10 employee teams, fragmentation is the enemy. We consolidate your tools into one actionable interface.",        "Our dashboard eliminates manual data entry, providing clarity across inventory and cash flow in one unified view."]}
+        "For 1–10 employee teams, fragmentation is the enemy. We consolidate your tools into one actionable interface.",        "Our dashboard eliminates manual data entry, providing clarity across inventory and cash flow in one unified view."
+      ]}
     />
   </div>
 
@@ -82,20 +81,29 @@ export default function LandingPage() {
       <FeatureCardSeven
       animationType="slide-up"
       textboxLayout="split"
-      useInvertedBackground={false}
+      useInvertedBackground={true}
       features={[
-        {
+        { title: "Live Inventory Control", description: "See your exact stock levels, monitor low-stock alerts, and track pending orders as they happen.", imageSrc: "http://img.b2bpic.net/free-photo/empty-professional-warehouse-space-used-shipping-cargo-goods-from-online-shopping-local-small_482257-136203.jpg" },
-          title: "Live Inventory Control",          description: "See your exact stock levels, monitor low-stock alerts, and track pending orders as they happen.",          imageSrc: "http://img.b2bpic.net/free-photo/empty-professional-warehouse-space-used-shipping-cargo-goods-from-online-shopping-local-small_482257-136203.jpg"},
+        { title: "Financial Pulse", description: "Your revenue, expenses, and profit margins are calculated in real time, so you always know where you stand.", imageSrc: "http://img.b2bpic.net/free-photo/financial-software-ui-pc-screen-apartment-office-desk_482257-122945.jpg?_wi=2" },
-        {
+        { title: "Performance Insights", description: "Identify which products are underperforming financially and which are overstocked for smarter restocking.", imageSrc: "http://img.b2bpic.net/free-photo/delivery-truck-smartphone-with-location-pointer-shipping-customer-ecommerce-concept-blue-background-3d-illustration_56104-1784.jpg" },
-          title: "Financial Pulse",          description: "Your revenue, expenses, and profit margins are calculated in real time, so you always know where you stand.",          imageSrc: "http://img.b2bpic.net/free-photo/financial-software-ui-pc-screen-apartment-office-desk_482257-122945.jpg"},
-        {
-          title: "Performance Insights",          description: "Identify which products are underperforming financially and which are overstocked for smarter restocking.",          imageSrc: "http://img.b2bpic.net/free-photo/delivery-truck-smartphone-with-location-pointer-shipping-customer-ecommerce-concept-blue-background-3d-illustration_56104-1784.jpg"},
       ]}
       title="Visibility that drives decisions"
       description="Stop guessing. Start knowing."
     />
   </div>
 
+  <div id="coming-soon" data-section="coming-soon">
+      <ContactSplit
+      tag="Exclusive Access"
+      tagIcon={Clock}
+      title="Automated Marketing & CRM"
+      description="We're building the next evolution of ECommerce OS—integrating smart marketing automation directly into your operations. Sign up to get early access when we launch."
+      background={{ variant: "sparkles-gradient" }}
+      useInvertedBackground={true}
+      buttonText="Get early access"
+    />
+  </div>
+
   <div id="metrics" data-section="metrics">
       <MetricCardTwo
       animationType="depth-3d"
@@ -103,12 +111,9 @@ export default function LandingPage() {
       gridVariant="uniform-all-items-equal"
       useInvertedBackground={true}
       metrics={[
-        {
+        { id: "m1", value: "40%", description: "Average reduction in manual data entry time" },
-          id: "m1",          value: "40%",          description: "Average reduction in manual data entry time"},
+        { id: "m2", value: "$12k", description: "Average cash flow recovered per month" },
-        {
+        { id: "m3", value: "24/7", description: "Real-time visibility into every order" },
-          id: "m2",          value: "$12k",          description: "Average cash flow recovered per month"},
-        {
-          id: "m3",          value: "24/7",          description: "Real-time visibility into every order"},
       ]}
       title="Real-time impact"
       description="Results our users see in their first 30 days."
@@ -121,21 +126,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       testimonials={[
-        {
+        { id: "t1", name: "Sarah J.", handle: "@sarah_store", testimonial: "I used to spend 5 hours a week in spreadsheets. ECommerce OS cut that to zero.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-with-headphones_23-2148718045.jpg" },
-          id: "t1",          name: "Sarah J.",          handle: "@sarah_store",          testimonial: "I used to spend 5 hours a week in spreadsheets. ECommerce OS cut that to zero.",          rating: 5,
+        { id: "t2", name: "Mark L.", handle: "@mark_ops", testimonial: "Finally, I can see where our profit margins are leaking. Essential tool.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg" },
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-with-headphones_23-2148718045.jpg"},
+        { id: "t3", name: "Elena R.", handle: "@elena_goods", testimonial: "The real-time inventory alerts saved us from several stock-outs already.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-hispanic-man-standing-brick-wall-background-looking-sleepy-tired-exhausted-fatigue-hangover-lazy-eyes-morning_839833-16515.jpg" }
-        {
-          id: "t2",          name: "Mark L.",          handle: "@mark_ops",          testimonial: "Finally, I can see where our profit margins are leaking. Essential tool.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg"},
-        {
-          id: "t3",          name: "Elena R.",          handle: "@elena_goods",          testimonial: "The real-time inventory alerts saved us from several stock-outs already.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/young-hispanic-man-standing-brick-wall-background-looking-sleepy-tired-exhausted-fatigue-hangover-lazy-eyes-morning_839833-16515.jpg"},
-        {
-          id: "t4",          name: "David K.",          handle: "@david_retail",          testimonial: "Clean, simple, and actually useful. Integrates perfectly with our small store.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-man-wearing-trench-coat_23-2149729304.jpg"},
-        {
-          id: "t5",          name: "Anna W.",          handle: "@anna_tech",          testimonial: "The dashboard interface is just beautiful. Managing products has never been this easy.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/successful-senior-businessman-standing-window_1262-3120.jpg"},
       ]}
       showRating={true}
       title="Loved by growing teams"
@@ -148,12 +141,9 @@ export default function LandingPage() {
       textboxLayout="split"
       useInvertedBackground={true}
       faqs={[
-        {
+        { id: "f1", title: "Does it integrate with my store?", content: "Yes, we integrate seamlessly with major ecommerce platforms to pull your live data immediately." },
-          id: "f1",          title: "Does it integrate with my store?",          content: "Yes, we integrate seamlessly with major ecommerce platforms to pull your live data immediately."},
+        { id: "f2", title: "Can I track multiple inventory locations?", content: "Absolutely. You can monitor stock levels across every location you define within the dashboard." },
-        {
+        { id: "f3", title: "What kind of financial reports are included?", content: "We generate profit/loss statements, revenue breakdowns, and expense tracking reports automatically." },
-          id: "f2",          title: "Can I track multiple inventory locations?",          content: "Absolutely. You can monitor stock levels across every location you define within the dashboard."},
-        {
-          id: "f3",          title: "What kind of financial reports are included?",          content: "We generate profit/loss statements, revenue breakdowns, and expense tracking reports automatically."},
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/customer-care-webpage-interface-word_53876-134070.jpg"
       title="Frequently Asked Questions"
@@ -171,12 +161,8 @@ export default function LandingPage() {
       title="Operational insights"
       description="Best practices for your ecommerce growth."
       blogs={[
-        {
+        { id: "b1", category: "Scaling", title: "5 ways to manage inventory growth", excerpt: "Scaling inventory needs requires a system, not just more spreadsheets.", imageSrc: "http://img.b2bpic.net/free-photo/delivery-package-smartphone-screen-dark-blue-background-express-delivery-online-shopping-order-tracking-delivery-app-concept-3d-polygonal-digital-illustration_493343-29983.jpg", authorName: "ECommerce OS", authorAvatar: "http://img.b2bpic.net/free-photo/portrait-male-personal-shopper-working_23-2148924142.jpg", date: "Oct 12" },
-          id: "b1",          category: "Scaling",          title: "5 ways to manage inventory growth",          excerpt: "Scaling inventory needs requires a system, not just more spreadsheets.",          imageSrc: "http://img.b2bpic.net/free-photo/delivery-package-smartphone-screen-dark-blue-background-express-delivery-online-shopping-order-tracking-delivery-app-concept-3d-polygonal-digital-illustration_493343-29983.jpg",          authorName: "ECommerce OS",          authorAvatar: "http://img.b2bpic.net/free-photo/portrait-male-personal-shopper-working_23-2148924142.jpg",          date: "Oct 12"},
+        { id: "b2", category: "Finances", title: "Understanding your cash flow", excerpt: "The difference between revenue and profit in ecommerce environments.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-accounting-sales-statistics-computer-display_482257-122982.jpg", authorName: "ECommerce OS", authorAvatar: "http://img.b2bpic.net/free-photo/middle-eastern-businessman-does-daily-tasks-corporate-job_482257-116713.jpg", date: "Oct 15" }
-        {
-          id: "b2",          category: "Finances",          title: "Understanding your cash flow",          excerpt: "The difference between revenue and profit in ecommerce environments.",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-accounting-sales-statistics-computer-display_482257-122982.jpg",          authorName: "ECommerce OS",          authorAvatar: "http://img.b2bpic.net/free-photo/middle-eastern-businessman-does-daily-tasks-corporate-job_482257-116713.jpg",          date: "Oct 15"},
-        {
-          id: "b3",          category: "Operations",          title: "Automation for small stores",          excerpt: "How to reclaim 10 hours a week by automating your stock reports.",          imageSrc: "http://img.b2bpic.net/free-vector/dark-purple-stock-trading-infographic-template-design_53876-100724.jpg",          authorName: "ECommerce OS",          authorAvatar: "http://img.b2bpic.net/free-photo/people-having-dinner-luxurious-restaurants_23-2151081911.jpg",          date: "Oct 20"},
       ]}
     />
   </div>
@@ -184,13 +170,9 @@ export default function LandingPage() {
   <div id="contact" data-section="contact">
       <ContactText
       useInvertedBackground={true}
-      background={{
+      background={{ variant: "sparkles-gradient" }}
-        variant: "sparkles-gradient"}}
       text="Ready to unify your store operations? Join the future of ecommerce."
-      buttons={[
+      buttons={[{ text: "Start free dashboard", href: "#" }]}
-        {
-          text: "Start free dashboard",          href: "#"},
-      ]}
     />
   </div>
 
@@ -198,34 +180,9 @@ export default function LandingPage() {
       <FooterBaseReveal
       logoText="ECommerce OS"
       columns={[
-        {
+        { title: "Platform", items: [{ label: "About Us", href: "#about" }, { label: "Features", href: "#features" }] },
-          title: "Platform",          items: [
+        { title: "Company", items: [{ label: "Blog", href: "#blog" }, { label: "Contact", href: "#contact" }] },
-            {
+        { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
-              label: "About Us",              href: "#about"},
-            {
-              label: "Features",              href: "#features"},
-            {
-              label: "Pricing",              href: "#"},
-          ],
-        },
-        {
-          title: "Company",          items: [
-            {
-              label: "Blog",              href: "#"},
-            {
-              label: "Contact",              href: "#contact"},
-            {
-              label: "Careers",              href: "#"},
-          ],
-        },
-        {
-          title: "Legal",          items: [
-            {
-              label: "Privacy Policy",              href: "#"},
-            {
-              label: "Terms of Service",              href: "#"},
-          ],
-        },
       ]}
     />
   </div>