Update src/app/page.tsx

Merge version_16 into main

src/app/page.tsx

@@ -10,9 +10,122 @@ import ContactCTA from "@/components/sections/contact/ContactCTA";
 import FooterSimple from "@/components/sections/footer/FooterSimple";
 import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
 import BlogCardThree from "@/components/sections/blog/BlogCardThree";
-import { Star, Heart, Users, Camera, Sparkles, Crown, Phone, MessageCircle, User, Play } from "lucide-react";
+import { Star, Heart, Users, Camera, Sparkles, Crown, Phone, MessageCircle, User, Play, ChevronRight, X, ArrowDown, ArrowUp } from "lucide-react";
+import { useState, useEffect } from "react";
 
 export default function LandingPage() {
+  const [showModal, setShowModal] = useState(false);
+  const [showBackToTop, setShowBackToTop] = useState(false);
+
+  useEffect(() => {
+    const handleScroll = () => {
+      setShowBackToTop(window.scrollY > 300);
+    };
+
+    window.addEventListener('scroll', handleScroll);
+    return () => window.removeEventListener('scroll', handleScroll);
+  }, []);
+
+  const scrollToGallery = () => {
+    const gallerySectionElement = document.getElementById('gallery');
+    if (gallerySectionElement) {
+      gallerySectionElement.scrollIntoView({
+        behavior: 'smooth',
+        block: 'start'
+      });
+    }
+  };
+
+  const scrollToTop = () => {
+    const heroSectionElement = document.getElementById('hero');
+    if (heroSectionElement) {
+      heroSectionElement.scrollIntoView({
+        behavior: 'smooth',
+        block: 'start'
+      });
+    }
+  };
+
+  const allDresses = [
+    {
+      id: "dress-1",      name: "Classic Elegance",      price: "Starting at $1,200",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773897612811-03t85tl3.jpg?_wi=1",      imageAlt: "Elegant white wedding dress"
+    },
+    {
+      id: "dress-2",      name: "Blush Romance",      price: "Starting at $1,400",      variant: "Blush Pink",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773897625910-hax1y5k9.jpg?_wi=1",      imageAlt: "Beautiful blush pink wedding gown"
+    },
+    {
+      id: "dress-3",      name: "Modern Sophistication",      price: "Starting at $1,300",      variant: "Off-White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898154508-5owc9z0t.jpg?_wi=1",      imageAlt: "Modern off-shoulder wedding dress"
+    },
+    {
+      id: "dress-4",      name: "Intricate Lace",      price: "Starting at $1,500",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898173007-a5wime2i.jpg?_wi=1",      imageAlt: "Detailed lace wedding dress"
+    },
+    {
+      id: "dress-5",      name: "Minimalist Chic",      price: "Starting at $1,100",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898188020-nldykyrf.jpg?_wi=1",      imageAlt: "Sleek minimalist wedding dress"
+    },
+    {
+      id: "dress-6",      name: "Royal Drama",      price: "Starting at $1,600",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898205862-ka8mspzk.jpg?_wi=1",      imageAlt: "Dramatic train wedding dress"
+    },
+    {
+      id: "dress-7",      name: "Ethereal Layers",      price: "Starting at $1,350",      variant: "Ivory",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773897612811-03t85tl3.jpg?_wi=2",      imageAlt: "Layered tulle ethereal wedding dress"
+    },
+    {
+      id: "dress-8",      name: "Vintage Inspired",      price: "Starting at $1,450",      variant: "Champagne",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773897625910-hax1y5k9.jpg?_wi=2",      imageAlt: "Vintage champagne wedding gown"
+    },
+    {
+      id: "dress-9",      name: "Modern Asymmetric",      price: "Starting at $1,550",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898154508-5owc9z0t.jpg?_wi=2",      imageAlt: "Asymmetric modern wedding dress"
+    },
+    {
+      id: "dress-10",      name: "Beaded Elegance",      price: "Starting at $1,700",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898173007-a5wime2i.jpg?_wi=2",      imageAlt: "Beaded white wedding dress"
+    },
+    {
+      id: "dress-11",      name: "Sleek Minimalist",      price: "Starting at $1,150",      variant: "Off-White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898188020-nldykyrf.jpg?_wi=2",      imageAlt: "Sleek off-white minimalist dress"
+    },
+    {
+      id: "dress-12",      name: "Princess Ball Gown",      price: "Starting at $1,800",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898205862-ka8mspzk.jpg?_wi=2",      imageAlt: "Princess ball gown wedding dress"
+    },
+    {
+      id: "dress-13",      name: "Romantic Lace",      price: "Starting at $1,400",      variant: "Ivory",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773897612811-03t85tl3.jpg?_wi=3",      imageAlt: "Romantic lace wedding dress"
+    },
+    {
+      id: "dress-14",      name: "Blush Elegance",      price: "Starting at $1,480",      variant: "Blush",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773897625910-hax1y5k9.jpg?_wi=3",      imageAlt: "Blush elegance wedding gown"
+    },
+    {
+      id: "dress-15",      name: "Modern Drape",      price: "Starting at $1,320",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898154508-5owc9z0t.jpg?_wi=3",      imageAlt: "Modern drape wedding dress"
+    },
+    {
+      id: "dress-16",      name: "Lace Detail",      price: "Starting at $1,520",      variant: "Ivory",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898173007-a5wime2i.jpg?_wi=3",      imageAlt: "Lace detail wedding dress"
+    },
+    {
+      id: "dress-17",      name: "Minimal Chic",      price: "Starting at $1,120",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898188020-nldykyrf.jpg?_wi=3",      imageAlt: "Minimal chic wedding dress"
+    },
+    {
+      id: "dress-18",      name: "Dramatic Train",      price: "Starting at $1,650",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898205862-ka8mspzk.jpg?_wi=3",      imageAlt: "Dramatic train dress"
+    },
+    {
+      id: "dress-19",      name: "Sophisticated Ivory",      price: "Starting at $1,380",      variant: "Ivory",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773897612811-03t85tl3.jpg?_wi=4",      imageAlt: "Sophisticated ivory wedding dress"
+    },
+    {
+      id: "dress-20",      name: "Blush Romance Premium",      price: "Starting at $1,550",      variant: "Blush Pink",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773897625910-hax1y5k9.jpg?_wi=4",      imageAlt: "Premium blush pink wedding gown"
+    },
+    {
+      id: "dress-21",      name: "Contemporary Cut",      price: "Starting at $1,420",      variant: "Off-White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898154508-5owc9z0t.jpg?_wi=4",      imageAlt: "Contemporary cut wedding dress"
+    },
+    {
+      id: "dress-22",      name: "Intricate Beading",      price: "Starting at $1,720",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898173007-a5wime2i.jpg?_wi=4",      imageAlt: "Intricate beading wedding dress"
+    },
+    {
+      id: "dress-23",      name: "Elegant Minimalist",      price: "Starting at $1,180",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898188020-nldykyrf.jpg?_wi=4",      imageAlt: "Elegant minimalist wedding dress"
+    },
+    {
+      id: "dress-24",      name: "Royal Gown",      price: "Starting at $1,850",      variant: "White",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773898205862-ka8mspzk.jpg?_wi=4",      imageAlt: "Royal wedding gown"
+    },
+    {
+      id: "dress-25",      name: "Timeless Beauty",      price: "Starting at $1,440",      variant: "Ivory",      imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773897612811-03t85tl3.jpg?_wi=5",      imageAlt: "Timeless beauty wedding dress"
+    }
+  ];
+
+  const initialDresses = allDresses.slice(0, 6);
+
   return (
     <ThemeProvider
       defaultButtonVariant="shift-hover"
@@ -26,9 +139,100 @@ export default function LandingPage() {
       secondaryButtonStyle="glass"
       headingFontWeight="light"
     >
-      <div id="nav" data-section="nav">
+      {/* Decorative Squiggly Curved Lines with Gold Accents */}
+      <svg
+        className="fixed inset-0 pointer-events-none z-0 w-full h-full"
+        viewBox="0 0 1920 1080"
+        preserveAspectRatio="none"
+        style={{
+          opacity: 0.6,
+        }}
+      >
+        {/* Multiple squiggly curved lines flowing diagonally from top-left to bottom-right */}
+        
+        {/* Line 1 - Main centerline */}
+        <path
+          d="M 0 0 Q 200 150, 300 250 T 600 500 T 900 700 T 1200 850 T 1920 1080"
+          stroke="#D4AF37"
+          strokeWidth="3"
+          fill="none"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+        />
+        
+        {/* Line 2 - Left offset */}
+        <path
+          d="M -150 50 Q 100 180, 200 300 T 500 550 T 800 750 T 1100 900 T 1700 1050"
+          stroke="#D4AF37"
+          strokeWidth="2.5"
+          fill="none"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          opacity="0.7"
+        />
+        
+        {/* Line 3 - Right offset */}
+        <path
+          d="M 150 -20 Q 350 120, 480 220 T 800 480 T 1100 680 T 1350 850 T 1920 1000"
+          stroke="#D4AF37"
+          strokeWidth="2"
+          fill="none"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          opacity="0.65"
+        />
+        
+        {/* Line 4 - Far left */}
+        <path
+          d="M -300 100 Q -50 250, 80 350 T 400 600 T 700 800 T 950 950 T 1450 1080"
+          stroke="#D4AF37"
+          strokeWidth="2"
+          fill="none"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          opacity="0.55"
+        />
+        
+        {/* Line 5 - Far right */}
+        <path
+          d="M 300 20 Q 500 160, 650 280 T 950 520 T 1250 720 T 1550 900 T 1920 1080"
+          stroke="#D4AF37"
+          strokeWidth="1.5"
+          fill="none"
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          opacity="0.5"
+        />
+      </svg>
+
+      {/* Fixed "Go to Dresses" Button */}
+      <button
+        onClick={scrollToGallery}
+        className="fixed right-6 bottom-32 z-40 w-16 h-16 rounded-full bg-gradient-to-r from-[var(--primary-cta)] to-[var(--primary-cta)] text-[var(--primary-cta-text)] shadow-lg hover:shadow-2xl transition-all duration-300 ease-out flex items-center justify-center hover:scale-110 active:scale-95"
+        aria-label="Go to Dresses"
+        title="Go to Dresses"
+      >
+        <div className="flex flex-col items-center justify-center gap-1">
+          <ArrowDown className="w-5 h-5" />
+          <span className="text-xs font-semibold text-center leading-tight">Dresses</span>
+        </div>
+      </button>
+
+      {/* Fixed Back-to-Top Button */}
+      {showBackToTop && (
+        <button
+          onClick={scrollToTop}
+          className="fixed right-6 bottom-6 z-40 w-16 h-16 rounded-full bg-gradient-to-r from-[var(--secondary-cta)] to-[var(--secondary-cta)] text-[var(--secondary-cta-text)] shadow-lg hover:shadow-2xl transition-all duration-300 ease-out flex items-center justify-center hover:scale-110 active:scale-95 animate-in fade-in-0 duration-300"
+          aria-label="Back to Top"
+          title="Back to Top"
+        >
+          <ArrowUp className="w-5 h-5" />
+        </button>
+      )}
+
+      <div id="nav" data-section="nav" className="relative z-20">
         <NavbarStyleCentered
-          brandName="Irentall"
+          brandName="Irentall "
           navItems={[
             { name: "Home", id: "home" },
             { name: "About", id: "about" },
@@ -41,7 +245,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="hero" data-section="hero">
+      <div id="hero" data-section="hero" className="relative z-10">
         <HeroSplitDoubleCarousel
           title="Find Your Perfect Wedding Dress in Los Angeles"
           description="Personalized bridal styling with a curated collection of stunning gowns. Our expert team will guide you through every moment of your journey to find the dress of your dreams."
@@ -50,7 +254,8 @@ export default function LandingPage() {
           tagIcon={Star}
           tagAnimation="slide-up"
           buttons={[
-            { text: "Call Now", href: "tel:747-800-7770" }
+            { text: "Call Now", href: "tel:747-800-7770" },
+            { text: "Browse Dresses", onClick: scrollToGallery }
           ]}
           buttonAnimation="slide-up"
           leftCarouselItems={[
@@ -79,7 +284,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="features" data-section="features">
+      <div id="features" data-section="features" className="relative z-10">
         <FeatureCardSixteen
           title="What Makes Us Different"
           description="At Irentall, we believe every bride deserves a personalized, stress-free experience. Here's what sets us apart from other boutiques."
@@ -102,7 +307,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="about" data-section="about">
+      <div id="about" data-section="about" className="relative z-10">
         <TestimonialAboutCard
           tag="Meet Our Founder"
           tagIcon={User}
@@ -118,7 +323,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="testimonials" data-section="testimonials">
+      <div id="testimonials" data-section="testimonials" className="relative z-10">
         <TestimonialCardSixteen
           title="Real Brides, Real Love"
           description="See what brides in Los Angeles are saying about their Irentall experience."
@@ -154,44 +359,104 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="gallery" data-section="gallery">
-        <ProductCardFour
-          title="Our Dress Collection"
-          description="Handpicked dresses for every bride, every style, every story. From classic elegance to modern minimalism. Some of these dresses are exquisitely and elegantly sewed and crafted by MARAL."
-          textboxLayout="default"
-          useInvertedBackground={false}
-          tag="Gallery"
-          tagIcon={Camera}
-          tagAnimation="slide-up"
-          gridVariant="bento-grid"
-          animationType="slide-up"
-          products={[
-            {
-              id: "dress-1",              name: "Classic Elegance",              price: "Starting at $1,200",              variant: "White",              imageSrc: "http://img.b2bpic.net/free-photo/elegant-beautiful-fashionable-woman-blonde-long-white-dre_7502-4897.jpg?_wi=2",              imageAlt: "Elegant white wedding dress"
-            },
-            {
-              id: "dress-2",              name: "Blush Romance",              price: "Starting at $1,400",              variant: "Blush Pink",              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-bridal-dress-hanger_23-2149640924.jpg?_wi=1",              imageAlt: "Beautiful blush pink wedding gown"
-            },
-            {
-              id: "dress-3",              name: "Modern Sophistication",              price: "Starting at $1,300",              variant: "Off-White",              imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-wedding-clothes-collection_1236-88.jpg",              imageAlt: "Modern off-shoulder wedding dress"
-            },
-            {
-              id: "dress-4",              name: "Intricate Lace",              price: "Starting at $1,500",              variant: "White",              imageSrc: "http://img.b2bpic.net/free-photo/morning-bride-when-she-wears-beautiful-dress_1328-2238.jpg?_wi=1",              imageAlt: "Detailed lace wedding dress"
-            },
-            {
-              id: "dress-5",              name: "Minimalist Chic",              price: "Starting at $1,100",              variant: "White",              imageSrc: "http://img.b2bpic.net/free-photo/front-view-beautiful-bride-indoors_23-2149640909.jpg?_wi=1",              imageAlt: "Sleek minimalist wedding dress"
-            },
-            {
-              id: "dress-6",              name: "Royal Drama",              price: "Starting at $1,600",              variant: "White",              imageSrc: "http://img.b2bpic.net/free-photo/bride-playing-with-her-skirt_1157-725.jpg?_wi=1",              imageAlt: "Dramatic train wedding dress"
-            }
-          ]}
-        />
+      <div id="gallery" data-section="gallery" className="relative z-10">
+        <div className="relative">
+          <ProductCardFour
+            title="Our Dress Collection"
+            description="Handpicked dresses for every bride, every style, every story. From classic elegance to modern minimalism. Some of these dresses are exquisitely and elegantly sewed and crafted by MARAL."
+            textboxLayout="default"
+            useInvertedBackground={false}
+            tag="Gallery"
+            tagIcon={Camera}
+            tagAnimation="slide-up"
+            gridVariant="bento-grid"
+            animationType="slide-up"
+            products={initialDresses}
+          />
+
+          {/* View More Button Positioned on Right */}
+          <div className="flex justify-end px-4 md:px-8 lg:px-16 py-6 md:py-10">
+            <button
+              onClick={() => setShowModal(true)}
+              className="group relative inline-flex items-center gap-2 px-6 md:px-8 py-3 md:py-4 bg-gradient-to-r from-[var(--primary-cta)] to-[var(--primary-cta)] text-[var(--primary-cta-text)] rounded-lg font-semibold hover:shadow-lg transition-all duration-300 ease-out"
+              aria-label="View More Dresses"
+            >
+              <span className="text-sm md:text-base">View More Dresses</span>
+              <ChevronRight className="w-5 h-5 md:w-6 md:h-6 group-hover:translate-x-1 transition-transform" />
+            </button>
+          </div>
+        </div>
+
+        {/* Modal Gallery */}
+        {showModal && (
+          <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-sm p-4">
+            <div className="relative w-full max-w-6xl max-h-[90vh] bg-[var(--background)] rounded-2xl shadow-2xl overflow-hidden flex flex-col">
+              {/* Modal Header */}
+              <div className="flex items-center justify-between p-4 md:p-6 border-b border-[var(--accent)]/20">
+                <h2 className="text-xl md:text-2xl font-semibold text-[var(--foreground)]">Complete Dress Gallery</h2>
+                <button
+                  onClick={() => setShowModal(false)}
+                  className="p-2 hover:bg-[var(--accent)]/10 rounded-lg transition-colors"
+                  aria-label="Close gallery"
+                >
+                  <X className="w-6 h-6 text-[var(--foreground)]" />
+                </button>
+              </div>
+
+              {/* Modal Gallery Grid */}
+              <div className="overflow-y-auto flex-1 p-4 md:p-6">
+                <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4 md:gap-6">
+                  {allDresses.map((dress) => (
+                    <div
+                      key={dress.id}
+                      className="group relative overflow-hidden rounded-lg bg-[var(--card)] shadow-md hover:shadow-xl transition-all duration-500 ease-out"
+                    >
+                      {/* Image Container */}
+                      <div className="relative h-64 md:h-72 overflow-hidden bg-[var(--accent)]/5">
+                        <img
+                          src={dress.imageSrc}
+                          alt={dress.imageAlt}
+                          className="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500 ease-out"
+                        />
+                        {/* Hover Overlay */}
+                        <div className="absolute inset-0 bg-gradient-to-t from-black/40 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-300" />
+                      </div>
+
+                      {/* Content */}
+                      <div className="p-3 md:p-4">
+                        <h3 className="text-sm md:text-base font-semibold text-[var(--foreground)] line-clamp-2">
+                          {dress.name}
+                        </h3>
+                        <p className="text-xs md:text-sm text-[var(--foreground)]/70 mt-1">
+                          {dress.variant}
+                        </p>
+                        <p className="text-sm md:text-base font-bold text-[var(--primary-cta)] mt-2">
+                          {dress.price}
+                        </p>
+                      </div>
+                    </div>
+                  ))}
+                </div>
+              </div>
+
+              {/* Modal Footer */}
+              <div className="flex items-center justify-end gap-3 p-4 md:p-6 border-t border-[var(--accent)]/20 bg-[var(--card)]/50">
+                <button
+                  onClick={() => setShowModal(false)}
+                  className="px-4 md:px-6 py-2 md:py-3 rounded-lg border border-[var(--accent)] text-[var(--foreground)] hover:bg-[var(--accent)]/10 transition-colors"
+                >
+                  Close
+                </button>
+              </div>
+            </div>
+          </div>
+        )}
       </div>
 
-      <div id="reels" data-section="reels">
+      <div id="reels" data-section="reels" className="relative z-10">
         <BlogCardThree
           title="Behind the Beauty"
-          description="Watch our stunning Instagram reels showcasing real brides, styling tips, and magical moments from the Irentall boutique."
+          description=""
           textboxLayout="default"
           useInvertedBackground={true}
           tag="Featured Content"
@@ -200,22 +465,23 @@ export default function LandingPage() {
           animationType="slide-up"
           blogs={[
             {
-              id: "reel-1",              category: "Styling",              title: "The Perfect First Look",              excerpt: "Watch this emotional moment as the groom sees his bride for the first time in her Irentall dress.",              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-bride-posing-medium-shot_23-2149860841.jpg?_wi=2",              imageAlt: "Bride and groom first look moment",              authorName: "Irentall Team",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg",              date: "Latest"
+              id: "reel-1",              category: "",              title: "",              excerpt: "",              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-bride-posing-medium-shot_23-2149860841.jpg?_wi=2",              imageAlt: "Bride and groom first look moment",              authorName: "Irentall Team",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg",              date: ""
             },
             {
-              id: "reel-2",              category: "Dress Reveal",              title: "Twirl & Smile",              excerpt: "The joy of finding THE dress - captured in this beautiful twirl moment at our boutique.",              imageSrc: "http://img.b2bpic.net/free-photo/young-women-enjoying-bachelorette-party_23-2149278361.jpg?_wi=2",              imageAlt: "Bride twirling in wedding dress",              authorName: "Irentall Team",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg",              date: "Latest"
+              id: "reel-2",              category: "",              title: "",              excerpt: "",              imageSrc: "http://img.b2bpic.net/free-photo/young-women-enjoying-bachelorette-party_23-2149278361.jpg?_wi=2",              imageAlt: "Bride twirling in wedding dress",              authorName: "Irentall Team",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg",              date: ""
             },
             {
-              id: "reel-3",              category: "Styling Tips",              title: "Accessory Magic",              excerpt: "See how the right veil and shoes complete the perfect bridal look in seconds.",              imageSrc: "http://img.b2bpic.net/free-photo/elegant-beautiful-fashionable-woman-blonde-long-white-dre_7502-4897.jpg?_wi=2",              imageAlt: "Bride with complete bridal accessories",              authorName: "Irentall Team",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg",              date: "Latest"
+              id: "reel-3",              category: "",              title: "",              excerpt: "",              imageSrc: "http://img.b2bpic.net/free-photo/elegant-beautiful-fashionable-woman-blonde-long-white-dre_7502-4897.jpg?_wi=2",              imageAlt: "Bride with complete bridal accessories",              authorName: "Irentall Team",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg",              date: ""
             },
             {
-              id: "reel-4",              category: "Fashion",              title: "Lace Details Up Close",              excerpt: "Discover the intricate craftsmanship of our most popular lace wedding dress collection.",              imageSrc: "http://img.b2bpic.net/free-photo/elegant-bride-posing_23-2148105871.jpg?_wi=2",              imageAlt: "Close-up of wedding dress lace details",              authorName: "Irentall Team",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg",              date: "Latest"
+              id: "reel-4",              category: "",              title: "",              excerpt: "",              imageSrc: "http://img.b2bpic.net/free-photo/elegant-bride-posing_23-2148105871.jpg?_wi=2",              imageAlt: "Close-up of wedding dress lace details",              authorName: "Irentall Team",              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5MJh3BJx339lVFA4KYjFzlzMX/uploaded-1773894327718-8nx4sc9p.jpg",              date: ""
             }
           ]}
+          uniformGridCustomHeightClasses="min-h-120 2xl:min-h-150"
         />
       </div>
 
-      <div id="shoes" data-section="shoes">
+      <div id="shoes" data-section="shoes" className="relative z-10">
         <ProductCardFour
           title="Bridal Shoes"
           description="Complete your wedding day look with stunning shoes designed for comfort and elegance. From classic heels to modern designs."
@@ -249,7 +515,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="veils" data-section="veils">
+      <div id="veils" data-section="veils" className="relative z-10">
         <ProductCardFour
           title="Veils & Crowns"
           description="Enhance your bridal beauty with our exquisite collection of veils and headpieces. Each piece is carefully selected to complement your gown perfectly."
@@ -283,7 +549,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="contact" data-section="contact">
+      <div id="contact" data-section="contact" className="relative z-10">
         <ContactCTA
           tag="Get in Touch"
           tagIcon={Phone}
@@ -302,7 +568,7 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="footer" data-section="footer">
+      <div id="footer" data-section="footer" className="relative z-10">
         <FooterSimple
           columns={[
             {