Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -3,14 +3,15 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import ContactCenter from '@/components/sections/contact/ContactCenter';
-import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
 import FooterMedia from '@/components/sections/footer/FooterMedia';
 import HeroBillboard from '@/components/sections/hero/HeroBillboard';
-import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import SplitAbout from '@/components/sections/about/SplitAbout';
-import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
+import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
+import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
+import ProductCardFour from '@/components/sections/product/ProductCardFour';
+import { CheckCircle, Wrench, MessageSquare, Truck, ShieldCheck } from 'lucide-react';
 
 export default function LandingPage() {
   return (
@@ -30,22 +31,10 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleApple
       navItems={[
-        {
-          name: "Inicio",
-          id: "hero",
-        },
-        {
-          name: "Productos",
-          id: "products",
-        },
-        {
-          name: "Asesoramiento",
-          id: "assistant",
-        },
-        {
-          name: "Contacto",
-          id: "contact",
-        },
+        { name: "Inicio", id: "hero" },
+        { name: "Productos", id: "/products" },
+        { name: "Asesoramiento", id: "assistant" },
+        { name: "Contacto", id: "contact" },
       ]}
       brandName="ParqueGas"
     />
@@ -53,268 +42,94 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroBillboard
-      background={{
-        variant: "gradient-bars",
-      }}
+      background={{ variant: "gradient-bars" }}
       title="Todo para tu baño, cocina y gas — sin vueltas"
       description="Te asesoramos antes de comprar. Evitá errores con expertos de confianza en Merlo."
-      buttons={[
-        {
-          text: "Ver productos",
-          href: "#products",
-        },
-        {
-          text: "Hablar con un experto",
-          href: "https://wa.me/541100000000",
-        },
-      ]}
+      buttons={[{ text: "Ver productos", href: "/products" }, { text: "Hablar con un experto", href: "https://wa.me/541100000000" }]}
       imageSrc="http://img.b2bpic.net/free-photo/futuristic-kitchen-interior-design_23-2151821283.jpg"
-      mediaAnimation="slide-up"
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/beautiful-kitchen-interior-design_23-2150976518.jpg",
-          alt: "Beautiful kitchen interior design",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/kitchen-bar_23-2147798069.jpg",
-          alt: "Kitchen of bar",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/male-shop-assistant-helps-young-couple-choose-new-home-appliance_93675-133540.jpg",
-          alt: "Male shop assistant helps young couple to choose new home appliance",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/woman-pink-blouse-buys-dishes-store_1157-36718.jpg",
-          alt: "Woman in a pink blouse buys dishes in the store",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/woman-pink-blouse-buys-dishes-store_1157-36707.jpg",
-          alt: "Woman in a pink blouse buys dishes in the store",
-        },
-      ]}
-      marqueeItems={[
-        {
-          type: "text",
-          text: "Asesoramiento Personalizado",
-        },
-        {
-          type: "text",
-          text: "Envíos en el día",
-        },
-        {
-          type: "text",
-          text: "Productos de Calidad",
-        },
-        {
-          type: "text",
-          text: "Expertos en Merlo",
-        },
-        {
-          type: "text",
-          text: "Precios Competitivos",
-        },
-      ]}
     />
   </div>
 
-  <div id="categories" data-section="categories">
-      <FeatureCardThree
-      animationType="slide-up"
+  <div id="compatibility" data-section="compatibility">
+    <FeatureCardTen
+      title="Compatibilidad Garantizada"
+      description="Verificamos cada pieza para tu instalación específica."
       textboxLayout="default"
-      gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={true}
+      animationType="slide-up"
+      useInvertedBackground={false}
       features={[
-        {
-          title: "Baño",
-          description: "Griferías, inodoros y accesorios.",
-          imageSrc: "http://img.b2bpic.net/free-photo/faucet-sink_74190-4120.jpg",
-        },
-        {
-          title: "Cocina",
-          description: "Bachas, monocomandos y desagües.",
-          imageSrc: "http://img.b2bpic.net/free-photo/silver-basin-mixer-isolated-gray-background_181624-59278.jpg",
-        },
-        {
-          title: "Gas",
-          description: "Calefones, estufas y repuestos.",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-comfortable-couch-with-white-cushions_1203-1451.jpg",
-        },
+        { title: "Marcas compatibles", description: "Trabajamos con repuestos originales.", media: { imageSrc: "http://img.b2bpic.net/free-photo/faucet-sink_74190-4120.jpg" }, items: [{ icon: CheckCircle, text: "Certificado de calidad" }], reverse: false },
+        { title: "Guía de selección", description: "Evitá compras erróneas.", media: { imageSrc: "http://img.b2bpic.net/free-photo/silver-basin-mixer-isolated-gray-background_181624-59278.jpg" }, items: [{ icon: Wrench, text: "Asesoramiento técnico" }], reverse: true }
       ]}
