{item.title}
+ {item.intro && ( +{item.intro}
+ )} +{item.content}
+
-
- {/* =========================================================
- A. LOGO DE LA MARQUE
- ========================================================= */}
-
+ {/* Logo gaea21 ramenant à l'accueil */}
+
-
+
- {/* =========================================================
- B. BOUTON BURGER (Affiché uniquement sur écrans mobiles)
- ========================================================= */}
+ {/* Bouton burger mobile */}
- {/* =========================================================
- C. MENU DE NAVIGATION (DESKTOP & TIROIR MOBILE)
- ========================================================= */}
- {/*
- La classe 'open' est ajoutée conditionnellement pour déclencher
- l'apparition du tiroir de navigation en version mobile.
- */}
+ {/* Navigation principale */}
-
- {/*
- A. EN-TÊTE DU SITE
- Balise délimite le cœur informationnel unique de la page d'accueil.
- */}
+
- {/* Bannière d'introduction */}
-
-
);
}
\ No newline at end of file
diff --git a/assets/components/HuitTrajectoires.jsx b/assets/components/HuitTrajectoires.jsx
new file mode 100644
index 0000000..c7cb838
--- /dev/null
+++ b/assets/components/HuitTrajectoires.jsx
@@ -0,0 +1,80 @@
+import React from 'react';
+import heroTrajectoireImg from '../img/img-traject-banner.png';
+import HuitTrajectoires from './HuitTrajectoires';
+import HumanEmploymentModel from './HumanEmploymentModel';
+import MethodologieEtapes from './MethodologieEtapes';
+import LearningByDoing from './LearningByDoing';
+import ExemplesProjets from './ExemplesProjets';
+import CompetencesEvoluer from './CompetencesEvoluer';
+import '../styles/trajectoire.css';
+
+export default function ConstruireTrajectoire() {
+ return (
+
+ {/* 1. Hero */}
+
+
+
+
+ {/* 2. Questionnaire Intro */}
+
+
+
+ {/* 3. Les 8 Trajectoires */}
+
+ );
+}
\ No newline at end of file
diff --git a/assets/components/HumanEmploymentModel.jsx b/assets/components/HumanEmploymentModel.jsx
new file mode 100644
index 0000000..a8150a7
--- /dev/null
+++ b/assets/components/HumanEmploymentModel.jsx
@@ -0,0 +1,70 @@
+import React from 'react';
+import '../styles/human-employment.css';
+import hemImg from '../img/human-model-banner.png'; // Adapte le nom de ton image
+
+const PILLIERS_DATA = [
+ {
+ id: 1,
+ title: "La personne",
+ items: ["Ses aspirations.", "Ses motivations.", "Ses besoins.", "Ses valeurs."]
+ },
+ {
+ id: 2,
+ title: "Les compétences",
+ items: ["Celles qu'elle possède déjà.", "Celles qu'elle doit développer."]
+ },
+ {
+ id: 3,
+ title: "L'expérience",
+ items: ["Les projets.", "Les réalisations.", "Les responsabilités."]
+ },
+ {
+ id: 4,
+ title: "Le réseau",
+ items: ["Ses aspirations.", "Ses motivations.", "Ses besoins.", "Ses valeurs."]
+ }
+];
+
+export default function HumanEmploymentModel() {
+ return (
+
+
+
+
+ Construire sa
+
+
+ Construire sa
+ trajectoire.
+
+
+
+
+ Parfois, nous savons exactement où nous voulons aller.
+Parfois, nous savons simplement que nous ne pouvons plus rester là où nous sommes.
+Depuis plus de vingt ans, gaea21 accompagne les personnes dans ces moments de transition, d'évolution et de construction.
+Non pas en leur proposant une solution unique.
+
+
+ Trouvons ensemble la trajectoire qui vous correspond
+
+
+ + Répondez à quelques questions. +
+
+
+ Commencer
+
+
+
+
+ {/* Paragraphe descriptif */}
+
+ + Chaque parcours est unique et ne peut pas se réduire à un simple intitulé de poste. + Nous considérons que les trajectoires durables se construisent lorsque quatre dimensions essentielles s'articulent. +
+ + {/* Grille forcée sur 4 colonnes */} +
+ {PILLIERS_DATA.map((p) => (
+
+
+ {/* Phrase d'accroche */}
+
+
+ ))}
+ {p.title}
+-
+ {p.items.map((it, idx) => (
+
- {it} + ))} +
+ C’est cette approche que nous appelons le Human Employment Model. +
+ + {/* Cadre de l'image */} +
+ 
+
+
+
+
+ {/* Trait vert au-dessus */}
+
+
+ {/* Surtitre */}
+ Les trajectoires
+
+ {/* Titre principal */}
+
+ + Le Learning by Doing au cœur de l'expérience. +
+ + {/* Paragraphe descriptif conforme au Figma */} ++ Depuis plus de vingt ans, gaea21 accompagne les personnes dans ces moments de transition, d'évolution et de construction. + Non pas en leur proposant une solution unique, mais en les aidant à comprendre leur situation, identifier leurs forces, + développer leurs compétences, acquérir de l'expérience et construire une trajectoire cohérente avec leurs aspirations et la réalité du monde qui les entoure. +
+ + {/* Image bannière arrondie */} +
+ 
+
+
+
+
+
+ {ETAPES_DATA.map((item) => (
+
+
+
+ {/* Conteneur cercle + badge numéro */}
+
+ ))}
+
+
+
+ {/* Titre et description */}
+
+ 
+
+ {item.step}
+ {item.title}
+{item.description}
+ +