From c603d3af1ecfefb39060b3fcd389209f63d6ffab Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Wed, 13 May 2026 13:33:10 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 443 +++++++++++++++--------------------------------
 1 file changed, 141 insertions(+), 302 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 74b46fc..8b3a3f6 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -16,318 +16,157 @@ import { Heart, Shield, Sun } from "lucide-react";
 export default function LandingPage() {
   return (
     <ThemeProvider
-        defaultButtonVariant="text-shift"
-        defaultTextAnimation="entrance-slide"
-        borderRadius="soft"
-        contentWidth="small"
-        sizing="largeSmallSizeLargeTitles"
-        background="noiseDiagonalGradient"
-        cardStyle="gradient-radial"
-        primaryButtonStyle="double-inset"
-        secondaryButtonStyle="glass"
-        headingFontWeight="medium"
+      defaultButtonVariant="text-shift"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="soft"
+      contentWidth="medium"
+      sizing="medium"
+      background="circleGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
     >
       <ReactLenis root>
-  <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingOverlay
-      navItems={[
-        {
-          name: "Home",
-          id: "hero",
-        },
-        {
-          name: "About",
-          id: "about",
-        },
-        {
-          name: "Spaces",
-          id: "spaces",
-        },
-        {
-          name: "Book Now",
-          id: "booking",
-        },
-      ]}
-      brandName="Bali Villa"
-    />
-  </div>
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            navItems={[
+              { name: "Home", id: "hero" },
+              { name: "About", id: "about" },
+              { name: "Spaces", id: "spaces" },
+              { name: "Book Now", id: "booking" },
+            ]}
+            brandName="Bali Villa"
+          />
+        </div>
 
-  <div id="hero" data-section="hero">
-      <HeroOverlay
-      title="Your Private Luxury Escape"
-      description="A modern villa designed for unforgettable family moments and peaceful summer stays."
-      buttons={[
-        {
-          text: "Book Now via WhatsApp",
-          href: "https://wa.me/yournumber",
-        },
-      ]}
-      imageSrc="http://img.b2bpic.net/free-photo/view-house-lamp-with-futuristic-design_23-2151037462.jpg?_wi=1"
-      imageAlt="Luxury villa interior"
-      avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/people-relaxing-their-wooden-home_23-2151335847.jpg",
-          alt: "Happy guest profile 1",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/beautiful-sisters-sitting-bed-near-window_8353-7596.jpg",
-          alt: "Happy guest profile 2",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/full-shot-woman-playing-piano_52683-98044.jpg",
-          alt: "Happy guest profile 3",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/country-musicians-lifestyle-indoors_23-2151169628.jpg",
-          alt: "Happy guest profile 4",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/cozy-lively-home-interior-design_23-2151119035.jpg",
-          alt: "Happy guest profile 5",
-        },
-      ]}
-      avatarText="Trusted by families worldwide"
-    />
-  </div>
+        <div id="hero" data-section="hero">
+          <HeroOverlay
+            title="Your Private Luxury Escape"
+            description="A modern villa designed for unforgettable family moments and peaceful summer stays."
+            buttons={[{ text: "Book Now via WhatsApp", href: "https://wa.me/yournumber" }]}
+            imageSrc="http://img.b2bpic.net/free-photo/view-house-lamp-with-futuristic-design_23-2151037462.jpg"
+            imageAlt="Luxury villa interior"
+            avatars={[
+              { src: "http://img.b2bpic.net/free-photo/people-relaxing-their-wooden-home_23-2151335847.jpg", alt: "Happy guest profile 1" },
+              { src: "http://img.b2bpic.net/free-photo/beautiful-sisters-sitting-bed-near-window_8353-7596.jpg", alt: "Happy guest profile 2" },
+              { src: "http://img.b2bpic.net/free-photo/full-shot-woman-playing-piano_52683-98044.jpg", alt: "Happy guest profile 3" },
+              { src: "http://img.b2bpic.net/free-photo/country-musicians-lifestyle-indoors_23-2151169628.jpg", alt: "Happy guest profile 4" },
+              { src: "http://img.b2bpic.net/free-photo/cozy-lively-home-interior-design_23-2151119035.jpg", alt: "Happy guest profile 5" },
+            ]}
+            avatarText="Trusted by families worldwide"
+          />
+        </div>
 