-      title="Nuestras Categorías"
-      description="Soluciones completas para el hogar."
     />
   </div>
 
   <div id="assistant" data-section="assistant">
       <SplitAbout
       textboxLayout="split"
-      useInvertedBackground={false}
-      title="¿No sabés qué comprar? Te ayudamos"
-      description="Envianos una foto o consulta por WhatsApp. Analizamos tu caso y te recomendamos exactamente lo que necesitás para que no gastes de más."
-      buttons={[
-        {
-          text: "Consultar por WhatsApp",
-          href: "https://wa.me/541100000000",
-        },
-      ]}
-      bulletPoints={[
-        {
-          title: "Asesoramiento Real",
-          description: "Expertos que conocen el producto.",
-        },
-        {
-          title: "Evitá devoluciones",
-          description: "Comprá lo que sirve a la primera.",
-        },
-        {
-          title: "Coordinación rápida",
-          description: "Entrega en el día en Merlo.",
-        },
-      ]}
+      title="Recomendación Experta"
+      description="No compres a ciegas. Enviá una foto de tu instalación y te decimos qué pieza exacta necesitas."
+      buttons={[{ text: "Consultar ahora", href: "https://wa.me/541100000000" }]}
       imageSrc="http://img.b2bpic.net/free-photo/woman-pink-blouse-buys-dishes-store_1157-36711.jpg"
       mediaAnimation="slide-up"
+      bulletPoints={[
+        { title: "Atención personalizada", description: "Atención uno a uno con expertos en la materia.", icon: MessageSquare },
+        { title: "Envío a domicilio en Merlo", description: "Recibí tus productos en la comodidad de tu hogar.", icon: Truck },
+        { title: "Productos certificados", description: "Solo trabajamos con marcas homologadas.", icon: ShieldCheck }
+      ]}
+      useInvertedBackground={false}
     />
   </div>
 
   <div id="products" data-section="products">
       <ProductCardOne
       animationType="slide-up"
-      textboxLayout="default"
       gridVariant="three-columns-all-equal-width"
-      useInvertedBackground={true}
-      products={[
-        {
-          id: "1",
-          name: "Grifería Lavabo",
-          price: "$45.000",
-          imageSrc: "http://img.b2bpic.net/free-photo/black-faucet-with-steel-sink-stylish-modern-kitchen_169016-20021.jpg",
-        },
-        {
-          id: "2",
-          name: "Monocomando Cocina",
-          price: "$62.000",
-          imageSrc: "http://img.b2bpic.net/free-photo/professional-kitchen-faucet-stainless-sink-white-marble_169016-69044.jpg",
-        },
-        {
-          id: "3",
-          name: "Calefón a Gas",
-          price: "$150.000",
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-calling-plumber-solve-kitchen-problems_23-2150990674.jpg",
-        },
-        {
-          id: "4",
-          name: "Grifería Lavabo",
-          price: "$45.000",
-          imageSrc: "http://img.b2bpic.net/free-photo/nature-kitchen-flow-open-closeup_1203-5200.jpg",
-        },
-        {
-          id: "5",
-          name: "Monocomando Cocina",
-          price: "$62.000",
-          imageSrc: "http://img.b2bpic.net/free-photo/running-water-stream-black-faucet-marble-wall_169016-68854.jpg",
-        },
-        {
-          id: "6",
-          name: "Calefón a Gas",
-          price: "$150.000",
-          imageSrc: "http://img.b2bpic.net/free-photo/worker-repairing-water-heater_23-2149334229.jpg",
-        },
-      ]}
       title="Productos Destacados"
-      description="Calidad garantizada para tu tranquilidad."
-    />
-  </div>
-
-  <div id="shipping" data-section="shipping">
-      <MetricCardEleven
-      animationType="slide-up"
+      description="Lo mejor en accesorios para tu hogar."
       textboxLayout="default"
       useInvertedBackground={false}
