Update src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -3,16 +3,13 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import ContactCenter from '@/components/sections/contact/ContactCenter';
-import FaqBase from '@/components/sections/faq/FaqBase';
-import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
-import FooterMedia from '@/components/sections/footer/FooterMedia';
-import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
-import MediaAbout from '@/components/sections/about/MediaAbout';
-import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
-import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
-import ProductCardFour from '@/components/sections/product/ProductCardFour';
-import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
-import { Building, CheckCircle, Users } from "lucide-react";
+import TimelineHorizontalCardStack from '@/components/cardStack/layouts/timelines/TimelineHorizontalCardStack';
+import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import HeroCentered from '@/components/sections/hero/HeroCentered';
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
 
 export default function LandingPage() {
   return (
@@ -22,244 +19,131 @@ export default function LandingPage() {
         borderRadius="soft"
         contentWidth="mediumLarge"
         sizing="largeSmallSizeMediumTitles"
-        background="floatingGradient"
-        cardStyle="glass-depth"
-        primaryButtonStyle="radial-glow"
+        background="noise"
+        cardStyle="soft-shadow"
+        primaryButtonStyle="flat"
         secondaryButtonStyle="solid"
-        headingFontWeight="bold"
+        headingFontWeight="semibold"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarStyleApple
-      navItems={[
-        {
-          name: "Inicio",          id: "hero"},
-        {
-          name: "Servicios",          id: "servicios"},
-        {
-          name: "Proyectos",          id: "proyectos"},
-        {
-          name: "Contacto",          id: "contacto"},
-      ]}
-      brandName="ArchiCanning"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingInline
+            brandName="ArchiCanning"
+            button={{ text: "Contacto", href: "#contacto" }}
+            navItems={[
+              { name: "Inicio", id: "hero" },
+              { name: "Servicios", id: "servicios" },
+              { name: "Ventas", id: "proyectos" },
+              { name: "Proceso", id: "proceso" },
+              { name: "Contacto", id: "contacto" },
+            ]}
+          />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroBillboardTestimonial
-      useInvertedBackground={false}
-      background={{
-        variant: "plain"}}
-      title="Arquitectura y Desarrollos de Vanguardia en Buenos Aires"
-      description="Transformamos espacios en experiencias únicas. Diseño, construcción y comercialización integral en Canning y San Miguel."
-      testimonials={[
-        {
-          name: "Juan Pérez",          handle: "@juanp",          testimonial: "Excelente atención y calidad en la construcción.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-caucasian-young-guy-wearing-green-shirt-showing-goat-gesture-with-both-hands-isolated-white-background_141793-38583.jpg"},
-        {
-          name: "Ana García",          handle: "@anag",          testimonial: "El diseño de nuestra casa superó expectativas.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/architec-designer-working-with-3d-printed-models-buildings-modern-office_482257-27749.jpg"},
-        {
-          name: "Luis Rossi",          handle: "@luisr",          testimonial: "Profesionalismo puro en la dirección de obra.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/high-rise-construction-with-cantilever-decks-floor-rhythm-yellow-platforms_169016-69965.jpg"},
-        {
-          name: "Mariana López",          handle: "@mlop",          testimonial: "Un proyecto inmobiliario de primera calidad.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-couple-holding-house-plans_23-2148895458.jpg"},
-        {
-          name: "Carlos Ruiz",          handle: "@cruz",          testimonial: "El equipo más capacitado en la zona.",          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-real-estate-agent-working_23-2150322065.jpg"},
-      ]}
-      buttons={[
-        {
-          text: "Agendar Consulta",          href: "#contacto"},
-      ]}
-      imageSrc="http://img.b2bpic.net/free-photo/young-woman-architect-who-controls-sketches-real-estate-project-cozy-work-place_482257-31156.jpg"
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/architect-woman-her-desk-working-blueprints-business-creativity-architecture-job_482257-33113.jpg",          alt: "Arquitecta principal"},
-        {
-          src: "http://img.b2bpic.net/free-photo/front-view-man-working-project_23-2149721888.jpg",          alt: "Director de obra"},
-        {
-          src: "http://img.b2bpic.net/free-photo/female-architect-modern-office-looking-3d-printed-model-building-she-is-working_482257-31165.jpg",          alt: "Especialista en diseño 3D"},
-        {
-          src: "http://img.b2bpic.net/free-photo/female-artist-studio_23-2148002221.jpg",          alt: "Diseñadora de interiores"},
-        {
-          src: "http://img.b2bpic.net/free-photo/close-up-young-male-architect-with-blueprint-desk_23-2147839862.jpg",          alt: "Arquitecto colaborador"},
-      ]}
-      marqueeItems={[
-        {
-          type: "text",          text: "Diseño"},
-        {
-          type: "text",          text: "Construcción"},
-        {
-          type: "text",          text: "Inmobiliaria"},
-        {
-          type: "text",          text: "Canning"},
-        {
-          type: "text",          text: "San Miguel"},
-      ]}
-    />
-  </div>
+        <div id="hero" data-section="hero">
+          <HeroCentered
+            title="Construimos Hogares en Canning y Bella Vista"
+            description="Honestidad, calidez y excelencia en cada detalle. Arquitectura que conecta con tu forma de vivir."
+            avatars={[
+                { src: "https://img.b2bpic.net/free-photo/smiling-caucasian-young-guy-wearing-green-shirt-showing-goat-gesture-with-both-hands-isolated-white-background_141793-38583.jpg", alt: "User 1" },
+                { src: "https://img.b2bpic.net/free-photo/architec-designer-working-with-3d-printed-models-buildings-modern-office_482257-27749.jpg", alt: "User 2" }
+            ]}
+            buttons={[{ text: "Conocer más", href: "#servicios" }, { text: "Contacto WhatsApp", href: "https://wa.me/yournumber" }]}
+            background={{ variant: "plain" }}
+          />
+        </div>
 
-  <div id="servicios" data-section="servicios">
-      <FeatureCardThree
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="uniform-all-items-equal"
-      useInvertedBackground={false}
-      features={[
-        {
-          title: "Diseño Arquitectónico",          description: "Proyectos creativos y funcionales adaptados a tu terreno.",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-architect-woman-her-working-desk-working-new-projects-architecture-design_482257-33107.jpg"},
-        {
-          title: "Dirección de Obra",          description: "Supervisión técnica rigurosa para garantizar la excelencia.",          imageSrc: "http://img.b2bpic.net/free-photo/examination-serious-young-adult-woman-business-gray-suit-heels-wearing-safety-helmet-looking-document-smiling-three-men-waiting-construction-site_259150-57759.jpg"},
-        {
-          title: "Desarrollos en Venta",          description: "Propiedades listas para comprar con diseño de autor.",          imageSrc: "http://img.b2bpic.net/free-photo/couple-moving-new-house_23-2149383588.jpg"},
-      ]}
-      title="Nuestros Pilares"
-      description="Soluciones arquitectónicas integrales para cada necesidad."
-    />
-  </div>
+        <div id="servicios" data-section="servicios">
+          <FeatureCardNineteen
+            title="¿Por qué trabajar con nosotros?"
+            description="No somos una empresa enorme. Somos un equipo de arquitectos que trabaja de cerca con cada familia."
+            textboxLayout="split"
+            useInvertedBackground={false}
+            features={[
+                { tag: "Canning", title: "Conocimiento Local", subtitle: "Nuestra zona", description: "Conocemos Canning y bella vista como nuestra propia casa.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-architect-woman-her-working-desk-working-new-projects-architecture-design_482257-33107.jpg" },
+                { tag: "Transparencia", title: "Comunicación Clara", subtitle: "Sin términos técnicos", description: "Te explicamos todo sin términos técnicos ni vueltas.", imageSrc: "https://img.b2bpic.net/free-photo/examination-serious-young-adult-woman-business-gray-suit-heels-wearing-safety-helmet-looking-document-smiling-three-men-waiting-construction-site_259150-57759.jpg" },
+                { tag: "Presupuesto", title: "Transparencia Total", subtitle: "Sin sorpresas", description: "Presupuesto claro desde el primer día, sin sorpresas.", imageSrc: "https://img.b2bpic.net/free-photo/modern-house-exterior-design_23-2149457635.jpg" },
+                { tag: "Diseño", title: "Diseño y Construcción", subtitle: "Equipo integral", description: "El mismo equipo que diseña es el que construye.", imageSrc: "https://img.b2bpic.net/free-photo/young-architect-checking-house-blueprints-construction-site_23-2148780775.jpg?_wi=1" },
+                { tag: "Servicio", title: "Llave en Mano", subtitle: "Cero preocupaciones", description: "Entrega llave en mano — vos no coordinás nada.", imageSrc: "https://img.b2bpic.net/free-photo/happy-family-new-house_23-2148116544.jpg?_wi=1" },
+                { tag: "Flexibilidad", title: "Presupuestos Adaptables", subtitle: "Consultanos", description: "Trabajamos con distintos presupuestos, consultanos tu caso.", imageSrc: "https://img.b2bpic.net/free-photo/architect-holding-blueprint-with-client_23-2148780777.jpg?_wi=1" }
+            ]}
+          />
+        </div>
 
-  <div id="proyectos" data-section="proyectos">
-      <ProductCardFour
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="four-items-2x2-equal-grid"
-      useInvertedBackground={false}
-      products={[
-        {
-          id: "1",          name: "Casa Canning I",          price: "USD 250.000",          variant: "Residencial",          imageSrc: "http://img.b2bpic.net/free-photo/3d-house-model-with-modern-architecture_23-2151004028.jpg"},
-        {
-          id: "2",          name: "Casa San Miguel",          price: "USD 280.000",          variant: "Residencial",          imageSrc: "http://img.b2bpic.net/free-photo/african-american-lady-safety-helmet-taking-photo-building-construction_23-2148039969.jpg"},
-        {
-          id: "3",          name: "Casa Canning II",          price: "USD 310.000",          variant: "Residencial",          imageSrc: "http://img.b2bpic.net/free-photo/modern-buildings-with-yellow-lines_1112-273.jpg"},
-        {
-          id: "4",          name: "Townhouse San Miguel",          price: "USD 190.000",          variant: "Residencial",          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-building-exterior-design_23-2151917349.jpg"},
-        {
-          id: "5",          name: "Casa Canning III",          price: "USD 350.000",          variant: "Residencial",          imageSrc: "http://img.b2bpic.net/free-photo/male-architect-showing-blueprint-his-female-colleague_23-2147839903.jpg"},
-        {
-          id: "6",          name: "Casa San Miguel B",          price: "USD 260.000",          variant: "Residencial",          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-luxury-travel_23-2149204470.jpg"},
-      ]}
-      title="Desarrollos Disponibles"
-      description="Explora nuestras propiedades listas para convertirte en dueño."
-    />
-  </div>
+        <div id="proyectos" data-section="proyectos">
+          <ProductCardOne
+            title="Casas en Venta"
+            description="Propiedades exclusivas diseñadas para disfrutar."
+            gridVariant="uniform-all-items-equal"
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            products={[
+                { id: "1", name: "Residencia Bella Vista", price: "Consultar", imageSrc: "https://img.b2bpic.net/free-photo/3d-house-model-with-modern-architecture_23-2151004028.jpg" },
+                { id: "2", name: "Casa Canning Classic", price: "Consultar", imageSrc: "https://img.b2bpic.net/free-photo/beautiful-building-exterior-design_23-2151917349.jpg" }
+            ]}
+          />
+        </div>
 
-  <div id="metricas" data-section="metricas">
-      <MetricCardOne
-      animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="uniform-all-items-equal"
-      useInvertedBackground={false}
-      metrics={[
-        {
-          id: "1",          value: "150+",          title: "Proyectos",          description: "Diseñados y ejecutados exitosamente.",          icon: CheckCircle,
-        },
-        {
-          id: "2",          value: "20k",          title: "m²",          description: "Construidos en total en la zona.",          icon: Building,
-        },
-        {
-          id: "3",          value: "100%",          title: "Clientes",          description: "Satisfechos con los resultados.",          icon: Users,
-        },
-      ]}
-      title="Nuestra Trayectoria"
-      description="Números que respaldan nuestra seriedad en el mercado."
-    />
-  </div>
+        <div id="proceso" data-section="proceso">
+          <TimelineHorizontalCardStack
+            title="Nuestro Proceso de Trabajo"
+            description="Seguimos una metodología clara para garantizar calidad en cada etapa de tu proyecto."
+            textboxLayout="split"
+            useInvertedBackground={false}
+            mediaItems={[
+                { imageSrc: "https://img.b2bpic.net/free-photo/architect-holding-blueprint-with-client_23-2148780777.jpg?_wi=2", imageAlt: "Consulta" },
+                { imageSrc: "https://img.b2bpic.net/free-photo/architec-designer-working-with-3d-printed-models-buildings-modern-office_482257-27749.jpg", imageAlt: "Diseño" },
+                { imageSrc: "https://img.b2bpic.net/free-photo/young-architect-checking-house-blueprints-construction-site_23-2148780775.jpg?_wi=2", imageAlt: "Construcción" },
+                { imageSrc: "https://img.b2bpic.net/free-photo/happy-family-new-house_23-2148116544.jpg?_wi=2", imageAlt: "Entrega" }
+            ]}
+          >
+            <div />
+          </TimelineHorizontalCardStack>
+        </div>
 
-  <div id="por-que-elegirnos" data-section="por-que-elegirnos">
-      <MediaAbout
-      useInvertedBackground={false}
-      title="Por qué elegirnos"
-      description="Combinamos la visión técnica de la arquitectura con la eficacia de una desarrolladora inmobiliaria para maximizar el valor de tu inversión."
-      imageSrc="http://img.b2bpic.net/free-photo/photorealistic-house-with-wooden-architecture-timber-structure_23-2151302647.jpg"
-    />
-  </div>
+        <div id="ubicacion" data-section="ubicacion">
+          <div className="py-20 px-4 bg-card">
+              <h2 className="text-center text-3xl font-bold mb-10">¿Dónde encontrarnos?</h2>
+              <div className="w-full h-[400px] rounded-lg overflow-hidden">
+                 <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3278.435559868777!2d-58.5173167!3d-34.8236167!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x95bcc7d04473859b%3A0x6b4c3e80e95a9e70!2sCanning%2C%20Buenos%20Aires!5e0!3m2!1ses-419!2sar!4v1700000000000!5m2!1ses-419!2sar" width="100%" height="100%" style={{border:0}} allowFullScreen={true} loading="lazy"></iframe>
+              </div>
+          </div>
+        </div>
 
-  <div id="proceso" data-section="proceso">
-      <FaqBase
-      textboxLayout="default"
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "1",          title: "Consultoría inicial",          content: "Entendemos tus necesidades y presupuesto."},
-        {
-          id: "2",          title: "Anteproyecto",          content: "Diseñamos la idea y presentamos la propuesta."},
-        {
-          id: "3",          title: "Ejecución y Dirección",          content: "Llevamos adelante el proyecto con control técnico total."},
-      ]}
-      title="Nuestro Proceso de Trabajo"
-      description="Un enfoque transparente desde la idea inicial hasta la entrega final."
-      faqsAnimation="slide-up"
-    />
-  </div>
+        <div id="testimonios" data-section="testimonios">
+            <TestimonialCardThirteen
+                title="Lo que dicen de nosotros"
+                description="La confianza es nuestra mayor obra terminada."
+                textboxLayout="default"
+                showRating={true}
+                animationType="slide-up"
+                useInvertedBackground={false}
+                testimonials={[
+                    { id: "1", name: "Flia. Gómez", handle: "@familia", testimonial: "Un equipo humano y profesional de primera. Nos dieron confianza desde el inicio.", rating: 5 }
+                ]}
+            />
+        </div>
 
-  <div id="testimonios" data-section="testimonios">
-      <TestimonialCardFifteen
-      useInvertedBackground={false}
-      testimonial="Profesionalismo, creatividad y compromiso. Un equipo excelente que nos acompañó en cada etapa de la casa propia."
-      rating={5}
-      author="Familia Martínez"
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/construction-architect-team-working-desk-office-blueprint-layout-caucasian-colleagues-standing_482257-2828.jpg",          alt: "Cliente A"},
-        {
-          src: "http://img.b2bpic.net/free-photo/smiling-caucasian-young-guy-wearing-green-shirt-showing-yes-gesture-with-both-hand-isolated-green-background_141793-38588.jpg",          alt: "Cliente B"},
-        {
-          src: "http://img.b2bpic.net/free-photo/smiley-woman-posing-with-yellow-background_23-2148241124.jpg",          alt: "Cliente C"},
-        {
-          src: "http://img.b2bpic.net/free-photo/portrait-cute-caucasian-white-teenager-posing-outdoors_181624-52184.jpg",          alt: "Cliente D"},
-        {
-          src: "http://img.b2bpic.net/free-photo/smiling-caucasian-young-guy-wearing-pink-shirt-isolated-orange-background_141793-38611.jpg",          alt: "Cliente E"},
-      ]}
-      ratingAnimation="blur-reveal"
-      avatarsAnimation="slide-up"
-    />
-  </div>
+        <div id="contacto" data-section="contacto">
+            <ContactCenter
+                tag="Contacto"
+                title="¿Listo para empezar tu proyecto?"
+                description="Dejanos tu email y nos pondremos en contacto a la brevedad."
+                background={{ variant: "plain" }}
+                useInvertedBackground={false}
+            />
+        </div>
 
