feat: add src/components/Services.tsx
This commit is contained in:
parent
a81ee8e4d0
commit
0a34c7ed10
|
|
@ -0,0 +1,143 @@
|
||||||
|
"use client";
|
||||||
|
|
||||||
|
import {
|
||||||
|
Briefcase,
|
||||||
|
GraduationCap,
|
||||||
|
Users,
|
||||||
|
HeartHandshake,
|
||||||
|
FileText,
|
||||||
|
TrendingUp,
|
||||||
|
} from "lucide-react";
|
||||||
|
|
||||||
|
const services = [
|
||||||
|
{
|
||||||
|
icon: Briefcase,
|
||||||
|
title: "Placement Professionnel",
|
||||||
|
description:
|
||||||
|
"Accédez à notre réseau exclusif de 450+ entreprises partenaires qui valorisent les compétences militaires : leadership, rigueur, gestion du stress.",
|
||||||
|
tags: ["CDI / CDD", "Mission", "Cadre / Non-cadre"],
|
||||||
|
color: "text-french-blue",
|
||||||
|
bg: "bg-blue-50",
|
||||||
|
border: "border-blue-100",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: GraduationCap,
|
||||||
|
title: "Formations Certifiantes",
|
||||||
|
description:
|
||||||
|
"Obtenez des certifications reconnues dans les secteurs de la sécurité, de la logistique, du management, de l'informatique et bien plus.",
|
||||||
|
tags: ["Financement OPCO", "À distance / Présentiel", "Diplômes reconnus"],
|
||||||
|
color: "text-military-green",
|
||||||
|
bg: "bg-green-50",
|
||||||
|
border: "border-green-100",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: FileText,
|
||||||
|
title: "CV & Bilan de compétences",
|
||||||
|
description:
|
||||||
|
"Nos experts 'traduisent' votre parcours militaire en langage civil. CV percutant, lettre de motivation et bilan de compétences personnalisé.",
|
||||||
|
tags: ["Bilan personnalisé", "CV optimisé", "Lettre de motivation"],
|
||||||
|
color: "text-gold",
|
||||||
|
bg: "bg-yellow-50",
|
||||||
|
border: "border-yellow-100",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: HeartHandshake,
|
||||||
|
title: "Accompagnement Psychologique",
|
||||||
|
description:
|
||||||
|
"Transition difficile ? Nos psychologues spécialisés vous accompagnent pour préserver votre santé mentale et traverser cette période de changement.",
|
||||||
|
tags: ["Confidentiel", "Psychologues militaires", "Suivi régulier"],
|
||||||
|
color: "text-french-red",
|
||||||
|
bg: "bg-red-50",
|
||||||
|
border: "border-red-100",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Users,
|
||||||
|
title: "Réseau Anciens Militaires",
|
||||||
|
description:
|
||||||
|
"Rejoignez une communauté de 12 000 anciens militaires. Entraide, mentoring, événements networking et offres d'emploi en avant-première.",
|
||||||
|
tags: ["Mentorat", "Événements", "Forum privé"],
|
||||||
|
color: "text-purple-600",
|
||||||
|
bg: "bg-purple-50",
|
||||||
|
border: "border-purple-100",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: TrendingUp,
|
||||||
|
title: "Création d'Entreprise",
|
||||||
|
description:
|
||||||
|
"Vous souhaitez entreprendre ? Nous vous guidons : business plan, financement (ACRE, prêt militaire), accompagnement juridique et comptable.",
|
||||||
|
tags: ["Business plan", "Financement ACRE", "Coaching entrepreneur"],
|
||||||
|
color: "text-orange-600",
|
||||||
|
bg: "bg-orange-50",
|
||||||
|
border: "border-orange-100",
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function Services() {
|
||||||
|
return (
|
||||||
|
<section id="services" className="py-24 bg-cream">
|
||||||
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
|
{/* Header */}
|
||||||
|
<div className="text-center mb-16">
|
||||||
|
<p className="text-french-red text-sm font-semibold tracking-widest uppercase mb-3">
|
||||||
|
Ce que nous faisons
|
||||||
|
</p>
|
||||||
|
<h2 className="section-title">
|
||||||
|
Des services conçus{" "}
|
||||||
|
<span className="text-military-green">pour vous</span>
|
||||||
|
</h2>
|
||||||
|
<p className="section-subtitle">
|
||||||
|
Chaque militaire a un parcours unique. Nos services s'adaptent à
|
||||||
|
votre grade, votre spécialité et vos ambitions.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Grid */}
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||||
|
{services.map((service) => (
|
||||||
|
<div
|
||||||
|
key={service.title}
|
||||||
|
className={`card p-8 group cursor-default ${service.border} hover:border-military-green/30`}
|
||||||
|
>
|
||||||
|
{/* Icon */}
|
||||||
|
<div
|
||||||
|
className={`inline-flex items-center justify-center w-14 h-14 rounded-lg ${service.bg} mb-6`}
|
||||||
|
>
|
||||||
|
<service.icon className={`w-7 h-7 ${service.color}`} />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Content */}
|
||||||
|
<h3 className="font-serif text-xl font-bold text-military-dark mb-3 group-hover:text-military-green transition-colors">
|
||||||
|
{service.title}
|
||||||
|
</h3>
|
||||||
|
<p className="text-gray-600 text-sm leading-relaxed mb-5">
|
||||||
|
{service.description}
|
||||||
|
</p>
|
||||||
|
|
||||||
|
{/* Tags */}
|
||||||
|
<div className="flex flex-wrap gap-2">
|
||||||
|
{service.tags.map((tag) => (
|
||||||
|
<span
|
||||||
|
key={tag}
|
||||||
|
className="text-xs font-medium px-3 py-1 bg-gray-100 text-gray-600 rounded-full"
|
||||||
|
>
|
||||||
|
{tag}
|
||||||
|
</span>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Bottom CTA */}
|
||||||
|
<div className="text-center mt-14">
|
||||||
|
<p className="text-gray-600 mb-4">
|
||||||
|
Vous ne savez pas par où commencer ?
|
||||||
|
</p>
|
||||||
|
<a href="#contact" className="btn-primary inline-block">
|
||||||
|
Obtenir un entretien gratuit
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
);
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue