"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import FooterBase from '@/components/sections/footer/FooterBase';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import { ListChecks, Mail, Sparkles } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-shift"
        defaultTextAnimation="entrance-slide"
        borderRadius="soft"
        contentWidth="medium"
        sizing="largeSizeMediumTitles"
        background="noiseDiagonalGradient"
        cardStyle="outline"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",
          id: "hero",
        },
        {
          name: "Leistungen",
          id: "key-solutions",
        },
        {
          name: "Branchen",
          id: "use-cases",
        },
        {
          name: "Datenschutz",
          id: "privacy",
        },
        {
          name: "Zusammenarbeit",
          id: "social-proof",
        },
        {
          name: "FAQ",
          id: "faq",
        },
        {
          name: "Kontakt",
          id: "contact",
        },
      ]}
      brandName="Flogix"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardScroll
      background={{
        variant: "downward-rays-animated-grid",
      }}
      title="KI-Agenten für Unternehmen, die Anfragen automatisch übernehmen."
      description="Voice- & Chat-Agenten, die 24/7 erreichbar sind. Fragen klären, Termine buchen und Prozesse automatisieren – DSGVO-konform und schnell implementiert."
      tag="Revolutionieren Sie Ihr Kundenerlebnis"
      tagIcon={Sparkles}
      tagAnimation="slide-up"
      buttons={[
        {
          text: "Unverbindlich anfragen",
          href: "#contact",
        },
        {
          text: "Beispiele & Branchen ansehen",
          href: "#use-cases",
        },
      ]}
      buttonAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg?_wi=1"
      imageAlt="AI-powered dashboard showing automated inquiry management"
    />
  </div>

  <div id="use-cases" data-section="use-cases">
      <ProductCardOne
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="bento-grid"
      useInvertedBackground={true}
      products={[
        {
          id: "use-case-1",
          name: "Support-Hotline",
          price: "Effizient",
          imageSrc: "http://img.b2bpic.net/free-photo/upset-gamer-yelling-smashing-table-after-losing-online-competitive-multiplayer-match_482257-77051.jpg?_wi=1",
          imageAlt: "Support agent with headset",
        },
        {
          id: "use-case-2",
          name: "Immobilien",
          price: "Maßgeschneidert",
          imageSrc: "http://img.b2bpic.net/free-photo/technology-concept-with-futuristic-element_23-2151910950.jpg?_wi=1",
          imageAlt: "Modern office building",
        },
        {
          id: "use-case-3",
          name: "Arztpraxis",
          price: "Entlastend",
          imageSrc: "http://img.b2bpic.net/free-photo/nobody-hospital-waiting-room-front-desk-with-office-supplies-promotional-flyers-healthcare-facility-empty-reception-counter-with-no-people-private-practice-clinic_482257-45891.jpg",
          imageAlt: "Doctor's office reception",
        },
        {
          id: "use-case-4",
          name: "E-Commerce",
          price: "Kundenorientiert",
          imageSrc: "http://img.b2bpic.net/free-photo/neon-robot-vacuum-cleaner_23-2151349301.jpg",
          imageAlt: "E-commerce interface with products",
        },
        {
          id: "use-case-5",
          name: "Logistik & Transport",
          price: "Optimiert",
          imageSrc: "http://img.b2bpic.net/free-photo/variety-people-multitasking-3d-cartoon-scene_23-2151294524.jpg",
          imageAlt: "Logistics warehouse with automation",
        },
        {
          id: "use-case-6",
          name: "Bankwesen & Finanzen",
          price: "Sicher",
          imageSrc: "http://img.b2bpic.net/free-photo/businessman-working-laptop-with-stock-market-chart_23-2151966722.jpg",
          imageAlt: "Financial dashboard",
        },
      ]}
      title="Passenden Use Case für Ihr Unternehmen ansehen"
      description="So setzen Unternehmen KI-Agenten ein, um Anfragen effizient zu bearbeiten und Teams zu entlasten. Entdecken Sie unsere branchenspezifischen Lösungen."
      tag="Branchenlösungen"
      tagIcon={ListChecks}
      buttons={[
        {
          text: "Alle Branchen & Anwendungsfälle ansehen",
          href: "#contact",
        },
      ]}
    />
  </div>

  <div id="key-solutions" data-section="key-solutions">
      <FeatureCardNine
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          title: "KI-Telefonbot",
          description: "Nimmt Anrufe an, beantwortet Fragen und bucht Termine 24/7 – mit natürlicher Stimme und CRM-Anbindung.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/woman-using-smartphone-text-with-chat-bubbles_23-2151989429.jpg",
            imageAlt: "Phonebot icon",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/wireless-white-smart-speaker-mockup-digital-device_53876-97320.jpg",
            imageAlt: "Phonebot icon",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg?_wi=2",
          imageAlt: "AI phone bot icon white blue",
        },
        {
          title: "KI-Chatbot",
          description: "Website-Assistent für sofortigen Support und intelligente Lead-Qualifizierung in mehreren Sprachen.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-vector/ai-assitant-chat-message-set_78370-9699.jpg",
            imageAlt: "Chatbot icon",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-vector/chatbot-message-bubble-set_78370-9334.jpg",
            imageAlt: "Chatbot icon",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/upset-gamer-yelling-smashing-table-after-losing-online-competitive-multiplayer-match_482257-77051.jpg?_wi=2",
          imageAlt: "AI phone bot icon white blue",
        },
        {
          title: "Automationen",
          description: "Nahtlose Integration Ihrer Workflows in CRM, E-Mail und Kalender für maximale Zeiteffizienz.",
          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-vector/collection-futuristic-infographic-elements_52683-15148.jpg",
            imageAlt: "Automations icon",
          },
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-vector/technological-icons-set_23-2147531323.jpg",
            imageAlt: "Automations icon",
          },
          imageSrc: "http://img.b2bpic.net/free-photo/technology-concept-with-futuristic-element_23-2151910950.jpg?_wi=2",
          imageAlt: "AI phone bot icon white blue",
        },
      ]}
      showStepNumbers={false}
      title="Die 3 Kernlösungen für moderne Unternehmen"
      description="Wir integrieren KI-Agenten in bestehende Prozesse – praxisnah, skalierbar und ohne Systembruch. Steigern Sie Ihre Effizienz."
      tag="Unsere Services"
      buttons={[
        {
          text: "Alle Leistungen & Details ansehen",
          href: "#contact",
        },
      ]}
    />
  </div>

  <div id="privacy" data-section="privacy">
      <TextSplitAbout
      useInvertedBackground={true}
      title="Datenschutz ist bei uns Voraussetzung."
      description={[
        "Ihre Daten bleiben unter Ihrer Kontrolle – heute und in Zukunft. Wir legen größten Wert auf die Einhaltung höchster Sicherheitsstandards und Transparenz.",
        "Unsere Lösungen sind von Grund auf DSGVO-konform und werden ausschließlich in Deutschland gehostet. Vertrauen Sie auf einen Partner, der Ihre Daten schützt.",
      ]}
      showBorder={false}
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "Microsoft",
        "Google",
        "Siemens",
        "Telekom",
        "SAP",
        "Bosch",
        "Allianz",
      ]}
      title="So arbeiten wir mit Unternehmen zusammen"
      description="Transparente Leistungsrahmen statt starre Pakete – angepasst an Ihre Prozesse, Ziele und Anforderungen. Vertrauen Sie unseren Partnern."
      tag="Unsere Partner"
      speed={45}
      showCard={false}
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSix
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      testimonials={[
        {
          id: "1",
          name: "Anna Meier",
          handle: "@AnnaMeierCEO",
          testimonial: "Die KI-Agenten von Flogix haben unsere Support-Hotline revolutioniert. Wir konnten Wartezeiten drastisch reduzieren und die Kundenzufriedenheit steigern. Ein echter Game-Changer für unser Unternehmen!",
          imageSrc: "http://img.b2bpic.net/free-photo/handsome-smiling-hipster-modelunshaven-arabian-man-dressed-elegant-beige-suit-fashion-male-with-long-curly-hairstyle-posing-near-beige-wall-studio-isolated_158538-26993.jpg",
          imageAlt: "Anna Meier, CEO",
        },
        {
          id: "2",
          name: "Max Schmidt",
          handle: "@MaxSchmidtCTO",
          testimonial: "Die Implementierung war reibungslos und die Integration in unsere bestehenden Systeme erfolgte nahtlos. Die Skalierbarkeit der Flogix-Lösungen ist beeindruckend.",
          imageSrc: "http://img.b2bpic.net/free-photo/project-leder-with-disabilities-looking-front-sitting-immobilized-wheelchair-business-office-room_482257-2404.jpg",
          imageAlt: "Max Schmidt, CTO",
        },
        {
          id: "3",
          name: "Lena Müller",
          handle: "@LenaMullerMarketing",
          testimonial: "Unser Marketingteam profitiert enorm vom KI-Chatbot. Die Lead-Qualifizierung ist effizienter geworden, und wir erhalten wertvolle Einblicke in Kundenbedürfnisse.",
          imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-with-radio-transceiver-looking-clipboard_114579-70722.jpg",
          imageAlt: "Lena Müller, Marketing Director",
        },
        {
          id: "4",
          name: "Jonas Weber",
          handle: "@JonasWeberProduct",
          testimonial: "Flogix hat uns geholfen, unsere Produktivität zu steigern. Die Automationen übernehmen repetitive Aufgaben, sodass unser Team sich auf strategischere Projekte konzentrieren kann.",
          imageSrc: "http://img.b2bpic.net/free-photo/closeup-content-mature-business-man-office_1262-2979.jpg",
          imageAlt: "Jonas Weber, Product Manager",
        },
        {
          id: "5",
          name: "Julia Richter",
          handle: "@JuliaRichterOps",
          testimonial: "Die Einhaltung der DSGVO-Richtlinien war für uns entscheidend. Flogix hat uns hier voll überzeugt. Die Datenhoheit bleibt bei uns, und das gibt uns Sicherheit.",
          imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg",
          imageAlt: "Julia Richter, Operations Manager",
        },
      ]}
      title="Was unsere Kunden sagen"
      description="Hören Sie von unseren zufriedenen Kunden, wie Flogix ihre Geschäftsprozesse transformiert und messbare Ergebnisse geliefert hat."
      speed={50}
      topMarqueeDirection="right"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitMedia
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "faq-1",
          title: "Was sind KI-Agenten und wie funktionieren sie?",
          content: "KI-Agenten sind intelligente Software-Systeme, die natürliche Sprache verstehen und auf Basis von Regeln und Machine Learning-Modellen Aufgaben wie Kundenanfragen bearbeiten, Informationen bereitstellen oder Prozesse automatisieren können. Sie sind rund um die Uhr verfügbar.",
        },
        {
          id: "faq-2",
          title: "Ist Flogix DSGVO-konform?",
          content: "Ja, der Datenschutz hat bei uns höchste Priorität. Alle unsere Lösungen sind vollständig DSGVO-konform entwickelt und werden ausschließlich auf Servern in Deutschland gehostet, um maximale Datensicherheit zu gewährleisten.",
        },
        {
          id: "faq-3",
          title: "Wie lange dauert die Implementierung eines KI-Agenten?",
          content: "Die Implementierungszeit hängt stark von der Komplexität des Anwendungsfalls und der Integration in Ihre bestehenden Systeme ab. Typischerweise können einfache Chatbots innerhalb weniger Wochen und komplexere Lösungen in 2-3 Monaten einsatzbereit sein.",
        },
        {
          id: "faq-4",
          title: "Kann ein KI-Agent auch komplexe Anfragen bearbeiten?",
          content: "Unsere KI-Agenten sind darauf trainiert, sowohl einfache als auch komplexe Anfragen zu verstehen und zu bearbeiten. Bei besonders anspruchsvollen Fällen können sie nahtlos an menschliche Mitarbeiter übergeben, wobei alle relevanten Informationen bereits gesammelt wurden.",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/call-center-senior-agent-uses-ai-tech-enhance-customer-interactions_482257-117995.jpg"
      imageAlt="AI-powered FAQ interface with glowing question mark"
      mediaAnimation="slide-up"
      mediaPosition="right"
      title="Häufig gestellte Fragen"
      description="Hier finden Sie Antworten auf die gängigsten Fragen zu unseren KI-Agenten, Services und zur Implementierung in Ihr Unternehmen."
      tag="Support & Infos"
      faqsAnimation="blur-reveal"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCTA
      useInvertedBackground={true}
      background={{
        variant: "radial-gradient",
      }}
      tag="Unverbindlich anfragen"
      tagIcon={Mail}
      title="Starten Sie Ihre Transformation heute."
      description="Beschreiben Sie kurz Ihre aktuelle Situation oder Ihr Ziel. Unser Team berät Sie gerne, wie Flogix Ihr Unternehmen optimal unterstützen kann."
      buttons={[
        {
          text: "Anfrage senden",
        },
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBase
      columns={[
        {
          title: "Navigation",
          items: [
            {
              label: "Home",
              href: "#hero",
            },
            {
              label: "Leistungen",
              href: "#key-solutions",
            },
            {
              label: "Branchen",
              href: "#use-cases",
            },
            {
              label: "Zusammenarbeit",
              href: "#social-proof",
            },
            {
              label: "FAQ",
              href: "#faq",
            },
            {
              label: "Kontakt",
              href: "#contact",
            },
          ],
        },
        {
          title: "Rechtliches",
          items: [
            {
              label: "Impressum",
              href: "#",
            },
            {
              label: "Datenschutz",
              href: "#",
            },
            {
              label: "AGB",
              href: "#",
            },
            {
              label: "Cookie-Richtlinie",
              href: "#",
            },
          ],
        },
      ]}
      logoSrc="http://img.b2bpic.net/free-vector/gradient-technology-logo-collection_23-2148163556.jpg"
      logoAlt="Flogix Logo"
      logoText="Flogix"
      copyrightText="© 2024 Flogix | Alle Rechte vorbehalten."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
