diff --git a/src/pages/404.astro b/src/pages/404.astro
new file mode 100644
index 0000000..ca1ad16
--- /dev/null
+++ b/src/pages/404.astro
@@ -0,0 +1,39 @@
+---
+import Layout from "../layouts/main.astro";
+---
+
+<Layout title="404">
+  <div class="relative z-20 flex flex-col items-center justify-center w-full max-w-2xl mx-auto px-7 mt-16 mb-16 md:mt-24 lg:mt-32 text-center min-h-[50vh]">
+    <h1 class="text-8xl md:text-9xl font-bold text-neutral-200 dark:text-neutral-800 select-none">
+      404
+    </h1>
+
+    <p id="message" class="mt-6 text-xl text-neutral-600 dark:text-neutral-400">
+      Cette page n'existe pas.
+    </p>
+
+    <a id="home-link" href="/" class="mt-8 inline-flex items-center px-6 py-3 text-sm font-semibold text-white bg-blue-600 rounded-full hover:bg-blue-700 transition-colors duration-200">
+      Retour à l'accueil
+    </a>
+  </div>
+</Layout>
+
+<script is:inline>
+  (function () {
+    var path = window.location.pathname;
+    var msg = document.getElementById('message');
+    var link = document.getElementById('home-link');
+
+    if (path.startsWith('/en')) {
+      msg.textContent = 'This page does not exist.';
+      link.textContent = 'Back to home';
+      link.href = '/en';
+    } else if (path.startsWith('/ar')) {
+      msg.textContent = 'هذه الصفحة غير موجودة.';
+      link.textContent = 'العودة إلى الصفحة الرئيسية';
+      link.href = '/ar';
+      msg.dir = 'rtl';
+      link.dir = 'rtl';
+    }
+  })();
+</script>