"use client";

import { SiteFrame, SiteLang, useSiteFrame } from "../components/SiteFrame";

type Area = { icon: string; title: string; objective: string; groups: { title: string; items: string[] }[] };

const areas: Record<SiteLang, Area[]> = {
  ar: [
    { icon: "↗", title: "تطوير الكفاءات", objective: "تكوينات عملية تستجيب لحاجيات سوق الشغل والمقاولات ورواد الأعمال.", groups: [
      { title: "التدبير والقيادة", items: ["القيادة", "تدبير الفرق", "تدبير النزاعات", "التواصل المهني", "التحدث أمام الجمهور"] },
      { title: "ريادة الأعمال", items: ["إنشاء المقاولة", "Business Model Canvas", "Business Plan", "دراسة السوق", "البحث عن التمويل", "Pitch المستثمرين", "التطوير التجاري"] },
      { title: "التدبير والمالية", items: ["المحاسبة", "التدبير المالي", "التحليل المالي", "مراقبة التسيير", "الجبايات"] },
      { title: "الموارد البشرية", items: ["تدبير الموارد البشرية", "التوظيف", "GPEC", "قانون الشغل", "تقييم الأداء"] },
      { title: "التسويق والتواصل", items: ["التسويق الرقمي", "Community Management", "Facebook Ads", "LinkedIn", "Google Ads", "Branding", "Copywriting"] },
      { title: "المعلوميات والتحول الرقمي", items: ["الذكاء الاصطناعي", "تطوير الويب", "Python", "المعلوميات المكتبية", "Excel المتقدم", "Power BI", "الأمن السيبراني"] },
      { title: "الجودة والسلامة والبيئة", items: ["QHSE", "Animateur HSE", "Superviseur HSE", "التدقيق الداخلي ISO", "نظام التدبير المندمج"] },
    ] },
    { icon: "◆", title: "مواكبة ريادة الأعمال", objective: "تحويل الفكرة إلى مشروع قابل للإطلاق والنمو والاستمرار.", groups: [
      { title: "من الفكرة إلى الإطلاق", items: ["التشخيص المقاولاتي", "مواكبة إنشاء المقاولة", "دراسات الجدوى", "إعداد Business Plan", "البحث عن التمويل", "Coaching مقاولاتي"] },
      { title: "النمو والاستدامة", items: ["مواكبة التعاونيات", "مواكبة المقاولين الذاتيين", "التطوير التجاري", "رقمنة الأنشطة", "التتبع بعد الإنشاء"] },
    ] },
    { icon: "◎", title: "الاستشارة للمقاولات", objective: "تحسين أداء المؤسسة وقدرتها على التنظيم والتنافس.", groups: [
      { title: "التشخيص والاستراتيجية", items: ["التشخيص التنظيمي", "Audit RH", "Audit QHSE", "إعداد الخطط الاستراتيجية", "إعداد مخططات التكوين"] },
      { title: "التحول والأداء", items: ["التنظيم والمساطر", "التحول الرقمي", "مواكبة التغيير", "إرساء أنظمة الجودة", "Coaching المسيرين"] },
    ] },
    { icon: "✦", title: "مواكبة الجمعيات والتعاونيات", objective: "تقوية الحكامة والقدرات وتطوير المشاريع والموارد.", groups: [
      { title: "الحكامة والتدبير", items: ["الحكامة الجمعوية", "تقوية القدرات", "التدبير المالي", "تدبير الشراكات", "التتبع والتقييم"] },
      { title: "المشاريع والموارد", items: ["إعداد المشاريع", "البحث عن التمويلات", "التواصل المؤسساتي", "تعبئة الموارد", "تنمية الاقتصاد الاجتماعي والتضامني"] },
    ] },
    { icon: "✓", title: "VAE والتطور المهني", objective: "تثمين الكفاءات المكتسبة وتوجيه المسار نحو الشهادة المناسبة.", groups: [
      { title: "الاعتراف بالكفاءات", items: ["الإخبار والتوجيه", "تشخيص المسار", "تحليل الكفاءات", "إعداد ملفات VAE", "التحضير لمقابلات اللجان", "Validation des Acquis Professionnels (VAP)"] },
      { title: "التطور المهني", items: ["حصيلة الكفاءات", "Coaching مهني", "التوجيه نحو الدبلومات والشهادات"] },
    ] },
    { icon: "▶", title: "منصة التكوين عن بُعد", objective: "تطوير عرض تكويني رقمي يمكن الولوج إليه من أي مكان.", groups: [
      { title: "التعلّم المرن", items: ["فيديوهات تعليمية", "فصول افتراضية", "دعامات قابلة للتحميل", "منتديات تبادل"] },
      { title: "التطبيق والتقييم", items: ["اختبارات تفاعلية", "دراسات حالة", "تمارين تطبيقية", "تقييم مستمر", "Coaching فردي", "شهادات رقمية"] },
    ] },
    { icon: "●", title: "التواصل الرقمي والمحتوى الخبير", objective: "بناء حضور رقمي موثوق يحوّل الخبرة إلى معرفة مفيدة ومجتمع متفاعل.", groups: [
      { title: "القنوات", items: ["Facebook", "Instagram", "LinkedIn", "TikTok", "YouTube", "WhatsApp Business"] },
      { title: "المحتوى", items: ["فيديوهات قصيرة", "شهادات وتجارب", "مقابلات خبراء", "Webinaires", "Podcasts", "مقالات", "Newsletters"] },
    ] },
  ],
  fr: [
    { icon: "↗", title: "Développement des compétences", objective: "Des formations pratiques alignées sur les besoins du marché, des entreprises et des entrepreneurs.", groups: [{ title: "Management et leadership", items: ["Leadership", "Management d’équipe", "Gestion des conflits", "Communication professionnelle", "Prise de parole en public"] }, { title: "Entrepreneuriat", items: ["Création d’entreprise", "Business Model Canvas", "Business Plan", "Étude de marché", "Recherche de financement", "Pitch investisseurs", "Développement commercial"] }, { title: "Gestion et finance", items: ["Comptabilité", "Gestion financière", "Analyse financière", "Contrôle de gestion", "Fiscalité"] }, { title: "Ressources humaines", items: ["Gestion RH", "Recrutement", "GPEC", "Droit social", "Évaluation des performances"] }, { title: "Marketing et communication", items: ["Marketing digital", "Community Management", "Facebook Ads", "LinkedIn", "Google Ads", "Branding", "Copywriting"] }, { title: "Informatique et transformation digitale", items: ["Intelligence artificielle", "Développement Web", "Python", "Bureautique", "Excel avancé", "Power BI", "Cybersécurité"] }, { title: "Qualité, sécurité et environnement", items: ["QHSE", "Animateur HSE", "Superviseur HSE", "Auditeur interne ISO", "Management intégré"] }] },
    { icon: "◆", title: "Accompagnement entrepreneurial", objective: "Transformer une idée en activité viable, finançable et durable.", groups: [{ title: "De l’idée au lancement", items: ["Diagnostic entrepreneurial", "Création d’entreprise", "Études de faisabilité", "Business Plan", "Recherche de financement", "Coaching entrepreneurial"] }, { title: "Croissance et pérennité", items: ["Accompagnement des coopératives", "Accompagnement des auto-entrepreneurs", "Développement commercial", "Digitalisation des activités", "Suivi post-création"] }] },
    { icon: "◎", title: "Conseil aux entreprises", objective: "Améliorer l’organisation, la performance et la compétitivité.", groups: [{ title: "Diagnostic et stratégie", items: ["Diagnostic organisationnel", "Audit RH", "Audit QHSE", "Plans stratégiques", "Plans de formation"] }, { title: "Transformation et performance", items: ["Organisation et procédures", "Transformation digitale", "Conduite du changement", "Systèmes qualité", "Coaching des dirigeants"] }] },
    { icon: "✦", title: "Associations et coopératives", objective: "Renforcer la gouvernance, les capacités, les projets et les ressources.", groups: [{ title: "Gouvernance et gestion", items: ["Gouvernance associative", "Renforcement des capacités", "Gestion financière", "Gestion des partenariats", "Suivi-évaluation"] }, { title: "Projets et ressources", items: ["Élaboration de projets", "Recherche de financements", "Communication institutionnelle", "Mobilisation des ressources", "Économie sociale et solidaire"] }] },
    { icon: "✓", title: "VAE et évolution professionnelle", objective: "Valoriser les compétences acquises et orienter le parcours vers la certification adaptée.", groups: [{ title: "Reconnaissance des compétences", items: ["Information et orientation", "Diagnostic de parcours", "Analyse des compétences", "Dossiers VAE", "Préparation aux jurys", "Validation des Acquis Professionnels (VAP)"] }, { title: "Évolution professionnelle", items: ["Bilan de compétences", "Coaching de carrière", "Orientation vers les diplômes et certifications"] }] },
    { icon: "▶", title: "Plateforme de formation en ligne", objective: "Développer une offre de formation digitale accessible partout.", groups: [{ title: "Apprentissage flexible", items: ["Vidéos pédagogiques", "Classes virtuelles", "Supports téléchargeables", "Forums d’échange"] }, { title: "Pratique et validation", items: ["Quiz interactifs", "Études de cas", "Exercices pratiques", "Coaching individuel", "Évaluation continue", "Certificats numériques"] }] },
    { icon: "●", title: "Communication digitale et contenu expert", objective: "Transformer l’expertise en présence digitale utile, crédible et engageante.", groups: [{ title: "Canaux", items: ["Facebook", "Instagram", "LinkedIn", "TikTok", "YouTube", "WhatsApp Business"] }, { title: "Contenus", items: ["Capsules vidéo", "Témoignages", "Interviews", "Webinaires", "Podcasts", "Articles", "Newsletters"] }] },
  ],
  en: [],
  zgh: [],
};