-  <div id="about" data-section="about">
-      <TextSplitAbout
-      useInvertedBackground={true}
-      title="Authentic Privacy"
-      description={[
-        "Experience the perfect harmony of modern minimalism and cozy luxury. Our villa is designed for families seeking complete privacy in a peaceful, sun-drenched environment.",
-        "Every corner reflects sophisticated comfort, ensuring your stay is nothing short of extraordinary.",
-      ]}
-    />
-  </div>
+        <div id="about" data-section="about">
+          <TextSplitAbout
+            useInvertedBackground={true}
+            title="Authentic Privacy"
+            description={[
+              "Experience the perfect harmony of modern minimalism and cozy luxury. Our villa is designed for families seeking complete privacy in a peaceful, sun-drenched environment.",              "Every corner reflects sophisticated comfort, ensuring your stay is nothing short of extraordinary."]}
+          />
+        </div>
 
-  <div id="spaces" data-section="spaces">
-      <FeatureCardNine
-      animationType="slide-up"
-      textboxLayout="default"
-      useInvertedBackground={false}
-      features={[
-        {
-          title: "Modern Kitchen",
-          description: "Fully equipped open kitchen for gourmet moments.",
-          phoneOne: {
-            imageSrc: "http://img.b2bpic.net/free-photo/woman-having-breakfast-with-mobile-phone_657883-345.jpg",
-            imageAlt: "Kitchen View 1",
-          },
-          phoneTwo: {
-            imageSrc: "http://img.b2bpic.net/free-photo/close-up-black-toddler-eating_23-2149310677.jpg",
-            imageAlt: "Kitchen View 2",
-          },
-          imageSrc: "http://img.b2bpic.net/free-photo/view-house-lamp-with-futuristic-design_23-2151037462.jpg?_wi=2",
-          imageAlt: "modern open kitchen luxury home",
-        },
-        {
-          title: "Elegant Lounge",
-          description: "Comfortable seating designed for quality family time.",
-          phoneOne: {
-            imageSrc: "http://img.b2bpic.net/free-photo/pillow-sofa_74190-4565.jpg",
-            imageAlt: "Lounge View 1",
-          },
-          phoneTwo: {
-            imageSrc: "http://img.b2bpic.net/free-photo/cozy-home-interior-anime-style_23-2151176358.jpg",
-            imageAlt: "Lounge View 2",
-          },
-          imageSrc: "http://img.b2bpic.net/free-photo/living-room-with-chandelier-couch-with-number-pillows-large-chandelier_188544-27064.jpg",
-          imageAlt: "modern open kitchen luxury home",
-        },
-        {
-          title: "Natural Light",
-          description: "Bright, airy spaces with warm neutral textures.",
-          phoneOne: {
-            imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-modern-house-kitchen-dining-room_181624-2870.jpg",
-            imageAlt: "Space View 1",
-          },
-          phoneTwo: {
-            imageSrc: "http://img.b2bpic.net/free-photo/living-room-without-electric-light-inside-modern-house-blackout_123827-35881.jpg",
-            imageAlt: "Space View 2",
-          },
-          imageSrc: "http://img.b2bpic.net/free-photo/cozy-lively-home-interior-design_23-2151118971.jpg?_wi=1",
-          imageAlt: "modern open kitchen luxury home",
-        },
-      ]}
-      showStepNumbers={false}
-      title="Living Spaces"
-      description="Thoughtfully designed areas for relaxation and connection."
-    />
-  </div>
+        <div id="spaces" data-section="spaces">
+          <FeatureCardNine
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={false}
+            features={[
+              {
+                title: "Modern Kitchen",                description: "Fully equipped open kitchen for gourmet moments.",                phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/woman-having-breakfast-with-mobile-phone_657883-345.jpg", imageAlt: "Kitchen View 1" },
+                phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-black-toddler-eating_23-2149310677.jpg", imageAlt: "Kitchen View 2" },
+              },
+              {
+                title: "Elegant Lounge",                description: "Comfortable seating designed for quality family time.",                phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/pillow-sofa_74190-4565.jpg", imageAlt: "Lounge View 1" },
+                phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/cozy-home-interior-anime-style_23-2151176358.jpg", imageAlt: "Lounge View 2" },
+              },
+              {
+                title: "Natural Light",                description: "Bright, airy spaces with warm neutral textures.",                phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-modern-house-kitchen-dining-room_181624-2870.jpg", imageAlt: "Space View 1" },
+                phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/living-room-without-electric-light-inside-modern-house-blackout_123827-35881.jpg", imageAlt: "Space View 2" },
+              },
+            ]}
+            showStepNumbers={false}
+            title="Living Spaces"
+            description="Thoughtfully designed areas for relaxation and connection."
+          />
+        </div>
 
