first commit

frontend/app/home/components/CTASection.tsx

@@ -0,0 +1,47 @@
+"use client";
+import { Button, Card } from "ikoncomponents";
+import { ArrowRight } from "lucide-react";
+import { useRouter } from "next/dist/client/components/navigation";
+
+export function CTASection() {
+  const router = useRouter();
+  const handleGetStarted = () => {
+    router.push("/main/overview/dashboard");
+  };
+  return (
+    <section className="py-20">
+      <div className="container mx-auto px-4">
+        <Card className="relative max-w-5xl mx-auto overflow-hidden rounded-3xl border p-10 text-center">
+          {/* Decorative radial glow */}
+          <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-full h-full blur-[120px] pointer-events-none" />
+
+          <div className="relative z-10 space-y-8">
+            <h2 className="text-4xl md:text-5xl font-bold  tracking-tight">
+              Ready to Transform Your Projects?
+            </h2>
+            <p className="text-gray-400 text-lg max-w-xl mx-auto">
+              Join thousands of teams using AI to deliver projects on time and
+              under budget.
+            </p>
+
+            <div className="flex flex-wrap justify-center gap-4 pt-2">
+              <Button
+                className="bg-indigo-600 hover:bg-indigo-700  px-8 py-6 text-lg group"
+                onClick={handleGetStarted}
+              >
+                Get Start
+                <ArrowRight className="ml-2 h-5 w-5 transition-transform group-hover:translate-x-1" />
+              </Button>
+              <Button
+                variant="outline"
+                className="border-gray-800 bg-transparent  px-8 py-6 text-lg hover:bg-white/5"
+              >
+                Contact Sales
+              </Button>
+            </div>
+          </div>
+        </Card>
+      </div>
+    </section>
+  );
+}