From 1f462afc1b2ddae5c96b11e88f9b9d5ea98759ba Mon Sep 17 00:00:00 2001
From: kleap-admin <admin@kleap.co>
Date: Sun, 18 Jan 2026 18:55:03 +0000
Subject: [PATCH] Update components/services.tsx

---
 components/services.tsx | 86 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 86 insertions(+)
 create mode 100644 components/services.tsx

diff --git a/components/services.tsx b/components/services.tsx
new file mode 100644
index 0000000..ba2bab3
--- /dev/null
+++ b/components/services.tsx
@@ -0,0 +1,86 @@
+"use client";
+import { Container } from "@/components/container";
+import { Heading } from "@/components/heading";
+import { Subheading } from "@/components/subheading";
+import { Card, CardHeader, CardTitle, CardDescription } from "@/components/ui/card";
+import { 
+  Cpu, 
+  FileDigit, 
+  ShieldCheck, 
+  Globe, 
+  Smartphone, 
+  Cloud, 
+  ReceiptText, 
+  PartyPopper 
+} from "lucide-react";
+
+const services = [
+  {
+    title: "Predator AI Solutions",
+    description: "Powerful AI-driven systems that automate operations, analyze data, and help you make faster, smarter decisions.",
+    icon: <Cpu className="w-8 h-8 text-primary" />,
+  },
+  {
+    title: "Digital Transformation",
+    description: "We turn paper into secure digital assets. From IDs and certificates to official records, we digitize, manage, and protect your documents.",
+    icon: <FileDigit className="w-8 h-8 text-primary" />,
+  },
+  {
+    title: "Advanced Security Services",
+    description: "End-to-end security solutions including smart CCTV, professional management, trained officers, and dedicated vehicles.",
+    icon: <ShieldCheck className="w-8 h-8 text-primary" />,
+  },
+  {
+    title: "Web Design",
+    description: "Modern, secure, and high-performance websites that build trust, strengthen your brand, and convert visitors into customers.",
+    icon: <Globe className="w-8 h-8 text-primary" />,
+  },
+  {
+    title: "App Development",
+    description: "Custom mobile and web applications designed to simplify workflows, improve control, and enhance user experience.",
+    icon: <Smartphone className="w-8 h-8 text-primary" />,
+  },
+  {
+    title: "Cloud Services",
+    description: "Reliable and secure cloud solutions for data storage, backups, and system management—accessible anytime, anywhere.",
+    icon: <Cloud className="w-8 h-8 text-primary" />,
+  },
+  {
+    title: "Tax Filing Services",
+    description: "Stress-free tax preparation and filing for individuals and companies, ensuring accuracy, compliance, and peace of mind.",
+    icon: <ReceiptText className="w-8 h-8 text-primary" />,
+  },
+  {
+    title: "Event & Party Security",
+    description: "Professional security planning and on-site management for events and private gatherings—safety handled professionally.",
+    icon: <PartyPopper className="w-8 h-8 text-primary" />,
+  },
+];
+
+export function Services() {
+  return (
+    <section id="services" className="py-20 bg-neutral-50">
+      <Container>
+        <div className="text-center mb-16">
+          <Heading>Our Services</Heading>
+          <Subheading className="mt-4">
+            Comprehensive solutions tailored to your business needs.
+          </Subheading>
+        </div>
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
+          {services.map((service, index) => (
+            <Card key={index} className="border-none shadow-sm hover:shadow-md transition-shadow">
+              <CardHeader>
+                <div className="mb-4">{service.icon}</div>
+                <CardTitle className="text-xl">{service.title}</CardTitle>
+                <CardDescription className="text-neutral-600 mt-2">
+                  {service.description}
+                </CardDescription>
+              </CardHeader>
+            </Card>
+          ))}
+        </div>
+      </Container>
+    </section>
+  );
+}