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

pages/RanOutOfProject.tsx

@@ -32,13 +32,13 @@ import {
   Wrench,
   Zap
 } from "lucide-react";
-import { navigateTo } from "../App";
 import { Footer } from "../components/Footer";
 import { GridPattern } from "../components/GridPattern";
 import { Navigation } from "../components/Navigation";
 import { ImageWithFallback } from "../components/figma/ImageWithFallback";
 import { Button } from "../components/ui/button";
 import ranoutofLogo from "../src/images/ranoutof-logo.webp";
+import { useNavigate } from "react-router-dom";
 
 // Technology to icon mapping
 const getTechIcon = (tech: string) => {
@@ -212,10 +212,12 @@ const futureRoadmap = [
   }
 ];
 
+
 export const RanOutOfProject = () => {
+  const navigate = useNavigate();
   return (
     <div className="dark min-h-screen bg-background">
-      <Navigation />
+      {/* <Navigation /> */}
       
       {/* Section 1: Hero with Heading, Subheading, and Image */}
       <section className="relative pt-32 pb-24 bg-background overflow-hidden">
@@ -231,7 +233,7 @@ export const RanOutOfProject = () => {
           >
             <Button
               variant="ghost"
-              onClick={() => navigateTo('/case-studies')}
+              onClick={() => navigate('/case-studies')}
               className="text-muted-foreground hover:text-foreground flex items-center gap-2 px-0 hover:bg-transparent"
             >
               <ArrowLeft className="w-4 h-4" />
@@ -1063,7 +1065,7 @@ export const RanOutOfProject = () => {
             <div className="flex flex-col sm:flex-row gap-4 justify-center">
               <Button
                 size="lg"
-                onClick={() => navigateTo('/contact-us')}
+                onClick={() => navigate('/contact-us')}
                 className="bg-accent hover:bg-accent/90 text-accent-foreground"
               >
                 Contact Us
@@ -1072,7 +1074,7 @@ export const RanOutOfProject = () => {
               <Button
                 size="lg"
                 variant="outline"
-                onClick={() => navigateTo('/case-studies')}
+                onClick={() => navigate('/case-studies')}
                 className="border-accent/30 text-accent hover:bg-accent/10"
               >
                 View More Case Studies
@@ -1083,7 +1085,7 @@ export const RanOutOfProject = () => {
         </div>
       </section>
 
-      <Footer />
+      {/* <Footer /> */}
     </div>
   );
 };