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/pages/Themes.tsx

@@ -0,0 +1,109 @@
+import { 
+  GraduationCap, 
+  Binary, 
+  Users, 
+  Cpu, 
+  Database, 
+  Gamepad2, 
+  CreditCard,
+  Calculator
+} from "lucide-react";
+import Navigation from "@/components/Navigation";
+import ThemeCard from "@/components/ThemeCard";
+
+const Themes = () => {
+  const themes = [
+    {
+      title: "School Connect",
+      description: "Interactive tools designed to bridge theoretical concepts with practical applications in educational settings.",
+      path: "/themes/school-connect",
+      icon: <GraduationCap className="w-6 h-6" />
+    },
+    {
+      title: "Discrete Math",
+      description: "Explore fundamental concepts in discrete mathematics through visual and interactive demonstrations.",
+      path: "/themes/discrete-math",
+      icon: <Binary className="w-6 h-6" />
+    },
+    {
+      title: "Social Choice",
+      description: "Understand voting systems, fairness criteria, and collective decision-making through interactive simulations.",
+      path: "/themes/social-choice",
+      icon: <Users className="w-6 h-6" />
+    },
+    {
+      title: "Advanced Algorithms",
+      description: "Deep dive into complex algorithmic concepts with step-by-step visualizations and performance analysis.",
+      path: "/themes/advanced-algorithms",
+      icon: <Cpu className="w-6 h-6" />
+    },
+    {
+      title: "Data Structures",
+      description: "Master fundamental and advanced data structures through interactive manipulation and visualization.",
+      path: "/themes/data-structures",
+      icon: <Database className="w-6 h-6" />
+    },
+    {
+      title: "Games",
+      description: "Learn through play with educational games that reinforce computer science and mathematical concepts.",
+      path: "/themes/games",
+      icon: <Gamepad2 className="w-6 h-6" />
+    },
+    {
+      title: "Cards and Math",
+      description: "Discover mathematical principles and probability theory through card games and interactive demonstrations.",
+      path: "/themes/cards-math",
+      icon: <CreditCard className="w-6 h-6" />
+    }
+  ];
+
+  return (
+    <div className="min-h-screen bg-background">
+      <Navigation />
+      
+      <div className="py-12 px-4">
+        <div className="max-w-6xl mx-auto">
+          <div className="text-center mb-12">
+            <div className="w-16 h-16 bg-accent rounded-2xl flex items-center justify-center mx-auto mb-6">
+              <Calculator className="w-8 h-8 text-accent-foreground" />
+            </div>
+            <h1 className="text-4xl font-bold text-foreground mb-4">
+              Educational Themes
+            </h1>
+            <p className="text-lg text-muted-foreground max-w-3xl mx-auto">
+              Explore our collection of interactive educational modules, each focusing on a specific area of study. 
+              These themes provide structured pathways through complex topics with hands-on learning experiences.
+            </p>
+          </div>
+
+          <div className="grid lg:grid-cols-3 md:grid-cols-2 gap-6">
+            {themes.map((theme) => (
+              <ThemeCard
+                key={theme.title}
+                title={theme.title}
+                description={theme.description}
+                path={theme.path}
+                icon={theme.icon}
+              />
+            ))}
+          </div>
+
+          <div className="mt-16 text-center">
+            <div className="bg-surface border border-outline rounded-lg p-8 max-w-4xl mx-auto">
+              <h3 className="text-xl font-semibold text-foreground mb-4">
+                More Themes Coming Soon
+              </h3>
+              <p className="text-muted-foreground">
+                We're continuously developing new interactive themes to cover more educational topics. 
+                Each theme will include multiple interactive modules, assessments, and practical exercises 
+                to enhance your learning experience.
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Themes;