diff --git a/src/app/page.tsx b/src/app/page.tsx
index 6984d20..74ab9fc 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -12,6 +12,7 @@ import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
 import ContactFaq from "@/components/sections/contact/ContactFaq";
 import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
 import { Lightbulb, Target, Zap, Phone } from "lucide-react";
+import Link from "next/link";
 
 export default function Home() {
   return (
@@ -27,31 +28,33 @@ export default function Home() {
       secondaryButtonStyle="glass"
       headingFontWeight="semibold"
     >
-      <NavbarStyleApple
-        navItems={[
-          { name: "Home", id: "/" },
-          { name: "About", id: "#about" },
-          { name: "Services", id: "#services" },
-          { name: "Pricing", id: "#pricing" },
-          { name: "Contact", id: "#contact" }
-        ]}
-        brandName="Webbug"
-      />
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "About", id: "about" },
+            { name: "Services", id: "services" },
+            { name: "Pricing", id: "pricing" },
+            { name: "Contact", id: "contact" }
+          ]}
+          brandName="Webbug"
+        />
+      </div>
 
       <div id="hero" data-section="hero">
         <HeroCentered
           background={{ variant: "plain" }}
           avatars={[
-            { src: "asset://avatar-1", alt: "User 1" },
-            { src: "asset://avatar-2", alt: "User 2" },
-            { src: "asset://avatar-3", alt: "User 3" }
+            { src: "/placeholders/placeholder1.webp", alt: "User 1" },
+            { src: "/placeholders/placeholder1.webp", alt: "User 2" },
+            { src: "/placeholders/placeholder1.webp", alt: "User 3" }
           ]}
           avatarText="Trusted by 100+ practices"
           title="Professional Web Design for Medical & Dental Practices"
           description="HIPAA-compliant websites designed to build patient trust and grow your practice"
           buttons={[
-            { text: "Get Started", href: "#contact" },
-            { text: "Learn More", href: "#about" }
+            { text: "Get Started", href: "contact" },
+            { text: "Learn More", href: "about" }
           ]}
         />
       </div>
@@ -73,12 +76,12 @@ export default function Home() {
               title: "SEO Optimized",              description: "Better visibility in search results",              icon: Zap
             }
           ]}
-          imageSrc="asset://about-image"
+          imageSrc="/placeholders/placeholder1.webp"
           imageAlt="Medical practice team"
           imagePosition="right"
           mediaAnimation="none"
           buttons={[
-            { text: "Schedule a Call", href: "#contact" }
+            { text: "Schedule a Call", href: "contact" }
           ]}
         />
       </div>
