Update src/app/page.tsx

Merge version_4 into main

src/app/page.tsx

@@ -3,13 +3,13 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import BlogCardThree from '@/components/sections/blog/BlogCardThree';
-import ContactSplit from '@/components/sections/contact/ContactSplit';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
 import FaqBase from '@/components/sections/faq/FaqBase';
-import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
 import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
-import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
+import SplitAbout from '@/components/sections/about/SplitAbout';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import ProductCardFour from '@/components/sections/product/ProductCardFour';
+import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
 
 export default function LandingPage() {
@@ -31,21 +31,15 @@ export default function LandingPage() {
       <NavbarStyleFullscreen
       navItems={[
         {
-          name: "Inicio",
-          id: "hero",
-        },
+          name: "Inicio",          id: "hero"},
         {
-          name: "Sobre Nosotros",
-          id: "about",
-        },
+          name: "Sobre Nosotros",          id: "about"},
         {
-          name: "Nuestros Modelos",
-          id: "products",
-        },
+          name: "Nuestros Modelos",          id: "products"},
         {
-          name: "Contacto",
-          id: "contact",
-        },
+          name: "Noticias",          id: "news"},
+        {
+          name: "Contacto",          id: "contact"},
       ]}
       brandName="IBERIAN MARINE"
     />
@@ -54,215 +48,52 @@ export default function LandingPage() {
   <div id="hero" data-section="hero">
       <HeroSplitDoubleCarousel
       background={{
-        variant: "radial-gradient",
-      }}
+        variant: "radial-gradient"}}
       title="IBERIAN MARINE"
       description="Excelencia en navegación y diseño náutico."
       leftCarouselItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/outdoor-home-ocean-architecture-lounge_1203-4450.jpg",