-  <div id="experience" data-section="experience">
-      <MetricCardOne
-      animationType="slide-up"
-      textboxLayout="split"
-      gridVariant="bento-grid"
-      useInvertedBackground={true}
-      metrics={[
-        {
-          id: "m1",
-          value: "100%",
-          title: "Private",
-          description: "Total seclusion for your family group.",
-          icon: Shield,
-        },
-        {
-          id: "m2",
-          value: "Summer",
-          title: "Atmosphere",
-          description: "Calm, relaxing, and ready for you.",
-          icon: Sun,
-        },
-        {
-          id: "m3",
-          value: "Gather",
-          title: "Gathering",
-          description: "Perfect for meaningful celebrations.",
-          icon: Heart,
-        },
-      ]}
-      title="The Bali Villa Experience"
-      description="Everything we do is focused on your comfort and peace."
-    />
-  </div>
+        <div id="experience" data-section="experience">
+          <MetricCardOne
+            animationType="slide-up"
+            textboxLayout="split"
+            gridVariant="bento-grid"
+            useInvertedBackground={true}
+            metrics={[
+              { id: "m1", value: "100%", title: "Private", description: "Total seclusion for your family group.", icon: Shield },
+              { id: "m2", value: "Summer", title: "Atmosphere", description: "Calm, relaxing, and ready for you.", icon: Sun },
+              { id: "m3", value: "Gather", title: "Gathering", description: "Perfect for meaningful celebrations.", icon: Heart },
+            ]}
+            title="The Bali Villa Experience"
+            description="Everything we do is focused on your comfort and peace."
+          />
+        </div>
 
-  <div id="gallery" data-section="gallery">
-      <ProductCardOne
-      textboxLayout="default"
-      gridVariant="bento-grid"
-      useInvertedBackground={false}
-      products={[
-        {
-          id: "p1",
-          name: "Master Suite",
-          price: "Luxury",
-          imageSrc: "http://img.b2bpic.net/free-photo/cozy-lively-home-interior-design_23-2151118971.jpg?_wi=2",
-        },
-        {
-          id: "p2",
-          name: "Bath & Wellness",
-          price: "Modern",
-          imageSrc: "http://img.b2bpic.net/free-photo/elegant-bathroom-background-zoom-calls_23-2149684467.jpg",
-        },
-        {
-          id: "p3",
-          name: "Private Pool",
-          price: "Refresh",
-          imageSrc: "http://img.b2bpic.net/free-photo/hotel-pool-resort_74190-1618.jpg",
-        },
-        {
-          id: "p4",
-          name: "Terrace",
-          price: "Calm",
-          imageSrc: "http://img.b2bpic.net/free-photo/rustic-deck-with-patio-furniture-vegetation_23-2150698400.jpg",
-        },
-        {
-          id: "p5",
-          name: "Balcony View",
-          price: "Scenery",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-beaujtiful-woman-luxury-travcel-house_23-2149140843.jpg",
-        },
-        {
-          id: "p6",
-          name: "Dining Space",
-          price: "Gather",
-          imageSrc: "http://img.b2bpic.net/free-photo/dining-table-with-plates-interior-design_23-2148848671.jpg",
-        },
-      ]}
-      title="Cinematic Gallery"
-      description="A glimpse of your next summer destination."
-    />
-  </div>
+        <div id="gallery" data-section="gallery">
+          <ProductCardOne
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="bento-grid"
+            useInvertedBackground={false}
+            products={[
+              { id: "p1", name: "Master Suite", price: "Luxury", imageSrc: "http://img.b2bpic.net/free-photo/cozy-lively-home-interior-design_23-2151118971.jpg" },
+              { id: "p2", name: "Bath & Wellness", price: "Modern", imageSrc: "http://img.b2bpic.net/free-photo/elegant-bathroom-background-zoom-calls_23-2149684467.jpg" },
+              { id: "p3", name: "Private Pool", price: "Refresh", imageSrc: "http://img.b2bpic.net/free-photo/hotel-pool-resort_74190-1618.jpg" },
+            ]}
+            title="Cinematic Gallery"
+            description="A glimpse of your next summer destination."
+          />
+        </div>
 
