Merge version_8 into main

Merge version_8 into main

src/app/globals.css

@@ -4,13 +4,13 @@
   /* Base units */
   /* --vw is set by ThemeProvider */
 
-  --background: #f8fcff;;
-  --card: #ffffff;;
-  --foreground: #00101f;;
-  --primary-cta: #409fff;;
+  --background: #f7fffa;;
+  --card: #f1fff8;;
+  --foreground: #001a0a;;
+  --primary-cta: #0a7039;;
   --secondary-cta: #ffffff;;
-  --accent: #c7e2fc;;
-  --background-accent: #9bcfff;;
+  --accent: #a8d9be;;
+  --background-accent: #6bbf8e;;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);

src/app/layout.tsx

@@ -1272,4 +1272,4 @@ export default function RootLayout({
       </ServiceWrapper>
     </html>
   );
-}
+}

src/app/page.tsx

@@ -1,17 +1,17 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
-import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
+import MediaAbout from '@/components/sections/about/MediaAbout';
 import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
 import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
 import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
-import TeamCardThree from '@/components/sections/team/TeamCardThree';
-import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
+import TeamCardFive from '@/components/sections/team/TeamCardFive';
+import TestimonialCardEight from '@/components/sections/testimonial/TestimonialCardEight';
 import ContactInline from '@/components/sections/contact/ContactInline';
 import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
