123 lines
3.9 KiB
TypeScript
123 lines
3.9 KiB
TypeScript
"use client";
|
|
import { motion } from "framer-motion";
|
|
import {
|
|
Sparkles,
|
|
Layers,
|
|
BarChart3,
|
|
Users,
|
|
CheckCircle2,
|
|
ShieldCheck,
|
|
Workflow,
|
|
LineChart,
|
|
WorkflowIcon,
|
|
} from "lucide-react";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
const FEATURES_DATA = [
|
|
{
|
|
icon: Users,
|
|
title: "Smart Candidate Management",
|
|
description:
|
|
"Track candidates effortlessly with pipeline stages, auto tagging & resume parsing.",
|
|
},
|
|
{
|
|
icon: Layers,
|
|
title: "Unified ATS + CRM Platform",
|
|
description:
|
|
"Manage hiring, leads & clients under one powerful and connected workspace.",
|
|
},
|
|
{
|
|
icon: CheckCircle2,
|
|
title: "Automated Workflows",
|
|
description:
|
|
"Reduce manual tasks with automated approvals, reminders & email triggers.",
|
|
},
|
|
{
|
|
icon: WorkflowIcon,
|
|
title: "Task & Team Collaboration",
|
|
description:
|
|
"Assign tasks, manage roles, and collaborate with real-time updates.",
|
|
},
|
|
{
|
|
icon: ShieldCheck,
|
|
title: "Role-Based Access",
|
|
description:
|
|
"Secure & compliant access controls to protect sensitive data.",
|
|
},
|
|
{
|
|
icon: BarChart3,
|
|
title: "Analytics & Insights",
|
|
description:
|
|
"Get real-time dashboards for hiring performance and revenue growth.",
|
|
},
|
|
];
|
|
|
|
export default function FeaturesPage() {
|
|
return (
|
|
<main className="bg-white">
|
|
{/* HERO */}
|
|
<section className="py-24 text-center px-6 bg-gradient-to-b from-white to-blue-50">
|
|
<motion.h1
|
|
initial={{ opacity: 0, y: 20 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
className="text-4xl md:text-6xl font-extrabold text-gray-900"
|
|
>
|
|
Powerful Features to Turbocharge Your{" "}
|
|
<span className="bg-gradient-to-r from-blue-600 to-purple-600 bg-clip-text text-transparent">
|
|
Hiring & CRM
|
|
</span>
|
|
</motion.h1>
|
|
<p className="mt-4 text-lg text-gray-600 max-w-2xl mx-auto">
|
|
Everything you need to streamline recruitment, manage clients and
|
|
scale your business — all in one platform.
|
|
</p>
|
|
</section>
|
|
|
|
{/* FEATURE GRID */}
|
|
<section className="py-20 px-6 max-w-7xl mx-auto">
|
|
<motion.div
|
|
initial={{ opacity: 0 }}
|
|
whileInView={{ opacity: 1 }}
|
|
className="grid sm:grid-cols-2 lg:grid-cols-3 gap-10"
|
|
>
|
|
{FEATURES_DATA.map((feature, i) => (
|
|
<motion.div
|
|
key={i}
|
|
initial={{ opacity: 0, y: 30 }}
|
|
whileInView={{ opacity: 1, y: 0 }}
|
|
transition={{ delay: i * 0.1 }}
|
|
className="p-8 bg-white rounded-3xl border shadow-sm hover:shadow-xl transition-all duration-300 hover:-translate-y-2"
|
|
>
|
|
<div className="w-14 h-14 rounded-xl bg-gradient-to-br from-blue-500 to-purple-600 text-white flex items-center justify-center shadow-md mb-5">
|
|
<feature.icon className="w-7 h-7" />
|
|
</div>
|
|
<h3 className="text-xl font-semibold text-gray-900 mb-2">
|
|
{feature.title}
|
|
</h3>
|
|
<p className="text-gray-600">{feature.description}</p>
|
|
</motion.div>
|
|
))}
|
|
</motion.div>
|
|
</section>
|
|
|
|
{/* CTA STRIP */}
|
|
<section className="py-20 bg-gradient-to-r from-blue-700 to-purple-700 text-white text-center px-6">
|
|
<motion.h2
|
|
initial={{ opacity: 0, scale: 0.95 }}
|
|
whileInView={{ opacity: 1, scale: 1 }}
|
|
className="text-3xl md:text-4xl font-bold mb-4"
|
|
>
|
|
Experience The Future of Hiring & Client Management
|
|
</motion.h2>
|
|
<p className="text-lg max-w-2xl mx-auto opacity-90 mb-8">
|
|
Try Winixco now and transform the way your business grows.
|
|
</p>
|
|
|
|
<Button size="lg" className="text-lg bg-white text-blue-700 hover:bg-blue-100">
|
|
Book a Live Demo
|
|
</Button>
|
|
</section>
|
|
</main>
|
|
);
|
|
}
|