website refactor

apps/website/ui/CardStack.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import { Box } from './Box';
+
+interface CardStackProps {
+  children: React.ReactNode;
+  gap?: 2 | 3 | 4 | 6 | 8;
+}
+
+/**
+ * CardStack - A semantic UI component for stacking cards or panels.
+ */
+export function CardStack({ children, gap = 4 }: CardStackProps) {
+  return (
+    <Box display="flex" flexDirection="col" gap={gap}>
+      {children}
+    </Box>
+  );
+}