-  <div id="booking" data-section="booking">
-      <PricingCardNine
-      animationType="slide-up"
-      textboxLayout="split-description"
-      useInvertedBackground={true}
-      plans={[
-        {
-          id: "full-villa",
-          title: "Full Villa Rental",
-          price: "Custom",
-          period: "per stay",
-          features: [
-            "Full Kitchen",
-            "Private Grounds",
-            "Family Seating",
-            "High-speed WiFi",
-          ],
-          button: {
-            text: "Book Now via WhatsApp",
-            href: "https://wa.me/yournumber",
-          },
-          imageSrc: "http://img.b2bpic.net/free-photo/aesthetic-summer-holidays_23-2151982718.jpg",
-        },
-      ]}
-      title="Book Your Stay"
-      description="Secure your dates and experience luxury."
-    />
-  </div>
+        <div id="booking" data-section="booking">
+          <PricingCardNine
+            animationType="slide-up"
+            textboxLayout="split-description"
+            useInvertedBackground={true}
+            plans={[
+              {
+                id: "full-villa",                title: "Full Villa Rental",                price: "Custom",                period: "per stay",                features: ["Full Kitchen", "Private Grounds", "Family Seating", "High-speed WiFi"],
+                button: { text: "Book Now via WhatsApp", href: "https://wa.me/yournumber" },
+                imageSrc: "http://img.b2bpic.net/free-photo/aesthetic-summer-holidays_23-2151982718.jpg"},
+            ]}
+            title="Book Your Stay"
+            description="Secure your dates and experience luxury."
+          />
+        </div>
 
-  <div id="location" data-section="location">
-      <FaqSplitMedia
-      textboxLayout="split-description"
-      useInvertedBackground={false}
-      faqs={[
-        {
-          id: "q1",
-          title: "Is the location private?",
-          content: "Yes, the villa is fully secluded for your group.",
-        },
-        {
-          id: "q2",
-          title: "How do I get there?",
-          content: "Detailed map and navigation links are shared upon booking confirmation.",
-        },
-        {
-          id: "q3",
-          title: "Is parking available?",
-          content: "Yes, we provide secure on-site parking for all guests.",
-        },
-      ]}
-      mediaAnimation="slide-up"
-      title="Location Details"
-      description="Nestled in a peaceful area of Palestine."
-      faqsAnimation="slide-up"
-      imageSrc="http://img.b2bpic.net/free-photo/view-house-lamp-with-futuristic-design_23-2151037462.jpg?_wi=3"
-      imageAlt="Area view"
-    />
-  </div>
+        <div id="location" data-section="location">
+          <FaqSplitMedia
+            textboxLayout="split-description"
+            useInvertedBackground={false}
+            faqs={[
+              { id: "q1", title: "Is the location private?", content: "Yes, the villa is fully secluded for your group." },
+              { id: "q2", title: "How do I get there?", content: "Detailed map and navigation links are shared upon booking confirmation." },
+              { id: "q3", title: "Is parking available?", content: "Yes, we provide secure on-site parking for all guests." },
+            ]}
+            mediaAnimation="slide-up"
+            title="Location Details"
+            description="Nestled in a peaceful area of Palestine."
+            faqsAnimation="slide-up"
+            imageSrc="http://img.b2bpic.net/free-photo/view-house-lamp-with-futuristic-design_23-2151037462.jpg"
+            imageAlt="Area view"
+          />
+        </div>
 
-  <div id="footer" data-section="footer">
-      <FooterLogoEmphasis
-      columns={[
-        {
-          items: [
-            {
-              label: "About Us",
-              href: "#about",
-            },
-            {
-              label: "Book Now",
-              href: "#booking",
-            },
-          ],
-        },
-        {
-          items: [
-            {
-              label: "WhatsApp",
-              href: "https://wa.me/yournumber",
-            },
-            {
-              label: "Instagram",
-              href: "#",
-            },
-          ],
-        },
-      ]}
-      logoText="Bali Villa"
-    />
-  </div>
+        <div id="footer" data-section="footer">
+          <FooterLogoEmphasis
+            columns={[
+              { items: [{ label: "About Us", href: "#about" }, { label: "Book Now", href: "#booking" }] },
+              { items: [{ label: "WhatsApp", href: "https://wa.me/yournumber" }, { label: "Instagram", href: "#" }] },
+            ]}
+            logoText="Bali Villa"
+          />
+        </div>
       </ReactLenis>
     </ThemeProvider>
   );
-- 
2.49.1