All changes, done like fully react router uses, services, al/ml and solution page section alignment and missing section done!

pages/HireMobileAppDevelopers.tsx

@@ -5,12 +5,13 @@ import { Button } from "../components/ui/button";
 import { Badge } from "../components/ui/badge";
 import { Card, CardContent } from "../components/ui/card";
 import { ArrowRight, Smartphone, Apple, Code, Zap, Shield, Target, Users, CheckCircle, Star } from "lucide-react";
-import { navigateTo } from "@/App";
+import { useNavigate } from "react-router-dom";
 import { Helmet } from "react-helmet-async";
 import { HireTalentHeroBanner } from "@/components/HireTalentHeroBanner";
 import { MobileAppVector } from "@/components/vectors";
 
 export const HireMobileAppDevelopers = () => {
+  const navigate = useNavigate();
   const expertise = [
     {
       icon: Apple,
@@ -115,7 +116,7 @@ export const HireMobileAppDevelopers = () => {
 
   return (
     <div className="dark min-h-screen bg-background">
-      <Navigation />
+      {/* <Navigation /> */}
  <Helmet>
           {/* Page Title and Meta Description */}
           <title>Hire Mobile App Developers | Expert Talent at WDI</title>
@@ -326,7 +327,7 @@ export const HireMobileAppDevelopers = () => {
             </p>
             <div className="flex flex-col sm:flex-row gap-4 justify-center">
               <Button size="lg" className="bg-[#E5195E] hover:bg-[#E5195E]/90 text-white"
-                onClick={() => navigateTo("/start-a-project")}
+                onClick={() => navigate("/start-a-project")}
               >
                 Get Started Today
                 <ArrowRight className="ml-2 w-4 h-4" />
@@ -339,7 +340,7 @@ export const HireMobileAppDevelopers = () => {
         </div>
       </section>
 
-      <Footer />
+      {/* <Footer /> */}
     </div>
   );
 };