From 80319fc9931b87f848f3db555cbecf2c56cc7161 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Wed, 10 Jun 2026 16:20:18 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 197 ++++++++++++++++++++++++-----------------------
 1 file changed, 101 insertions(+), 96 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 77d23a9..5e76e53 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -24,8 +24,7 @@ import {
     BookLock,
     BellRing,
     ClipboardCheck,
-    Mail,
-    WhatsApp
+    Mail
 } from "lucide-react";
 import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
 import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
@@ -56,72 +55,77 @@ export default function WebAgencyThemePage() {
             headingFontWeight="medium"
         >
             <ReactLenis root>
-                <NavbarLayoutFloatingInline
-                    navItems={navItems}
-                    brandName="NomaDigital"
-                    button={{ text: "Contactez-nous", href: "#contact" }}
-                />
-                <HeroSplitKpi
-                    id="home"
-                    background={{ variant: "radial-gradient" }}
-                    tag="QHSE Digital"
-                    tagIcon={Sparkles}
-                    title="L'Avenir de la Gestion QHSE : Digitalisation & Automatisation Intelligente"
-                    description="Optimisez vos systèmes de management avec des outils digitaux, des tableaux de bord automatisés et des applications QHSE sur-mesure."
-                    enableKpiAnimation={true}
-                    kpis={[
-                        { value: "+95%", label: "Conformité Améliorée" },
-                        { value: "50%", label: "Coûts Réduits" },
-                        { value: "3x", label: "Productivité Accrue" }
-                    ]}
-                    buttons={[
-                        {
-                            text: "Découvrir Nos Produits",                            href: "#products"
-                        }
-                    ]}
-                    avatars={[]}
-                    avatarText=""
-                    imageSrc="http://img.b2bpic.net/free-photo/letter-t-made-real-natural-flowers-leaves-transparent-background_169016-54314.jpg"
-                    imageAlt="Ingénieurs QHSE interagissant avec des outils numériques sur site"
-                    mediaAnimation="slide-up"
-                    showMarqueeCard={false}
-                    marqueeItems={[]}
-                />
-                <TextAbout
-                    id="about"
-                    title="NomaDigital : Votre Partenaire en Transformation Digitale QHSE"
-                    buttons={[]}
-                    useInvertedBackground={false}
-                />
-                <FeatureCardNineteen
-                    id="products"
-                    title="Nos Solutions Digitales QHSE Innovantes"
-                    description="Découvrez nos outils conçus pour optimiser votre gestion de la Qualité, de l'Hygiène, de la Sécurité et de l'Environnement."
-                    tag="Produits & Applications"
-                    tagIcon={Layers}
-                    features={[
-                        {
-                            tag: "Suite Complète",                            title: "01",                            subtitle: "PACK TOTAL QHSE PRO (12 Modules)",                            description: "Écosystème complet de gestion d'entreprise intégrant les normes ISO 45001, 14001 et 9001. Centralisez et harmonisez tous vos processus QHSE.",                            imageSrc: "http://img.b2bpic.net/free-photo/glowing-warning-triangle-with-digital-distortion-black-background_84443-91300.jpg",                            imageAlt: "Logiciel de gestion QHSE tout-en-un"
-                        },
-                        {
-                            tag: "Analyse Stratégique",                            title: "02",                            subtitle: "Tableau de Bord QHSE Automatisé (Excel/VBA)",                            description: "Suivi dynamique des KPIs, des incidents et des plans d'action avec génération automatique de graphiques. Prenez des décisions éclairées.",                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=aum5ju",                            imageAlt: "Tableau de bord QHSE automatisé"
-                        },
-                        {
-                            tag: "Maîtrise des Risques",                            title: "03",                            subtitle: "Application de Gestion des Risques & Matrice 3D",                            description: "Matrice d'évaluation des risques digitaux (alignée sur l'ISO 31000) avec calcul automatique des scores et priorisation visuelle.",                            imageSrc: "http://img.b2bpic.net/free-photo/letter-h-made-green-grass-with-flowers-isolated-white_169016-57181.jpg",                            imageAlt: "Matrice d'évaluation des risques 3D"
-                        },
-                        {
-                            tag: "Sécurité Terrain",                            title: "04",                            subtitle: "App Mobile de Remontée des Presqu'accidents",                            description: "Template d'application mobile No-Code pour le signalement en temps réel des risques et des incidents mineurs sur le terrain, même hors ligne.",                            imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=r737j3",                            imageAlt: "Application mobile de reporting d'incidents"
-                        },
-                        {
-                            tag: "Conformité Simplifiée",                            title: "05",                            subtitle: "Suivi Digital des Certifications & Audits",                            description: "Traqueur de conformité automatisé avec système d'alerte par e-mail/WhatsApp pour les échéances, garantissant le respect des normes.",                            imageSrc: "http://img.b2bpic.net/free-photo/hands-holding-letter-b_53876-63682.jpg",                            imageAlt: "Interface de suivi de certifications"
-                        },
-                        {
-                            tag: "Documentation Centralisée",                            title: "06",                            subtitle: "Registre Unique de Sécurité Électronique",                            description: "Registre digital centralisé pour les inspections, la conformité des équipements et les mises à jour réglementaires. Accès sécurisé et instantané.",                            imageSrc: "http://img.b2bpic.net/free-photo/online-shopping-spree_23-2151952990.jpg",                            imageAlt: "Registre de sécurité électronique sécurisé"
-                        }
-                    ]}
-                    textboxLayout="default"
-                    useInvertedBackground={false}
-                />
+                <div id="nav" data-section="nav">
+                    <NavbarLayoutFloatingInline
+                        navItems={navItems}
+                        brandName="NomaDigital"
+                        button={{ text: "Contactez-nous", href: "#contact" }}
+                    />
+                </div>
+                <div id="home" data-section="home">
+                    <HeroSplitKpi
+                        background={{ variant: "radial-gradient" }}
+                        tag="QHSE Digital"
+                        tagIcon={Sparkles}
+                        title="L'Avenir de la Gestion QHSE : Digitalisation & Automatisation Intelligente"
+                        description="Optimisez vos systèmes de management avec des outils digitaux, des tableaux de bord automatisés et des applications QHSE sur-mesure."
+                        enableKpiAnimation={true}
+                        kpis={[
+                            { value: "+95%", label: "Conformité Améliorée" },
+                            { value: "50%", label: "Coûts Réduits" },
+                            { value: "3x", label: "Productivité Accrue" }
+                        ]}
+                        buttons={[
+                            {
+                                text: "Découvrir Nos Produits", href: "#products"
+                            }
+                        ]}
+                        avatars={[]}
+                        avatarText=""
+                        imageSrc="http://img.b2bpic.net/free-photo/letter-t-made-real-natural-flowers-leaves-transparent-background_169016-54314.jpg"
+                        imageAlt="Ingénieurs QHSE interagissant avec des outils numériques sur site"
+                        mediaAnimation="slide-up"
+                        showMarqueeCard={false}
+                        marqueeItems={[]}
+                    />
+                </div>
+                <div id="about" data-section="about">
+                    <TextAbout
+                        title="NomaDigital : Votre Partenaire en Transformation Digitale QHSE"
+                        buttons={[]}
+                        useInvertedBackground={false}
+                    />
+                </div>
+                <div id="products" data-section="products">
+                    <FeatureCardNineteen
+                        title="Nos Solutions Digitales QHSE Innovantes"
+                        description="Découvrez nos outils conçus pour optimiser votre gestion de la Qualité, de l'Hygiène, de la Sécurité et de l'Environnement."
+                        tag="Produits & Applications"
+                        tagIcon={Layers}
+                        features={[
+                            {
+                                tag: "Suite Complète", title: "01", subtitle: "PACK TOTAL QHSE PRO (12 Modules)", description: "Écosystème complet de gestion d'entreprise intégrant les normes ISO 45001, 14001 et 9001. Centralisez et harmonisez tous vos processus QHSE.", imageSrc: "http://img.b2bpic.net/free-photo/glowing-warning-triangle-with-digital-distortion-black-background_84443-91300.jpg", imageAlt: "Logiciel de gestion QHSE tout-en-un"
+                            },
+                            {
+                                tag: "Analyse Stratégique", title: "02", subtitle: "Tableau de Bord QHSE Automatisé (Excel/VBA)", description: "Suivi dynamique des KPIs, des incidents et des plans d'action avec génération automatique de graphiques. Prenez des décisions éclairées.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=aum5ju", imageAlt: "Tableau de bord QHSE automatisé"
+                            },
+                            {
+                                tag: "Maîtrise des Risques", title: "03", subtitle: "Application de Gestion des Risques & Matrice 3D", description: "Matrice d'évaluation des risques digitaux (alignée sur l'ISO 31000) avec calcul automatique des scores et priorisation visuelle.", imageSrc: "http://img.b2bpic.net/free-photo/letter-h-made-green-grass-with-flowers-isolated-white_169016-57181.jpg", imageAlt: "Matrice d'évaluation des risques 3D"
+                            },
+                            {
+                                tag: "Sécurité Terrain", title: "04", subtitle: "App Mobile de Remontée des Presqu'accidents", description: "Template d'application mobile No-Code pour le signalement en temps réel des risques et des incidents mineurs sur le terrain, même hors ligne.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=r737j3", imageAlt: "Application mobile de reporting d'incidents"
+                            },
+                            {
+                                tag: "Conformité Simplifiée", title: "05", subtitle: "Suivi Digital des Certifications & Audits", description: "Traqueur de conformité automatisé avec système d'alerte par e-mail/WhatsApp pour les échéances, garantissant le respect des normes.", imageSrc: "http://img.b2bpic.net/free-photo/hands-holding-letter-b_53876-63682.jpg", imageAlt: "Interface de suivi de certifications"
+                            },
+                            {
+                                tag: "Documentation Centralisée", title: "06", subtitle: "Registre Unique de Sécurité Électronique", description: "Registre digital centralisé pour les inspections, la conformité des équipements et les mises à jour réglementaires. Accès sécurisé et instantané.", imageSrc: "http://img.b2bpic.net/free-photo/online-shopping-spree_23-2151952990.jpg", imageAlt: "Registre de sécurité électronique sécurisé"
+                            }
+                        ]}
+                        textboxLayout="default"
+                        useInvertedBackground={false}
+                    />
+                </div>
                 <MetricCardOne
                     title="Notre Impact sur Votre Gestion QHSE"
                     description="Des résultats concrets qui prouvent l'efficacité de nos solutions pour transformer votre approche QHSE."
@@ -144,16 +148,16 @@ export default function WebAgencyThemePage() {
                     tagIcon={Star}
                     testimonials={[
                         {
-                            id: "1",                            name: "Marie Dubois",                            date: "Responsable QHSE, Industrie X",                            title: "Une transformation digitale réussie",                            quote: "NomaDigital a révolutionné notre gestion QHSE. Le Pack Total est une solution complète qui a grandement simplifié nos processus et amélioré notre conformité.",                            tag: "Pack Total QHSE",                            avatarSrc: "http://img.b2bpic.net/free-photo/letter-q-made-green-grass-with-flowers-isolated-white-font-your-design_169016-57765.jpg",                            avatarAlt: "Marie Dubois",                            imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-letter-o_53876-63749.jpg",                            imageAlt: "Projet QHSE Industrie X"
+                            id: "1", name: "Marie Dubois", date: "Responsable QHSE, Industrie X", title: "Une transformation digitale réussie", quote: "NomaDigital a révolutionné notre gestion QHSE. Le Pack Total est une solution complète qui a grandement simplifié nos processus et amélioré notre conformité.", tag: "Pack Total QHSE", avatarSrc: "http://img.b2bpic.net/free-photo/letter-q-made-green-grass-with-flowers-isolated-white-font-your-design_169016-57765.jpg", avatarAlt: "Marie Dubois", imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-letter-o_53876-63749.jpg", imageAlt: "Projet QHSE Industrie X"
                         },
                         {
-                            id: "2",                            name: "Jean Dupont",                            date: "Directeur des Opérations, Logistique Y",                            title: "Visibilité et contrôle accrus",                            quote: "Le tableau de bord automatisé nous offre une vue d'ensemble instantanée de nos KPIs. C'est un outil indispensable pour la prise de décision rapide et éclairée.",                            tag: "Tableau de Bord QHSE",                            avatarSrc: "http://img.b2bpic.net/free-photo/ai-nuclear-energy-future-innovation-disruptive-technology_53876-129784.jpg",                            avatarAlt: "Jean Dupont",                            imageSrc: "http://img.b2bpic.net/free-photo/3d-letter-fire-with-flames_23-2151073733.jpg",                            imageAlt: "Projet QHSE Logistique Y"
+                            id: "2", name: "Jean Dupont", date: "Directeur des Opérations, Logistique Y", title: "Visibilité et contrôle accrus", quote: "Le tableau de bord automatisé nous offre une vue d'ensemble instantanée de nos KPIs. C'est un outil indispensable pour la prise de décision rapide et éclairée.", tag: "Tableau de Bord QHSE", avatarSrc: "http://img.b2bpic.net/free-photo/ai-nuclear-energy-future-innovation-disruptive-technology_53876-129784.jpg", avatarAlt: "Jean Dupont", imageSrc: "http://img.b2bpic.net/free-photo/3d-letter-fire-with-flames_23-2151073733.jpg", imageAlt: "Projet QHSE Logistique Y"
                         },
                         {
-                            id: "3",                            name: "Fatima Zahra",                            date: "Ingénieure Sécurité, Construction Z",                            title: "Sécurité terrain renforcée",                            quote: "L'application mobile de remontée des presqu'accidents est un game-changer. Nos équipes sur le terrain peuvent signaler les risques en temps réel, améliorant drastiquement notre réactivité.",                            tag: "App Mobile Sécurité",                            avatarSrc: "http://img.b2bpic.net/free-photo/letter-t-made-real-natural-flowers-leaves-transparent-background_169016-54314.jpg",                            avatarAlt: "Fatima Zahra",                            imageSrc: "http://img.b2bpic.net/free-photo/3d-letter-fire-with-flames_23-2151073780.jpg",                            imageAlt: "Projet QHSE Construction Z"
+                            id: "3", name: "Fatima Zahra", date: "Ingénieure Sécurité, Construction Z", title: "Sécurité terrain renforcée", quote: "L'application mobile de remontée des presqu'accidents est un game-changer. Nos équipes sur le terrain peuvent signaler les risques en temps réel, améliorant drastiquement notre réactivité.", tag: "App Mobile Sécurité", avatarSrc: "http://img.b2bpic.net/free-photo/letter-t-made-real-natural-flowers-leaves-transparent-background_169016-54314.jpg", avatarAlt: "Fatima Zahra", imageSrc: "http://img.b2bpic.net/free-photo/3d-letter-fire-with-flames_23-2151073780.jpg", imageAlt: "Projet QHSE Construction Z"
                         },
                         {
-                            id: "4",                            name: "Ahmed Alami",                            date: "Consultant QHSE, Solutions W",                            title: "Expertise et accompagnement de qualité",                            quote: "L'équipe NomaDigital nous a offert un support exceptionnel, allant au-delà de la simple fourniture d'outils. Leur connaissance des normes QHSE est impressionnante.",                            tag: "Accompagnement QHSE",                            avatarSrc: "http://img.b2bpic.net/free-photo/letter-r-made-real-natural-flowers-leaves-white-background-isolated_169016-54270.jpg",                            avatarAlt: "Ahmed Alami",                            imageSrc: "http://img.b2bpic.net/free-photo/woman-retro-vintage-50-s-cafe-pink-color-sitting-table-drinking-milk-shake-cocktail-hipster-outfit-having-fun_285396-10336.jpg",                            imageAlt: "Projet QHSE Solutions W"
+                            id: "4", name: "Ahmed Alami", date: "Consultant QHSE, Solutions W", title: "Expertise et accompagnement de qualité", quote: "L'équipe NomaDigital nous a offert un support exceptionnel, allant au-delà de la simple fourniture d'outils. Leur connaissance des normes QHSE est impressionnante.", tag: "Accompagnement QHSE", avatarSrc: "http://img.b2bpic.net/free-photo/letter-r-made-real-natural-flowers-leaves-white-background-isolated_169016-54270.jpg", avatarAlt: "Ahmed Alami", imageSrc: "http://img.b2bpic.net/free-photo/woman-retro-vintage-50-s-cafe-pink-color-sitting-table-drinking-milk-shake-cocktail-hipster-outfit-having-fun_285396-10336.jpg", imageAlt: "Projet QHSE Solutions W"
                         }
                     ]}
                     textboxLayout="default"
@@ -169,7 +173,7 @@ export default function WebAgencyThemePage() {
                     useInvertedBackground={false}
                     features={[
                         {
-                            title: "Digitalisation Intégrée",                            description: "Centralisez et automatisez tous vos processus QHSE, de la gestion des risques aux audits, sur une plateforme unique.",                            media: { imageSrc: "http://img.b2bpic.net/free-photo/letter-e-made-green-grass-with-flowers-isolated-white_169016-57073.jpg", imageAlt: "Digitalisation des processus" },
+                            title: "Digitalisation Intégrée", description: "Centralisez et automatisez tous vos processus QHSE, de la gestion des risques aux audits, sur une plateforme unique.", media: { imageSrc: "http://img.b2bpic.net/free-photo/letter-e-made-green-grass-with-flowers-isolated-white_169016-57073.jpg", imageAlt: "Digitalisation des processus" },
                             reverse: false,
                             items: [
                                 { icon: Code, text: "Plateformes unifiées" },
@@ -178,7 +182,7 @@ export default function WebAgencyThemePage() {
                             ]
                         },
                         {
-                            title: "Conformité Simplifiée",                            description: "Restez conforme aux normes ISO et réglementations locales grâce à des outils de suivi et d'alerte intelligents.",                            media: { imageSrc: "http://img.b2bpic.net/free-photo/alphabet-pink-neon-lights-black-background_53876-15055.jpg", imageAlt: "Gestion de la conformité" },
+                            title: "Conformité Simplifiée", description: "Restez conforme aux normes ISO et réglementations locales grâce à des outils de suivi et d'alerte intelligents.", media: { imageSrc: "http://img.b2bpic.net/free-photo/alphabet-pink-neon-lights-black-background_53876-15055.jpg", imageAlt: "Gestion de la conformité" },
                             reverse: true,
                             items: [
                                 { icon: Award, text: "Gestion ISO 9001, 14001, 45001" },
@@ -187,7 +191,7 @@ export default function WebAgencyThemePage() {
                             ]
                         },
                         {
-                            title: "Décision Stratégique",                            description: "Accédez à des tableaux de bord dynamiques et des analyses prédictives pour des décisions plus rapides et pertinentes.",                            media: { imageSrc: "http://img.b2bpic.net/free-photo/hands-holding-letter-t_53876-63683.jpg", imageAlt: "Tableaux de bord stratégiques" },
+                            title: "Décision Stratégique", description: "Accédez à des tableaux de bord dynamiques et des analyses prédictives pour des décisions plus rapides et pertinentes.", media: { imageSrc: "http://img.b2bpic.net/free-photo/hands-holding-letter-t_53876-63683.jpg", imageAlt: "Tableaux de bord stratégiques" },
                             reverse: false,
                             items: [
                                 { icon: BarChart2, text: "KPIs personnalisables" },
@@ -197,29 +201,30 @@ export default function WebAgencyThemePage() {
                         }
                     ]}
                 />
-                <ContactCenter
-                    id="contact"
-                    tag="Contactez-nous"
-                    tagIcon={Mail}
-                    title="Prêt à Digitaliser Votre Gestion QHSE ?"
-                    description="Remplissez le formulaire ci-dessous pour discuter de vos besoins et obtenir une démonstration personnalisée."
-                    inputPlaceholder="Votre adresse e-mail"
-                    buttonText="Envoyer votre message"
-                    termsText="En cliquant sur 'Envoyer votre message', vous confirmez accepter nos Termes et Conditions."
-                    onSubmit={(email: string) => {
-                        console.log(`Email submitted: ${email}`);
-                        alert(`Merci pour votre intérêt ! Nous vous contacterons à l'adresse ${email}.`);
-                    }}
-                    background={{ variant: "canvas-reveal" }}
-                    useInvertedBackground={false}
-                />
+                <div id="contact" data-section="contact">
+                    <ContactCenter
+                        tag="Contactez-nous"
+                        tagIcon={Mail}
+                        title="Prêt à Digitaliser Votre Gestion QHSE ?"
+                        description="Remplissez le formulaire ci-dessous pour discuter de vos besoins et obtenir une démonstration personnalisée."
+                        inputPlaceholder="Votre adresse e-mail"
+                        buttonText="Envoyer votre message"
+                        termsText="En cliquant sur 'Envoyer votre message', vous confirmez accepter nos Termes et Conditions."
+                        onSubmit={(email: string) => {
+                            console.log(`Email submitted: ${email}`);
+                            alert(`Merci pour votre intérêt ! Nous vous contacterons à l'adresse ${email}.`);
+                        }}
+                        background={{ variant: "canvas-reveal" }}
+                        useInvertedBackground={false}
+                    />
+                </div>
                 <FooterMedia
                     imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg"
                     imageAlt="NomaDigital Footer Background"
                     logoText="NomaDigital"
                     columns={[
                         {
-                            title: "Produits",                            items: [
+                            title: "Produits", items: [
                                 { label: "Pack Total QHSE Pro", href: "#products" },
                                 { label: "Tableau de Bord QHSE", href: "#products" },
                                 { label: "Gestion des Risques", href: "#products" },
@@ -227,21 +232,21 @@ export default function WebAgencyThemePage() {
                             ]
                         },
                         {
-                            title: "À Propos",                            items: [
+                            title: "À Propos", items: [
                                 { label: "Notre Histoire", href: "#about" },
                                 { label: "Notre Impact", href: "#about" },
                                 { label: "Témoignages", href: "#about" }
                             ]
                         },
                         {
-                            title: "Contact",                            items: [
+                            title: "Contact", items: [
                                 { label: "Email: nimadigital99@gmail.com", href: "mailto:nimadigital99@gmail.com" },
                                 { label: "WhatsApp", href: "https://wa.me/212638673530?text=Bonjour%20NomaDigital,%20je%20suis%20intéressé%20par%20vos%20solutions%20digitales%20QHSE" },
                                 { label: "Demander une Démo", href: "#contact" }
                             ]
                         },
                         {
-                            title: "Suivez-nous",                            items: [
+                            title: "Suivez-nous", items: [
                                 { label: "Twitter", href: "https://twitter.com" },
                                 { label: "Instagram", href: "https://instagram.com" },
                                 { label: "LinkedIn", href: "https://linkedin.com" }
@@ -258,7 +263,7 @@ export default function WebAgencyThemePage() {
                 aria-label="Contacter NomaDigital sur WhatsApp"
                 className="fixed bottom-6 right-6 z-50 bg-green-500 text-white p-3 rounded-full shadow-lg hover:bg-green-600 transition-colors duration-300 flex items-center justify-center space-x-2"
             >
-                <WhatsApp size={24} />
+                <Mail size={24} />
                 <span className="sr-only">WhatsApp</span>
             </a>
         </ThemeProvider>