"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import FeatureCardThirteen from '@/components/sections/feature/FeatureCardThirteen';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterBaseSocial from '@/components/sections/footer/FooterBaseSocial';
import { Twitter, Linkedin, Github, Mail } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="medium"
      sizing="largeSmallSizeLargeTitles"
      background="dotGrid"
      cardStyle="gradient-subtle"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="solid"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleMinimal
          brandName="Webild"
          button={{
            text: "Get Started",            href: "contact"
          }}
          className="border-b border-opacity-10"
          buttonClassName="rounded-pill"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboardSplit
          logoText="WEBILD"
          description="Transform your digital presence with innovative design solutions. We create stunning, responsive experiences that captivate audiences and drive real results."
          buttons={[
            {
              text: "Explore Solutions",              href: "features"
            },
            {
              text: "View Case Studies",              href: "testimonials"
            }
          ]}
          layoutOrder="default"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717186718-2w0ix4wj.jpg"
          imageAlt="Digital innovation and modern design workspace"
          frameStyle="browser"
          logoLineHeight={1.15}
          ariaLabel="Hero section showcasing Webild design services"
        />
      </div>

      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            {
              type: "text",              content: "Building digital futures with"
            },
            {
              type: "image",              src: "https://img.b2bpic.net/free-vector/geometric-harmony-hills-private-school-logo-template_742173-18879.jpg",              alt: "Webild brand mark"
            },
            {
              type: "text",              content: "cutting-edge design and"
            },
            {
              type: "image",              src: "https://img.b2bpic.net/free-vector/psychology-logos-with-colorful-geometric-shapes_23-2147590277.jpg",              alt: "Innovation symbol"
            },
            {
              type: "text",              content: "strategic thinking"
            }
          ]}
          buttons={[
            {
              text: "Learn Our Process",              href: "features"
            },
            {
              text: "Contact Us",              href: "contact"
            }
          ]}
          useInvertedBackground="invertDefault"
          ariaLabel="About Webild design philosophy and mission"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardThirteen
          title="Our Design Process"
          description="A proven methodology to transform your vision into exceptional digital experiences"
          tag="Workflow"
          textboxLayout="default"
          animationType="slide-up"
          features={[
            {
              id: "01",              title: "Discovery & Strategy",              description: "We dive deep into understanding your business goals, target audience, and competitive landscape to craft a strategic foundation."
            },
            {
              id: "02",              title: "Design & Prototyping",              description: "Our team creates beautiful, intuitive designs and interactive prototypes that bring your vision to life with precision."
            },
            {
              id: "03",              title: "Development & Optimization",              description: "We build performant, accessible solutions and optimize every detail to ensure seamless user experiences across all devices."
            },
            {
              id: "04",              title: "Launch & Support",              description: "We launch your project with confidence and provide ongoing support to ensure continued success and growth."
            }
          ]}
          gridVariant="uniform-all-items-equal"
          useInvertedBackground="noInvert"
          buttons={[
            {
              text: "Start Your Project",              href: "contact"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="Client Success Stories"
          description="See how we've helped innovative brands achieve their digital goals"
          tag="Testimonials"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertCard"
          speed={30}
          topMarqueeDirection="left"
          testimonials={[
            {
              id: "1",              name: "Sarah Chen",              handle: "@sarahchen_creative",              testimonial: "Webild transformed our entire digital presence. Their strategic approach combined with stunning design resulted in a 150% increase in user engagement.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767698836114-ric6d4b4.jpg",              imageAlt: "Sarah Chen"
            },
            {
              id: "2",              name: "Michael Rodriguez",              handle: "@mrodriguez_design",              testimonial: "Working with Webild was a game-changer. They understood our vision perfectly and delivered beyond expectations. Highly recommend!",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717189290-37iyik7e.jpg",              imageAlt: "Michael Rodriguez"
            },
            {
              id: "3",              name: "Emma Thompson",              handle: "@emmathompson_tech",              testimonial: "Their attention to detail and innovative thinking set them apart. Our new platform has become a key competitive advantage in our market.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717190681-i2cfacd9.jpg",              imageAlt: "Emma Thompson"
            },
            {
              id: "4",              name: "James Patterson",              handle: "@jpatterson_co",              testimonial: "Exceptional team that delivers exceptional results. The entire process was smooth, professional, and the final product exceeded all expectations.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767698836698-ror4nxcc.jpg",              imageAlt: "James Patterson"
            },
            {
              id: "5",              name: "Lisa Wang",              handle: "@lisawang_ventures",              testimonial: "Webild brings both creative excellence and technical expertise. They're a trusted partner we continue to work with on multiple projects.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767703280295-jyqaitc4.jpg",              imageAlt: "Lisa Wang"
            },
            {
              id: "6",              name: "David Kumar",              handle: "@davidkumar_digital",              testimonial: "From concept to launch, Webild demonstrated professionalism and creativity that elevated our brand. Fantastic experience working with them.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717192014-j1rpv8a9.jpg",              imageAlt: "David Kumar"
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitMedia
          title="Frequently Asked Questions"
          description="Find answers to common questions about our services, process, and partnership approach"
          tag="Help"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-vector/flat-timeline-infographic-template_23-2148927216.jpg"
          imageAlt="Customer support and FAQ illustration"
          mediaPosition="left"
          animationType="smooth"
          showCard={true}
          faqs={[
            {
              id: "1",              title: "What industries do you specialize in?",              content: "We work across diverse industries including SaaS, fintech, e-commerce, healthcare, and more. Our team has experience delivering exceptional results for startups through enterprise clients."
            },
            {
              id: "2",              title: "How long does a typical project take?",              content: "Project timelines vary based on scope and complexity. Most projects take 8-16 weeks from initial discovery through launch. We'll provide a detailed timeline during our planning phase."
            },
            {
              id: "3",              title: "Do you offer ongoing support after launch?",              content: "Yes! We offer comprehensive post-launch support including maintenance, updates, performance optimization, and feature enhancements to ensure continued success."
            },
            {
              id: "4",              title: "What is your design and development process?",              content: "Our process includes discovery & strategy, design & prototyping, development & optimization, and launch & support. We keep you involved at every stage with regular check-ins."
            },
            {
              id: "5",              title: "Can you work with our existing team?",              content: "Absolutely! We excel at collaborating with internal teams and other agencies. We provide clear documentation and knowledge transfer to ensure seamless integration."
            },
            {
              id: "6",              title: "How do you ensure quality and accessibility?",              content: "We follow WCAG accessibility guidelines, conduct thorough testing, and implement best practices for performance, security, and user experience across all projects."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Newsletter"
          title="Stay Updated on Design Trends"
          description="Subscribe to our newsletter and receive weekly insights on digital design, innovation strategies, and industry trends delivered to your inbox."
          useInvertedBackground="invertCard"
          imageSrc="https://img.b2bpic.net/free-vector/flat-process-infographic-concept_23-2148564973.jpg"
          imageAlt="Newsletter subscription and email communication"
          mediaPosition="right"
          inputPlaceholder="Enter your email address"
          buttonText="Subscribe"
          termsText="We respect your privacy. Unsubscribe at any time. See our privacy policy."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseSocial
          logoText="Webild"
          description="Creating exceptional digital experiences through strategic design and innovative thinking. We transform visions into remarkable digital realities."
          copyrightText="© 2025 Webild. All rights reserved."
          columns={[
            {
              title: "Services",              items: [
                {
                  label: "Design Services",                  href: "features"
                },
                {
                  label: "Web Development",                  href: "features"
                },
                {
                  label: "UX Strategy",                  href: "features"
                },
                {
                  label: "Branding",                  href: "features"
                }
              ]
            },
            {
              title: "Company",              items: [
                {
                  label: "About Us",                  href: "about"
                },
                {
                  label: "Our Process",                  href: "features"
                },
                {
                  label: "Case Studies",                  href: "testimonials"
                },
                {
                  label: "Contact",                  href: "contact"
                }
              ]
            },
            {
              title: "Resources",              items: [
                {
                  label: "Blog",                  href: "#blog"
                },
                {
                  label: "Design Guide",                  href: "#guide"
                },
                {
                  label: "FAQ",                  href: "faq"
                },
                {
                  label: "Support",                  href: "contact"
                }
              ]
            },
            {
              title: "Legal",              items: [
                {
                  label: "Privacy Policy",                  href: "#privacy"
                },
                {
                  label: "Terms of Service",                  href: "#terms"
                },
                {
                  label: "Cookie Policy",                  href: "#cookies"
                }
              ]
            }
          ]}
          socialLinks={[
            {
              icon: Twitter,
              href: "https://twitter.com",              ariaLabel: "Follow us on Twitter"
            },
            {
              icon: Linkedin,
              href: "https://linkedin.com",              ariaLabel: "Connect on LinkedIn"
            },
            {
              icon: Github,
              href: "https://github.com",              ariaLabel: "View our GitHub"
            },
            {
              icon: Mail,
              href: "mailto:hello@webild.io",              ariaLabel: "Email us"
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}