"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Award, Clock, Lightbulb, Shield, TrendingUp, Users, Zap } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="small"
      sizing="mediumLarge"
      background="circleGradient"
      cardStyle="inset"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Work", id: "work" },
            { name: "Writing", id: "writing" },
            { name: "Contact", id: "contact" }
          ]}
          button={{ text: "Get in touch", href: "contact" }}
          brandName="Founder"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboard
          logoText="Founder & Operator"
          description="Building thoughtful products and leading teams with clarity, discipline, and purpose. Focused on sustainable growth and meaningful impact."
          buttons={[
            { text: "Explore my work", href: "work" },
            { text: "Let's talk", href: "contact" }
          ]}
          background={{ variant: "plain" }}
          imageSrc="https://img.b2bpic.net/free-photo/dark-blonde-bearded-man-crosses-his-hands-chest-posing-black-shirt_8353-1116.jpg"
          imageAlt="Founder portrait"
          frameStyle="card"
        />
      </div>

      <div id="about" data-section="about">
        <MediaSplitTabsAbout
          title="Philosophy & Approach"
          description="How I think about building and leading"
          tabs={[
            {
              id: "operator",              label: "Operator",              description: "I believe in hands-on leadership, deep operational understanding, and building systems that scale. Excellence comes from attention to detail at every level."
            },
            {
              id: "learner",              label: "Learner",              description: "Continuous learning shapes how I lead. I actively seek feedback, study best practices across industries, and evolve my thinking based on evidence and results."
            },
            {
              id: "builder",              label: "Builder",              description: "I'm driven by creating something of lasting value. From product to team culture, I focus on sustainable foundations that compound over time."
            },
            {
              id: "strategist",              label: "Strategist",              description: "Clear strategy aligned with execution separates good intentions from real results. I think in systems, second-order effects, and long-term compounding."
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/composition-workplace-with-vase-laptop-desk_23-2148225531.jpg"
          imageAlt="Minimal workspace setup"
          imagePosition="right"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="work" data-section="work">
        <FeatureHoverPattern
          title="Core Expertise"
          description="Areas where I create measurable impact and bring unique perspective"
          features={[
            {
              icon: Zap,
              title: "Product Strategy",              description: "From idea to market fit, building products that solve real problems and scale with intentionality."
            },
            {
              icon: Users,
              title: "Team Building",              description: "Recruiting, developing, and leading high-performing teams aligned around clear mission and values."
            },
            {
              icon: TrendingUp,
              title: "Growth",              description: "Sustainable acquisition strategies, retention optimization, and building flywheel effects that compound."
            },
            {
              icon: Shield,
              title: "Operational Excellence",              description: "Systems thinking, process design, and execution discipline that enable scaling without sacrificing quality."
            },
            {
              icon: Lightbulb,
              title: "Strategic Thinking",              description: "Long-term vision setting, competitive positioning, and navigating complex business environments."
            },
            {
              icon: Award,
              title: "Fundraising",              description: "Building investor relationships, compelling narratives, and securing capital aligned with company vision."
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardOne
          title="Impact & Results"
          description="Measurable outcomes from leadership and strategic direction"
          metrics={[
            {
              id: "1",              value: "8",              title: "years",              description: "Building and scaling companies from early stage to profitability",              icon: Clock
            },
            {
              id: "2",              value: "150%",              title: "growth",              description: "Average annual revenue growth across portfolio companies",              icon: TrendingUp
            },
            {
              id: "3",              value: "50+",              title: "team",              description: "People directly coached and developed into leadership roles",              icon: Users
            },
            {
              id: "4",              value: "$30M",              title: "capital",              description: "Raised across multiple funding rounds and companies",              icon: Zap
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSixteen
          title="What Others Say"
          description="Feedback from founders, investors, and team members I've worked with"
          testimonials={[
            {
              id: "1",              name: "Sarah Chen",              role: "CEO",              company: "TechVenture",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              imageAlt: "Sarah Chen"
            },
            {
              id: "2",              name: "Marcus Johnson",              role: "Founder",              company: "GrowthLabs",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg",              imageAlt: "Marcus Johnson"
            },
            {
              id: "3",              name: "Elena Rodriguez",              role: "VP Products",              company: "ScaleUp Inc",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiley-business-man_23-2148514859.jpg",              imageAlt: "Elena Rodriguez"
            },
            {
              id: "4",              name: "David Park",              role: "Investor",              company: "Forward Fund",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg",              imageAlt: "David Park"
            }
          ]}
          kpiItems={[
            { value: "4.9/5", label: "Average rating" },
            { value: "12+", label: "Companies advised" },
            { value: "95%", label: "Would recommend" }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="writing" data-section="writing">
        <BlogCardOne
          title="Latest Insights"
          description="Thoughts on product, leadership, and building sustainable businesses"
          blogs={[
            {
              id: "1",              category: "Strategy",              title: "Building Founder-Friendly Operations",              excerpt: "How operational discipline and clear systems enable founders to scale without losing their identity or vision.",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-person-working-home-night_23-2149090964.jpg",              imageAlt: "Building operations blog post",              authorName: "Founder",              authorAvatar: "https://img.b2bpic.net/free-photo/dark-blonde-bearded-man-crosses-his-hands-chest-posing-black-shirt_8353-1116.jpg",              date: "15 Jan 2025"
            },
            {
              id: "2",              category: "Leadership",              title: "The Operator's Mindset in Growth Stages",              excerpt: "Why detailed operational thinking separates companies that scale from those that plateau at critical inflection points.",              imageSrc: "https://img.b2bpic.net/free-photo/young-woman-with-glasses-cafe_273609-3980.jpg",              imageAlt: "Growth stage blog post",              authorName: "Founder",              authorAvatar: "https://img.b2bpic.net/free-photo/dark-blonde-bearded-man-crosses-his-hands-chest-posing-black-shirt_8353-1116.jpg",              date: "8 Jan 2025"
            },
            {
              id: "3",              category: "Insights",              title: "Hiring for Leverage: Building Teams That Multiply Your Impact",              excerpt: "The framework I use to hire people who don't just fill roles, but multiply organizational effectiveness and culture.",              imageSrc: "https://img.b2bpic.net/free-photo/media-journalism-global-daily-news-content-concept_53876-123733.jpg",              imageAlt: "Hiring and leverage blog post",              authorName: "Founder",              authorAvatar: "https://img.b2bpic.net/free-photo/dark-blonde-bearded-man-crosses-his-hands-chest-posing-black-shirt_8353-1116.jpg",              date: "1 Jan 2025"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          carouselMode="buttons"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Let's connect"
          description="Whether you're exploring collaboration, seeking advice, or just want to have a thoughtful conversation—I'd love to hear from you."
          inputs={[
            { name: "name", type: "text", placeholder: "Your name", required: true },
            { name: "email", type: "email", placeholder: "Your email", required: true },
            { name: "company", type: "text", placeholder: "Company or project", required: false }
          ]}
          textarea={{
            name: "message",            placeholder: "Share what's on your mind...",            rows: 5,
            required: true
          }}
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-photo/team-diverse-coworkers-modern-office-discuss-their-project-together_93675-133516.jpg"
          imageAlt="Team collaboration"
          mediaPosition="right"
          buttonText="Send message"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={[
            {
              title: "Navigate",              items: [
                { label: "Home", href: "#hero" },
                { label: "About", href: "#about" },
                { label: "Work", href: "#work" },
                { label: "Writing", href: "#writing" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "LinkedIn", href: "https://linkedin.com" },
                { label: "Twitter", href: "https://twitter.com" },
                { label: "Email", href: "mailto:contact@example.com" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Articles", href: "#writing" },
                { label: "Speaking", href: "#" },
                { label: "Advising", href: "#" },
                { label: "Projects", href: "#" }
              ]
            }
          ]}
          bottomLeftText="© 2025 Founder. All rights reserved."
          bottomRightText="Designed with intention and built for clarity."
        />
      </div>
    </ThemeProvider>
  );
}