-          imageAlt: "Embarcaciones de Pesca y Recreo",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/details-yacht-deck-reflection-sky_72229-318.jpg",
-          imageAlt: "Embarcaciones de Lujo",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/boat-body-water-near-island_206273-1.jpg",
-          imageAlt: "Experiencia Náutica",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/young-healthy-calm-woman-doing-yoga-sailing-yacht-boat-sea-island_1153-4004.jpg",
-          imageAlt: "Calidad Superior",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-taking-photos-woman_23-2149049104.jpg",
-          imageAlt: "Seguridad en Mar",
-        },
+        { imageSrc: "http://img.b2bpic.net/free-photo/outdoor-home-ocean-architecture-lounge_1203-4450.jpg", imageAlt: "Embarcaciones de Pesca y Recreo" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/details-yacht-deck-reflection-sky_72229-318.jpg", imageAlt: "Embarcaciones de Lujo" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/boat-body-water-near-island_206273-1.jpg", imageAlt: "Experiencia Náutica" },
       ]}
       rightCarouselItems={[
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/still-life-relaxing-coffee-cup-terrace_23-2149711973.jpg",
-          imageAlt: "Diseño Exclusivo",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/boat-sailing-ocean_23-2151995412.jpg",
-          imageAlt: "Lujo en cada detalle",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/view-graphic-3d-boat_23-2150849221.jpg",
-          imageAlt: "Pesca profesional",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/young-slim-woman-sitting-bikini-bathing-suit-yacht-basking-sun_1153-3944.jpg",
-          imageAlt: "Calidad técnica",
-        },
-        {
-          imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-laying-boat_23-2149046378.jpg",
-          imageAlt: "Rendimiento óptimo",
-        },
-      ]}
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/business-partnership_72229-581.jpg",
-          alt: "Equipo Iberian Marine",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/people-laying-by-lake-high-angle_23-2149870008.jpg",
-          alt: "Asesor náutico",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/medium-shot-woman-holding-cup_23-2149046379.jpg",
-          alt: "Consultora de ventas",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/swan-paddle-boats-lake_53876-33844.jpg",
-          alt: "Experto en diseño",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/two-glasses-rose-wine-boat_23-2151995419.jpg",
-          alt: "Ingeniero naval",
-        },
-      ]}
-      avatarText="Nuestro equipo de expertos en navegación"
-      marqueeItems={[
-        {
-          type: "image",
-          src: "http://img.b2bpic.net/free-photo/view-from-yacht-traffic-sea-vintage-effect-style-pictures_1253-965.jpg",
-          alt: "Marca náutica 1",
-        },
-        {
-          type: "image",
-          src: "http://img.b2bpic.net/free-photo/sunglasses-coffee-jewelry-boat_23-2151995457.jpg",
-          alt: "Marca náutica 2",
-        },
-        {
-          type: "image",
-          src: "http://img.b2bpic.net/free-photo/entertainment-with-speedboat-parachute_1122-1373.jpg",
-          alt: "Marca náutica 3",
-        },
-        {
-          type: "text",
-          text: "Innovación",
-        },
-        {
-          type: "text",
-          text: "Seguridad",
-        },
+        { imageSrc: "http://img.b2bpic.net/free-photo/still-life-relaxing-coffee-cup-terrace_23-2149711973.jpg", imageAlt: "Diseño Exclusivo" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/boat-sailing-ocean_23-2151995412.jpg", imageAlt: "Lujo en cada detalle" },
       ]}
     />
   </div>
 
   <div id="about" data-section="about">
-      <MetricSplitMediaAbout
+      <SplitAbout
       useInvertedBackground={true}
+      textboxLayout="default"
       title="Sobre Nosotros"
-      description="Con décadas de experiencia en el sector náutico, Iberian Marine combina tradición y tecnología para ofrecer las mejores soluciones de navegación. Nuestra pasión por el mar guía cada detalle de nuestras embarcaciones."
-      metrics={[
-        {
-          value: "20+",
-          title: "Años de Experiencia",
-        },
-        {
-          value: "500+",
-          title: "Barcos Vendidos",
-        },
-        {
-          value: "100%",
-          title: "Satisfacción Cliente",
-        },
+      description="Con décadas de experiencia en el sector náutico, Iberian Marine combina tradición y tecnología para ofrecer las mejores soluciones de navegación."
+      bulletPoints={[
+        { title: "Tradición", description: "Décadas de experiencia en la industria." },
+        { title: "Tecnología", description: "Innovación constante en diseño." },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/sky-sea-april-01-2024_58702-17032.jpg"
-      imageAlt="Sobre Nosotros"
-      mediaAnimation="slide-up"
+      mediaAnimation="none"
     />
   </div>
 
   <div id="products" data-section="products">
-      <ProductCardFour
+      <ProductCardOne
       animationType="slide-up"
       textboxLayout="split"
       gridVariant="four-items-2x2-equal-grid"
       useInvertedBackground={false}
-      products={[
-        {
-          id: "1",
-          name: "IM-560A",
-          price: "Consulta",
-          variant: "Pesca",
-          imageSrc: "http://img.b2bpic.net/free-photo/loop-boats-concept-collage_23-2150040477.jpg",
-        },
-        {
-          id: "2",
-          name: "IM-600A",
-          price: "Consulta",
-          variant: "Pesca",
-          imageSrc: "http://img.b2bpic.net/free-photo/white-paper-boat-high-angle_23-2148541515.jpg",
-        },
-        {
-          id: "3",
-          name: "IM-700A",
-          price: "Consulta",
-          variant: "Pesca",
-          imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-white-sail-boat-mast-clear-sky-daytime_181624-13047.jpg",
-        },
-        {
-          id: "4",
-          name: "IM-600B",
-          price: "Consulta",
-          variant: "Pesca",
-          imageSrc: "http://img.b2bpic.net/free-photo/person-having-fun-with-jetski_1122-1375.jpg",
-        },
-        {
-          id: "5",
-          name: "IM-650B",
-          price: "Consulta",
-          variant: "Pesca",
-          imageSrc: "http://img.b2bpic.net/free-photo/sailboat-owner-yachtsman-uses-hose-wash-salt-water-from-yachr-deck-when-docked-parked-marina-sunset_346278-362.jpg",
-        },
-        {
-          id: "6",
-          name: "IBERIAN50",
-          price: "Consulta",
-          variant: "Lujo",
-          imageSrc: "http://img.b2bpic.net/free-photo/details-yacht-deck-reflection-sky_72229-283.jpg",
-        },
-      ]}
+      products={[]}
       title="Nuestros Modelos"
-      description="Explore nuestra gama de embarcaciones diseñadas para la excelencia."
+      description="Explore nuestra gama de embarcaciones."
     />
   </div>
 
   <div id="testimonials" data-section="testimonials">
       <TestimonialCardTwelve
       useInvertedBackground={true}
-      testimonials={[
-        {
-          id: "1",
-          name: "Carlos M.",
-          imageSrc: "http://img.b2bpic.net/free-photo/front-view-happy-woman-posing-with-hat_23-2148700814.jpg",
-        },
-        {
-          id: "2",
-          name: "Laura S.",
-          imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-beach-working-laptop_23-2148578223.jpg",
-        },
-        {
-          id: "3",
-          name: "Javier R.",
-          imageSrc: "http://img.b2bpic.net/free-photo/handsome-serious-bearded-young-guy-walks-along-harbor_273609-20543.jpg",
-        },
-        {
-          id: "4",
-          name: "Elena F.",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-port-preparing-yacht-trip_72229-516.jpg",
-        },
-        {
-          id: "5",
-          name: "Miguel D.",
-          imageSrc: "http://img.b2bpic.net/free-photo/businessman-using-smartphone-laptop-near-water_23-2147793103.jpg",
-        },
-      ]}
+      testimonials={[]}
       cardTitle="Lo que dicen nuestros clientes"
       cardTag="Testimonios"
       cardAnimation="slide-up"
@@ -278,35 +109,7 @@ export default function LandingPage() {
       description="Manténgase al día con las últimas novedades del sector náutico."
       blogs={[
         {
-          id: "1",
-          category: "Sector",
-          title: "Innovación en Navegación",
-          excerpt: "Nuevas tecnologías aplicadas al rendimiento de barcos.",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-travelling-by-boat-san-sebastian_23-2149121007.jpg",
-          authorName: "Iberian",
-          authorAvatar: "http://img.b2bpic.net/free-photo/front-view-man-with-sunglasses-having-video-call-marina_23-2148682609.jpg",
-          date: "10 Ene 2024",
-        },
-        {
-          id: "2",
-          category: "Estilo",
-          title: "Tendencias 2024",
-          excerpt: "Descubre las nuevas tendencias en embarcaciones de lujo.",
-          imageSrc: "http://img.b2bpic.net/free-photo/arranged-traveling-items_23-2147656279.jpg",
-          authorName: "Iberian",
-          authorAvatar: "http://img.b2bpic.net/free-photo/man-sitting-his-bike_23-2148777812.jpg",
-          date: "15 Ene 2024",
-        },
-        {
-          id: "3",
-          category: "Consejos",
-          title: "Mantenimiento Náutico",
-          excerpt: "Guía práctica para preparar su embarcación.",
-          imageSrc: "http://img.b2bpic.net/free-photo/diverse-young-people-being-digital-nomads-working-remotely-from-dreamy-locations_23-2151187932.jpg",
-          authorName: "Iberian",
-          authorAvatar: "http://img.b2bpic.net/free-photo/young-man-supporting-needy-individuals_482257-75712.jpg",
-          date: "20 Ene 2024",
-        },
+          id: "1",          category: "Sector",          title: "Innovación en Navegación",          excerpt: "Nuevas tecnologías aplicadas al rendimiento de barcos.",          imageSrc: "http://img.b2bpic.net/free-photo/man-travelling-by-boat-san-sebastian_23-2149121007.jpg",          authorName: "Iberian",          authorAvatar: "http://img.b2bpic.net/free-photo/front-view-man-with-sunglasses-having-video-call-marina_23-2148682609.jpg",          date: "10 Ene 2024"}
       ]}
     />
   </div>
@@ -315,81 +118,39 @@ export default function LandingPage() {
       <FaqBase
       textboxLayout="split"
       useInvertedBackground={true}
-      faqs={[
-        {
-          id: "1",
-          title: "Cómo solicitar información?",
-          content: "Rellene el formulario de contacto indicando el modelo.",
-        },
-        {
-          id: "2",
-          title: "Realizan servicio postventa?",
-          content: "Sí, contamos con soporte técnico especializado.",
-        },
-        {
-          id: "3",
-          title: "Puedo financiar mi compra?",
-          content: "Ofrecemos asesoramiento en opciones de financiación.",
-        },
-      ]}
+      faqs={[]}
       title="Preguntas Frecuentes"
-      description="Resolvemos sus dudas sobre nuestros servicios."
+      description="Encuentre respuesta a las dudas más habituales sobre nuestros servicios y embarcaciones."
       faqsAnimation="slide-up"
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactSplit
+      <ContactCenter
       useInvertedBackground={false}
-      background={{
-        variant: "plain",
-      }}
+      background={{ variant: "plain" }}
       tag="Contacto"
       title="Contacto"
       description="Estamos listos para atender su solicitud de información."
-      imageSrc="http://img.b2bpic.net/free-photo/geometric-abstract-creative-blue-paperboard-background-flat-lay_24972-370.jpg"
-      mediaAnimation="slide-up"
+      onSubmit={(email) => console.log("Contacto recibido:", email)}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBaseReveal
-      logoText="IBERIAN MARINE"
+      <FooterSimple
       columns={[
         {
-          title: "Navegación",
-          items: [
-            {
-              label: "Inicio",
-              href: "#hero",
-            },
-            {
-              label: "Nosotros",
-              href: "#about",
-            },
-            {
-              label: "Modelos",
-              href: "#products",
-            },
-          ],
+          title: "Navegación",          items: [{ label: "Inicio", href: "#hero" }, { label: "Sobre Nosotros", href: "#about" }]
         },
         {
-          title: "Legal",
-          items: [
-            {
-              label: "Aviso Legal",
-              href: "#",
-            },
-            {
-              label: "Privacidad",
-              href: "#",
-            },
-          ],
-        },
+          title: "Legal",          items: [{ label: "Privacidad", href: "#" }]
+        }
       ]}
+      bottomLeftText="© 2024 IBERIAN MARINE"
+      bottomRightText="Todos los derechos reservados"
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/variables.css

@@ -11,14 +11,14 @@
   --background-accent: #ffffff; */
 
   --background: #ffffff;
-  --card: #f4f5f7;
-  --foreground: #0a1f44;
-  --primary-cta: #0a1f44;
+  --card: #f9f9f9;
+  --foreground: #000612e6;
+  --primary-cta: #15479c;
   --primary-cta-text: #ffffff;
-  --secondary-cta: #8a9bb0;
-  --secondary-cta-text: #ffffff;
-  --accent: #2c3e50;
-  --background-accent: #f4f5f7;
+  --secondary-cta: #f9f9f9;
+  --secondary-cta-text: #000612e6;
+  --accent: #e2e2e2;
+  --background-accent: #c4c4c4;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);