"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import ParallaxAbout from '@/components/sections/about/ParallaxAbout';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import ProductCardFive from '@/components/sections/product/ProductCardFive';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="small"
      sizing="mediumSizeLargeTitles"
      background="dotGrid"
      cardStyle="gradient-bordered"
      primaryButtonStyle="layered-depth"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="Webild"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Services", id: "features" },
            { name: "Products", id: "products" },
            { name: "Contact", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCarouselLogo
          logoText="WEBILD"
          description="Create stunning, responsive websites with our comprehensive component library and design solutions"
          buttons={[
            { text: "Get Started", href: "https://github.com" },
            { text: "Learn More", href: "about" }
          ]}
          slides={[
            {
              imageSrc: "https://img.b2bpic.net/free-vector/isometric-landing-page_23-2148101273.jpg",              imageAlt: "Digital marketing and startup innovation"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-vector/start-up-landing-page-web-design_23-2148281955.jpg",              imageAlt: "Web design and creative solutions"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-vector/startup-landing-page-concept_23-2148312959.jpg",              imageAlt: "Technology and digital transformation"
            }
          ]}
          autoplayDelay={4000}
          showDimOverlay={true}
        />
      </div>

      <div id="about" data-section="about">
        <ParallaxAbout
          title="Elevate Your Digital Presence"
          description="We craft exceptional digital experiences that combine strategic thinking with creative excellence. Our team transforms ideas into elegant, high-performing solutions that drive real business results and meaningful user engagement."
          tag="About Us"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717183788-vfc1qko3.jpg"
          imageAlt="Team collaboration and modern workspace"
          buttons={[
            { text: "Discover Our Work", href: "products" },
            { text: "Schedule a Call", href: "contact" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardNineteen
          title="Our Process"
          description="We follow a strategic, data-driven approach to transform your vision into reality"
          tag="How It Works"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          features={[
            {
              id: 1,
              tag: "Discovery",              title: "Strategy",              subtitle: "Deep market and user insights drive our direction",              description: "We begin by understanding your business goals, market landscape, and user needs through comprehensive research and analysis. This foundation ensures every decision is data-backed and aligned with your vision.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717186022-dxq1qdtj.jpg",              imageAlt: "Strategy and market analysis"
            },
            {
              id: 2,
              tag: "Creation",              title: "Design",              subtitle: "Elegant solutions that resonate with your audience",              description: "Our designers craft beautiful, intuitive interfaces that balance aesthetics with functionality. We focus on user experience excellence, creating designs that not only look stunning but feel natural to interact with.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717187669-bvejaxye.jpg",              imageAlt: "Design and prototyping process"
            },
            {
              id: 3,
              tag: "Execution",              title: "Development",              subtitle: "Robust, scalable technology that powers growth",              description: "Our engineering team builds production-ready solutions using modern technologies and best practices. We prioritize performance, security, and maintainability to ensure your product stands the test of time.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717189881-qlcinqml.jpg",              imageAlt: "Development and implementation"
            }
          ]}
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardFive
          title="Featured Solutions"
          description="Discover our innovative products designed to solve real-world challenges and drive measurable impact"
          tag="Our Work"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          products={[
            {
              id: "product-1",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717191648-fay6b1se.jpg",              imageAlt: "Enterprise web application platform",              button: {
                text: "Explore Solution",                href: "#"
              }
            },
            {
              id: "product-2",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717193132-21dx5ges.jpg",              imageAlt: "Mobile-first application framework",              button: {
                text: "View Details",                href: "#"
              }
            },
            {
              id: "product-3",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717195047-l430bv2c.jpg",              imageAlt: "Analytics and insights dashboard",              button: {
                text: "Learn More",                href: "#"
              }
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="What Our Clients Say"
          description="Join hundreds of companies trusting us with their digital transformation journey"
          tag="Testimonials"
          textboxLayout="default"
          useInvertedBackground="invertCard"
          animationType="slide-up"
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              handle: "CEO, TechCorp",              testimonial: "Webild transformed our digital presence completely. The team's expertise and dedication to excellence is unmatched.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767707511590-ys5q268i.jpg",              imageAlt: "Sarah Johnson"
            },
            {
              id: "2",              name: "Michael Chen",              handle: "CTO, InnovateLab",              testimonial: "Working with Webild was seamless. They delivered a solution that exceeded our expectations on time and budget.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767707512375-5uxmzsjq.jpg",              imageAlt: "Michael Chen"
            },
            {
              id: "3",              name: "Emily Rodriguez",              handle: "Marketing Director, GrowthCo",              testimonial: "The design quality and attention to detail is exceptional. Our users absolutely love the new interface.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767707515360-zek3jvis.jpg",              imageAlt: "Emily Rodriguez"
            },
            {
              id: "4",              name: "David Kim",              handle: "Founder, StartupXYZ",              testimonial: "Webild didn't just build a product, they built a partnership. Their strategic insights shaped our product direction.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767707513887-mw7rlupn.jpg",              imageAlt: "David Kim"
            },
            {
              id: "5",              name: "Jennifer Lee",              handle: "VP Product, FutureTech",              testimonial: "Outstanding collaboration and communication throughout the project. Webild is a trusted extension of our team.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767707516587-6e5udn4d.jpg",              imageAlt: "Jennifer Lee"
            },
            {
              id: "6",              name: "Marcus Thompson",              handle: "Director, Digital Innovation",              testimonial: "The results speak for themselves. Our metrics improved dramatically after launching with Webild's solution.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717197373-6p8jm8w7.jpg",              imageAlt: "Marcus Thompson"
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitText
          sideTitle="Frequently Asked Questions"
          sideDescription="Find answers to common questions about our services, process, and how we can help your business"
          textPosition="left"
          useInvertedBackground="noInvert"
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "What industries do you specialize in?",              content: "We serve a diverse range of industries including SaaS, fintech, healthcare, e-commerce, and enterprise software. Our experience spans startups to Fortune 500 companies, allowing us to bring industry-specific insights to every project."
            },
            {
              id: "2",              title: "How long does a typical project take?",              content: "Project timelines vary based on scope and complexity. Small projects typically take 6-12 weeks, while larger enterprise solutions can range from 4-6 months. We provide detailed timelines during the discovery phase."
            },
            {
              id: "3",              title: "Do you provide ongoing support after launch?",              content: "Absolutely. We offer comprehensive post-launch support including maintenance, updates, monitoring, and technical assistance. We have flexible support packages to match your needs and budget."
            },
            {
              id: "4",              title: "What is your approach to project collaboration?",              content: "We believe in transparent, continuous collaboration. You'll have regular check-ins, full visibility into progress, and easy access to the team. We use agile methodologies for flexibility and responsiveness to your feedback."
            },
            {
              id: "5",              title: "Can you scale the solution as our business grows?",              content: "Yes, scalability is built into our architecture. We design solutions with future growth in mind, ensuring your technology can scale with your user base and business needs without major rebuilds."
            },
            {
              id: "6",              title: "What's included in your discovery phase?",              content: "Our discovery phase includes stakeholder interviews, market research, user research, competitive analysis, technical assessment, and strategy development. This ensures we fully understand your needs before we start building."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="Ready to Transform Your Digital Future?"
          ctaDescription="Let's start a conversation about your project and how we can help bring your vision to life."
          ctaButton={{
            text: "Schedule a Consultation",            href: "#"
          }}
          ctaIcon={Zap}
          useInvertedBackground="invertDefault"
          animationType="slide-up"
          faqs={[
            {
              id: "1",              title: "What information should I prepare for our first call?",              content: "Have your business goals, current challenges, target audience, and budget range ready. If you have any existing materials like wireframes or competitive references, those are helpful too. We'll guide you through the rest."
            },
            {
              id: "2",              title: "How do you handle confidential information?",              content: "We take confidentiality very seriously. All our team members sign NDAs, and we have robust data security practices. Your project details are protected throughout our partnership."
            },
            {
              id: "3",              title: "What are your payment and contract terms?",              content: "We offer flexible engagement models including fixed-price projects, time-and-materials, and retainer arrangements. Detailed contracts outline deliverables, timeline, and payment schedules. We're happy to discuss options that work for your situation."
            }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="Webild"
          copyrightText="© 2025 Webild. All rights reserved."
          columns={[
            {
              title: "Product",              items: [
                { label: "Features", href: "#features" },
                { label: "Solutions", href: "#products" },
                { label: "Pricing", href: "#" },
                { label: "Security", href: "#" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Our Team", href: "#" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Documentation", href: "#" },
                { label: "API Reference", href: "#" },
                { label: "Case Studies", href: "#" },
                { label: "Support", href: "#contact" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Cookie Policy", href: "#" },
                { label: "Contact", href: "#contact" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}