Update .gitignore and remove cached build artifacts

src/components/HomeAbout.tsx

@@ -0,0 +1,95 @@
+'use client'
+
+import { useState } from 'react'
+import { motion } from 'framer-motion'
+import { TypeAnimation } from 'react-type-animation'
+import { Dialog, DialogPanel } from '@headlessui/react'
+import { Bars3Icon, XMarkIcon, ChevronDoubleDownIcon } from '@heroicons/react/24/outline'
+
+const navigation = [
+  { name: 'Product', href: '#' },
+  { name: 'Features', href: '#' },
+  { name: 'Marketplace', href: '#' },
+  { name: 'Company', href: '#' },
+]
+
+export function HomeAbout() {
+  const [mobileMenuOpen, setMobileMenuOpen] = useState(false)
+
+  return (
+    <div className="relative h-screen">
+      <div className="relative isolate px-6 lg:px-8">
+        <div className="relative -top-10  mx-auto max-w-8xl h-screen flex items-center justify-center">
+        <motion.div
+          initial={{ opacity: 0 }}
+          animate={{ opacity: 1 }}
+          transition={{ duration: 2, delay: 0.5 }}
+          aria-hidden="true"
+          className="absolute top-10 left-[calc(50%-4rem)] -z-10 transform-gpu blur-3xl sm:left-[calc(50%-18rem)] lg:top-[calc(50%-30rem)] lg:left-48 xl:left-[calc(50%-24rem)]"
+        >
+          <div
+            style={{
+              clipPath:
+                'polygon(73.6% 51.7%, 91.7% 11.8%, 100% 46.4%, 97.4% 82.2%, 92.5% 84.9%, 75.7% 64%, 55.3% 47.5%, 46.5% 49.4%, 45% 62.9%, 50.3% 87.2%, 21.3% 64.1%, 0.1% 100%, 5.4% 51.1%, 21.4% 63.9%, 58.9% 0.2%, 73.6% 51.7%)',
+            }}
+            className="aspect-1108/632 w-277 bg-linear-to-r from-[#80caff] to-[#4f46e5] opacity-20"
+          />
+        </motion.div>
+          <motion.p
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            transition={{ duration: 1, delay: 1 }}
+            className="absolute top-24 left-0 max-w-xl text-left text-4xl font-medium text-pretty text-[#2F3178] lg:text-6xl"
+          >
+            Enterprise AI Agents
+            That Never Sleep.
+          </motion.p>
+          <motion.p
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            transition={{ duration: 1, delay: 1.5 }}
+            className="absolute top-64 left-0 max-w-xl text-left  text-2xl font-medium text-pretty text-[#2F3178] lg:text-2xl"
+          >
+            With Mycelium, you could deploy AI agents that handle your most complex workflows while maintaining complete data sovereignty and control.
+          </motion.p>
+          
+          <div className="absolute bottom-24 right-0 h-96 w-2/3 overflow-hidden">
+            <div className="animate-marquee-vertical space-y-4 text-right text-4xl font-medium text-[#2F3178]">
+              <p>Data Orchestration</p>
+              <p>Data Cleaning</p>
+              <p>Real-time Monitoring</p>
+              <p>Query Optimization</p>
+              <p>Report Generation</p>
+              <p>Metadata Management</p>
+              <p>Model Monitoring</p>
+              <p>Cost Optimization</p>
+              <p>API Integration</p>
+              <p>Access Control</p>
+              <p>Log Processing</p>
+              <p>Synthetic Data</p>
+              <p>Code Intelligence</p>
+              <p>Incident Automation</p>
+              <p>Data Discovery</p>
+              {/* Duplicate for seamless scroll */}
+              <p aria-hidden="true">Data Orchestration</p>
+              <p aria-hidden="true">Data Cleaning</p>
+              <p aria-hidden="true">Real-time Monitoring</p>
+              <p aria-hidden="true">Query Optimization</p>
+              <p aria-hidden="true">Report Generation</p>
+              <p aria-hidden="true">Metadata Management</p>
+              <p aria-hidden="true">Model Monitoring</p>
+              <p aria-hidden="true">Cost Optimization</p>
+              <p aria-hidden="true">API Integration</p>
+              <p aria-hidden="true">Access Control</p>
+              <p aria-hidden="true">Log Processing</p>
+              <p aria-hidden="true">Synthetic Data</p>
+              <p aria-hidden="true">Code Intelligence</p>
+              <p aria-hidden="true">Incident Automation</p>
+              <p aria-hidden="true">Data Discovery</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}