-      metrics={[
-        {
-          id: "m1",
-          value: "24hs",
-          title: "Entrega Rápida",
-          description: "Envío en el día en zona Merlo.",
-          imageSrc: "http://img.b2bpic.net/free-photo/classical-background-house-bath-interior_1203-5614.jpg",
-        },
-        {
-          id: "m2",
-          value: "100%",
-          title: "Asesoramiento",
-          description: "Guía completa antes de pagar.",
-          imageSrc: "http://img.b2bpic.net/free-photo/tap-hot-water-yellow-white_1203-4434.jpg",
-        },
-        {
-          id: "m3",
-          value: "Fácil",
-          title: "Retiro en Local",
-          description: "Tu pedido listo para buscar.",
-          imageSrc: "http://img.b2bpic.net/free-photo/hand-pushing-heater-s-red-button_23-2149395836.jpg",
-        },
+      products={[
+        { id: "1", name: "Grifería Lavabo", price: "$45.000", imageSrc: "http://img.b2bpic.net/free-photo/black-faucet-with-steel-sink-stylish-modern-kitchen_169016-20021.jpg" },
+        { id: "2", name: "Monocomando Cocina", price: "$62.000", imageSrc: "http://img.b2bpic.net/free-photo/professional-kitchen-faucet-stainless-sink-white-marble_169016-69044.jpg" }
       ]}
-      title="Servicio de Primera"
-      description="En ParqueGas facilitamos todo el proceso."
     />
   </div>
 
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialCardSix
+  <div id="related" data-section="related">
+    <ProductCardFour
+      title="Relacionados"
+      gridVariant="three-columns-all-equal-width"
       animationType="slide-up"
-      textboxLayout="default"
       useInvertedBackground={true}
-      testimonials={[
-        {
-          id: "t1",
-          name: "Ana Rodríguez",
-          handle: "Cliente Local",
-          testimonial: "Excelente atención y buenos precios. Me ayudaron a elegir el calefón justo.",
-          imageSrc: "http://img.b2bpic.net/free-photo/manufacturer-teaching-new-employee-how-shape-wooden-bowl-disc-sander_482257-99053.jpg",
-        },
-        {
-          id: "t2",
-          name: "Juan Pérez",
-          handle: "Cliente Local",
-          testimonial: "Te ayudan si no entendés nada, super pacientes.",
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-happy-man-showing-approval_23-2148230800.jpg",
-        },
-        {
-          id: "t3",
-          name: "Mariana Gómez",
-          handle: "Cliente Local",
-          testimonial: "Muy buen asesoramiento, muy rápidos en la entrega.",
-          imageSrc: "http://img.b2bpic.net/free-photo/happy-builder-hardhat_1398-1730.jpg",
-        },
-        {
-          id: "t4",
-          name: "Carlos Ruiz",
-          handle: "Cliente Local",
-          testimonial: "La mejor tienda de Merlo, sin dudas.",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-cute-couple-repairs-room_1157-25122.jpg",
-        },
-        {
-          id: "t5",
-          name: "Lucía Fernández",
-          handle: "Cliente Local",
-          testimonial: "Gracias por salvarme la instalación, expertos totales.",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-happy-woman-shopping-center_1163-1810.jpg",
-        },
+      textboxLayout="default"
+      description="Accesorios complementarios."
+      products={[
+        { id: "r1", name: "Kit Instalación", price: "$12.000", variant: "Kit", imageSrc: "http://img.b2bpic.net/free-photo/nature-kitchen-flow-open-closeup_1203-5200.jpg" }
       ]}
-      title="Lo que dicen nuestros clientes"
-      description="Expertos recomendados en Merlo."
+    />
+  </div>
+
+  <div id="social-proof" data-section="social-proof">
+    <TestimonialCardFifteen
+      testimonial="Increíble servicio. Me ahorraron mucho tiempo y dinero con la recomendación."
+      rating={5}
+      author="Carlos G."
+      avatars={[{ src: "http://img.b2bpic.net/free-photo/front-view-happy-man-showing-approval_23-2148230800.jpg", alt: "User" }]}
+      ratingAnimation="slide-up"
+      avatarsAnimation="slide-up"
+      useInvertedBackground={false}
     />
   </div>
 
   <div id="contact" data-section="contact">
       <ContactCenter
-      useInvertedBackground={false}
-      background={{
-        variant: "gradient-bars",
-      }}
       tag="Contacto"
       title="Estamos para ayudarte"
-      description="Escribinos por WhatsApp para cualquier consulta técnica o de stock."
+      description="Escribinos por WhatsApp para cualquier consulta técnica."
       buttonText="Escribir ahora"
+      background={{ variant: "plain" }}
+      useInvertedBackground={false}
     />
   </div>
 
@@ -322,35 +137,7 @@ export default function LandingPage() {
       <FooterMedia
       imageSrc="http://img.b2bpic.net/free-photo/woman-buys-dishes-store_1157-36695.jpg"
       logoText="ParqueGas"
-      columns={[
-        {
-          title: "Navegación",
-          items: [
-            {
-              label: "Inicio",
-              href: "/",
-            },
-            {
-              label: "Productos",
-              href: "#products",
-            },
-          ],
-        },
-        {
-          title: "Ayuda",
-          items: [
-            {
-              label: "WhatsApp",
-              href: "https://wa.me/541100000000",
-            },
-            {
-              label: "Contacto",
-              href: "#contact",
-            },
-          ],
-        },
-      ]}
-      copyrightText="© 2025 ParqueGas Merlo"
+      columns={[{ title: "Ayuda", items: [{ label: "WhatsApp", href: "https://wa.me/541100000000" }] }]}
     />
   </div>
       </ReactLenis>

src/app/products/page.tsx

@@ -0,0 +1,90 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
+import SplitAbout from '@/components/sections/about/SplitAbout';
+import FooterMedia from '@/components/sections/footer/FooterMedia';
+
+export default function ProductsPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="shift-hover"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="soft"
+        contentWidth="mediumSmall"
+        sizing="medium"
+        background="noiseDiagonalGradient"
+        cardStyle="outline"
+        primaryButtonStyle="flat"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="extrabold"
+    >
+      <ReactLenis root>
+        <NavbarStyleApple
+          navItems={[
+            { name: "Inicio", id: "/" },
+            { name: "Productos", id: "/products" },
+            { name: "Asesoramiento", id: "/#assistant" },
+            { name: "Contacto", id: "/#contact" },
+          ]}
+          brandName="ParqueGas"
+        />
+
+        <div id="products">
+            <ProductCardOne
+                title="Nuestro Catálogo"
+                description="Encuentra la pieza exacta para tu instalación."
+                textboxLayout="split"
+                gridVariant="three-columns-all-equal-width"
+                animationType="slide-up"
+                useInvertedBackground={false}
+                products={[
+                    { id: "1", name: "Grifería Premium", price: "$55.000", imageSrc: "http://img.b2bpic.net/free-photo/silver-basin-mixer-isolated-gray-background_181624-59278.jpg" },
+                    { id: "2", name: "Kit Repuesto Gas", price: "$28.000", imageSrc: "http://img.b2bpic.net/free-photo/nature-kitchen-flow-open-closeup_1203-5200.jpg" },
+                    { id: "3", name: "Filtro de Agua", price: "$32.000", imageSrc: "http://img.b2bpic.net/free-photo/black-faucet-with-steel-sink-stylish-modern-kitchen_169016-20021.jpg" }
+                ]}
+            />
+        </div>
+
+        <div id="compatibility">
+            <FeatureCardTen
+                title="¿Es compatible?"
+                description="No te preocupes por el ajuste. Analizamos cada modelo."
+                textboxLayout="inline-image"
+                animationType="blur-reveal"
+                useInvertedBackground={false}
+                features={[
+                    {
+                        title: "Validación técnica",                        description: "Verificamos medidas y roscas antes de enviarte cualquier repuesto.",                        media: { imageSrc: "http://img.b2bpic.net/free-photo/faucet-sink_74190-4120.jpg" },
+                        items: [],
+                        reverse: false
+                    }
+                ]}
+            />
+        </div>
+
+        <div id="assistant">
+            <SplitAbout
+                title="Soporte por WhatsApp"
+                description="¿Tienes dudas técnicas? Envíale una foto a nuestros expertos y te asistiremos."
+                textboxLayout="split-actions"
+                buttons={[{ text: "Chat con experto", href: "https://wa.me/541100000000" }]}
+                imageSrc="http://img.b2bpic.net/free-photo/woman-pink-blouse-buys-dishes-store_1157-36711.jpg"
+                mediaAnimation="slide-up"
+                bulletPoints={[]}
+                useInvertedBackground={false}
+            />
+        </div>
+
+        <FooterMedia
+            imageSrc="http://img.b2bpic.net/free-photo/woman-buys-dishes-store_1157-36695.jpg"
+            logoText="ParqueGas"
+            columns={[{ title: "Ayuda", items: [{ label: "WhatsApp", href: "https://wa.me/541100000000" }] }]}
+        />
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}