Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -2,13 +2,14 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactSplit from '@/components/sections/contact/ContactSplit';
-import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
-import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
-import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
-import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import SplitAbout from '@/components/sections/about/SplitAbout';
-import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import FeatureBento from '@/components/sections/feature/FeatureBento';
+import FooterBase from '@/components/sections/footer/FooterBase';
+import HeroSplit from '@/components/sections/hero/HeroSplit';
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import AboutMetric from '@/components/sections/about/AboutMetric';
+import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
+import { Users, Info, Sparkles, MapPin, Star, Calendar } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -26,241 +27,90 @@ export default function LandingPage() {
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarStyleCentered
+      <NavbarLayoutFloatingInline
       navItems={[
-        {
-          name: "Acasa",
-          id: "hero",
-        },
-        {
-          name: "Despre",
-          id: "about",
-        },
-        {
-          name: "Facilități",
-          id: "features",
-        },
-        {
-          name: "Recenzii",
-          id: "testimonials",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
+        { name: "Acasa", id: "hero" },
+        { name: "Despre", id: "about" },
+        { name: "Facilități", id: "features" },
+        { name: "Recenzii", id: "testimonials" },
+        { name: "Contact", id: "contact" },
       ]}
       brandName="Hotel Ana Maria"
+      button={{ text: "Rezervări", href: "#contact" }}
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroBillboardCarousel
-      background={{
-        variant: "gradient-bars",
-      }}
+      <HeroSplit
+      background={{ variant: "sparkles-gradient" }}
       title="Oază de liniște la poalele Ceahlăului"
       description="Experimentați luxul și confortul într-o locație impecabilă, unde natura întâlnește ospitalitatea autentică."
-      buttons={[
-        {
-          text: "Rezervă Acum",
-          href: "#contact",
-        },
-      ]}
-      mediaItems={[
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CJ01VbaoxL9ce1PTbxxhQoM9AA/uploaded-1776089836398-lzjtf6t1.jpg",
-          imageAlt: "Hotel Ana Maria vedere Ceahlau",
-        },
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CJ01VbaoxL9ce1PTbxxhQoM9AA/uploaded-1776089820988-sgzt8ujd.jpg",
-          imageAlt: "Vedere panoramica",
-        },
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CJ01VbaoxL9ce1PTbxxhQoM9AA/uploaded-1776089884715-5e380v0k.jpg",
-          imageAlt: "Chalet rustic",
-        },
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CJ01VbaoxL9ce1PTbxxhQoM9AA/uploaded-1776089843011-wi360c5q.jpg",
-          imageAlt: "Design modern",
-        },
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CJ01VbaoxL9ce1PTbxxhQoM9AA/uploaded-1776089866590-s2z7o8np.jpg",
-          imageAlt: "Liniste montana",
-        },
-        {
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CJ01VbaoxL9ce1PTbxxhQoM9AA/uploaded-1776089811983-uxttqzzm.jpg",
-          imageAlt: "Parcare generoasa",
-        },
-      ]}
+      buttons={[{ text: "Rezervă Acum", href: "#contact" }]}
+      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CJ01VbaoxL9ce1PTbxxhQoM9AA/uploaded-1776089836398-lzjtf6t1.jpg"
     />
   </div>
 
   <div id="about" data-section="about">
-      <SplitAbout
-      textboxLayout="split"
-      useInvertedBackground={false}
+      <AboutMetric
       title="Povestea noastră în Durău"
