src/app/page.tsx

@@ -26,18 +26,20 @@ export default function ZeeshanWebDesignerPage() {
       headingFontWeight="semibold"
     >
       <ReactLenis root>
-        <NavbarLayoutFloatingOverlay
-          brandName="Zeeshan Web Designer"
-          navItems={[
-            { name: "Services", id: "services" },
-            { name: "Portfolio", id: "portfolio" },
-            { name: "Process", id: "process" },
-            { name: "Contact", id: "contact" },
-          ]}
-          button={{ text: "WhatsApp", onClick: () => window.open('https://wa.me/yournumber', '_blank') }}
-        />
+        <div id="nav" data-section="nav">
+          <NavbarLayoutFloatingOverlay
+            brandName="Zeeshan Web Designer"
+            navItems={[
+              { name: "Services", id: "services" },
+              { name: "Portfolio", id: "portfolio" },
+              { name: "Process", id: "process" },
+              { name: "Contact", id: "contact" },
+            ]}
+            button={{ text: "WhatsApp", onClick: () => window.open('https://wa.me/yournumber', '_blank') }}
+          />
+        </div>
         
-        <div id="hero">
+        <div id="hero" data-section="hero">
           <HeroCarouselLogo
             logoText="Zeeshan Web Designer"
             description="High-converting, professional websites for dental clinics and local businesses. Let's build your growth engine."
@@ -49,9 +51,10 @@ export default function ZeeshanWebDesignerPage() {
           />
         </div>
 
-        <div id="services">
+        <div id="services" data-section="services">
           <FeatureCardTwentyNine
             title="Services for Local Growth"
+            description="Professional web solutions designed to grow your local business and convert visitors into appointments."
             gridVariant="bento-grid"
             animationType="blur-reveal"
             textboxLayout="split"
@@ -64,7 +67,7 @@ export default function ZeeshanWebDesignerPage() {
           />
         </div>
 
-        <div id="process">
+        <div id="process" data-section="process">
           <TimelineProcessFlow
             title="Our Proven Process"
             description="Clear steps from consultation to launch."
@@ -78,7 +81,7 @@ export default function ZeeshanWebDesignerPage() {
           />
         </div>
 
-        <div id="portfolio">
+        <div id="portfolio" data-section="portfolio">
             <TestimonialCardTwelve 
                 testimonials={[{ id: "1", name: "Dr. Smith - City Dental", imageSrc: "" }]}
                 cardTitle="Trusted by Professionals"
@@ -88,7 +91,7 @@ export default function ZeeshanWebDesignerPage() {
             />
         </div>
 
-        <div id="contact">
+        <div id="contact" data-section="contact">
           <ContactText
             text="Ready to take your business online?"
             background={{ variant: "gradient-bars" }}
@@ -97,7 +100,7 @@ export default function ZeeshanWebDesignerPage() {
           />
         </div>
 
-        <div id="footer">
+        <div id="footer" data-section="footer">
           <FooterBaseReveal
             logoText="Zeeshan Web Designer"
             columns={[