Update src/app/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -2,15 +2,13 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactSplit from '@/components/sections/contact/ContactSplit';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
-import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
-import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+import HeroBillboardTiltedCarousel from '@/components/sections/hero/HeroBillboardTiltedCarousel/HeroBillboardTiltedCarousel';
-import HeroCentered from '@/components/sections/hero/HeroCentered';
 import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
 import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
-import ProductCardFour from '@/components/sections/product/ProductCardFour';
+import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
-import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
 
 export default function LandingPage() {
   return (
@@ -30,83 +28,23 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarLayoutFloatingOverlay
       navItems={[
-        {
+        { name: "Home", id: "hero" },
-          name: "Home",
+        { name: "About", id: "about" },
-          id: "hero",
+        { name: "Features", id: "features" },
-        },
+        { name: "Contact", id: "contact" },
-        {
-          name: "About",
-          id: "about",
-        },
-        {
-          name: "Services",
-          id: "features",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
       ]}
-      brandName="IMMERSIVE3D"
+      brandName="LUXURY4BHK"
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroCentered
+      <HeroBillboardTiltedCarousel
-      background={{
+      title="Redefining Luxury Living"
-        variant: "plain",
+      description="Sophisticated 4BHK interior designs tailored for premium lifestyles. Where space meets artistic brilliance."
-      }}
+      images={[
-      title="Immersive 3D Design Premium Digital Experiences"
+        { src: "https://images.unsplash.com/photo-1618221195710-dd6b41faaea6?q=80&w=2000", alt: "Modern living room" },
-      description="We transform static websites into interactive worlds that captivate audiences and drive engagement. Experience the future of web design today."
+        { src: "https://images.unsplash.com/photo-1616486338812-3dadae4b4ace?q=80&w=2000", alt: "Elegant bedroom" },
-      avatars={[
+        { src: "https://images.unsplash.com/photo-1600566753086-00f1807b8971?q=80&w=2000", alt: "Luxury dining space" }
-        {
-          src: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-66975.jpg",
-          alt: "Client 1",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/studio-portrait-handsome-afro-american-male-elegant-brown-jacket-hat-isolated-dark-background_613910-17815.jpg",
-          alt: "Client 2",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/financial-department-team-leader-researching-marketing-ideas-while-analyzing-company-expenses-report-startup-project-manager-developing-budget-growth-solutions-while-brainstorming-promoting-strategy_482257-38904.jpg",
-          alt: "Client 3",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/project-leder-with-disabilities-looking-front-sitting-immobilized-wheelchair-business-office-room_482257-2404.jpg",
-          alt: "Client 4",
-        },
-        {
-          src: "http://img.b2bpic.net/free-photo/close-up-labor-union-member_23-2150969909.jpg",
-          alt: "Client 5",
-        },
-      ]}
-      buttons={[
-        {
-          text: "Explore Our Work",
-          href: "#features",
-        },
-      ]}
-      marqueeItems={[
-        {
-          type: "text",
-          text: "Next-Gen Web",
-        },
-        {
-          type: "text",
-          text: "Interactive 3D",
-        },
-        {
-          type: "text",
-          text: "Immersive Experiences",
-        },
-        {
-          type: "text",
-          text: "High Performance",
-        },
-        {
-          type: "text",
-          text: "Award Winning",
-        },
       ]}
     />
   </div>
@@ -114,224 +52,68 @@ export default function LandingPage() {
   <div id="about" data-section="about">
       <MetricSplitMediaAbout
       useInvertedBackground={true}
-      title="Art Meets Technology"
+      title="Design Philosophy"
-      description="Our studio bridges the gap between high-fidelity 3D artistry and performant web development to deliver experiences that truly stand out."
+      description="We craft interiors that embody elegance, functionality, and timeless appeal for the modern homeowner."
       metrics={[
-        {
+        { value: "150+", title: "Luxury Projects" },
-          value: "100+",
+        { value: "10/10", title: "Design Excellence" },
-          title: "Projects Launched",
+        { value: "4BHK", title: "Specialization" },
-        },
-        {
-          value: "50+",
-          title: "Award Wins",
-        },
-        {
-          value: "99%",
-          title: "Client Satisfaction",
-        },
       ]}
-      imageSrc="http://img.b2bpic.net/free-photo/black-developer-creating-machine-parts_482257-127095.jpg"
+      imageSrc="https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?q=80&w=1200"
-      mediaAnimation="slide-up"
-      metricsAnimation="slide-up"
     />
   </div>
 
   <div id="features" data-section="features">
       <FeatureCardTwentyNine
-      animationType="slide-up"
+      title="Our Services"
+      description="Comprehensive design solutions for your 4BHK home."
       textboxLayout="split"
       gridVariant="bento-grid"
       useInvertedBackground={false}
-      features={[
-        {
-          title: "Interactive 3D",
-          description: "Custom 3D model integration.",
-          imageSrc: "http://img.b2bpic.net/free-photo/beautiful-closeup-shot-epcot-taken-night-with-amazing-colored-textures-dark-background_181624-2158.jpg",
-          titleImageSrc: "http://img.b2bpic.net/free-photo/ferromagnetic-liquid-metal-with-copy-space_23-2148253659.jpg",
-          buttonText: "Learn More",
-        },
-        {
-          title: "Immersive Web",
-          description: "Performant browser experiences.",
-          imageSrc: "http://img.b2bpic.net/free-photo/ui-ux-representations-with-smart-watch_23-2150201853.jpg",
-          titleImageSrc: "http://img.b2bpic.net/free-photo/hacker-bypasses-network-security-engages-cyber-crime-with-vr-headset_482257-126453.jpg",
-          buttonText: "Learn More",
-        },
-        {
-          title: "Data Visualization",
-          description: "Compelling interactive charts.",
-          imageSrc: "http://img.b2bpic.net/free-photo/3d-render-abstract-techno-with-flowing-lines-particles_1048-13718.jpg",
-          titleImageSrc: "http://img.b2bpic.net/free-photo/abstract-low-poly-background-with-connecting-dots-lines_1048-5910.jpg",
-          buttonText: "Learn More",
-        },
-      ]}
-      title="Our Expertise"
-      description="Specialized solutions for tech-savvy enterprises."
-    />
-  </div>
-
-  <div id="products" data-section="products">
-      <ProductCardFour
       animationType="slide-up"
-      textboxLayout="split"
+      features={[
-      gridVariant="uniform-all-items-equal"
+        { title: "Space Planning", description: "Optimized layouts for maximum comfort.", imageSrc: "https://images.unsplash.com/photo-1600585154340-be6161a56a0c?q=80&w=800", titleImageSrc: "https://images.unsplash.com/photo-1600585154340-be6161a56a0c?q=80&w=100", buttonText: "Explore" },
-      useInvertedBackground={true}
+        { title: "Bespoke Furniture", description: "Handcrafted pieces made to measure.", imageSrc: "https://images.unsplash.com/photo-1600585154526-99d9ced45d5a?q=80&w=800", titleImageSrc: "https://images.unsplash.com/photo-1600585154526-99d9ced45d5a?q=80&w=100", buttonText: "Explore" }
-      products={[
-        {
-          id: "p1",
-          name: "Web License Pro",
-          price: "$199",
-          variant: "Essential",
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-arrangement-with-vr-glasses_23-2148847740.jpg",
-        },
-        {
-          id: "p2",
-          name: "Toolkit Suite",
-          price: "$299",
-          variant: "Studio",
-          imageSrc: "http://img.b2bpic.net/free-photo/financial-software-ui-pc-screen-apartment-office-desk_482257-122945.jpg",
-        },
-        {
-          id: "p3",
-          name: "Workshop Pass",
-          price: "$499",
-          variant: "Premium",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-friends-hostel_23-2150518173.jpg",
-        },
-        {
-          id: "p4",
-          name: "Branded Swag",
-          price: "$89",
-          variant: "Lifestyle",
-          imageSrc: "http://img.b2bpic.net/free-vector/illustration-financial-crisis_53876-5237.jpg",
-        },
-        {
-          id: "p5",
-          name: "Library Membership",
-          price: "$99/mo",
-          variant: "Subscription",
-          imageSrc: "http://img.b2bpic.net/free-photo/using-credit-card_23-2151918485.jpg",
-        },
-        {
-          id: "p6",
-          name: "Art Concept Catalog",
-          price: "$149",
-          variant: "Collector",
-          imageSrc: "http://img.b2bpic.net/free-photo/cool-background-blank-wallpaper-place-your-concept_1194-641450.jpg",
-        },
       ]}
-      title="Digital Asset Catalog"
-      description="Premium resources for your design workflow."
     />
   </div>
 
   <div id="metrics" data-section="metrics">
       <MetricCardTwo
-      animationType="slide-up"
+      title="Performance Stats"
-      textboxLayout="split"
+      description="The numbers behind our success."
-      gridVariant="uniform-all-items-equal"
-      useInvertedBackground={false}
       metrics={[
-        {
+        { id: "m1", value: "40%", description: "Space efficiency increase" },
-          id: "m1",
+        { id: "m2", value: "12wk", description: "Average project turnaround" },
-          value: "150%",
+        { id: "m3", value: "100%", description: "High-quality sourcing" },
-          description: "Average engagement boost",
-        },
-        {
-          id: "m2",
-          value: "3x",
-          description: "Faster conversion rates",
-        },
-        {
-          id: "m3",
-          value: "85%",
-          description: "Brand awareness growth",
-        },
       ]}
-      title="Impact by Numbers"
+      gridVariant="uniform-all-items-equal"
-      description="Quantifying the effectiveness of our 3D solutions."
+      animationType="depth-3d"
-    />
+      textboxLayout="default"
-  </div>
+      useInvertedBackground={false}
-
-  <div id="testimonials" data-section="testimonials">
-      <TestimonialCardTen
-      textboxLayout="split"
-      useInvertedBackground={true}
-      testimonials={[
-        {
-          id: "1",
-          title: "Exceptional",
-          quote: "The 3D integration was seamless and beautiful.",
-          name: "Sarah Johnson",
-          role: "CEO",
-          imageSrc: "http://img.b2bpic.net/free-photo/successful-businessman-imagines-great-career_1163-5478.jpg",
-        },
-        {
-          id: "2",
-          title: "Innovation",
-          quote: "They transformed our site into an interactive hub.",
-          name: "Michael Chen",
-          role: "Creative Lead",
-          imageSrc: "http://img.b2bpic.net/free-photo/cool-man-posing-black-white-medium-shot_23-2149411426.jpg",
-        },
-        {
-          id: "3",
-          title: "Professional",
-          quote: "Highly technical and artistically gifted team.",
-          name: "Emily Rodriguez",
-          role: "CTO",
-          imageSrc: "http://img.b2bpic.net/free-photo/confident-young-bald-call-center-man-holding-pointing-with-hand-laptop-isolated-olive-green-with-copy-space_141793-76626.jpg",
-        },
-        {
-          id: "4",
-          title: "Transformation",
-          quote: "Our conversion rates skyrocketed.",
-          name: "David Kim",
-          role: "Product Manager",
-          imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-black-man-wool-suit_613910-15972.jpg",
-        },
-        {
-          id: "5",
-          title: "Top-tier",
-          quote: "The future of the web, delivered today.",
-          name: "Alex Smith",
-          role: "Founder",
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-labor-union-member_23-2150969909.jpg",
-        },
-      ]}
-      title="Client Success Stories"
-      description="What our partners say about working with us."
     />
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactSplit
+      <ContactCenter
+      tag="Inquire Now"
+      title="Start Your Journey"
+      description="Let's create your dream 4BHK apartment interior. Reach out to our design consultants."
+      background={{ variant: "radial-gradient" }}
       useInvertedBackground={false}
-      background={{
-        variant: "plain",
-      }}
-      tag="Get in touch"
-      title="Ready to Build Your World?"
-      description="Let's collaborate on your next interactive project."
-      imageSrc="http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139120.jpg"
-      mediaAnimation="slide-up"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterLogoReveal
+      <FooterBaseReveal
-      logoText="IMMERSIVE3D"
+      logoText="LUXURY4BHK"
-      leftLink={{
+      columns={[
-        text: "Terms of Service",
+        { title: "Studio", items: [{ label: "Philosophy", href: "#about" }] },
-        href: "#",
+        { title: "Support", items: [{ label: "Contact", href: "#contact" }] }
-      }}
+      ]}
-      rightLink={{
-        text: "Privacy Policy",
-        href: "#",
-      }}
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/base.css

@@ -11,7 +11,7 @@ html {
 body {
   background-color: var(--background);
   color: var(--foreground);
-  font-family: var(--font-source-sans-3), sans-serif;
+  font-family: var(--font-montserrat), sans-serif;
   position: relative;
   min-height: 100vh;
   overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: var(--font-source-sans-3), sans-serif;
+  font-family: var(--font-montserrat), sans-serif;
 }

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #000000;
+  --background: #0a0a0a;
-  --card: #0c0c0c;
+  --card: #1a1a1a;
-  --foreground: #ffffff;
+  --foreground: #f8f1e5;
-  --primary-cta: #cee7ff;
+  --primary-cta: #d4af37;
   --primary-cta-text: #000000;
-  --secondary-cta: #000000;
+  --secondary-cta: #1a1a1a;
   --secondary-cta-text: #ffffff;
-  --accent: #535353;
+  --accent: #b8860b;
-  --background-accent: #CEE7FF;
+  --background-accent: #2c2c2c;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);