first commit

frontend/app/home/components/Footer.tsx

@@ -0,0 +1,55 @@
+"use client";
+import { Brain} from "lucide-react";
+
+const footerLinks = {
+  Product: ["Features", "Pricing", "Integrations", "API"],
+  Resources: ["Documentation", "Blog", "Support", "Community"],
+  Company: ["About", "Careers", "Privacy", "Terms"]
+};
+
+export function Footer() {
+  return (
+    <footer className="pt-10 pb-12 border-t">
+      <div className="container mx-auto px-6 lg:px-24">
+        <div className="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-5 gap-12 mb-10">
+          
+          {/* Brand Column */}
+          <div className="col-span-2 space-y-6">
+            <div className="flex items-center gap-2  font-bold text-xl">
+              <div className="p-1.5 rounded-lg bg-indigo-600">
+                <Brain size={20} />
+              </div>
+              ProjectAI
+            </div>
+            <p className="text-gray-400 max-w-xs leading-relaxed">
+              AI-powered project management for the modern enterprise.
+            </p>
+          </div>
+
+          {/* Links Columns */}
+          {Object.entries(footerLinks).map(([category, links]) => (
+            <div key={category} className="space-y-3">
+              <h4 className=" font-semibold">{category}</h4>
+              <ul className="space-y-2">
+                {links.map((link) => (
+                  <li key={link}>
+                    <a href="#" className="text-gray-400 hover:text-indigo-400 transition-colors text-sm">
+                      {link}
+                    </a>
+                  </li>
+                ))}
+              </ul>
+            </div>
+          ))}
+        </div>
+
+        {/* Bottom Bar */}
+        <div className="pt-8 border-t flex flex-col justify-between items-center gap-4">
+          <p className="text-gray-400 text-sm">
+            © 2025 ProjectAI. All rights reserved.
+          </p>
+        </div>
+      </div>
+    </footer>
+  );
+}