areas.en = [
  { icon: "↗", title: "Skills development", objective: "Provide practical training aligned with labor-market, company and entrepreneur needs.", groups: [
    { title: "Management and leadership", items: ["Leadership", "Team management", "Conflict management", "Professional communication", "Public speaking"] },
    { title: "Entrepreneurship", items: ["Business creation", "Business Model Canvas", "Business Plan", "Market research", "Fundraising", "Investor pitch", "Business development"] },
    { title: "Management and finance", items: ["Accounting", "Financial management", "Financial analysis", "Management control", "Taxation"] },
    { title: "Human resources", items: ["HR management", "Recruitment", "Workforce planning", "Employment law", "Performance assessment"] },
    { title: "Marketing and communication", items: ["Digital marketing", "Community Management", "Facebook Ads", "LinkedIn", "Google Ads", "Branding", "Copywriting"] },
    { title: "IT and digital transformation", items: ["Artificial intelligence", "Web development", "Python", "Office tools", "Advanced Excel", "Power BI", "Cybersecurity"] },
    { title: "Quality, safety and environment", items: ["QHSE", "HSE facilitator", "HSE supervisor", "Internal ISO auditor", "Integrated management"] },
  ] },
  { icon: "◆", title: "Entrepreneurship support", objective: "Turn an idea into a sustainable, fundable business.", groups: [{ title: "From idea to launch", items: ["Entrepreneurial diagnosis", "Business creation", "Feasibility studies", "Business Plan", "Fundraising", "Entrepreneurial coaching"] }, { title: "Growth and sustainability", items: ["Cooperative support", "Self-employed support", "Business development", "Activity digitization", "Post-creation follow-up"] }] },
  { icon: "◎", title: "Business consulting", objective: "Improve organizational performance and competitiveness.", groups: [{ title: "Diagnosis and strategy", items: ["Organizational diagnosis", "HR audit", "QHSE audit", "Strategic plans", "Training plans"] }, { title: "Transformation and performance", items: ["Organization and procedures", "Digital transformation", "Change management", "Quality systems", "Executive coaching"] }] },
  { icon: "✦", title: "Associations and cooperatives", objective: "Strengthen governance, capabilities, projects and resources.", groups: [{ title: "Governance and management", items: ["Associative governance", "Capacity building", "Financial management", "Partnership management", "Monitoring and evaluation"] }, { title: "Projects and resources", items: ["Project design", "Fundraising", "Institutional communication", "Resource mobilization", "Social and solidarity economy"] }] },
  { icon: "✓", title: "VAE and career development", objective: "Secure official recognition of skills and access to suitable qualifications.", groups: [{ title: "Skills recognition", items: ["Information and guidance", "Career diagnosis", "Skills analysis", "VAE portfolios", "Panel preparation", "Validation of Professional Experience (VAP)"] }, { title: "Career development", items: ["Skills assessment", "Career coaching", "Qualification guidance"] }] },
  { icon: "▶", title: "Online learning platform", objective: "Develop a digital training offer accessible from anywhere.", groups: [{ title: "Flexible learning", items: ["Educational videos", "Virtual classes", "Downloadable resources", "Discussion forums"] }, { title: "Practice and assessment", items: ["Interactive quizzes", "Case studies", "Practical exercises", "Individual coaching", "Continuous assessment", "Digital certificates"] }] },
  { icon: "●", title: "Digital communication and expert content", objective: "Turn expertise into a useful, credible and engaging digital presence.", groups: [{ title: "Channels", items: ["Facebook", "Instagram", "LinkedIn", "TikTok", "YouTube", "WhatsApp Business"] }, { title: "Content", items: ["Video capsules", "Testimonials", "Expert interviews", "Webinars", "Podcasts", "Blog articles", "Newsletters"] }] },
];
areas.zgh = areas.fr;

