"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import TextAbout from '@/components/sections/about/TextAbout';
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import TeamCardFive from '@/components/sections/team/TeamCardFive';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="expand-hover"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="compact"
      sizing="largeSmallSizeMediumTitles"
      background="fluid"
      cardStyle="soft-shadow"
      primaryButtonStyle="flat"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={[
            { name: "Services", id: "services" },
            { name: "About", id: "about" },
            { name: "Team", id: "team" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{ text: "Get Started", href: "contact" }}
          brandName="Van Digital"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogo
          logoText="Van Digital"
          description="Transform your business through innovative digital solutions. We blend strategy, design, and technology to create lasting impact."
          buttons={[
            { text: "Explore Our Work", href: "services" },
            { text: "Schedule a Consultation", href: "contact" }
          ]}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/a-modern-digital-transformation-workspac-1772495313423-cd84d5c1.png"
          imageAlt="Digital transformation workspace with collaborative team"
          showDimOverlay={true}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="about" data-section="about">
        <TextAbout
          tag="About Van Digital"
          title="Empowering businesses through thoughtful digital innovation and strategic technology integration"
          useInvertedBackground={false}
          buttons={[
            { text: "Learn More", href: "services" }
          ]}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardMedia
          tag="Our Services"
          title="Comprehensive Digital Solutions"
          description="We deliver end-to-end digital services tailored to your unique business challenges and opportunities"
          textboxLayout="default"
          useInvertedBackground={true}
          animationType="slide-up"
          features={[
            {
              id: "1",              tag: "Strategy",              title: "Digital Strategy & Consulting",              description: "Craft compelling digital roadmaps that align with your business goals and market opportunities",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/abstract-strategic-planning-visualizatio-1772495313113-2287467b.png",              imageAlt: "Digital strategy visualization"
            },
            {
              id: "2",              tag: "Development",              title: "Custom Software Development",              description: "Build scalable, secure applications that drive innovation and operational excellence",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/software-development-and-coding-workspac-1772495315382-d98f4343.png",              imageAlt: "Modern development workspace"
            },
            {
              id: "3",              tag: "Design",              title: "Design & User Experience",              description: "Create beautiful, intuitive digital experiences that engage users and deliver results",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/ux-ui-design-workspace-showing-design-to-1772495313351-a1283768.png",              imageAlt: "UX/UI design process"
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardEleven
          tag="Our Impact"
          title="Delivering Measurable Results"
          description="Proven track record of transforming businesses through strategic digital initiatives"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
          metrics={[
            {
              id: "1",              value: "150+",              title: "Projects Delivered",              description: "Successfully completed digital transformation initiatives",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/a-modern-digital-transformation-workspac-1772495313423-cd84d5c1.png",              imageAlt: "Project delivery success"
            },
            {
              id: "2",              value: "95%",              title: "Client Satisfaction",              description: "Consistently exceeding expectations and delivering exceptional value",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/abstract-strategic-planning-visualizatio-1772495313113-2287467b.png",              imageAlt: "Client satisfaction metrics"
            }
          ]}
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardFive
          tag="Our Team"
          title="Meet the Experts Behind Your Success"
          description="Talented professionals dedicated to driving your digital transformation"
          textboxLayout="default"
          useInvertedBackground={true}
          animationType="slide-up"
          team={[
            {
              id: "1",              name: "Sarah Johnson",              role: "Chief Strategy Officer",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/professional-portrait-of-a-confident-dig-1772495312349-5ffd94d9.png",              imageAlt: "Sarah Johnson"
            },
            {
              id: "2",              name: "Michael Chen",              role: "Lead Developer",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/professional-portrait-of-a-creative-deve-1772495313065-30fc9779.png",              imageAlt: "Michael Chen"
            },
            {
              id: "3",              name: "Emma Rodriguez",              role: "Design Director",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/professional-portrait-of-a-project-manag-1772495312962-b8da1ee7.png",              imageAlt: "Emma Rodriguez"
            },
            {
              id: "4",              name: "David Park",              role: "Senior Architect",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/professional-portrait-of-a-tech-speciali-1772495313149-052d3aa0.png",              imageAlt: "David Park"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSixteen
          tag="Client Success Stories"
          title="What Our Clients Say"
          description="Real feedback from businesses we've helped transform"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
          testimonials={[
            {
              id: "1",              name: "Victoria Martinez",              role: "CEO",              company: "TechFlow Solutions",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/professional-headshot-of-a-satisfied-bus-1772495312732-0645920c.png",              imageAlt: "Victoria Martinez"
            },
            {
              id: "2",              name: "James Wilson",              role: "Founder",              company: "Innovate Inc",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/professional-portrait-of-a-company-found-1772495312716-ee73482c.png",              imageAlt: "James Wilson"
            },
            {
              id: "3",              name: "Lisa Anderson",              role: "Operations Director",              company: "Digital Ventures",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APXaelGawfhYOT2IJVRsdm2JeQ/professional-headshot-of-a-operations-ma-1772495312580-063c675e.png",              imageAlt: "Lisa Anderson"
            }
          ]}
          kpiItems={[
            { value: "150+", label: "Projects completed" },
            { value: "95%", label: "Client satisfaction" },
            { value: "12+", label: "Years of expertise" }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          tag="FAQ"
          title="Common Questions"
          description="Find answers to frequently asked questions about our services and process"
          textboxLayout="default"
          useInvertedBackground={true}
          faqsAnimation="slide-up"
          faqs={[
            {
              id: "1",              title: "What digital services do you offer?",              content: "We provide comprehensive digital solutions including strategic consulting, custom software development, UI/UX design, cloud infrastructure, and digital transformation guidance tailored to your business needs."
            },
            {
              id: "2",              title: "How long does a typical project take?",              content: "Project timelines vary based on scope and complexity. Small projects may take 4-8 weeks, while larger initiatives can span 3-12 months. We'll provide a detailed timeline during the consultation phase."
            },
            {
              id: "3",              title: "What is your development process?",              content: "We follow an agile methodology with regular communication, iterative development, and continuous feedback loops. This ensures transparency, quality, and alignment with your goals throughout the project."
            },
            {
              id: "4",              title: "Do you provide ongoing support after launch?",              content: "Yes, we offer post-launch support packages including maintenance, monitoring, performance optimization, and feature enhancements to ensure your solution continues to deliver value."
            },
            {
              id: "5",              title: "How do you handle data security?",              content: "We implement industry-leading security practices including encryption, secure authentication, regular audits, and compliance with relevant standards (GDPR, SOC 2, etc.) to protect your data."
            },
            {
              id: "6",              title: "Can you work with existing systems?",              content: "Absolutely. We specialize in integrating with existing platforms and legacy systems, ensuring smooth transitions and minimal disruption to your current operations."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to transform your business digitally? Let's connect and explore how Van Digital can help you achieve your goals."
          animationType="background-highlight"
          background={{ variant: "gradient-bars" }}
          useInvertedBackground={false}
          buttons={[
            { text: "Get in Touch", href: "#" },
            { text: "Schedule a Call", href: "#" }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Van Digital"
          columns={[
            {
              items: [
                { label: "Services", href: "services" },
                { label: "Team", href: "team" },
                { label: "About", href: "about" }
              ]
            },
            {
              items: [
                { label: "Testimonials", href: "testimonials" },
                { label: "FAQ", href: "faq" },
                { label: "Contact", href: "contact" }
              ]
            },
            {
              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Code of Conduct", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}
