Split the pages up

app/Models.tsx

@@ -0,0 +1,43 @@
+// Models.tsx
+import React from 'react';
+
+const Models: React.FC = () => {
+  return (
+    <div className="model-background">
+      <div className="models">
+        <div className="titel">
+          <h1>Different AI models</h1>
+        </div>
+        <form action="">
+          <div className="grid">
+            <button className="code-model model-box">
+              <div className="overlay">
+                <h3>Code</h3>
+                <img src="/img/wifi.svg" alt="Wi-Fi" />
+              </div>
+            </button>
+            <button className="math-model model-box">
+              <div className="overlay">
+                <h3>Math</h3>
+                <img src="/img/nowifi.svg" alt="No Wi-Fi" />
+              </div>
+            </button>
+            <button className="language-model model-box">
+              <div className="overlay">
+                <h3>Language</h3>
+              </div>
+            </button>
+            <button className="default-model model-box">
+              <div className="overlay">
+                <h3>Default</h3>
+              </div>
+            </button>
+            {/* Add more model buttons here */}
+          </div>
+        </form>
+      </div>
+    </div>
+  );
+};
+
+export default Models;