const copy = {
  ar: { kicker: "مجالات خبرتنا", title: "خبرات متعددة، شريك واحد، ومسار مصمم على قياس حاجتك", body: "اكتشف منظومة Compétences+ كاملة. افتح كل مجال لرؤية الحلول، ثم تواصل معنا لتصميم المواكبة المناسبة.", objective: "الهدف", services: "الخدمات", ask: "اطلب معلومات", cta: "ما لقيتيش الحل بالضبط؟", ctaBody: "شرح لينا الهدف أو التحدي ديالك، ونبني لك مساراً يجمع أكثر من خبرة عند الحاجة.", ctaButton: "اطلب تشخيصاً أولياً" },
  fr: { kicker: "Nos expertises", title: "Plusieurs expertises, un seul partenaire, un parcours sur mesure", body: "Explorez l’écosystème complet de Compétences+. Ouvrez chaque domaine, puis échangez avec nous pour construire la solution adaptée.", objective: "Objectif", services: "Solutions", ask: "Demander des informations", cta: "Votre besoin traverse plusieurs domaines ?", ctaBody: "Présentez-nous votre objectif ou votre défi ; nous construirons un parcours transversal et cohérent.", ctaButton: "Demander un diagnostic" },
  en: { kicker: "Our expertise", title: "Multiple capabilities, one partner, one tailored pathway", body: "Explore the complete Compétences+ ecosystem and discover the right combination of services for your goal.", objective: "Objective", services: "Solutions", ask: "Ask about this area", cta: "Does your need span several areas?", ctaBody: "Tell us your objective or challenge and we will design a coherent cross-functional pathway.", ctaButton: "Request a diagnosis" },
  zgh: { kicker: "ⵉⴳⵔⴰⵏ ⵏⵏⵖ", title: "ⴰⵟⵟⴰⵙ ⵏ ⵜⵎⵓⵙⵙⵏⵉⵡⵉⵏ، ⵢⴰⵏ ⵓⵎⵛⵛⵉⵡⵍ", body: "ⵙⵙⵏ ⵉⴳⵔⴰⵏ ⴽⵓⵍⵍⵓ ⵏ Compétences+.", objective: "ⵉⵙⵡⵉ", services: "ⵜⵉⴼⵔⴰⵜⵉⵏ", ask: "ⵜⵜⵔ ⵜⴰⵍⵖⵓⵜ", cta: "ⵜⴰⵃⵡⴰⵊⵜ ⵏⵏⴽ ⵜⵙⵙⴰⵡⴰⴹ؟", ctaBody: "ⵎⵍ ⴰⵏⵖ ⵉⵙⵡⵉ ⵏⵏⴽ.", ctaButton: "ⵜⵜⵔ ⴰⵙⵙⵉⵔⵎ" },
} as const;

