feat: Implement website structure

- Add navigation with Themes, Puzzles, and Miscellany.
- Create "coming soon" pages for Puzzles and Miscellany.
- Create a Themes page with cards for various topics.
- Implement basic boxy layout.
- Prepare for future interactive additions and filtering.
- Set up for Netlify deployment.

src/components/Navigation.tsx

@@ -0,0 +1,52 @@
+import { Link, useLocation } from "react-router-dom";
+import { cn } from "@/lib/utils";
+
+const Navigation = () => {
+  const location = useLocation();
+  
+  const navItems = [
+    { name: "Themes", path: "/themes" },
+    { name: "Puzzles", path: "/puzzles" },
+    { name: "Miscellany", path: "/miscellany" }
+  ];
+
+  return (
+    <nav className="bg-surface border-b border-outline">
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div className="flex items-center justify-between h-16">
+          <Link 
+            to="/" 
+            className="text-xl font-bold text-foreground hover:text-accent transition-colors"
+          >
+            EduInteractives
+          </Link>
+          
+          <div className="flex space-x-8">
+            {navItems.map((item) => {
+              const isActive = location.pathname === item.path;
+              return (
+                <Link
+                  key={item.name}
+                  to={item.path}
+                  className={cn(
+                    "px-3 py-2 text-sm font-medium transition-colors relative",
+                    isActive 
+                      ? "text-accent" 
+                      : "text-foreground hover:text-accent"
+                  )}
+                >
+                  {item.name}
+                  {isActive && (
+                    <div className="absolute bottom-0 left-0 right-0 h-0.5 bg-accent" />
+                  )}
+                </Link>
+              );
+            })}
+          </div>
+        </div>
+      </div>
+    </nav>
+  );
+};
+
+export default Navigation;