@@ -89,29 +92,29 @@ export default function Home() {
             {
               title: "Website Design",              description: "Custom websites tailored to your practice",              icon: Target,
               mediaItems: [
-                { imageSrc: "asset://service-1", imageAlt: "Website design" },
-                { imageSrc: "asset://service-2", imageAlt: "Website design 2" }
+                { imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Website design" },
+                { imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Website design 2" }
               ]
             },
             {
               title: "Patient Portal",              description: "Secure patient communication platform",              icon: Lightbulb,
               mediaItems: [
-                { imageSrc: "asset://service-3", imageAlt: "Patient portal" },
-                { imageSrc: "asset://service-4", imageAlt: "Patient portal 2" }
+                { imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Patient portal" },
+                { imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Patient portal 2" }
               ]
             },
             {
               title: "SEO Services",              description: "Improve your online visibility",              icon: Zap,
               mediaItems: [
-                { imageSrc: "asset://service-5", imageAlt: "SEO services" },
-                { imageSrc: "asset://service-6", imageAlt: "SEO services 2" }
+                { imageSrc: "/placeholders/placeholder1.webp", imageAlt: "SEO services" },
+                { imageSrc: "/placeholders/placeholder1.webp", imageAlt: "SEO services 2" }
               ]
             },
             {
               title: "Maintenance",              description: "24/7 support and updates",              icon: Target,
               mediaItems: [
-                { imageSrc: "asset://service-7", imageAlt: "Maintenance" },
-                { imageSrc: "asset://service-8", imageAlt: "Maintenance 2" }
+                { imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Maintenance" },
+                { imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Maintenance 2" }
               ]
             }
           ]}
@@ -121,7 +124,7 @@ export default function Home() {
           useInvertedBackground={false}
           animationType="slide-up"
           buttons={[
-            { text: "View All Services", href: "#contact" }
+            { text: "View All Services", href: "contact" }
           ]}
         />
       </div>
@@ -130,19 +133,19 @@ export default function Home() {
         <PricingCardNine
           plans={[
             {
-              id: "basic",              title: "Basic",              price: "$999",              period: "/month",              imageSrc: "asset://pricing-basic",              imageAlt: "Basic plan",              button: { text: "Get Started", href: "#contact" },
+              id: "basic",              title: "Basic",              price: "$999",              period: "/month",              imageSrc: "/placeholders/placeholder1.webp",              imageAlt: "Basic plan",              button: { text: "Get Started", href: "contact" },
               features: [
                 "Professional Website",                "Mobile Responsive",                "Basic SEO Setup",                "Email Support"
               ]
             },
             {
-              id: "professional",              title: "Professional",              price: "$1,999",              period: "/month",              imageSrc: "asset://pricing-professional",              imageAlt: "Professional plan",              button: { text: "Get Started", href: "#contact" },
+              id: "professional",              title: "Professional",              price: "$1,999",              period: "/month",              imageSrc: "/placeholders/placeholder1.webp",              imageAlt: "Professional plan",              button: { text: "Get Started", href: "contact" },
               features: [
                 "All Basic Features",                "Patient Portal",                "Advanced SEO",                "Priority Support",                "Monthly Analytics"
               ]
             },
             {
-              id: "enterprise",              title: "Enterprise",              price: "Custom",              period: "/month",              imageSrc: "asset://pricing-enterprise",              imageAlt: "Enterprise plan",              button: { text: "Schedule Call", href: "#contact" },
+              id: "enterprise",              title: "Enterprise",              price: "Custom",              period: "/month",              imageSrc: "/placeholders/placeholder1.webp",              imageAlt: "Enterprise plan",              button: { text: "Schedule Call", href: "contact" },
               features: [
                 "All Professional Features",                "Custom Integrations",                "24/7 Support",                "Dedicated Account Manager",                "Advanced Analytics"
               ]
@@ -154,7 +157,7 @@ export default function Home() {
           useInvertedBackground={false}
           animationType="slide-up"
           buttons={[
-            { text: "View Full Details", href: "#contact" }
+            { text: "View Full Details", href: "contact" }
           ]}
         />
       </div>
@@ -180,16 +183,16 @@ export default function Home() {
         <TeamCardOne
           members={[
             {
-              id: "1",              name: "Sarah Johnson",              role: "Lead Designer",              imageSrc: "asset://team-1",              imageAlt: "Sarah Johnson"
+              id: "1",              name: "Sarah Johnson",              role: "Lead Designer",              imageSrc: "/placeholders/placeholder1.webp",              imageAlt: "Sarah Johnson"
             },
             {
-              id: "2",              name: "Michael Chen",              role: "Founder & CEO",              imageSrc: "asset://team-2",              imageAlt: "Michael Chen"
+              id: "2",              name: "Michael Chen",              role: "Founder & CEO",              imageSrc: "/placeholders/placeholder1.webp",              imageAlt: "Michael Chen"
             },
             {
-              id: "3",              name: "Emily Rodriguez",              role: "Patient Experience Lead",              imageSrc: "asset://team-3",              imageAlt: "Emily Rodriguez"
+              id: "3",              name: "Emily Rodriguez",              role: "Patient Experience Lead",              imageSrc: "/placeholders/placeholder1.webp",              imageAlt: "Emily Rodriguez"
             },
             {
-              id: "4",              name: "David Park",              role: "Technical Director",              imageSrc: "asset://team-4",              imageAlt: "David Park"
+              id: "4",              name: "David Park",              role: "Technical Director",              imageSrc: "/placeholders/placeholder1.webp",              imageAlt: "David Park"
             }
           ]}
           title="Meet Our Team"
@@ -217,7 +220,7 @@ export default function Home() {
               id: "4",              title: "Can you integrate with our current systems?",              content: "Absolutely. We can integrate with EMR systems, appointment scheduling software, and other healthcare platforms."
             }
           ]}
-          imageSrc="asset://faq-image"
+          imageSrc="/placeholders/placeholder1.webp"
           imageAlt="FAQ support"
           title="Frequently Asked Questions"
           description="Find answers to common questions about our services"
@@ -227,7 +230,7 @@ export default function Home() {
           mediaAnimation="none"
           faqsAnimation="slide-up"
           buttons={[
-            { text: "Still have questions?", href: "#contact" }
+            { text: "Still have questions?", href: "contact" }
           ]}
         />
       </div>
@@ -259,26 +262,26 @@ export default function Home() {
         columns={[
           {
             title: "Product",            items: [
-              { label: "Website Design", href: "#services" },
-              { label: "Patient Portal", href: "#services" },
-              { label: "SEO Services", href: "#services" },
-              { label: "Pricing", href: "#pricing" }
+              { label: "Website Design", href: "services" },
+              { label: "Patient Portal", href: "services" },
+              { label: "SEO Services", href: "services" },
+              { label: "Pricing", href: "pricing" }
             ]
           },
           {
             title: "Company",            items: [
-              { label: "About Us", href: "#about" },
-              { label: "Team", href: "#team" },
-              { label: "Blog", href: "#" },
-              { label: "Contact", href: "#contact" }
+              { label: "About Us", href: "about" },
+              { label: "Team", href: "team" },
+              { label: "Blog", href: "/" },
+              { label: "Contact", href: "contact" }
             ]
           },
           {
             title: "Resources",            items: [
-              { label: "Documentation", href: "#" },
-              { label: "Support", href: "#contact" },
-              { label: "FAQ", href: "#faq" },
-              { label: "Privacy Policy", href: "#" }
+              { label: "Documentation", href: "/" },
+              { label: "Support", href: "contact" },
+              { label: "FAQ", href: "faq" },
+              { label: "Privacy Policy", href: "/" }
             ]
           }
         ]}