"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import MediaAbout from '@/components/sections/about/MediaAbout';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TeamCardSix from '@/components/sections/team/TeamCardSix';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Sparkles, ArrowRight, Users } from "lucide-react";
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="small"
      sizing="mediumSizeLargeTitles"
      background="none"
      cardStyle="layered-gradient"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Peak Productions"
          navItems={[
            { name: "About", id: "about" },
            { name: "Services", id: "services" },
            { name: "Portfolio", id: "portfolio" },
            { name: "Team", id: "team" }
          ]}
          button={{ text: "Get Started", href: "contact" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplit
          title="Transform Your Brand Into a Market Leader"
          description="Peak Productions crafts data-driven marketing strategies that turn brands into industry leaders. We combine creative excellence with measurable results."
          background={{ variant: "glowing-orb" }}
          tag="Marketing Agency"
          tagIcon={Sparkles}
          imageSrc="https://img.b2bpic.net/free-photo/colleagues-making-business-plan-meeting_176420-5099.jpg"
          imageAlt="Peak Productions marketing strategy team"
          imagePosition="right"
          buttons={[
            { text: "Start Your Project", href: "contact" },
            { text: "View Case Studies", href: "portfolio" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <MediaAbout
          title="Creative Strategy Meets Data-Driven Results"
          description="At Peak Productions, we believe exceptional marketing comes from blending creative innovation with strategic intelligence. Our team of experts works collaboratively to elevate your brand."
          tag="About Us"
          imageSrc="https://img.b2bpic.net/free-photo/young-coworkers-sharing-concepts-together_329181-19755.jpg"
          imageAlt="Peak Productions creative process collaboration"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Learn Our Process", href: "services" }
          ]}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardNineteen
          title="Our Services"
          description="Comprehensive marketing solutions designed to drive growth and establish your brand as an industry authority."
          tag="What We Do"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          features={[
            {
              id: 1,
              tag: "Brand Strategy",              title: "Brand Foundation",              subtitle: "Establish your unique market position",              description: "We develop comprehensive brand strategies that define your identity, messaging, and market positioning. From brand architecture to voice guidelines, we create the foundation for consistent, impactful communication across all channels.",              imageSrc: "https://img.b2bpic.net/free-photo/data-analytics-tablet_23-2151957101.jpg",              imageAlt: "Brand strategy development",              buttons: [{ text: "Explore", href: "#services" }]
            },
            {
              id: 2,
              tag: "Digital Marketing",              title: "Campaign Execution",              subtitle: "Drive measurable results across channels",              description: "Our integrated campaign approach spans social media, content marketing, SEO, and paid advertising. We craft data-backed campaigns that resonate with your audience and deliver ROI that matters.",              imageSrc: "https://img.b2bpic.net/free-photo/data-analytics-tablet_23-2151957101.jpg",              imageAlt: "Digital marketing campaigns",              buttons: [{ text: "Explore", href: "#services" }]
            },
            {
              id: 3,
              tag: "Creative Design",              title: "Visual Excellence",              subtitle: "Stunning design that captures attention",              description: "From logo design to full brand collateral, our creative team produces visually compelling work that sets you apart. Every design choice is intentional, strategic, and aligned with your brand vision.",              imageSrc: "https://img.b2bpic.net/free-photo/data-analytics-tablet_23-2151957101.jpg",              imageAlt: "Creative design services",              buttons: [{ text: "Explore", href: "#services" }]
            }
          ]}
        />
      </div>

      <div id="portfolio" data-section="portfolio">
        <ProductCardTwo
          title="Recent Case Studies"
          description="Explore our portfolio of successful projects that showcase our expertise in brand transformation and market growth."
          tag="Portfolio"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          gridVariant="three-columns-all-equal-width"
          products={[
            {
              id: "1",              brand: "TechStart Inc",              name: "Brand Repositioning Campaign",              price: "240% ROI",              rating: 5,
              reviewCount: "18 months",              imageSrc: "https://img.b2bpic.net/free-photo/woman-makes-patriotic-gingerbread-support-ukraine_169016-20150.jpg",              imageAlt: "TechStart brand repositioning case study"
            },
            {
              id: "2",              brand: "Luxury Fashion Co",              name: "Integrated Marketing Strategy",              price: "185% Growth",              rating: 5,
              reviewCount: "12 months",              imageSrc: "https://img.b2bpic.net/free-photo/business-colleagues-together-teamwork-working-office_53876-16024.jpg",              imageAlt: "Luxury Fashion integrated marketing case study"
            },
            {
              id: "3",              brand: "Health & Wellness",              name: "Digital Transformation",              price: "320% Engagement",              rating: 5,
              reviewCount: "9 months",              imageSrc: "https://img.b2bpic.net/free-photo/man-working-desk-top-view_23-2149930937.jpg",              imageAlt: "Health Wellness digital transformation case study"
            }
          ]}
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardSix
          title="Meet Our Team"
          description="Industry experts and creative visionaries united by a passion for transforming brands and driving business growth."
          tag="Our People"
          tagIcon={Users}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="slide-up"
          gridVariant="uniform-all-items-equal"
          members={[
            {
              id: "1",              name: "Alexandra Chen",              role: "Creative Director",              imageSrc: "https://img.b2bpic.net/free-photo/confident-business-team_23-2147807975.jpg",              imageAlt: "Alexandra Chen, Creative Director"
            },
            {
              id: "2",              name: "Marcus Johnson",              role: "Strategy Lead",              imageSrc: "https://img.b2bpic.net/free-photo/front-view-smiley-team-work_23-2149741178.jpg",              imageAlt: "Marcus Johnson, Strategy Lead"
            },
            {
              id: "3",              name: "Sarah Williams",              role: "Brand Designer",              imageSrc: "https://img.b2bpic.net/free-photo/full-shot-smiley-people-work_23-2149636310.jpg",              imageAlt: "Sarah Williams, Brand Designer"
            },
            {
              id: "4",              name: "David Rodriguez",              role: "Digital Strategist",              imageSrc: "https://img.b2bpic.net/free-photo/people-their-office-job-showing-inclusivity_23-2149571097.jpg",              imageAlt: "David Rodriguez, Digital Strategist"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="Peak Productions completely transformed our brand narrative and market presence. Their strategic approach combined with creative excellence delivered results that exceeded our expectations. We've seen a 240% increase in qualified leads since launching our new brand positioning."
          rating={5}
          author="James Mitchell, CEO of TechStart Inc"
          avatars={[
            { src: "https://img.b2bpic.net/free-photo/front-view-business-woman-suit_23-2148603018.jpg", alt: "James Mitchell" },
            { src: "https://img.b2bpic.net/free-photo/close-up-portrait-young-bearded-man-white-shirt-jacket-posing-camera-with-broad-smile-isolated-gray_171337-629.jpg", alt: "Emma Thompson" },
            { src: "https://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg", alt: "David Park" },
            { src: "https://img.b2bpic.net/free-photo/smiling-businessman-face-portrait-wearing-suit_53876-148135.jpg", alt: "Lisa Chen" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardTwo
          title="Our Impact"
          description="Proven results that demonstrate our commitment to client success and measurable marketing excellence."
          tag="Results"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="slide-up"
          gridVariant="uniform-all-items-equal"
          metrics={[
            {
              id: "1",              value: "150+",              description: "Successful Projects Completed"
            },
            {
              id: "2",              value: "95%",              description: "Client Satisfaction Rate"
            },
            {
              id: "3",              value: "$50M+",              description: "Generated Client Revenue"
            },
            {
              id: "4",              value: "15+",              description: "Years Combined Industry Experience"
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="Ready to Elevate Your Brand?"
          ctaDescription="Let's discuss how Peak Productions can transform your marketing strategy and drive measurable growth for your business."
          ctaButton={{ text: "Schedule a Consultation", href: "https://calendly.com" }}
          ctaIcon={ArrowRight}
          useInvertedBackground="noInvert"
          animationType="slide-up"
          faqs={[
            {
              id: "1",              title: "What is your typical project timeline?",              content: "Most projects range from 3-12 months depending on scope. We break complex strategies into phases with clear milestones and deliverables. Initial strategy development typically takes 4-6 weeks, followed by execution and optimization phases."
            },
            {
              id: "2",              title: "How do you measure campaign success?",              content: "We establish clear KPIs and metrics from the start of every project. Regular reporting includes ROI analysis, engagement metrics, conversion tracking, and brand lift measurements. Our clients receive monthly detailed reports with actionable insights."
            },
            {
              id: "3",              title: "Do you work with businesses of all sizes?",              content: "Yes, we work with startups, mid-market companies, and enterprises. We tailor our approach and service offerings to match your budget, timeline, and strategic objectives. Every business deserves world-class marketing strategy."
            },
            {
              id: "4",              title: "What makes Peak Productions different?",              content: "We combine data-driven strategy with creative excellence. Our integrated approach ensures every tactic aligns with your broader business goals. We don't just execute campaigns—we transform brands and drive lasting business impact."
            },
            {
              id: "5",              title: "How do you stay ahead of marketing trends?",              content: "Our team continuously studies industry developments, attends conferences, and maintains certifications in key platforms. We test emerging channels and tactics to identify what drives real results for your specific market and audience."
            },
            {
              id: "6",              title: "Can we see examples of your work?",              content: "Absolutely! We're proud of our portfolio and happy to share detailed case studies, metrics, and client testimonials. NDA permitting, we can show relevant examples in your industry during our initial consultation."
            }
          ]}
        />
      </div>

      <div id="feature_card_eight" data-section="feature_card_eight">
        <FeatureCardEight
          features={[{ title: "Strategic Branding", description: "Define your brand's identity and message to captivate your audience." }, { title: "Content Creation", description: "Craft compelling narratives and visuals that resonate with your target market." }, { title: "Market Analysis", description: "Gain insights into your industry and competitors to inform your marketing strategies." }]}
          title="Elevate Your Brand Strategy"
          description="Discover how we blend creativity and data to drive your brand's success."
          tag="Strategy"
          buttons={[{ label: "Learn More", href: "#" }, { label: "Contact Us", href: "#" }]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>
      <div id="footer" data-section="footer">
        <FooterBase
          logoText="Peak Productions"
          copyrightText="© 2025 Peak Productions. All rights reserved."
          columns={[
            {
              title: "Services",              items: [
                { label: "Brand Strategy", href: "services" },
                { label: "Digital Marketing", href: "services" },
                { label: "Creative Design", href: "services" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "about" },
                { label: "Our Team", href: "team" },
                { label: "Case Studies", href: "portfolio" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Contact Us", href: "contact" },
                { label: "LinkedIn", href: "https://linkedin.com" },
                { label: "Instagram", href: "https://instagram.com" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}