x

apps/spa/src/pages/CustomPage.tsx

@@ -3,6 +3,7 @@ import { useParams, Link } from 'react-router-dom';
 import Navbar from '../components/Navbar';
 import Footer from '../components/Footer';
 import DynamicPageRenderer from '../components/DynamicPageRenderer';
+import NotFoundPage from './NotFoundPage';
 import { API_BASE, type Category, type PageSection } from '../types';
 
 export default function CustomPage() {
@@ -78,20 +79,7 @@ export default function CustomPage() {
           <div className="w-12 h-12 border-4 border-spa-forest border-t-transparent rounded-full animate-spin"></div>
         </div>
       ) : error ? (
-        <div className="min-h-[60vh] flex flex-col items-center justify-center space-y-6 px-6 text-center">
-          <h2 className="text-3xl font-serif font-light tracking-wide text-spa-forest">
-            Sensory Page Not Found
-          </h2>
-          <p className="text-spa-stone/70 text-sm max-w-md font-light">
-            The page you are looking for does not exist or may have been moved.
-          </p>
-          <Link
-            to="/"
-            className="px-8 py-3 bg-spa-forest text-white hover:bg-spa-forest/90 rounded-full font-bold text-xs uppercase tracking-widest transition-all"
-          >
-            Return to Home
-          </Link>
-        </div>
+        <NotFoundPage />
       ) : (
         <div className={`animate-fade-in ${announcementSections.length > 0 ? 'pt-[32px] md:pt-[40px]' : ''}`}>
           <DynamicPageRenderer