"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroBillboardCarouselSplit from '@/components/sections/hero/HeroBillboardCarouselSplit';
import TagAbout from '@/components/sections/about/TagAbout';
import MetricCardTen from '@/components/sections/metrics/MetricCardTen';
import TeamCardSix from '@/components/sections/team/TeamCardSix';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Linkedin, Twitter, Globe, Zap, Sparkles } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="mediumLarge"
      sizing="mediumLarge"
      background="aurora"
      cardStyle="glass-elevated"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Joule VC"
          navItems={[
            { name: "Approach", id: "approach" },
            { name: "Team", id: "team" },
            { name: "Portfolio", id: "portfolio" },
            { name: "Contact", id: "contact" }
          ]}
          button={{ text: "Book a Call", href: "#contact" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardCarouselSplit
          title="Fuel Innovation from Atlanta"
          mediaItems={[
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391970436-37n7t9v9.jpg", imageAlt: "founders startup meeting tech entrepreneurs" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391971052-5paod60c.jpg", imageAlt: "team collaboration" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391971396-8z0vqol9.jpg", imageAlt: "innovation workspace" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391971803-ej8f6jxf.jpg", imageAlt: "strategy session" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391976173-y73rbzo8.jpg", imageAlt: "founder success" }
          ]}
          buttons={[
            { text: "Start Your Journey", href: "#contact" },
            { text: "View Portfolio", href: "#portfolio" }
          ]}
        />
      </div>

      <div id="approach" data-section="approach">
        <TagAbout
          tag="Why us"
          description="We believe in founders who dare to build. Joule VC partners with ambitious Israeli and American founders to scale breakthrough companies. We provide capital, expertise, and network to turn vision into reality."
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="portfolio" data-section="portfolio">
        <MetricCardTen
          title="Our Impact"
          description="Joule VC drives results across portfolio companies"
          metrics={[
            { id: "1", title: "Capital Deployed", subtitle: "Supporting innovation worldwide", category: "Investment", value: "$500M+" },
            { id: "2", title: "Portfolio Companies", subtitle: "Building the future", category: "Growth", value: "45+" },
            { id: "3", title: "Unicorn Exits", subtitle: "Industry-transforming successes", category: "Success", value: "8" },
            { id: "4", title: "Average Return", subtitle: "Exceptional investor outcomes", category: "Performance", value: "3x" }
          ]}
          carouselMode="auto"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardSix
          title="Meet Our Partners"
          description="Seasoned operators and investors dedicated to founder success"
          members={[
            {
              id: "1",
              name: "David Chen",
              role: "Founding Partner",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391971052-5paod60c.jpg",
              imageAlt: "David Chen, Founding Partner"
            },
            {
              id: "2",
              name: "Rachel Goldman",
              role: "Partner, Operations",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391971396-8z0vqol9.jpg",
              imageAlt: "Rachel Goldman, Partner Operations"
            },
            {
              id: "3",
              name: "Michael Shapiro",
              role: "Partner, Growth",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391971803-ej8f6jxf.jpg",
              imageAlt: "Michael Shapiro, Partner Growth"
            },
            {
              id: "4",
              name: "Sarah Ivanova",
              role: "Investment Director",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391976173-y73rbzo8.jpg",
              imageAlt: "Sarah Ivanova, Investment Director"
            },
            {
              id: "5",
              name: "Yom Tov",
              role: "Tech Advisor",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391976473-pyurxsk4.jpg",
              imageAlt: "Yom Tov, Tech Advisor"
            },
            {
              id: "6",
              name: "Marcus Johnson",
              role: "Business Development",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391976886-2ze5293a.jpg",
              imageAlt: "Marcus Johnson, Business Development"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="blur-reveal"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTen
          title="What Founders Say"
          description="Hear from the leaders building tomorrow's companies"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          testimonials={[
            {
              id: "1",
              title: "Transformative Partnership",
              quote: "Joule VC didn't just provide capital—they provided strategic direction and opened doors we didn't know existed. Their network was transformative for our growth.",
              name: "Sarah Ivanova",
              role: "CEO & Co-founder",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391976173-y73rbzo8.jpg",
              imageAlt: "Sarah Ivanova"
            },
            {
              id: "2",
              title: "Perfect Market Fit",
              quote: "As an Israeli founder expanding to the US, Joule VC's dual expertise in both markets was invaluable. They truly understand our challenges.",
              name: "Yom Tov",
              role: "Founder & CTO",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391976473-pyurxsk4.jpg",
              imageAlt: "Yom Tov"
            },
            {
              id: "3",
              title: "Hands-On Investors",
              quote: "The team goes beyond traditional VC duties. They actively help recruit talent, navigate regulations, and connect us with strategic partners.",
              name: "Marcus Johnson",
              role: "CEO",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391976886-2ze5293a.jpg",
              imageAlt: "Marcus Johnson"
            },
            {
              id: "4",
              title: "True Partnership Commitment",
              quote: "Joule VC's hands-on approach and commitment to founder success made them the obvious choice. They're invested in our success, not just our exit.",
              name: "Liron Cohen",
              role: "Co-founder",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391977462-3pyh5z5x.jpg",
              imageAlt: "Liron Cohen"
            },
            {
              id: "5",
              title: "Rapid & Transparent Process",
              quote: "The investment process was transparent, thoughtful, and fast. From first meeting to funding took weeks, not months. That's rare in VC.",
              name: "Jennifer Wu",
              role: "CEO & Founder",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391978458-gt6h13nj.jpg",
              imageAlt: "Jennifer Wu"
            },
            {
              id: "6",
              title: "Global Perspective",
              quote: "Joule VC brings unique insights from Israeli startup success. Their global perspective combined with local Atlanta expertise is a winning combination.",
              name: "David Rothstein",
              role: "Founder",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391978763-0nm61w1h.jpg",
              imageAlt: "David Rothstein"
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="Frequently Asked Questions"
          description="Everything you need to know about partnering with Joule VC"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="smooth"
          faqs={[
            {
              id: "1",
              title: "What stage of companies do you invest in?",
              content: "We primarily focus on Series A and Series B companies, but we're open to exceptional seed-stage founders with strong traction. We look for founders solving significant problems with clear market opportunity."
            },
            {
              id: "2",
              title: "What's your typical investment size?",
              content: "We typically lead or co-lead rounds between $2M and $15M. We can participate in larger rounds and maintain a strong conviction in our portfolio companies."
            },
            {
              id: "3",
              title: "Do you invest outside of tech?",
              content: "While our expertise is strongest in technology and deep tech, we've backed companies in healthtech, climate tech, fintech, and enterprise software. We focus on innovation and scalability over industry."
            },
            {
              id: "4",
              title: "What geographic focus do you have?",
              content: "We're based in Atlanta and have deep expertise in Israel's startup ecosystem. We invest in founders anywhere, but we especially support Israeli founders expanding to the US market and American founders learning from Israeli innovation."
            },
            {
              id: "5",
              title: "How long does the investment process take?",
              content: "From initial conversation to term sheet typically takes 4-8 weeks. We move quickly on decisions and believe in transparent, efficient processes. No surprises."
            },
            {
              id: "6",
              title: "What support do you provide beyond capital?",
              content: "We provide strategic guidance, introductions to potential customers and partners, recruitment support, and access to our network of experienced founders and operators. We're actively engaged in portfolio company growth."
            },
            {
              id: "7",
              title: "Do you take board seats?",
              content: "For lead investments, we typically take a board seat or board observer role. This allows us to stay closely involved and provide strategic support at the board level."
            },
            {
              id: "8",
              title: "How do I apply for funding?",
              content: "The best way is to schedule a call with our team or request an introduction from someone in our network. You can also email pitch@joulevc.com with your deck and brief overview. We read everything."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Get Started"
          tagIcon={Sparkles}
          title="Ready to scale?"
          description="Let's have a conversation about your vision. We're excited to hear from ambitious founders building the future."
          useInvertedBackground="noInvert"
          buttonText="Schedule a Call"
          inputPlaceholder="your@email.com"
          onSubmit={(email) => {
            console.log("Contact submission:", email);
          }}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767391970436-37n7t9v9.jpg"
          imageAlt="footer background"
          logoText="Joule VC"
          columns={[
            {
              title: "Company",
              items: [
                { label: "About", href: "#approach" },
                { label: "Team", href: "#team" },
                { label: "Portfolio", href: "#portfolio" },
                { label: "Blog", href: "/blog" }
              ]
            },
            {
              title: "Resources",
              items: [
                { label: "Founder Guide", href: "/guide" },
                { label: "FAQ", href: "#faq" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              title: "Legal",
              items: [
                { label: "Privacy Policy", href: "/privacy" },
                { label: "Terms of Service", href: "/terms" }
              ]
            }
          ]}
          copyrightText="© 2025 Joule VC. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}