-      description="Hotel Ana Maria reprezintă o experiență de neuitat pentru cei care caută un 'detox fonic' și o conexiune profundă cu natura. Situată chiar pe traseul către vârful Toaca, locația noastră îmbină designul rustic cu facilități moderne, oferind tot ce aveți nevoie pentru un sejur de 5 stele."
-      bulletPoints={[
-        {
-          title: "Camere impecabile",
-          description: "Spațioase, curate, cu băi proprii și dotări premium.",
-        },
-        {
-          title: "Bucătărie completă",
-          description: "Acces la o bucătărie utilată cu tot necesarul.",
-        },
-        {
-          title: "Facilități moderne",
-          description: "WiFi rapid, spa, și monitorizare video pentru siguranță.",
-        },
+      metrics={[
+        { icon: MapPin, label: "Locație", value: "Ceahlău" },
+        { icon: Users, label: "Oaspeți", value: "1000+" },
+        { icon: Star, label: "Rating", value: "4.9/5" }
       ]}
-      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CJ01VbaoxL9ce1PTbxxhQoM9AA/uploaded-1776089783098-4s3z17pj.jpg"
+      useInvertedBackground={true}
     />
   </div>
 
   <div id="features" data-section="features">
-      <FeatureCardOne
+      <FeatureBento
       animationType="slide-up"
-      textboxLayout="default"
-      gridVariant="two-columns-alternating-heights"
+      textboxLayout="split"
       useInvertedBackground={false}
-      features={[
-        {
-          title: "Bucătărie modernă",
-          description: "Utilată complet cu tot ce aveți nevoie pentru masa în familie.",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-female-cook-cutting-green-celery-gourmet-kitchen-using-cutting-board-knife-slice-coleslaw-salad-woman-chef-with-uniform-preparing-ingredients-food-recipe_482257-46080.jpg",
-        },
-        {
-          title: "Foișor și grătar",
-          description: "Zonă de relaxare în aer liber cu vedere spre Ceahlău.",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CJ01VbaoxL9ce1PTbxxhQoM9AA/uploaded-1776089764315-neny8v9t.jpg",
-        },
-        {
-          title: "Loc de joacă",
-          description: "Spațiu special amenajat pentru cei mici în siguranță.",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CJ01VbaoxL9ce1PTbxxhQoM9AA/uploaded-1776089695537-6ri8e5mj.jpg",
-        },
-      ]}
       title="Facilități Premium"
-      description="Tot ce aveți nevoie pentru un sejur perfect."
+      description="Tot ce aveți nevoie pentru un sejur perfect la munte."
+      features={[
+        { title: "Bucătărie modernă", description: "Utilată complet pentru masa în familie", bentoComponent: "reveal-icon", icon: Star },
+        { title: "Foișor și grătar", description: "Zonă de relaxare în aer liber", bentoComponent: "reveal-icon", icon: MapPin },
+        { title: "Loc de joacă", description: "Spațiu sigur pentru cei mici", bentoComponent: "reveal-icon", icon: Calendar }
+      ]}
     />
   </div>
 
   <div id="testimonials" data-section="testimonials">
-      <TestimonialCardSixteen
-      animationType="slide-up"
-      textboxLayout="split"
-      useInvertedBackground={false}
-      testimonials={[
-        {
-          id: "1",
-          name: "Lucia Maria Trif",
-          role: "Turistă",
-          company: "Austria-rival",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-couple-love-standing-building-rooftop-sunset_1301-7512.jpg",
-        },
-        {
-          id: "2",
-          name: "Mihai Vlad",
-          role: "Turist",
-          company: "Detox",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/couple-enjoying-hot-drink-nature_23-2148693701.jpg",
-        },
-        {
-          id: "3",
-          name: "Cristina Craevscaia",
-          role: "Familie",
-          company: "Rustic",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/young-hiker-finds-inspiration-pictures-top-mountain_482257-124997.jpg",
-        },
-        {
-          id: "4",
-          name: "Radu",
-          role: "Familie",
-          company: "Traseu",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/couple-traveling-nature-enjoying-beverage_23-2149939721.jpg",
-        },
-        {
-          id: "5",
-          name: "Daria Hofnar",
-          role: "Turistă",
-          company: "Toaca",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/young-backpackers-traveling-nature_53876-15375.jpg",
-        },
-      ]}
-      kpiItems={[
-        {
-          value: "4.9",
-          label: "Rating Google",
-        },
-        {
-          value: "95+",
-          label: "Recenzii",
-        },
-        {
-          value: "100%",
-          label: "Ospitalitate",
-        },
-      ]}
+      <TestimonialCardFive
       title="Oaspeți Fericiți"
-      description="Peste 95 de recenzii Google cu un rating de 4.9/5."
+      description="Experiențele celor care ne-au trecut pragul."
+      textboxLayout="split"
+      useInvertedBackground={true}
+      testimonials={[
+        { id: "1", name: "Lucia Maria Trif", date: "2024", title: "Minunat!", quote: "O experiență de neuitat în Durău.", tag: "Turistă", avatarSrc: "" }
+      ]}
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactSplit
+      <ContactSplitForm
+      title="Rezervă sejurul tău"
+      description="Trimite-ne o cerere de disponibilitate."
+      inputs={[
+        { name: "nume", type: "text", placeholder: "Numele tău" },
+        { name: "email", type: "email", placeholder: "Email-ul tău" }
+      ]}
       useInvertedBackground={false}
-      background={{
-        variant: "plain",
-      }}
-      tag="Rezervă acum"
-      title="Rezervă sejurul tău la Durău"
-      description="Ești la un pas de a experimenta liniștea și frumusețea munților. Contactează-ne pentru disponibilitate."
-      imageSrc="http://img.b2bpic.net/free-photo/elderly-man-searching-landmarks_482257-81650.jpg"
-      mediaAnimation="slide-up"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBaseReveal
+      <FooterBase
       logoText="Hotel Ana Maria"
       columns={[
-        {
-          title: "Pagini",
-          items: [
-            {
-              label: "Acasă",
-              href: "/",
-            },
-            {
-              label: "Facilități",
-              href: "#features",
-            },
-            {
-              label: "Contact",
-              href: "#contact",
-            },
-          ],
-        },
-        {
-          title: "Legal",
-          items: [
-            {
-              label: "Politica de Confidențialitate",
-              href: "#",
-            },
-          ],
-        },
+        { title: "Pagini", items: [{ label: "Acasă", href: "/" }] },
+        { title: "Legal", items: [{ label: "Confidențialitate", href: "#" }] }
       ]}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}