product

components/Footer.tsx

@@ -0,0 +1,56 @@
+import React from 'react';
+import { Twitter } from 'lucide-react';
+
+interface FooterProps {
+  onPrivacyClick?: (e: React.MouseEvent) => void;
+}
+
+const Footer: React.FC<FooterProps> = ({ onPrivacyClick }) => {
+  return (
+    <footer className="bg-[#0A0C12] pt-16 pb-8 border-t border-gray-800">
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <div className="grid grid-cols-2 md:grid-cols-2 gap-8 mb-12">
+          {/* Brand Column */}
+          <div className="col-span-1">
+            <div className="flex items-center gap-2 mb-4">
+              <img 
+                src="/assets/images/icon.png" 
+                alt="Nemia Logo" 
+                className="w-6 h-6 rounded object-contain"
+              />
+              <span className="font-display font-bold text-lg text-white">
+                Nemia
+              </span>
+            </div>
+            <p className="text-sm text-gray-400 max-w-xs">
+              Making learning inevitable through smart blocking and spaced repetition.
+            </p>
+          </div>
+
+          {/* Legal Links */}
+          <div className="flex flex-col items-end">
+            <h4 className="font-bold text-white mb-4">Legal</h4>
+            <ul className="space-y-2 text-sm text-gray-400 text-right">
+              <li><a href="#" onClick={onPrivacyClick} className="hover:text-primary transition-colors">Privacy</a></li>
+              <li><a href="#" className="hover:text-primary transition-colors">Terms</a></li>
+              <li><a href="#" className="hover:text-primary transition-colors">Cookie Policy</a></li>
+            </ul>
+          </div>
+        </div>
+
+        {/* Bottom Bar */}
+        <div className="border-t border-gray-800 pt-8 flex flex-col md:flex-row justify-between items-center gap-4">
+          <p className="text-sm text-gray-400">© 2026 Nemia Inc. All rights reserved.</p>
+          <div className="flex space-x-6">
+            <a href="#" className="text-gray-400 hover:text-primary transition-colors">
+              <span className="sr-only">Twitter</span>
+              <Twitter size={20} />
+            </a>
+          </div>
+        </div>
+      </div>
+    </footer>
+  );
+};
+
+export default Footer;