function ExpertiseContent() {
  const { lang } = useSiteFrame();
  const t = copy[lang];
  return (
    <main>
      <section className="subhero expertise-hero">
        <div className="container subhero-grid">
          <div><a className="back-link" href="/">← Compétences+</a><span className="badge"><i />{t.kicker}</span><h1>{t.title}</h1><p>{t.body}</p></div>
          <div className="expertise-compass"><span>+</span><div>360°<small>Compétences+</small></div></div>
        </div>
      </section>
      <section className="section soft">
        <div className="container expertise-page-grid">
          {areas[lang].map((area, index) => (
            <article className="expertise-page-card" key={area.title}>
              <div className="expertise-card-top"><span className="expertise-index">{String(index + 1).padStart(2, "0")}</span><i>{area.icon}</i></div>
              <h2>{area.title}</h2>
              <p><b>{t.objective}</b> — {area.objective}</p>
              <div className="expertise-groups">{area.groups.map((group) => <div key={group.title}><h3>{group.title}</h3><div>{group.items.map((item) => <span key={item}>{item}</span>)}</div></div>)}</div>
              <a className="expertise-contact" target="_blank" rel="noreferrer" href={`https://wa.me/212668217313?text=${encodeURIComponent(`${lang === "ar" ? "السلام عليكم، بغيت معلومات على" : "Bonjour, je souhaite des informations sur"} ${area.title}`)}`}>{t.ask} ↗</a>
            </article>
          ))}
        </div>
      </section>
      <section className="cta"><div className="container"><div><span>Compétences+ 360°</span><h2>{t.cta}</h2><p>{t.ctaBody}</p></div><a className="button white" href="/#simulator">{t.ctaButton}</a></div></section>
    </main>
  );
}

export default function ExpertisePage() { return <SiteFrame><ExpertiseContent /></SiteFrame>; }