"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import { Award, Sparkles, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-bubble"
        defaultTextAnimation="background-highlight"
        borderRadius="rounded"
        contentWidth="smallMedium"
        sizing="largeSmallSizeLargeTitles"
        background="fluid"
        cardStyle="gradient-radial"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="solid"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        {
          name: "Home",          id: "#home"},
        {
          name: "About Us",          id: "#about"},
        {
          name: "Features",          id: "#features"},
        {
          name: "Products",          id: "#products"},
        {
          name: "Pricing",          id: "#pricing"},
        {
          name: "Testimonials",          id: "#testimonials"},
        {
          name: "FAQ",          id: "#faq"},
        {
          name: "Contact",          id: "#contact"},
      ]}
      brandName="SMESolutions"
      button={{
        text: "Get a Quote",        href: "#contact"}}
    />
  </div>

  <div id="home" data-section="home">
      <HeroBillboard
      background={{
        variant: "plain"}}
      title="Empowering Your Business Growth with Smart Solutions"
      description="Unlock your full potential with tailored technology and strategic insights designed for small and medium enterprises. We help you thrive in the digital era."
      buttons={[
        {
          text: "Get Started",          href: "#contact"},
        {
          text: "Learn More",          href: "#about"},
      ]}
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/business-man-working-late-office_23-2148991382.jpg",          alt: "Sarah Johnson"},
        {
          src: "http://img.b2bpic.net/free-photo/elegant-businessman_23-2148012927.jpg",          alt: "Michael Chen"},
        {
          src: "http://img.b2bpic.net/free-photo/office-worker-preparing-business-competition_23-2149496715.jpg",          alt: "Emily Rodriguez"},
        {
          src: "http://img.b2bpic.net/free-photo/pensive-man-protective-helmet-holding-tablet-looking-away_74855-16420.jpg",          alt: "David Kim"},
        {
          src: "http://img.b2bpic.net/free-photo/serious-business-woman-working-office_1398-1451.jpg",          alt: "Maria Gomez"},
      ]}
      avatarText="Join 500+ satisfied SMEs"
      imageSrc="http://img.b2bpic.net/free-photo/admin-working-green-screen-desktop-pc-data-center_482257-125067.jpg"
      imageAlt="Modern software dashboard with analytics"
      mediaAnimation="slide-up"
      marqueeItems={[
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/empty-interior-forex-market-exchange-company-office-with-financial-data-growth-charts-multiple-displays-workspace-equipped-with-workstation-having-finance-statistics-real-time-graph_482257-44513.jpg",          alt: "Business analytics dashboard"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/business-people-working-project_1098-21554.jpg",          alt: "Team collaboration interface"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/cloud-storage-background-business-network-design_53876-160252.jpg",          alt: "Secure cloud network"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/customer-relationship-management-concept_23-2150038402.jpg",          alt: "Customer relationship management system"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/modern-equipped-computer-lab_23-2149241207.jpg",          alt: "Financial planning software"},
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <MetricSplitMediaAbout
      useInvertedBackground={true}
      title="Your Partner in Digital Transformation"
      description="At SMESolutions, we provide comprehensive services that empower small and medium enterprises to thrive in the digital age. From optimizing operations to enhancing customer engagement, we're dedicated to your success, delivering real results and sustainable growth."
      metrics={[
        {
          value: "150+",          title: "Projects Completed"},
        {
          value: "98%",          title: "Client Satisfaction"},
        {
          value: "10+",          title: "Years Experience"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/people-table-office-meeting_23-2148817063.jpg?_wi=1"
      imageAlt="Business professionals collaborating in a modern office"
      mediaAnimation="slide-up"
      metricsAnimation="slide-up"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyNine
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      features={[
        {
          title: "Integrated CRM & Sales Automation",          description: "Manage customer relationships, automate sales processes, and improve your conversion rates with our powerful CRM tools. Track leads from first contact to closed deal.",          imageSrc: "http://img.b2bpic.net/free-photo/review-evaluation-satisfaction-customer-service-feedback-sign-icon_53876-123854.jpg?_wi=1",          imageAlt: "CRM system illustration",          titleImageSrc: "http://img.b2bpic.net/free-photo/social-media-still-life-flat-lay_23-2149019145.jpg",          buttonText: "Learn More"},
        {
          title: "Advanced Data Analytics & Reporting",          description: "Gain deep insights into your business performance with comprehensive data analytics and customizable reporting dashboards. Make data-driven decisions confidently.",          imageSrc: "http://img.b2bpic.net/free-photo/map-statistical-information-with-smartwatch-background_1134-389.jpg?_wi=1",          imageAlt: "Data analytics illustration",          titleImageSrc: "http://img.b2bpic.net/free-vector/flat-elements-about-seo_1045-246.jpg",          buttonText: "Discover Insights"},
        {
          title: "Cloud Infrastructure & Security",          description: "Ensure your data is secure and accessible with robust cloud infrastructure and cutting-edge cybersecurity measures. Scale your operations reliably and safely.",          imageSrc: "http://img.b2bpic.net/free-photo/employee-using-laptop-oversee-data-center-machines_482257-125806.jpg?_wi=1",          imageAlt: "Cloud infrastructure illustration",          titleImageSrc: "http://img.b2bpic.net/free-photo/cybersecurity-concept-shield-protecting-data_23-2152001124.jpg",          buttonText: "Explore Security"},
      ]}
      title="Streamline Operations, Maximize Impact"
      description="Discover our core solutions designed to simplify your daily tasks and drive significant growth for your business. We offer integrated tools to boost efficiency and profitability."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardTwo
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={true}
      products={[
        {
          id: "p1",          brand: "SMESolutions",          name: "WorkFlow Pro",          price: "$49/month",          rating: 5,
          reviewCount: "120",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-accounting-sales-statistics-computer-display_482257-122982.jpg?_wi=1",          imageAlt: "Workflow Pro software screenshot"},
        {
          id: "p2",          brand: "SMESolutions",          name: "Insight CRM",          price: "$69/month",          rating: 5,
          reviewCount: "95",          imageSrc: "http://img.b2bpic.net/free-photo/executive-workspace-features-digital-dashboard-with-financial-charts_482257-123845.jpg?_wi=1",          imageAlt: "Insight CRM software screenshot"},
        {
          id: "p3",          brand: "SMESolutions",          name: "DataVault Secure",          price: "$39/month",          rating: 4,
          reviewCount: "80",          imageSrc: "http://img.b2bpic.net/free-photo/cloud-security-data-protection-illustration_23-2151998474.jpg?_wi=1",          imageAlt: "DataVault Secure software screenshot"},
        {
          id: "p4",          brand: "SMESolutions",          name: "MarketPulse AI",          price: "$79/month",          rating: 5,
          reviewCount: "110",          imageSrc: "http://img.b2bpic.net/free-photo/supply-chain-representation-with-transportation-vehicles_52683-99737.jpg?_wi=1",          imageAlt: "MarketPulse AI software screenshot"},
        {
          id: "p5",          brand: "SMESolutions",          name: "FinAccel ERP",          price: "$99/month",          rating: 4,
          reviewCount: "70",          imageSrc: "http://img.b2bpic.net/free-photo/manager-watches-tablet-with-greenscreen_482257-76577.jpg?_wi=1",          imageAlt: "FinAccel ERP software screenshot"},
        {
          id: "p6",          brand: "SMESolutions",          name: "ConnectHR",          price: "$59/month",          rating: 5,
          reviewCount: "85",          imageSrc: "http://img.b2bpic.net/free-photo/person-typing-into-ai-chatbot-system-automate-her-workflow-home-office_482257-122978.jpg?_wi=1",          imageAlt: "ConnectHR software screenshot"},
      ]}
      title="Explore Our Enterprise Software Suite"
      description="Browse our curated selection of powerful software tools, each designed to address specific business needs and boost productivity across your organization."
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardFive
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      plans={[
        {
          id: "basic",          tag: "Starter",          tagIcon: Sparkles,
          price: "$99",          period: "/month",          description: "Ideal for new businesses establishing their digital presence and basic operational needs.",          button: {
            text: "Choose Starter",            href: "#contact"},
          featuresTitle: "Includes:",          features: [
            "Basic CRM & Contact Management",            "Cloud Storage (100GB)",            "Standard Analytics Dashboard",            "Email Support"],
        },
        {
          id: "pro",          tag: "Pro",          tagIcon: Zap,
          price: "$249",          period: "/month",          description: "Perfect for growing businesses needing enhanced tools and deeper insights to scale efficiently.",          button: {
            text: "Choose Pro",            href: "#contact"},
          featuresTitle: "Everything in Starter, plus:",          features: [
            "Advanced CRM & Sales Automation",            "Cloud Storage (1TB)",            "Customizable Analytics & Reports",            "Priority Email & Chat Support",            "24/7 Monitoring & Security"],
        },
        {
          id: "enterprise",          tag: "Enterprise",          tagIcon: Award,
          price: "Custom",          period: "/month",          description: "Tailored solutions for large SMEs requiring comprehensive integration and dedicated support.",          button: {
            text: "Contact Sales",            href: "#contact"},
          featuresTitle: "Everything in Pro, plus:",          features: [
            "Dedicated Account Manager",            "Unlimited Cloud Storage",            "On-site Implementation & Training",            "24/7 Phone & Technical Support",            "Advanced Security Compliance"],
        },
      ]}
      title="Flexible Plans for Every Business Stage"
      description="Choose a solution that scales with your ambition. Our transparent pricing ensures you get the best value without hidden costs, designed for small to medium enterprises."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSixteen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      testimonials={[
        {
          id: "1",          name: "Sarah Johnson",          role: "CEO",          company: "TechInnovate Inc.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/people-working-as-team-company_23-2149136872.jpg",          imageAlt: "Sarah Johnson"},
        {
          id: "2",          name: "Michael Chen",          role: "Founder",          company: "GrowthForge",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",          imageAlt: "Michael Chen"},
        {
          id: "3",          name: "Emily Rodriguez",          role: "Marketing Director",          company: "DigitalCraft",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/middle-aged-bald-man-suit-wearing-glasses-doing-selfie-using-smartphone-happy_141793-61983.jpg",          imageAlt: "Emily Rodriguez"},
        {
          id: "4",          name: "David Kim",          role: "Operations Manager",          company: "LogiSync Solutions",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/man-warehouse-carrying-box_23-2148923107.jpg",          imageAlt: "David Kim"},
        {
          id: "5",          name: "Maria Gomez",          role: "Finance Controller",          company: "Apex Accounting",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/general-director-examining-statistics-big-data-computer-control-room_482257-90941.jpg",          imageAlt: "Maria Gomez"},
      ]}
      kpiItems={[
        {
          value: "+30%",          label: "Revenue Growth"},
        {
          value: "-25%",          label: "Operational Costs"},
        {
          value: "2x",          label: "Efficiency Boost"},
      ]}
      title="What Our Clients Say About SMESolutions"
      description="Hear from business leaders who have experienced significant growth and efficiency improvements with our tailored solutions."
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "Innovate Ventures",        "Global Dynamics",        "FutureTech Solutions",        "Synergy Partners",        "Apex Corp",        "Stratagem Group",        "Elite Industries"]}
      title="Trusted by Leading SMEs"
      description="Our commitment to excellence has earned the trust of diverse small and medium enterprises across various industries. Partner with the best to achieve your business goals."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitMedia
      textboxLayout="default"
      useInvertedBackground={true}
      faqs={[
        {
          id: "faq1",          title: "What kind of businesses do you support?",          content: "We specialize in providing solutions for Small and Medium Enterprises (SMEs) across various industries, including tech, services, retail, and more. Our adaptable platforms cater to diverse business models."},
        {
          id: "faq2",          title: "How long does implementation take?",          content: "Implementation timelines vary depending on the complexity of your needs and the chosen solutions. We work closely with you to ensure a smooth, efficient rollout, typically ranging from a few weeks to a couple of months."},
        {
          id: "faq3",          title: "Do you offer ongoing support?",          content: "Absolutely! All our plans include comprehensive support options, from email and chat to dedicated account management for enterprise clients. We're here to ensure your continuous success."},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/mobile-up-map_1134-208.jpg"
      imageAlt="Customer support illustration with diverse people"
      mediaAnimation="slide-up"
      title="Frequently Asked Questions"
      description="Find quick answers to the most common questions about our services, pricing, and how we help businesses achieve their objectives."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Ready to Transform Your Business?"
      description="Contact us today for a personalized consultation and discover how our tailored solutions can empower your enterprise to reach new heights."
      imageSrc="http://img.b2bpic.net/free-photo/focused-business-group-standing-talking-office-talking-discussing-project-work-issues-copy-space-business-communication-briefing-concept_74855-11708.jpg"
      imageAlt="Modern office meeting room"
      mediaAnimation="slide-up"
      mediaPosition="right"
      inputs={[
        { name: "name", type: "text", placeholder: "Your Name", required: true },
        { name: "email", type: "email", placeholder: "Your Email", required: true },
        { name: "subject", type: "text", placeholder: "Subject", required: false },
      ]}
      textarea={{
        name: "message",        placeholder: "Your Message",        rows: 5,
        required: true,
      }}
      buttonText="Send Message"
      onSubmit={(data) => console.log("Form submitted:", data)}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterMedia
      imageSrc="http://img.b2bpic.net/free-photo/high-rise-buildings-modern-city_1359-899.jpg?_wi=1"
      imageAlt="Panoramic cityscape at night"
      logoText="SMESolutions"
      columns={[
        {
          title: "Solutions",          items: [
            {
              label: "CRM & Sales",              href: "#features"},
            {
              label: "Analytics",              href: "#features"},
            {
              label: "Cloud & Security",              href: "#features"},
            {
              label: "Products",              href: "#products"},
          ],
        },
        {
          title: "Company",          items: [
            {
              label: "About Us",              href: "#about"},
            {
              label: "Pricing",              href: "#pricing"},
            {
              label: "Contact",              href: "#contact"},
            {
              label: "Testimonials",              href: "#testimonials"},
          ],
        },
        {
          title: "Resources",          items: [
            {
              label: "FAQ",              href: "#faq"},
            {
              label: "Support",              href: "#contact"},
            {
              label: "Terms of Service",              href: "#"},
            {
              label: "Privacy Policy",              href: "#"},
          ],
        },
      ]}
      copyrightText="© 2024 SMESolutions. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