-  <div id="contacto" data-section="contacto">
-      <ContactCenter
-      useInvertedBackground={false}
-      background={{
-        variant: "plain"}}
-      tag="Contacto"
-      title="Iniciemos tu proyecto"
-      description="Agenda una consulta personalizada con nuestro estudio."
-      buttonText="Enviar Consulta"
-    />
-  </div>
-
-  <div id="footer" data-section="footer">
-      <FooterMedia
-      imageSrc="http://img.b2bpic.net/free-photo/woman-thinking-papers_23-2147668756.jpg"
-      logoText="ArchiCanning"
-      columns={[
-        {
-          title: "Estudio",          items: [
-            {
-              label: "Sobre nosotros",              href: "#"},
-            {
-              label: "Contacto",              href: "#contacto"},
-          ],
-        },
-        {
-          title: "Servicios",          items: [
-            {
-              label: "Diseño",              href: "#servicios"},
-            {
-              label: "Dirección",              href: "#servicios"},
-          ],
-        },
-        {
-          title: "Legal",          items: [
-            {
-              label: "Política de Privacidad",              href: "#"},
-          ],
-        },
-      ]}
-      copyrightText="© 2025 ArchiCanning Studio. Todos los derechos reservados."
-    />
-  </div>
+        <div id="footer" data-section="footer">
+            <FooterBaseCard 
+                logoText="ArchiCanning"
+                columns={[
+                    { title: "Estudio", items: [{ label: "Sobre Nosotros", href: "#" }, { label: "Proyectos", href: "#proyectos" }] },
+                    { title: "Contacto", items: [{ label: "WhatsApp", href: "#" }, { label: "Email", href: "#" }] }
+                ]}
+            />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #ffffff;
-  --card: #f9f9f9;
-  --foreground: #1c1c1c;
-  --primary-cta: #1c1c1c;
+  --background: #0a0a0a;
+  --card: #1a1a1a;
+  --foreground: #ffffffe6;
+  --primary-cta: #e6e6e6;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #1a1a1a;
   --secondary-cta-text: #1c1c1c;
-  --accent: #d4d4d4;
-  --background-accent: #f4f4f4;
+  --accent: #737373;
+  --background-accent: #737373;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);