Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -2,8 +2,8 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCTA from '@/components/sections/contact/ContactCTA';
-import FooterBase from '@/components/sections/footer/FooterBase';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
 import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
@@ -29,71 +29,29 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleApple
       navItems={[
-        {
-          name: "Inicio",
-          id: "hero",
-        },
-        {
-          name: "Servicios",
-          id: "pricing",
-        },
-        {
-          name: "Tienda",
-          id: "product",
-        },
-        {
-          name: "Contacto",
-          id: "contact",
-        },
+        { name: "Inicio", id: "hero" },
+        { name: "Sobre Nosotros", id: "about" },
+        { name: "Servicios", id: "pricing" },
+        { name: "Productos", id: "product" },
+        { name: "Contacto", id: "contact" },
       ]}
-      brandName="Estudio Capilar"
+      brandName="Estudio Capilar Colombia"
     />
   </div>
 
   <div id="hero" data-section="hero">
       <HeroBillboardRotatedCarousel
-      background={{
-        variant: "gradient-bars",
-      }}
-      title="Expertos en Estilo y Color Capilar en Colombia"
-      description="Desde alisados perfectos hasta balayage de diseño. Transformamos tu cabello con técnicas personalizadas y productos premium."
-      buttons={[
-        {
-          text: "Reservar Cita",
-          href: "#contact",
-        },
-      ]}
+      background={{ variant: "gradient-bars" }}
+      title="Expertos en Arte Capilar Colombiano"
+      description="Transformamos tu cabello con técnicas de vanguardia, desde alisados de seda hasta balayage de diseño. Productos premium diseñados para el cabello latino."
+      buttons={[{ text: "Reserva tu cita", href: "#contact" }]}
       carouselItems={[
-        {
-          id: "1",
-          imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=1",
-          imageAlt: "Salon Luxury",
-        },
-        {
-          id: "2",
-          imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=2",
-          imageAlt: "Hair Transformation",
-        },
-        {
-          id: "3",
-          imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=3",
-          imageAlt: "Balayage Technique",
-        },
-        {
-          id: "4",
-          imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=4",
-          imageAlt: "Color Styling",
-        },
-        {
-          id: "5",
-          imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=5",
-          imageAlt: "Hair Care",
-        },
-        {
-          id: "6",
-          imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=6",
-          imageAlt: "Professional Result",
-        },
+        { id: "1", imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=1", imageAlt: "Salon luxury hair" },
+        { id: "2", imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=2", imageAlt: "Professional colorist" },
+        { id: "3", imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=3", imageAlt: "Healthy hair results" },
+        { id: "4", imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=4", imageAlt: "Colombian salon aesthetics" },
+        { id: "5", imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=5", imageAlt: "Balayage mastery" },
+        { id: "6", imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=6", imageAlt: "Natural hair care" },
       ]}
     />
   </div>
@@ -101,13 +59,8 @@ export default function LandingPage() {
   <div id="about" data-section="about">
       <TextAbout
       useInvertedBackground={false}
-      title="Tu mejor versión comienza aquí"
-      buttons={[
-        {
-          text: "Conoce más",
-          href: "#contact",
-        },
-      ]}
+      title="El corazón de la belleza capilar en Colombia"
+      buttons={[{ text: "Nuestra Historia", href: "#contact" }]}
     />
   </div>
 
@@ -116,61 +69,13 @@ export default function LandingPage() {
       animationType="slide-up"
       textboxLayout="default"
       useInvertedBackground={false}
+      title="Nuestros Servicios Estrella"
+      description="Tratamientos exclusivos adaptados a la textura y necesidades de tu cabello."
       plans={[
-        {
-          id: "p1",
-          title: "Alisado Especial",
-          price: "Desde $250.000",
-          period: "sesión",
-          features: [
-            "Alisado progresivo",
-            "Protección térmica",
-            "Brillo intenso",
-          ],
-          button: {
-            text: "Reservar",
-            href: "#contact",
-          },
-          imageSrc: "http://img.b2bpic.net/free-photo/profile-pretty-blonde-young-woman-shaking-her-hair_171337-15461.jpg?_wi=7",
-          imageAlt: "modern hair salon interior luxury",
-        },
-        {
-          id: "p2",
-          title: "Balayage Diseño",
-          price: "Desde $350.000",
-          period: "sesión",
-          features: [
-            "Diseño personalizado",
-            "Tono natural",
-            "Tratamiento de sellado",
-          ],
-          button: {
-            text: "Reservar",
-            href: "#contact",
-          },
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-female-hairdresser-pink-t-shirt-black-cape-holding-brush-scissors-smiling-green_140725-24204.jpg",
-          imageAlt: "hair stylist professional portrait",
-        },
-        {
-          id: "p3",
-          title: "Color a Pedido",
-          price: "Desde $180.000",
-          period: "sesión",
-          features: [
-            "Tintura premium",
-            "Cuidado post-color",
-            "Brillo de salón",
-          ],
-          button: {
-            text: "Reservar",
-            href: "#contact",
-          },
-          imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232288.jpg?_wi=1",
-          imageAlt: "hair serum bottle mock-up",
-        },
+        { id: "p1", title: "Alisado de Seda", price: "Desde $250.000", period: "sesión", features: ["Nutrición profunda", "Efecto espejo", "Anti-frizz"], button: { text: "Reservar", href: "#contact" } },
+        { id: "p2", title: "Balayage Premium", price: "Desde $380.000", period: "sesión", features: ["Diseño a medida", "Protección capilar", "Brillo intenso"], button: { text: "Reservar", href: "#contact" } },
+        { id: "p3", title: "Color & Vitalidad", price: "Desde $190.000", period: "sesión", features: ["Tintura premium", "Sellado de cutícula", "Hidratación"], button: { text: "Reservar", href: "#contact" } },
       ]}
-      title="Nuestros Servicios"
-      description="Tratamientos personalizados según tu tipo de cabello y estilo personal."
     />
   </div>
 
@@ -178,66 +83,15 @@ export default function LandingPage() {
       <ProductCardTwo
       animationType="slide-up"
       textboxLayout="default"
-      gridVariant="uniform-all-items-equal"
       useInvertedBackground={false}
+      gridVariant="uniform-all-items-equal"
+      title="Línea Exclusiva de Cuidado"
+      description="Lleva la calidad de nuestro salón a tu hogar con productos desarrollados para el clima y tipo de cabello colombiano."
       products={[
-        {
-          id: "1",
-          brand: "Estudio",
-          name: "Serum Hidratante",
-          price: "$45.000",
-          rating: 5,
-          reviewCount: "120",
-          imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232288.jpg?_wi=2",
-        },
-        {
-          id: "2",
-          brand: "Estudio",
-          name: "Mascarilla Reparadora",
-          price: "$60.000",
-          rating: 5,
-          reviewCount: "85",
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-close-up-shot-jar-honey-with-flowers-leaves_23-2148346577.jpg",
-        },
-        {
-          id: "3",
-          brand: "Estudio",
-          name: "Spray Protector",
-          price: "$35.000",
-          rating: 4,
-          reviewCount: "40",
-          imageSrc: "http://img.b2bpic.net/free-photo/snapshot-beautiful-lady-white-wall-girl-refuses-use-shampoo-with-chemicals-favor-natural_197531-13863.jpg",
-        },
-        {
-          id: "4",
-          brand: "Estudio",
-          name: "Aceite Esencial",
-          price: "$50.000",
-          rating: 5,
-          reviewCount: "200",
-          imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-product-container-with-art-nouveau-inspired-sun-relief-background_23-2151420642.jpg",
-        },
-        {
-          id: "5",
-          brand: "Estudio",
-          name: "Tónico Capilar",
-          price: "$40.000",
-          rating: 4,
-          reviewCount: "65",
-          imageSrc: "http://img.b2bpic.net/free-photo/hairdressing-supplies-bottle-with-spray-pump_23-2147711586.jpg",
-        },
-        {
-          id: "6",
-          brand: "Estudio",
-          name: "Acondicionador Profundo",
-          price: "$55.000",
-          rating: 5,
-          reviewCount: "150",
-          imageSrc: "http://img.b2bpic.net/free-photo/elegant-silk-pillow-skincare-product_23-2151968642.jpg",
-        },
+        { id: "1", brand: "Capilar", name: "Serum Nutritivo", price: "$45.000", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232288.jpg?_wi=2" },
+        { id: "2", brand: "Capilar", name: "Mascarilla Reparadora", price: "$60.000", rating: 5, reviewCount: "90", imageSrc: "http://img.b2bpic.net/free-photo/top-view-close-up-shot-jar-honey-with-flowers-leaves_23-2148346577.jpg" },
+        { id: "3", brand: "Capilar", name: "Spray de Brillo", price: "$35.000", rating: 4, reviewCount: "45", imageSrc: "http://img.b2bpic.net/free-photo/snapshot-beautiful-lady-white-wall-girl-refuses-use-shampoo-with-chemicals-favor-natural_197531-13863.jpg" },
       ]}
-      title="Catálogo de Cuidado Capilar"
-      description="Productos digitales y físicos para mantener tu cabello siempre radiante."
     />
   </div>
 
@@ -245,108 +99,39 @@ export default function LandingPage() {
       <TestimonialCardOne
       animationType="slide-up"
       textboxLayout="default"
-      gridVariant="uniform-all-items-equal"
       useInvertedBackground={false}
+      gridVariant="uniform-all-items-equal"
+      title="Historias de nuestras clientas"
+      description="La confianza es nuestra mayor recompensa. Descubre por qué somos referencia en el país."
       testimonials={[
-        {
-          id: "1",
-          name: "Camila R.",
-          role: "Cliente frecuente",
-          company: "Bogotá",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/nice-woman-with-photo-frame_1187-5662.jpg",
-        },
-        {
-          id: "2",
-          name: "Daniela G.",
-          role: "Balayage lover",
-          company: "Medellín",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-pretty-woman_1303-10235.jpg",
-        },
-        {
-          id: "3",
-          name: "Lucía P.",
-          role: "Alisado premium",
-          company: "Cali",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-people-giving-themselves-scalp-massage_23-2151307470.jpg",
-        },
-        {
-          id: "4",
-          name: "Sofia M.",
-          role: "Color personalizado",
-          company: "Cartagena",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/woman-getting-treatment-hairdresser-shop_23-2149229812.jpg",
-        },
-        {
-          id: "5",
-          name: "Valentina H.",
-          role: "Cuidado capilar",
-          company: "Barranquilla",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-businesswomen-working-office_23-2147955077.jpg",
-        },
+        { id: "1", name: "María C.", role: "Cliente frecuente", company: "Bogotá", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/nice-woman-with-photo-frame_1187-5662.jpg" },
+        { id: "2", name: "Lucía P.", role: "Balayage Look", company: "Medellín", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-pretty-woman_1303-10235.jpg" },
       ]}
-      title="Lo que dicen nuestras clientas"
-      description="Experiencias de transformación capilar con nosotros."
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactCTA
+      <ContactSplitForm
       useInvertedBackground={false}
-      background={{
-        variant: "plain",
-      }}
-      tag="Contacto"
-      title="Agenda tu cita hoy"
-      description="Reserva tu espacio llamando o vía WhatsApp. Estamos listos para consentirte."
-      buttons={[
-        {
-          text: "WhatsApp: +57 300 000 0000",
-          href: "https://wa.me/573000000000",
-        },
+      title="¿Lista para un cambio?"
+      description="Escríbenos y nuestro equipo te contactará para agendar tu cita de asesoría gratuita."
+      inputs={[
+        { name: "name", type: "text", placeholder: "Tu nombre", required: true },
+        { name: "phone", type: "tel", placeholder: "Tu teléfono (WhatsApp)", required: true },
       ]}
+      textarea={{ name: "message", placeholder: "Cuéntanos qué tratamiento buscas...", rows: 4 }}
+      buttonText="Enviar consulta"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBase
-      columns={[
-        {
-          title: "Navegación",
-          items: [
-            {
-              label: "Inicio",
-              href: "#hero",
-            },
-            {
-              label: "Servicios",
-              href: "#pricing",
-            },
-            {
-              label: "Catálogo",
-              href: "#product",
-            },
-          ],
-        },
-        {
-          title: "Legal",
-          items: [
-            {
-              label: "Política de Privacidad",
-              href: "#",
-            },
-            {
-              label: "Términos y Condiciones",
-              href: "#",
-            },
-          ],
-        },
-      ]}
+      <FooterLogoEmphasis
       logoText="Estudio Capilar"
+      columns={[
+        { items: [{ label: "Inicio", href: "#hero" }, { label: "Sobre Nosotros", href: "#about" }, { label: "Servicios", href: "#pricing" }] },
+        { items: [{ label: "Productos", href: "#product" }, { label: "WhatsApp: +57 300 000 0000" }] },
+        { items: [{ label: "Carrera 15 # 93-45, Bogotá" }, { label: "Lun-Sáb: 9am - 7pm" }] },
+      ]}
     />
   </div>
       </ReactLenis>