"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import MediaAbout from '@/components/sections/about/MediaAbout';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import TeamCardTwo from '@/components/sections/team/TeamCardTwo';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { Award, Github, Linkedin, Mail, Rocket, Target, Twitter, Users, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="medium"
      sizing="mediumLargeSizeMediumTitles"
      background="none"
      cardStyle="subtle-shadow"
      primaryButtonStyle="flat"
      secondaryButtonStyle="layered"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="StartupHub"
          navItems={[
            { name: "Features", id: "features" },
            { name: "Team", id: "team" },
            { name: "Investors", id: "investors" }
          ]}
          button={{ text: "Get Started", href: "contact" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroOverlay
          title="Build the Future of Innovation"
          description="Transform your ideas into reality with our cutting-edge platform. Join hundreds of startups that are already scaling globally."
          tag="Welcome to StartupHub"
          tagIcon={Rocket}
          imageSrc="https://img.b2bpic.net/free-photo/portrait-smiling-coworkers-looking-revenue-figures-paperwork_482257-126641.jpg"
          imageAlt="Dynamic startup team collaboration and innovation"
          textPosition="bottom-left"
          showBlur={true}
          showDimOverlay={false}
          buttons={[
            { text: "Launch Now", href: "contact" },
            { text: "Watch Demo", href: "#" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <MediaAbout
          title="Empowering the Next Generation of Startups"
          description="We provide founders with the tools, resources, and network they need to scale rapidly. Our platform combines advanced technology with expert mentorship to accelerate your growth."
          tag="Our Mission"
          tagIcon={Target}
          imageSrc="https://img.b2bpic.net/free-photo/portrait-smiling-coworkers-looking-revenue-figures-paperwork_482257-126641.jpg"
          imageAlt="StartupHub platform features"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Learn More", href: "features" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardNine
          title="Powerful Features"
          description="Everything you need to build and scale your startup"
          tag="Features"
          tagIcon={Zap}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          showStepNumbers={true}
          features={[
            {
              id: 1,
              title: "Real-Time Analytics",              description: "Track key metrics in real-time with intuitive dashboards that help you make data-driven decisions faster.",              phoneOne: { imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-coworkers-looking-revenue-figures-paperwork_482257-126641.jpg" },
              phoneTwo: { imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-coworkers-looking-revenue-figures-paperwork_482257-126641.jpg" }
            },
            {
              id: 2,
              title: "Global Network Access",              description: "Connect with investors, mentors, and fellow founders worldwide through our curated community platform.",              phoneOne: { imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-coworkers-looking-revenue-figures-paperwork_482257-126641.jpg" },
              phoneTwo: { imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-coworkers-looking-revenue-figures-paperwork_482257-126641.jpg" }
            },
            {
              id: 3,
              title: "Automated Compliance",              description: "Stay compliant with regulations across all jurisdictions with our intelligent, automated compliance system.",              phoneOne: { imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-coworkers-looking-revenue-figures-paperwork_482257-126641.jpg" },
              phoneTwo: { imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-coworkers-looking-revenue-figures-paperwork_482257-126641.jpg" }
            }
          ]}
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardTwo
          title="Meet Our Team"
          description="Experienced leaders dedicated to your startup success"
          tag="Leadership"
          tagIcon={Users}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          members={[
            {
              id: "1",              name: "Sarah Chen",              role: "Founder & CEO",              description: "Former VP at Google with 15+ years in tech. Serial entrepreneur building the future.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-grey-haired-businessman-standing_74855-10324.jpg",              imageAlt: "Sarah Chen, CEO",              socialLinks: [
                { icon: Twitter, url: "https://twitter.com" },
                { icon: Linkedin, url: "https://linkedin.com" }
              ]
            },
            {
              id: "2",              name: "Marcus Rodriguez",              role: "CTO",              description: "Stanford CS grad. Built infrastructure for 3 unicorns. Passionate about scalable systems.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-businessman-sitting-sofa-waiting-area_107420-95816.jpg",              imageAlt: "Marcus Rodriguez, CTO",              socialLinks: [
                { icon: Github, url: "https://github.com" },
                { icon: Linkedin, url: "https://linkedin.com" }
              ]
            },
            {
              id: "3",              name: "Emma Walsh",              role: "Head of Design",              description: "Award-winning designer. Founded two design studios. User-centric design evangelist.",              imageSrc: "https://img.b2bpic.net/free-photo/cheerful-boss-sitting-with-newspaper-table_1098-3037.jpg",              imageAlt: "Emma Walsh, Head of Design",              socialLinks: [
                { icon: Twitter, url: "https://twitter.com" }
              ]
            },
            {
              id: "4",              name: "James Patterson",              role: "VP of Operations",              description: "Ex-McKinsey consultant. Scaled 5 companies to Series B. Operations excellence focused.",              imageSrc: "https://img.b2bpic.net/free-photo/serene-businessman-with-glasses_1098-719.jpg",              imageAlt: "James Patterson, VP Operations",              socialLinks: [
                { icon: Linkedin, url: "https://linkedin.com" },
                { icon: Twitter, url: "https://twitter.com" }
              ]
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCTA
          tag="Get in Touch"
          tagIcon={Mail}
          title="Ready to Join the Startup Revolution?"
          description="Let's discuss how StartupHub can accelerate your journey. Our team is ready to support your vision."
          useInvertedBackground="noInvert"
          background={{ variant: "plain" }}
          buttons={[
            { text: "Contact Us", href: "#" },
            { text: "Schedule Demo", href: "#" }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseReveal
          copyrightText="© 2025 StartupHub. All rights reserved."
          columns={[
            {
              title: "Product",              items: [
                { label: "Features", href: "features" },
                { label: "Pricing", href: "#" },
                { label: "Security", href: "#" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Documentation", href: "#" },
                { label: "Support", href: "#" },
                { label: "Contact", href: "contact" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}