src/app/page.tsx

@@ -9,9 +9,24 @@ import FeatureCardTwentyOne from "@/components/sections/feature/FeatureCardTwent
 import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
 import ContactCTA from "@/components/sections/contact/ContactCTA";
 import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
-import Link from "next/link";
+import dynamic from "next/dynamic";
 import { Sparkles, Zap, Mail, Star, Image as ImageIcon } from "lucide-react";
 
+const DynamicHeroSection = dynamic(
+  () => import("@/components/sections/hero/HeroSplitDualMedia"),
+  { loading: () => <div className="h-screen" /> }
+);
+
+const DynamicProductSection = dynamic(
+  () => import("@/components/sections/product/ProductCardTwo"),
+  { loading: () => <div className="h-96" /> }
+);
+
+const DynamicTestimonialSection = dynamic(
+  () => import("@/components/sections/testimonial/TestimonialCardOne"),
+  { loading: () => <div className="h-96" /> }
+);
+
 export default function HomePage() {
   return (
     <ThemeProvider
@@ -79,7 +94,7 @@ export default function HomePage() {
       </div>
 
       <div id="gallery" data-section="gallery">
-        <ProductCardTwo
+        <DynamicProductSection
           title="Tattoo Portfolio"
           description="Explore our extensive collection of custom tattoo designs. Each piece showcases our commitment to artistic excellence and client satisfaction."
           tag="Gallery"
@@ -152,7 +167,7 @@ export default function HomePage() {
       </div>
 
       <div id="testimonials" data-section="testimonials">
-        <TestimonialCardOne
+        <DynamicTestimonialSection
           testimonials={[
             {
               id: "1",              name: "Rajesh Kumar",              role: "Professional",              company: "Tech Startup",              rating: 5,
@@ -246,4 +261,4 @@ export default function HomePage() {
       </div>
     </ThemeProvider>
   );
-}
+}