"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroBillboardMetrics from '@/components/sections/hero/HeroBillboardMetrics';
import TextAbout from '@/components/sections/about/TextAbout';
import FeatureCardEleven from '@/components/sections/feature/FeatureCardEleven';
import ProductCardFive from '@/components/sections/product/ProductCardFive';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import ContactCenterForm from '@/components/sections/contact/ContactCenterForm';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Sparkles, Zap, Award } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="bounce-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="mediumLarge"
      sizing="mediumLargeSizeLargeTitles"
      background="noiseDiagonalGradient"
      cardStyle="spotlight"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="solid"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="CreativeFlow"
          navItems={[
            { name: "Services", id: "services" },
            { name: "Portfolio", id: "portfolio" },
            { name: "About", id: "about" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Get Started",            href: "contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardMetrics
          title="Transform Your Brand Story"
          description="Strategic marketing campaigns that drive growth, engagement, and lasting customer relationships. We blend creativity with data-driven insights to amplify your message."
          tag="Creative Agency"
          tagIcon={Sparkles}
          buttons={[
            { text: "Start Your Project", href: "contact" },
            { text: "View Our Work", href: "portfolio" }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/young-coworkers-sharing-concepts-together_329181-19755.jpg"
          imageAlt="Marketing team collaborating on strategy"
          frameStyle="browser"
          metricsLabel="Trusted by innovative brands worldwide"
          metrics={[
            { id: "1", value: "500+", label: "Campaigns Delivered" },
            { id: "2", value: "95%", label: "Client Satisfaction" },
            { id: "3", value: "150%", label: "Average ROI Growth" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <TextAbout
          title="We are a team of strategists, creators, and innovators dedicated to transforming how brands connect with their audiences through authentic, impactful marketing."
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Learn Our Approach", href: "services" }
          ]}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardEleven
          title="Our Creative Process"
          description="From strategy to execution, we guide every campaign through a proven methodology designed for measurable success."
          tag="How We Work"
          tagIcon={Zap}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          usePrimaryButtonImage={false}
          animationType="slide-up"
          features={[
            {
              id: 1,
              title: "Research & Strategy",              description: "Deep dive into market analysis, audience insights, and competitive landscape. We uncover opportunities and define a clear strategic direction for your brand.",              imageSrc: "https://img.b2bpic.net/free-photo/young-team-coworkers-working-project_273609-16267.jpg",              imageAlt: "Research and strategy planning"
            },
            {
              id: 2,
              title: "Creative Development",              description: "Our talented designers and copywriters craft compelling narratives and visuals. Every element is crafted to resonate with your target audience and stand out.",              imageSrc: "https://img.b2bpic.net/free-photo/young-team-coworkers-working-project_273609-16269.jpg",              imageAlt: "Creative design development"
            },
            {
              id: 3,
              title: "Campaign Launch & Optimization",              description: "Strategic execution across digital and traditional channels. We monitor performance in real-time, optimizing campaigns for maximum impact and ROI.",              imageSrc: "https://img.b2bpic.net/free-photo/colleagues-working-together-financial-report-using-modern-gadget_273609-5547.jpg",              imageAlt: "Campaign execution and launch"
            }
          ]}
        />
      </div>

      <div id="portfolio" data-section="portfolio">
        <ProductCardFive
          title="Our Portfolio"
          description="A showcase of campaigns that moved the needle for brands across industries."
          tag="Case Studies"
          tagIcon={Award}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          gridVariant="bento-grid"
          products={[
            {
              id: "1",              imageSrc: "https://img.b2bpic.net/free-photo/closeup-caucasian-man-drinking-coffee-with-computer-screen-showing-marketing-strategy_53876-23498.jpg",              imageAlt: "Award-winning brand campaign",              button: { text: "View Case Study" }
            },
            {
              id: "2",              imageSrc: "https://img.b2bpic.net/free-photo/digital-marketing-with-icons-business-people_53876-94833.jpg",              imageAlt: "Social media content strategy",              button: { text: "View Case Study" }
            },
            {
              id: "3",              imageSrc: "https://img.b2bpic.net/free-photo/marketing-strategy-connting-digital-devices-concept_53876-23053.jpg",              imageAlt: "Integrated marketing campaign",              button: { text: "View Case Study" }
            }
          ]
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="What Our Clients Say"
          description="Real results from brands we've transformed. Hear directly from our partners about their experience working with CreativeFlow."
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          speed={30}
          topMarqueeDirection="left"
          testimonials={[
            {
              id: "1",              name: "Sarah Mitchell",              handle: "CEO, InnovateTech",              testimonial: "CreativeFlow transformed our brand presence. Their strategic approach and creative execution delivered results beyond our expectations.",              imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-woman-posing-indoors_23-2149915935.jpg",              imageAlt: "Sarah Mitchell"
            },
            {
              id: "2",              name: "Michael Chen",              handle: "Marketing Director, GrowthCo",              testimonial: "Working with this team was a game-changer. They truly understand our industry and delivered campaigns that resonated with our audience.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-successful-businesswoman-looking-into-camera-sitting-restaurant-business-lady-with-stylish-hairstyle-wears-elegant-suit-business-meeting-attractive-appearance_8353-12611.jpg",              imageAlt: "Michael Chen"
            },
            {
              id: "3",              name: "Emily Rodriguez",              handle: "Founder, BrandStudio",              testimonial: "The level of attention to detail and strategic thinking is exceptional. They're not just vendors, they're true partners in our growth.",              imageSrc: "https://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg",              imageAlt: "Emily Rodriguez"
            },
            {
              id: "4",              name: "David Thompson",              handle: "CMO, RetailPro",              testimonial: "ROI on every campaign exceeded benchmarks. Their data-driven approach combined with creative excellence is unmatched.",              imageSrc: "https://img.b2bpic.net/free-photo/content-beautiful-businesswoman-standing-window_1262-1778.jpg",              imageAlt: "David Thompson"
            },
            {
              id: "5",              name: "Jessica Liu",              handle: "VP Marketing, StartupXYZ",              testimonial: "Professional, responsive, and incredibly creative. CreativeFlow elevated our entire marketing strategy and brand narrative.",              imageSrc: "https://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg",              imageAlt: "Jessica Liu"
            },
            {
              id: "6",              name: "Robert Anderson",              handle: "Director, DigitalVentures",              testimonial: "From concept to execution, every touchpoint was polished and strategic. Highly recommend for any serious marketing initiative.",              imageSrc: "https://img.b2bpic.net/free-photo/studio-portrait-successful-young-businesswoman_1262-5844.jpg",              imageAlt: "Robert Anderson"
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitText
          sideTitle="Frequently Asked Questions"
          sideDescription="Everything you need to know about working with CreativeFlow and how we can elevate your marketing."
          textPosition="left"
          useInvertedBackground="noInvert"
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "What services do you offer?",              content: "We provide comprehensive marketing services including brand strategy, digital marketing, creative design, content creation, social media management, and campaign optimization. Our team tailors solutions to your specific business goals."
            },
            {
              id: "2",              title: "How long does a typical campaign take?",              content: "Campaign timelines vary based on scope and complexity. Most projects begin with a 2-4 week strategy phase, followed by creative development and execution. We maintain flexibility to adapt to your timeline and market needs."
            },
            {
              id: "3",              title: "What is your pricing model?",              content: "We work with both project-based pricing and ongoing retainer agreements. Pricing depends on campaign scope, deliverables, and duration. We provide transparent quotes and detailed breakdowns for all engagements."
            },
            {
              id: "4",              title: "How do you measure campaign success?",              content: "We establish clear KPIs aligned with your business objectives before launching any campaign. We track metrics like engagement, conversion, ROI, brand awareness, and customer acquisition. Regular reporting keeps you informed every step of the way."
            },
            {
              id: "5",              title: "Can you work with my existing team?",              content: "Absolutely! We love collaborative partnerships. Whether you need us to lead strategy, support your internal team, or work alongside your existing agencies, we adapt to your organizational structure."
            },
            {
              id: "6",              title: "What industries do you specialize in?",              content: "We've successfully worked across tech, retail, healthcare, finance, SaaS, e-commerce, and consumer brands. Our diverse experience allows us to bring fresh perspectives and proven strategies to any industry."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenterForm
          title="Ready to Elevate Your Brand?"
          description="Let's discuss how CreativeFlow can transform your marketing strategy and drive measurable growth. Fill out the form below and our team will reach out within 24 hours."
          useInvertedBackground="noInvert"
          buttonText="Send Message"
          inputs={[
            { name: "fullName", type: "text", placeholder: "Your Name", required: true },
            { name: "email", type: "email", placeholder: "Email Address", required: true },
            { name: "company", type: "text", placeholder: "Company Name", required: true },
            { name: "projectType", type: "text", placeholder: "What type of marketing do you need?", required: true }
          ]}
          textarea={{
            name: "message",            placeholder: "Tell us about your goals and vision...",            rows: 5,
            required: true
          }}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="CreativeFlow"
          columns={[
            {
              items: [
                { label: "Services", href: "services" },
                { label: "Portfolio", href: "portfolio" },
                { label: "About", href: "about" }
              ]
            },
            {
              items: [
                { label: "Contact", href: "contact" },
                { label: "Resources", href: "resources" },
                { label: "Blog", href: "blog" }
              ]
            },
            {
              items: [
                { label: "Privacy Policy", href: "privacy" },
                { label: "Terms of Service", href: "terms" },
                { label: "Sitemap", href: "sitemap" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}