"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TeamCardSix from '@/components/sections/team/TeamCardSix';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import TextAbout from '@/components/sections/about/TextAbout';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="small"
        sizing="medium"
        background="floatingGradient"
        cardStyle="gradient-mesh"
        primaryButtonStyle="flat"
        secondaryButtonStyle="glass"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        {
          name: "Servicios",          id: "#servicios"},
        {
          name: "El taller",          id: "#taller"},
        {
          name: "Ubicación",          id: "#ubicacion"},
      ]}
      brandName="MOTORRAD.ALGETE"
      button={{
        text: "PEDIR CITA",        href: "#contacto"}}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboard
      background={{
        variant: "plain"}}
      title="TU MOTO / EN BUENAS / MANOS."
      description="Mecánicos que te hablan claro, precios competitivos y resultados que se notan. Miguel y Sergio se encargan de todo."
      tag="Taller de confianza en Algete desde hace más de 15 años"
      buttons={[
        {
          text: "PEDIR CITA",          href: "#contacto"},
        {
          text: "VER SERVICIOS",          href: "#servicios"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/amazing-brand-new-motorbike-is-standing-dark-underground-parking_613910-17459.jpg"
      imageAlt="Motorcycle in a professional workshop"
      mediaAnimation="slide-up"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/portrait-stylish-serious-bearded-male-wearing-elegant-suit-dark-background_613910-11332.jpg",          alt: "male person avatar portrait"},
        {
          src: "http://img.b2bpic.net/free-photo/smiling-african-american-man-looking_74855-5149.jpg",          alt: "male avatar smiling candid"},
        {
          src: "http://img.b2bpic.net/free-photo/woman-wearing-pajamas-while-sitting-bed_273609-13213.jpg",          alt: "female avatar professional friendly"},
        {
          src: "http://img.b2bpic.net/free-photo/sweaty-male-couch-trainer-wears-hood-listens-music-with-earphones-electronic-device_273609-8618.jpg",          alt: "young man avatar smiling happy"},
        {
          src: "http://img.b2bpic.net/free-photo/expressive-senior-female-posing-indoor_344912-1363.jpg",          alt: "older woman avatar thoughtful"},
      ]}
      avatarText="+100 clientes satisfechos"
      marqueeItems={[
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/man-fixing-motorcycle-modern-workshop_158595-8099.jpg",          alt: "Man fixing a motorcycle in a modern workshop"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/front-view-man-with-cool-motorcycle_23-2150849577.jpg",          alt: "Front view man with cool motorcycle"},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/stylish-fashionable-biker-dressed-black-leather-jacket-with-sunglasses-holds-helmet-sitting-his-custom-made-retro-motorcycle-looking-camera_613910-18811.jpg",          alt: "Stylish fashionable biker dressed in a black leather jacket with sunglasses holds a helmet sitting on his custom-made retro motorcycle, looking at a camera."},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/portrait-brutal-fashionable-biker-dressed-black-leather-jacket-with-sunglasses-sitting-his-custom-made-retro-motorcycle-his-young-brunette-girlfriend-who-leaning-his-shoulder_613910-18825.jpg",          alt: "Portrait of a brutal fashionable biker dressed in a black leather jacket with sunglasses sitting on his custom-made retro motorcycle and his young brunette girlfriend who leaning on his shoulder."},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/side-view-man-repairing-motorcycle_23-2150868346.jpg",          alt: "Side view man repairing motorcycle"},
      ]}
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardEleven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      metrics={[
        {
          id: "m1",          value: "+15",          title: "años de taller",          description: "Experiencia consolidada en Algete.",          imageSrc: "http://img.b2bpic.net/free-vector/premium-gasoline-banner-icon-illustration_53876-40628.jpg",          imageAlt: "Icon representing years of experience"},
        {
          id: "m2",          value: "100%",          title: "multimarca",          description: "Trabajamos con todas las marcas de motos.",          imageSrc: "http://img.b2bpic.net/free-vector/coloured-abstract-shapes-collection_1222-7.jpg",          imageAlt: "Icon representing multi-brand support"},
        {
          id: "m3",          value: "4.7★",          title: "valoración media",          description: "La satisfacción de nuestros clientes nos avala.",          imageSrc: "http://img.b2bpic.net/free-photo/crescent-moon-star-path-from-islamic-archway_23-2152033147.jpg",          imageAlt: "Icon representing average customer rating"},
      ]}
      title="NUESTRA EXPERIENCIA EN CIFRAS."
      description="Más de una década cuidando tus motos con la máxima profesionalidad y dedicación."
    />
  </div>

  <div id="servicios" data-section="servicios">
      <FeatureCardTwentySeven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          id: "s1",          title: "01 MANTENIMIENTO Y REVISIONES",          descriptions: [
            "Revisiones periódicas, cambio de aceite, filtros y puesta a punto. Mientras esperas, si lo prefieres."],
          imageSrc: "http://img.b2bpic.net/free-photo/mechanic-examining-car-with-lamp_1170-1289.jpg",          imageAlt: "Motorcycle maintenance"},
        {
          id: "s2",          title: "02 MECÁNICA GENERAL",          descriptions: [
            "Reparación de motor, frenos, suspensión, embrague y sistema eléctrico. Todo con diagnóstico honesto."],
          imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-repairing-motorcycle_23-2150868350.jpg",          imageAlt: "Motorcycle general mechanics"},
        {
          id: "s3",          title: "03 NEUMÁTICOS Y RUEDAS",          descriptions: [
            "Cambio de neumáticos, equilibrado y revisión de ruedas. Todas las marcas y medidas."],
          imageSrc: "http://img.b2bpic.net/free-photo/asian-biker-fixing-his-motorcycle-before-ride_1098-19052.jpg",          imageAlt: "Motorcycle tire change"},
        {
          id: "s4",          title: "04 KIT DE ARRASTRE",          descriptions: [
            "Sustitución completa de cadena, piñón y corona. Resultados inmediatos en la transmisión."],
          imageSrc: "http://img.b2bpic.net/free-photo/motor-enduro-motorcycle_627829-11598.jpg",          imageAlt: "Motorcycle drive chain kit"},
        {
          id: "s5",          title: "05 VENTA DE MOTOS",          descriptions: [
            "Concesionario multimarca con asesoramiento sin rodeos. Te decimos la verdad antes de que compres."],
          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-biker-girl-wearing-black-leather-jacket-holding-helmet-superbike-outside-building_613910-5981.jpg",          imageAlt: "Motorcycle sales"},
        {
          id: "s6",          title: "06 RECAMBIOS Y ACCESORIOS",          descriptions: [
            "Piezas originales y aftermarket. Si no lo tenemos, lo buscamos."],
          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girl-with-long-hair-garage-repairing-motorcycle_1321-1395.jpg",          imageAlt: "Motorcycle spare parts"},
      ]}
      title="SERVICIOS"
      description="Ofrecemos una gama completa de servicios para mantener tu moto en perfectas condiciones."
    />
  </div>

  <div id="taller" data-section="taller">
      <TextAbout
      useInvertedBackground={false}
      title="SIN PELOS EN LA LENGUA."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",          name: "Luis González",          date: "Hace 2 semanas",          title: "Profesionales y cercanos",          quote: "Son profesionales y cercanos. Sin pelos en la lengua, si te dicen que vas a tirar el dinero no tienen problema en decírtelo.",          tag: "Cliente verificado",          avatarSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-serious-bearded-male-wearing-elegant-suit-dark-background_613910-11332.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/road-inside-parking_1203-433.jpg",          imageAlt: "Workshop background"},
        {
          id: "t2",          name: "Marcelo Caballero",          date: "Hace 1 mes",          title: "Confianza total",          quote: "Llevo más de 15 años confiándoles mis motos. Ya no vivo en Algete, pero sigo llevándoles la moto.",          tag: "Cliente fiel",          avatarSrc: "http://img.b2bpic.net/free-photo/smiling-african-american-man-looking_74855-5149.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-mature-sexy-woman-standing-balcony-her-motorbike_613910-13836.jpg",          imageAlt: "Motorcycle on lift"},
        {
          id: "t3",          name: "David De Miguel",          date: "Hace 3 meses",          title: "Sinceridad garantizada",          quote: "No entiendo nada de motos, pero por su cercanía y sinceridad son mi taller de referencia.",          tag: "Nuevo cliente",          avatarSrc: "http://img.b2bpic.net/free-photo/woman-wearing-pajamas-while-sitting-bed_273609-13213.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/custom-motorcycle-standing-repair-shop_158595-8117.jpg",          imageAlt: "Engine detail"},
        {
          id: "t4",          name: "Ana Fernández",          date: "Hace 1 semana",          title: "Excelente servicio",          quote: "Siempre rápidos y eficientes. Mi moto está como nueva cada vez que la llevo. ¡Totalmente recomendados!",          tag: "Cliente satisfecho",          avatarSrc: "http://img.b2bpic.net/free-photo/sweaty-male-couch-trainer-wears-hood-listens-music-with-earphones-electronic-device_273609-8618.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/view-man-s-strong-hands-with-leather-bracelets-fixing-gear-machine_181624-58135.jpg",          imageAlt: "Mechanic working"},
        {
          id: "t5",          name: "Javier Ruíz",          date: "Hace 2 meses",          title: "Precios justos",          quote: "Trabajo impecable y precios muy competitivos. Es el único taller en el que confío para mi moto.",          tag: "Cliente recurrente",          avatarSrc: "http://img.b2bpic.net/free-photo/expressive-senior-female-posing-indoor_344912-1363.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-tools-table-arrangement_23-2149916247.jpg",          imageAlt: "Motorcycle wheels"},
      ]}
      title="Lo que dicen nuestros clientes"
      description="Nuestra reputación se basa en la honestidad y el buen trabajo."
    />
  </div>

  <div id="team" data-section="team">
      <TeamCardSix
      animationType="depth-3d"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      members={[
        {
          id: "tm1",          name: "Miguel",          role: "Jefe de taller y mecánico principal. La cara visible del taller. Miguel te explica todo con detalle, sin tecnicismos, y siempre con la verdad por delante. +15 AÑOS",          imageSrc: "http://img.b2bpic.net/free-photo/happy-african-american-auto-mechanic-repair-shop_637285-9436.jpg",          imageAlt: "Portrait of Miguel, workshop owner"},
        {
          id: "tm2",          name: "Sergio",          role: "Mecánico y especialista técnico. El que tiene las manos en la moto. Sergio resuelve los problemas que otros talleres no encuentran. ESPECIALISTA",          imageSrc: "http://img.b2bpic.net/free-photo/young-technician-grey-uniform-standing-with-crossed-arms-looking-spiteful_176474-35390.jpg",          imageAlt: "Portrait of Sergio, technical specialist"},
      ]}
      title="MIGUEL & SERGIO."
      description="Conoce a los expertos que cuidarán de tu moto. Profesionales con más de 15 años de experiencia."
    />
  </div>

  <div id="cta-banner" data-section="cta-banner">
      <PricingCardThree
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      plans={[
        {
          id: "cta",          name: "PEDIR CITA AHORA",          price: "",          features: [],
          buttons: [
            {
              text: "PEDIR CITA AHORA",              href: "#contacto"},
          ],
        },
      ]}
      title="¿TU MOTO NECESITA ALGO?"
      description="Pide cita y te atendemos en el menor tiempo posible."
    />
  </div>

  <div id="brands" data-section="brands">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "YAMAHA",        "HONDA",        "SUZUKI",        "KAWASAKI",        "BMW MOTORRAD",        "DUCATI",        "TRIUMPH"]}
      title="TRABAJAMOS CON TODAS LAS MARCAS."
      description="Nuestro taller es 100% multimarca, lo que significa que puedes traer cualquier moto, de cualquier fabricante. Siempre con la misma profesionalidad."
      speed={40}
      showCard={false}
    />
  </div>

  <div id="ubicacion" data-section="ubicacion">
      <ContactCenter
      useInvertedBackground={false}
      background={{
        variant: "plain"}}
      tag="Contáctanos"
      title="Visítanos en Algete"
      description="📍 Dirección: Algete, Madrid\n🕐 Horario: Lunes a viernes 9:00–14:00 / 16:00–19:30 · Sábados 9:00–13:30\n📞 Teléfono: +34 916 291 421\n🔧 Especialidades: Todas las marcas · Carretera y trail · Scooters"
      inputPlaceholder="Tu nombre y teléfono"
      buttonText="Enviar Mensaje"
      termsText="Al enviar tu mensaje, aceptas nuestra política de privacidad."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseCard
      logoText="MOTORRAD.ALGETE"
      columns={[
        {
          title: "Links",          items: [
            {
              label: "Servicios",              href: "#servicios"},
            {
              label: "El taller",              href: "#taller"},
            {
              label: "Ubicación",              href: "#ubicacion"},
          ],
        },
      ]}
      copyrightText="© 2025 Motorrad Algete · Taller de motos en Algete, Madrid"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
