// 1. IMPORTATION DES DÉPENDANCES ET COMPOSANTS ENFANTS
import React from 'react';

// Barre de navigation supérieure (Logo, Liens, Boutons d'action)
import Header from './Header';

// Section d'accroche principale (Titre fort, boutons d'appel à l'action, visuel héroïque)
import Hero from './Hero';

// Cartes des profils cibles ("Qui êtes-vous ?") : Individus, Entreprises, Institutions, etc.
import ProfileCards from './ProfileCards';

// Section explicative de la méthodologie ("Comment ça fonctionne ?") en 6 étapes + chiffres clés
import Methodology from './Methodology';

// Section de preuve d'impact chiffrée avec fond immersif et carrousel
import Impact from './Impact';

// Section actualités : événements, articles, publications et formulaire de newsletter intermédiaire
import ActualitySection from './ActualitySection';

// Section opportunités et carrières ("Construire des trajectoires, pas seulement des emplois")
import CareersSection from './CareersSection';

// Pied de page complet (Navigation secondaire, réseaux sociaux, newsletter pleine largeur, mentions légales)
import Footer from './Footer';

/**
 * 2. COMPOSANT RACINE DE LA PAGE D'ACCUEIL : Home
 * 
 * Rôle architectural :
 * - Sert de page principale (Page Component / Container) orchestrant la disposition verticale
 *   de toutes les sections de la page d'accueil de gaea21.
 * - Assure une hiérarchie sémantique HTML5 claire pour le référencement (SEO) et l'accessibilité.
 */
export default function Home() {
    return (
        /* 
          CONTENEUR GLOBAL DE PAGE :
          - relative : sert de référentiel de positionnement pour d'éventuels éléments absolus.
          - min-h-screen : garantit que la page couvre au minimum 100% de la hauteur de la fenêtre (évite les fonds blancs coupés).
          - bg-white : couleur de fond par défaut pour l'ensemble du site.
          - overflow-x-hidden : masque tout débordement horizontal causé par des animations, des bannières pleine largeur ou des marges négatives.
        */
        <div className="relative min-h-screen bg-white overflow-x-hidden">

            {/* 
        A. EN-TÊTE DU SITE
        Balise <Header /> contenant la navigation principale fixée ou relative en haut de page.
      */}
            <Header />

            {/* 
        B. CONTENU PRINCIPAL DE LA PAGE
        La balise sémantique HTML5 <main> délimite le cœur informationnel unique de la page d'accueil.
      */}
            <main>
                {/* Bannière d'introduction */}
                <Hero />

                {/* Sélection des parcours utilisateurs */}
                <ProfileCards />

                {/* Présentation du modèle "Learning by Doing" */}
                <Methodology />

                {/* Statistiques d'impact et résultats sur 20 ans */}
                <Impact />

                {/* Actualités, publications et veille */}
                <ActualitySection />

                {/* Opportunités professionnelles et développement de compétences */}
                <CareersSection />

                {/* Pied de page et liens institutionnels */}
                <Footer />
            </main>

        </div>
    );
}