"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import TextAbout from '@/components/sections/about/TextAbout';
import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactText from '@/components/sections/contact/ContactText';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { Sparkles, Zap, Target, Palette, LineChart, Users, Megaphone } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="mediumLarge"
      sizing="medium"
      background="noiseDiagonalGradient"
      cardStyle="soft-shadow"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered 
          brandName="Stellar"
          navItems={[
            { name: "Services", id: "services" },
            { name: "Work", id: "work" },
            { name: "About", id: "about" },
            { name: "Insights", id: "insights" },
            { name: "Contact", id: "contact" }
          ]}
          button={{ text: "Get Started", href: "contact" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardCarousel
          title="Transform Your Brand's Digital Presence"
          description="Strategic marketing that drives growth. We blend creative excellence with data-driven insights to deliver campaigns that convert."
          tag="San Francisco Marketing Agency"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          background={{ variant: "sparkles-gradient" }}
          buttons={[
            { text: "Start Your Campaign", href: "contact" },
            { text: "View Our Work", href: "work" }
          ]}
          buttonAnimation="slide-up"
          mediaItems={[
            { imageSrc: "http://img.b2bpic.net/free-psd/creative-marketing-agency-social-media-story-design-template_47987-33977.jpg", imageAlt: "Digital campaign showcase" },
            { imageSrc: "http://img.b2bpic.net/free-photo/multiethnic-team-employees-meeting-break-have-fun-discussing-about-business-collaboration-happy-people-laughing-planning-marketing-project-office-handheld-shot_482257-43330.jpg", imageAlt: "Brand strategy workshop" },
            { imageSrc: "http://img.b2bpic.net/free-photo/modern-workspace-with-analytical-data-dashboards-displayed-devices_482257-126633.jpg", imageAlt: "Marketing analytics dashboard" },
            { imageSrc: "http://img.b2bpic.net/free-photo/businessmen-hands-wooden-table-with-documents-drafts_176420-372.jpg", imageAlt: "Creative design process" },
            { imageSrc: "http://img.b2bpic.net/free-photo/teamworking-startup-engineers-brainstorming-working-with-machine-learning_482257-118818.jpg", imageAlt: "Team collaboration space" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <TextAbout
          tag="About Stellar"
          title="We are a team of strategists, creatives, and technologists based in San Francisco, dedicated to building brands that matter and campaigns that move markets."
          useInvertedBackground={false}
          buttons={[
            { text: "Learn Our Story", href: "#" },
            { text: "Meet the Team", href: "#" }
          ]}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureBorderGlow
          title="Our Core Services"
          description="We deliver comprehensive marketing solutions that transform your brand and accelerate growth."
          tag="Services"
          tagAnimation="slide-up"
          features={[
            {
              icon: Zap,
              title: "Brand Strategy",              description: "Comprehensive positioning and messaging frameworks that define your market advantage and resonate with target audiences."
            },
            {
              icon: Target,
              title: "Digital Marketing",              description: "Results-driven campaigns across social, email, content, and paid channels optimized for maximum ROI and engagement."
            },
            {
              icon: Palette,
              title: "Creative Design",              description: "Compelling visual narratives including branding, web design, and content creation that captivate and convert."
            },
            {
              icon: LineChart,
              title: "Analytics & Optimization",              description: "Data-driven insights and continuous optimization to measure impact, refine strategy, and scale what works."
            },
            {
              icon: Users,
              title: "Social Strategy",              description: "End-to-end social media strategy, content planning, and community management that builds loyal audiences."
            },
            {
              icon: Megaphone,
              title: "Growth Marketing",              description: "Acquisition and retention strategies focused on sustainable business growth and customer lifetime value."
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="work" data-section="work">
        <BlogCardThree
          title="Featured Case Studies"
          description="Real results from brands we've transformed. Explore how we've driven growth across industries."
          tag="Our Work"
          tagAnimation="slide-up"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          blogs={[
            {
              id: "1",              category: "SaaS Growth",              title: "3x Revenue Growth in 12 Months",              excerpt: "How we repositioned a B2B SaaS platform and drove 300% annual growth through strategic content and paid acquisition.",              imageSrc: "http://img.b2bpic.net/free-photo/multi-ethnic-business-team-sitting-table-office-center-speaking-about-project-meeting-broadroom_482257-5077.jpg",              imageAlt: "SaaS platform growth metrics",              authorName: "Alex Chen",              authorAvatar: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              date: "Jan 2025"
            },
            {
              id: "2",              category: "E-Commerce",              title: "Turned First-Time Visitors into Repeat Customers",              excerpt: "A luxury retail brand's transformation through personalized email marketing and retention strategies that increased lifetime value by 250%.",              imageSrc: "http://img.b2bpic.net/free-photo/online-shopping-web-shop-e-shopping-concept_53876-124856.jpg",              imageAlt: "E-commerce customer engagement",              authorName: "Sarah Martinez",              authorAvatar: "http://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg",              date: "Dec 2024"
            },
            {
              id: "3",              category: "Brand Launch",              title: "Built a $5M Brand from Zero in 18 Months",              excerpt: "Complete go-to-market strategy for an innovative fintech startup including positioning, messaging, and integrated launch campaign.",              imageSrc: "http://img.b2bpic.net/free-photo/payment-solutions-financial-technology-with-businessman-using-tablet-background_53876-104203.jpg",              imageAlt: "Fintech brand launch campaign",              authorName: "Michael Zhang",              authorAvatar: "http://img.b2bpic.net/free-photo/smiling-business-leader-looking-through-window_1262-5623.jpg",              date: "Nov 2024"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="What Our Clients Say"
          description="Real feedback from founders and marketing leaders who've partnered with us."
          tag="Testimonials"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          animationType="slide-up"
          speed={40}
          testimonials={[
            {
              id: "1",              name: "Jessica Wong",              handle: "Founder, TechFlow",              testimonial: "Stellar transformed our marketing from scattered efforts into a cohesive strategy that actually drives revenue. Game-changer.",              imageSrc: "http://img.b2bpic.net/free-photo/confident-beautiful-young-businesswoman-looking-camera-head-shot-portrait_1163-4928.jpg?_wi=1",              imageAlt: "Jessica Wong"
            },
            {
              id: "2",              name: "David Patel",              handle: "CMO, CloudSync",              testimonial: "The team's strategic insights combined with creative execution delivered results that exceeded our aggressive growth targets.",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1",              imageAlt: "David Patel"
            },
            {
              id: "3",              name: "Emily Rodriguez",              handle: "VP Marketing, Innovate Inc",              testimonial: "Working with Stellar means partnering with experts who understand your business, not just executing tactics. Exceptional.",              imageSrc: "http://img.b2bpic.net/free-photo/confident-beautiful-young-businesswoman-looking-camera-head-shot-portrait_1163-4928.jpg?_wi=2",              imageAlt: "Emily Rodriguez"
            },
            {
              id: "4",              name: "James Kim",              handle: "Founder, GrowthLabs",              testimonial: "From strategy to execution, Stellar consistently delivers campaigns that perform. They're our go-to agency.",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2",              imageAlt: "James Kim"
            },
            {
              id: "5",              name: "Rachel Green",              handle: "Marketing Director, Brand Co",              testimonial: "The data-driven approach combined with creative excellence made all the difference in our market positioning and growth.",              imageSrc: "http://img.b2bpic.net/free-photo/confident-beautiful-young-businesswoman-looking-camera-head-shot-portrait_1163-4928.jpg?_wi=3",              imageAlt: "Rachel Green"
            },
            {
              id: "6",              name: "Marcus Thompson",              handle: "CEO, Future Tech",              testimonial: "Stellar's team brought strategic thinking and fresh perspectives that elevated our entire marketing operation.",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3",              imageAlt: "Marcus Thompson"
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardSeven
          title="Our Impact"
          description="Measurable results that demonstrate our expertise and commitment to client success."
          tag="Track Record"
          tagAnimation="slide-up"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          metrics={[
            {
              id: "1",              value: "150+",              title: "Successful campaigns launched",              items: [
                "Average 200% ROI increase",                "Across 25+ industries",                "Fortune 500 to ambitious startups"
              ]
            },
            {
              id: "2",              value: "$500M+",              title: "Revenue generated for clients",              items: [
                "Through integrated strategies",                "Data-driven optimization",                "Long-term partnerships"
              ]
            },
            {
              id: "3",              value: "8 Years",              title: "Proven track record in San Francisco",              items: [
                "Industry recognition and awards",                "Trusted by venture-backed startups",                "Consistent year-over-year growth"
              ]
            },
            {
              id: "4",              value: "98%",              title: "Client satisfaction and retention",              items: [
                "Long-term strategic partnerships",                "Repeat business and referrals",                "Collaborative team approach"
              ]
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="Frequently Asked Questions"
          description="Everything you need to know about working with Stellar."
          tag="FAQ"
          tagAnimation="slide-up"
          faqsAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "What industries do you specialize in?",              content: "We work across diverse sectors including SaaS, fintech, e-commerce, healthcare tech, and B2B services. Our team brings deep expertise across 25+ industries, with particular strength in scaling technology and innovative brands."
            },
            {
              id: "2",              title: "What's your typical engagement model?",              content: "We offer flexible engagement models including project-based campaigns, retainer partnerships, and strategic consulting. Most clients start with a 3-6 month campaign or retainer to establish strategy, measure results, and build momentum."
            },
            {
              id: "3",              title: "How do you measure campaign success?",              content: "We establish clear KPIs aligned with your business objectives before campaign launch. We provide monthly performance reports tracking metrics like ROI, conversion rates, customer acquisition cost, and other relevant business indicators."
            },
            {
              id: "4",              title: "Do you work with early-stage startups?",              content: "Absolutely. We love working with ambitious early-stage teams. We've helped seed-stage through Series B companies establish market positioning, launch go-to-market strategies, and scale acquisition channels efficiently."
            },
            {
              id: "5",              title: "What's your process like?",              content: "Our process starts with deep discovery to understand your business, market, and goals. We then develop a comprehensive strategy, present recommendations, execute campaigns with full transparency, and continuously optimize based on data and learnings."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to transform your marketing and drive growth? Let's talk about your goals and how we can help you succeed."
          animationType="entrance-slide"
          background={{ variant: "plain" }}
          useInvertedBackground={false}
          buttons={[
            { text: "Schedule a Consultation", href: "#" },
            { text: "Get in Touch", href: "#" }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={[
            {
              title: "Services",              items: [
                { label: "Brand Strategy", href: "#services" },
                { label: "Digital Marketing", href: "#services" },
                { label: "Creative Design", href: "#services" },
                { label: "Analytics", href: "#services" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About", href: "#about" },
                { label: "Work", href: "#work" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Contact", href: "#contact" },
                { label: "LinkedIn", href: "https://linkedin.com" },
                { label: "Twitter", href: "https://twitter.com" },
                { label: "Email", href: "#" }
              ]
            }
          ]}
          copyrightText="© 2025 Stellar Marketing. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}