feat: Create FE home page and about page

app/components/home/QuickLinksGrid.tsx

@@ -0,0 +1,67 @@
+import Link from "next/link";
+
+const LINKS = [
+    {
+        icon: "fa-solid fa-microscope",
+        title: "Research Hub",
+        desc: "Discover our ongoing projects, facilities, and interdisciplinary centers.",
+        cta: "View Hub",
+        href: "/research",
+    },
+    {
+        icon: "fa-solid fa-book-open",
+        title: "Publications",
+        desc: "Access our extensive repository of peer-reviewed papers and journals.",
+        cta: "Browse",
+        href: "/publications",
+    },
+    {
+        icon: "fa-solid fa-handshake",
+        title: "Partnerships",
+        desc: "Collaborate with us through industry, academic, and global networks.",
+        cta: "Connect",
+        href: "/partnerships",
+    },
+    {
+        icon: "fa-solid fa-newspaper",
+        title: "News & Events",
+        desc: "Stay updated with our latest breakthroughs, seminars, and campus life.",
+        cta: "Read More",
+        href: "/blog",
+    },
+];
+
+const QuickLinksGrid = () => {
+    return (
+        <section id="quick-links" className="quick-links">
+            <div className="container">
+                <div className="quick-links__header text-center">
+                    <h2 className="quick-links__title">Explore Our Ecosystem</h2>
+                    <p className="quick-links__subtitle">
+                        Navigate through our core pillars of academic excellence and global partnerships.
+                    </p>
+                </div>
+
+                <div className="quick-links__grid">
+                    {LINKS.map((item, i) => (
+                        <Link href={item.href} key={i} className="quick-links__card">
+                            <div className="quick-links__icon-wrap">
+                                <i className={item.icon}></i>
+                            </div>
+                            <h3 className="quick-links__card-title">{item.title}</h3>
+                            <p className="quick-links__card-desc">{item.desc}</p>
+                            <div className="quick-links__card-footer">
+                                <span className="quick-links__cta">{item.cta}</span>
+                                <span className="quick-links__arrow">
+                                    <i className="fa-solid fa-arrow-right"></i>
+                                </span>
+                            </div>
+                        </Link>
+                    ))}
+                </div>
+            </div>
+        </section>
+    );
+};
+
+export default QuickLinksGrid;