feat: switch to HashRouter for HF Spaces compatibility

src/App.jsx

@@ -1,4 +1,4 @@
-import { BrowserRouter, Routes, Route } from 'react-router-dom';
+import { HashRouter, Routes, Route } from 'react-router-dom';
 import { ThemeProvider, CssBaseline } from '@mui/material';
 import theme from './theme/theme';
 import { AppsProvider } from './context/AppsContext';
@@ -16,7 +16,7 @@ export default function App() {
     <ThemeProvider theme={theme}>
       <CssBaseline />
       <AppsProvider>
-        <BrowserRouter>
+        <HashRouter>
           <Routes>
             <Route path="/" element={<Home />} />
             <Route path="/getting-started" element={<GettingStarted />} />
@@ -26,7 +26,7 @@ export default function App() {
             <Route path="/apps" element={<Apps />} />
             <Route path="/buy" element={<Buy />} />
           </Routes>
-        </BrowserRouter>
+        </HashRouter>
       </AppsProvider>
     </ThemeProvider>
   );

src/components/Header.jsx

@@ -53,19 +53,8 @@ export default function Header({ transparent = false }) {
     setMobileOpen(!mobileOpen);
   };
 
-  const handleNavClick = (item) => {
+  const handleNavClick = () => {
     setMobileOpen(false);
-    if (item.external) return;
-    
-    if (item.href.startsWith('/#')) {
-      const elementId = item.href.replace('/#', '');
-      if (location.pathname === '/') {
-        const element = document.getElementById(elementId);
-        if (element) {
-          element.scrollIntoView({ behavior: 'smooth' });
-        }
-      }
-    }
   };
 
   // Determine colors based on transparent mode and scroll state

src/pages/Home.jsx

@@ -193,7 +193,7 @@ function Hero() {
           <Stack direction={{ xs: 'column', sm: 'row' }} spacing={2}>
             <Button
               component={RouterLink}
-              to="/#pricing"
+              to="/buy"
               variant="contained"
               size="large"
               sx={{