refactor(framework): Replace SuperClaude with Claude Flow & SPARC

This commit marks a significant architectural overhaul, replacing the legacy SuperClaude and Taskmaster AI frameworks with the new Claude Flow orchestration system and the SPARC/Roo methodology.

The new framework emphasizes parallel, swarm-based execution and mandatory batch operations for improved efficiency and coordination.

Key Changes:

- **Framework Migration:** The entire `.claude` and `.cursor` directories, containing the old command, persona, and rule systems, have been removed. They are replaced by the new `.roomodes` configuration and a comprehensive `CLAUDE.md` guide for Claude Flow.

- **New Orchestration Engine:** Introduced Claude Flow as the primary MCP server. The updated `CLAUDE.md` defines new rules for swarm orchestration, mandatory concurrent execution, and a clear separation of concerns between coordination (MCP) and execution (Claude Code).

- **Project Initiation (AIROUM):** Added extensive planning, design, and specification documents for a new project: the "AIROUM" educational landing page. This includes:
    - Mood boards and multiple HTML design iterations in `.superdesign` and `gallery`.
    - Detailed planning documents, technical designs, and pseudocode specs in `.taskmaster`.

- **Configuration Updates:**
    - `.mcp.json` now points to `claude-flow` and `ruv-swarm`.
    - `.gitignore` is updated to support the new Claude Flow file structure.

.superdesign/design_system/design-system.json

@@ -0,0 +1,132 @@
+{
+  "colors": {
+    "primary": {
+      "main": "#0A2A5B",
+      "light": "#1E40AF",
+      "dark": "#051A3A",
+      "contrastText": "#FFFFFF"
+    },
+    "secondary": {
+      "main": "#00D1FF",
+      "light": "#77F1FF",
+      "dark": "#00A8CC",
+      "contrastText": "#0A2A5B"
+    },
+    "accent": {
+      "main": "#E5408F",
+      "light": "#F472B6",
+      "dark": "#C72B77",
+      "contrastText": "#FFFFFF"
+    },
+    "neutrals": {
+      "black": "#111827",
+      "dark_gray": "#374151",
+      "gray": "#9CA3AF",
+      "light_gray": "#E5E7EB",
+      "white": "#FFFFFF"
+    },
+    "background": {
+      "default": "#F9FAFB",
+      "paper": "#FFFFFF",
+      "dark": "#111827",
+      "gradient_dark": "linear-gradient(135deg, #051A3A 0%, #111827 100%)"
+    },
+    "text": {
+      "primary": "#1F2937",
+      "secondary": "#4B5563",
+      "disabled": "#9CA3AF",
+      "primary_on_dark": "#F9FAFB",
+      "secondary_on_dark": "#9CA3AF"
+    }
+  },
+  "typography": {
+    "fontFamilies": {
+      "primary": "\"Pretendard\", \"Inter\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif",
+      "monospace": "\"Roboto Mono\", monospace"
+    },
+    "sizes": {
+      "h1": "2.5rem",
+      "h2": "2rem",
+      "h3": "1.75rem",
+      "h4": "1.5rem",
+      "h5": "1.25rem",
+      "h6": "1rem",
+      "body1": "1rem",
+      "body2": "0.875rem",
+      "caption": "0.75rem"
+    },
+    "weights": {
+      "light": 300,
+      "regular": 400,
+      "medium": 500,
+      "bold": 700,
+      "black": 900
+    },
+    "lineHeights": {
+      "h1": "1.2",
+      "h2": "1.25",
+      "h3": "1.3",
+      "body": "1.6"
+    }
+  },
+  "spacing": {
+    "base": 8,
+    "units": {
+      "1x": "8px",
+      "2x": "16px",
+      "3x": "24px",
+      "4x": "32px",
+      "5x": "40px",
+      "6x": "48px"
+    }
+  },
+  "components": {
+    "buttons": {
+      "primary": {
+        "backgroundColor": "#0A2A5B",
+        "color": "#FFFFFF",
+        "padding": "12px 24px",
+        "borderRadius": "9999px",
+        "fontWeight": 700
+      },
+      "secondary": {
+        "backgroundColor": "#00D1FF",
+        "color": "#0A2A5B",
+        "padding": "12px 24px",
+        "borderRadius": "9999px",
+        "fontWeight": 700
+      }
+    },
+    "inputs": {
+      "outlined": {
+        "borderColor": "#D1D5DB",
+        "borderRadius": "8px",
+        "padding": "12px 16px",
+        "backgroundColor": "#FFFFFF"
+      }
+    },
+    "cards": {
+      "default": {
+        "backgroundColor": "#FFFFFF",
+        "borderRadius": "16px",
+        "boxShadow": "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
+        "padding": "24px"
+      }
+    }
+  },
+  "effects": {
+    "borderRadius": {
+      "small": "4px",
+      "medium": "8px",
+      "large": "12px",
+      "xlarge": "16px",
+      "full": "9999px"
+    },
+    "boxShadows": {
+      "small": "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
+      "medium": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
+      "large": "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
+      "xlarge": "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)"
+    }
+  }
+}