-import { Star, Heart, Home, Mountain, Sparkles, Crown, Linkedin, Globe } from "lucide-react";
+import { Star, Heart, Home, Mountain, Sparkles, Crown } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -27,8 +27,8 @@ export default function LandingPage() {
       secondaryButtonStyle="solid"
       headingFontWeight="extrabold"
     >
-      <div id="nav" data-section="nav">
-        <NavbarLayoutFloatingOverlay
+      <div id="nav" data-section="nav" style={{ backgroundColor: '#f7fffa' }}>
+        <NavbarStyleCentered
           brandName="Alpine Luxury"
           navItems={[
             { name: "Rooms", id: "rooms" },
@@ -44,7 +44,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="hero" data-section="hero">
+      <div id="hero" data-section="hero" style={{ backgroundColor: '#f1fff8' }}>
         <HeroBillboardCarousel
           title="Alpine Luxury in the Heart of Switzerland"
           description="Experience unparalleled elegance nestled among snow-capped peaks. World-class hospitality, stunning vistas, and unforgettable mountain moments await."
@@ -82,21 +82,19 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="about" data-section="about">
-        <TestimonialAboutCard
+      <div id="about" data-section="about" style={{ backgroundColor: '#f7fffa' }}>
+        <MediaAbout
+          title="A sanctuary where Alpine grandeur meets Swiss hospitality perfection."
+          description="Margaret & Thomas from London, United Kingdom share their unforgettable experience at our luxury alpine resort."
           tag="Guest Testimonial"
           tagIcon={Star}
-          title="A sanctuary where Alpine grandeur meets Swiss hospitality perfection."
-          description="Margaret & Thomas"
-          subdescription="London, United Kingdom"
-          icon={Heart}
-          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767556190908-llv80fhw.jpg"
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767556193442-etd1bm8w.jpg"
           imageAlt="Luxurious mountain resort setting"
           useInvertedBackground="noInvert"
         />
       </div>
 
-      <div id="amenities" data-section="amenities">
+      <div id="amenities" data-section="amenities" style={{ backgroundColor: '#f1fff8' }}>
         <FeatureCardTwentyOne
           title="World-Class Amenities"
           description="Discover an extensive range of premium facilities designed to elevate your Alpine escape. From rejuvenating wellness to culinary excellence."
@@ -130,7 +128,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="rooms" data-section="rooms">
+      <div id="rooms" data-section="rooms" style={{ backgroundColor: '#f7fffa' }}>
         <PricingCardTwo
           title="Room & Suite Collections"
           description="Choose from our exquisitely appointed accommodations, each offering panoramic mountain views and uncompromising luxury."
@@ -197,7 +195,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="metrics" data-section="metrics">
+      <div id="metrics" data-section="metrics" style={{ backgroundColor: '#f1fff8' }}>
         <MetricCardEleven
           title="Our Alpine Legacy"
           description="Trusted by discerning travelers worldwide for exceptional mountain hospitality and service excellence."
@@ -234,106 +232,100 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="team" data-section="team">
-        <TeamCardThree
+      <div id="team" data-section="team" style={{ backgroundColor: '#f7fffa' }}>
+        <TeamCardFive
           title="Meet Our Hospitality Team"
           description="Dedicated professionals committed to creating your perfect Alpine experience."
           tag="Staff"
           textboxLayout="default"
           useInvertedBackground="noInvert"
           animationType="slide-up"
-          members={[
+          team={[
             {
               id: "1",
               name: "Samuel Eicher",
               role: "General Manager",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767556199718-irvjkbto.jpg",
-              imageAlt: "General Manager Samuel Eicher",
-              socialLinks: [
-                { icon: Linkedin, url: "https://linkedin.com" },
-                { icon: Globe, url: "https://example.com" }
-              ]
+              imageAlt: "General Manager Samuel Eicher"
             },
             {
               id: "2",
               name: "Marta Rossi",
               role: "Head Concierge",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767556198938-sapad5cn.jpg",
-              imageAlt: "Head Concierge Marta Rossi",
-              socialLinks: [
-                { icon: Linkedin, url: "https://linkedin.com" }
-              ]
+              imageAlt: "Head Concierge Marta Rossi"
             },
             {
               id: "3",
               name: "Chef Andreas Müller",
               role: "Executive Chef",
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767556200257-fw1n6fwc.jpg",
-              imageAlt: "Executive Chef Andreas Müller",
-              socialLinks: [
-                { icon: Linkedin, url: "https://linkedin.com" },
-                { icon: Globe, url: "https://example.com" }
-              ]
+              imageAlt: "Executive Chef Andreas Müller"
             }
           ]}
         />
       </div>
 
-      <div id="reviews" data-section="reviews">
-        <TestimonialCardTwo
+      <div id="reviews" data-section="reviews" style={{ backgroundColor: '#f1fff8' }}>
+        <TestimonialCardEight
           title="Guest Testimonials"
           description="Hear from travelers who have experienced our Alpine luxury firsthand."
           tag="Reviews"
           tagIcon={Star}
           textboxLayout="default"
           useInvertedBackground="noInvert"
-          animationType="slide-up"
           testimonials={[
             {
               id: "1",
               name: "Victoria Laurent",
               role: "CEO, Luxury Travel Magazine",
-              testimonial: "An absolute masterpiece of hospitality. The attention to detail, from the mountain views to the impeccable service, exceeded every expectation. We have never felt more welcomed.",
+              company: "Luxury Travel Magazine",
+              rating: 5,
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767556194899-33n0vonz.jpg",
               imageAlt: "Victoria Laurent"
             },
             {
               id: "2",
               name: "James Richardson",
-              role: "Investment Banker, New York",
-              testimonial: "This resort redefined my understanding of luxury. Every moment felt curated for perfection. The spa alone is worth the journey to the Alps. Simply incomparable.",
+              role: "Investment Banker",
+              company: "New York",
+              rating: 5,
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767556197950-ygtyy086.jpg",
               imageAlt: "James Richardson"
             },
             {
               id: "3",
               name: "Sophie Beaumont",
-              role: "Interior Designer, Paris",
-              testimonial: "The elegance of this property mirrors the Alpine beauty surrounding it. Exceptional cuisine, world-class wellness facilities, and staff that anticipate your every need.",
+              role: "Interior Designer",
+              company: "Paris",
+              rating: 5,
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767556198234-m2msdlmb.jpg",
               imageAlt: "Sophie Beaumont"
             },
             {
               id: "4",
               name: "David Chen",
-              role: "Entrepreneur, Singapore",
-              testimonial: "A perfect blend of solitude and sophistication. Whether you seek adventure on the slopes or tranquility in the spa, this resort delivers with extraordinary grace.",
+              role: "Entrepreneur",
+              company: "Singapore",
+              rating: 5,
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767556198552-xacdcut0.jpg",
               imageAlt: "David Chen"
             },
             {
               id: "5",
               name: "Elena Moretti",
-              role: "Artist, Milan",
-              testimonial: "The Alpine scenery is breathtaking, but it is the warmth of the team that truly captivated us. We are already planning our return visit. Unforgettable.",
+              role: "Artist",
+              company: "Milan",
+              rating: 5,
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767556194899-33n0vonz.jpg",
               imageAlt: "Elena Moretti"
             },
             {
               id: "6",
               name: "Christopher Davies",
-              role: "Physician, London",
-              testimonial: "A sanctuary for the soul. The combination of pristine mountain air, exceptional wellness programs, and genuine hospitality created an experience we will cherish forever.",
+              role: "Physician",
+              company: "London",
+              rating: 5,
               imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767556197950-ygtyy086.jpg",
               imageAlt: "Christopher Davies"
             }
@@ -341,7 +333,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="contact" data-section="contact">
+      <div id="contact" data-section="contact" style={{ backgroundColor: '#f7fffa' }}>
         <ContactInline
           text="Ready to escape to Alpine luxury?"
           inputPlaceholder="Your email address"
@@ -351,7 +343,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="footer" data-section="footer">
+      <div id="footer" data-section="footer" style={{ backgroundColor: '#f1fff8' }}>
         <FooterLogoEmphasis
           logoText="Alpine Luxury"
           columns={[
@@ -388,4 +380,4 @@ export default function LandingPage() {
       </div>
     </ThemeProvider>
   );
-}
+}