Merge version_2 into main

Merge version_2 into main

src/app/page.tsx

@@ -1,15 +1,11 @@
 "use client";
 
-// Missing section from registry: Hero Section
-// Missing section from registry: Differential Features
-// Missing section from registry: Our Services
-// Missing section from registry: Client Testimonials
-// Missing section from registry: About Julia
-// Missing section from registry: Location & Contact
-// Missing section from registry: Site Footer
-
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import AboutMetric from '@/components/sections/about/AboutMetric';
+import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+import { Sparkles, Heart, Award } from 'lucide-react';
 import { Libre_Baskerville } from "next/font/google";
 import { Inter } from "next/font/google";
 
@@ -27,13 +23,13 @@ export default function LandingPage() {
     <ThemeProvider
       defaultButtonVariant="shift-hover"
       defaultTextAnimation="background-highlight"
-      borderRadius="pill"
-      contentWidth="smallMedium"
+      borderRadius="soft"
+      contentWidth="medium"
       sizing="largeSmall"
-      background="circleGradient"
+      background="noise"
       cardStyle="glass-depth"
-      primaryButtonStyle="double-inset"
-      secondaryButtonStyle="radial-glow"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="solid"
       headingFontWeight="medium"
     >
       <div id="nav" data-section="nav">
@@ -42,13 +38,62 @@ export default function LandingPage() {
             { "name": "Servicios", "id": "services" },
             { "name": "Reseñas", "id": "reviews" },
             { "name": "Nosotros", "id": "about-julia" },
-            { "name": "Contacto", "id": "contact" }
+            { "name": "Contacto", "id": "final-cta" }
           ]}
           brandName="Julia Coiffure Unisex"
           bottomLeftText="Belleza Premium"
           bottomRightText="Reservar Turno"
         />
       </div>
+
+      <div id="about-julia" data-section="about-julia">
+        <AboutMetric
+          title="Julia Coiffure Unisex: Dedicación, Calidez y Experiencia"
+          metrics={[
+            { icon: Sparkles, label: "Experiencia Comprobada", value: "Más de 15 años" },
+            { icon: Heart, label: "Atención Personalizada", value: "Cientos de Clientes Felices" },
+            { icon: Award, label: "Resultados Impecables", value: "Transformaciones Únicas" }
+          ]}
+          metricsAnimation="blur-reveal"
+          useInvertedBackground={true}
+          className="py-20 lg:py-28"
+          containerClassName="max-w-screen-xl mx-auto px-4"
+          titleClassName="text-center text-3xl font-bold mb-12"
+        />
+      </div>
+
+      <div id="final-cta" data-section="final-cta">
+        <HeroSplitDualMedia
+          title="Tu Transformación Empieza Aquí."
+          description="Agenda tu cita hoy y experimenta el arte de la belleza con Julia. ¡Te esperamos!"
+          tag="Reservar Ahora"
+          background={{ variant: 'radial-gradient' }}
+          buttons={[
+            { text: "Reservar Turno", href: "#" },
+            { text: "WhatsApp", href: "https://wa.me/1234567890" }
+          ]}
+          mediaItems={[
+            { imageSrc: "/images/hair-styling-1.jpg", imageAlt: "Hair styling process" },
+            { imageSrc: "/images/hair-styling-2.jpg", imageAlt: "Finished elegant hairstyle" }
+          ]}
+          rating={5}
+          ratingText="Calidad de Servicio"
+          mediaAnimation="blur-reveal"
+          buttonAnimation="slide-up"
+          tagAnimation="slide-up"
+          className="py-20 lg:py-28"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterLogoReveal
+          logoText="Julia Coiffure Unisex"
+          leftLink={{ text: "WhatsApp", href: "https://wa.me/1234567890" }}
+          rightLink={{ text: "Instagram", href: "https://instagram.com/juliacoiffure" }}
+          className="py-10 bg-gradient-to-t from-background-accent to-transparent"
+        />
+      </div>
+
     </ThemeProvider>
   );
 }

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #FFFFFF;
-  --card: #FBFBFB;
-  --foreground: #0B0B0B;
-  --primary-cta: #C6A76A;
-  --primary-cta-text: #FFFFFF;
-  --secondary-cta: #0B0B0B;
-  --secondary-cta-text: #FFFFFF;
-  --accent: #C6A76A;
-  --background-accent: #FDF5ED;
+  --background: #0a0a0a;
+  --card: #1a1a1a;
+  --foreground: #f5f5f5;
+  --primary-cta: #ffdf7d;
+  --primary-cta-text: #0a0a0a;
+  --secondary-cta: #1a1a1a;
+  --secondary-cta-text: #ffffff;
+  --accent: #b8860b;
+  --background-accent: #8b6914;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);