Merge remote-tracking branch 'origin/Alexis' into Emmanuel

# Conflicts:
#	frontend/src/pages/Contact.jsx

frontend/src/App.jsx

@@ -17,6 +17,8 @@ import NotFound from './pages/NotFound'
 import Sitemap from './pages/Sitemap'
 import MentionsLegales from './pages/MentionsLegales'
 import Confidentialite from './pages/Confidentialite'
+import Accessibilite from './pages/Accessibilite'
+import Cgu from './pages/Cgu'
 import Contact from './pages/Contact.jsx'
 
 export default function App() {
@@ -33,6 +35,8 @@ export default function App() {
         <Route path="/regles-jeu" element={<Layout><ReglesJeu /></Layout>} />
         <Route path="/mentions-legales" element={<Layout><MentionsLegales /></Layout>} />
         <Route path="/confidentialite" element={<Layout><Confidentialite /></Layout>} />
+        <Route path="/accessibilite" element={<Layout><Accessibilite /></Layout>} />
+        <Route path="/cgu" element={<Layout><Cgu /></Layout>} />
         <Route path="/contact" element={<Layout><Contact /></Layout>} />
         <Route path="/sitemap" element={<Layout><Sitemap /></Layout>} />
 

frontend/src/components/Footer.jsx

@@ -16,7 +16,7 @@ export default function Footer() {
     )
   }
   return (
-    <footer className="bg-green-900 text-white">
+    <footer className="bg-[#006B6B] text-white">
  
  
       {/* Partie principale */}
@@ -31,7 +31,7 @@ export default function Footer() {
             </h3>
           </FooterLink>
  
-          <p className="text-green-100 text-sm leading-relaxed">
+          <p className="text-teal-100 text-sm leading-relaxed">
             Participez au jeu-concours Thé Tip Top et tentez de gagner
             des lots gourmands autour du thé.
           </p>
@@ -48,7 +48,7 @@ export default function Footer() {
           </h3>
  
  
-          <ul className="space-y-3 text-green-100">
+          <ul className="space-y-3 text-teal-100">
  
             <li>
               <FooterLink
@@ -105,7 +105,7 @@ export default function Footer() {
           </h3>
  
  
-          <ul className="space-y-3 text-green-100">
+          <ul className="space-y-3 text-teal-100">
  
             <li>
               <FooterLink
@@ -126,6 +126,24 @@ export default function Footer() {
               </FooterLink>
             </li>
 
+            <li>
+              <FooterLink
+                to="/accessibilite"
+                className="hover:text-white transition"
+              >
+                Accessibilité
+              </FooterLink>
+            </li>
+
+            <li>
+              <FooterLink
+                to="/cgu"
+                className="hover:text-white transition"
+              >
+                CGU
+              </FooterLink>
+            </li>
+
  
             <li>
               <FooterLink
@@ -159,19 +177,19 @@ export default function Footer() {
             Contact
           </h3>
  
-          <p className="text-green-100 text-sm mb-3">
+          <p className="text-teal-100 text-sm mb-3">
             Une question sur le jeu ?
           </p>
  
-          <a href="tel:+33184802034" className="block mt-2 font-medium hover:text-green-300">
+          <a href="tel:+33184802034" className="block mt-2 font-medium hover:text-teal-300">
             01 84 80 20 34
           </a>
  
-          <a href="mailto:contact@thetiptop.fr" className="inline-block mt-3 font-medium hover:text-green-300">
+          <a href="mailto:contact@thetiptop.fr" className="inline-block mt-3 font-medium hover:text-teal-300">
             contact@thetiptop.fr
           </a>
  
-          <p className="text-green-100 text-sm mt-2">
+          <p className="text-teal-100 text-sm mt-2">
             18 rue Léon Frot
             <br />
             75011 Paris, France
@@ -187,16 +205,16 @@ export default function Footer() {
  
       {/* Barre basse */}
  
-      <div className="border-t border-green-800">
+      <div className="border-t border-teal-800">
  
         <div className="max-w-7xl mx-auto px-6 py-5 flex flex-col md:flex-row justify-between items-center gap-3">
  
  
-          <p className="text-green-200 text-sm">
+          <p className="text-teal-200 text-sm">
             © {new Date().getFullYear()} Thé Tip Top. Tous droits réservés.
           </p>
  
-          <div className="flex gap-5 text-sm text-green-200">
+          <div className="flex gap-5 text-sm text-teal-200">
             <a
               href="https://www.facebook.com/profile.php?id=61590449280854"
               target="_blank"

frontend/src/components/Header.jsx

@@ -46,7 +46,7 @@ export default function Header() {
               key={link.to}
               to={link.to}
               className={`font-medium transition-colors ${
-                pathname === link.to ? 'text-green-700' : 'text-gray-700 hover:text-green-700'
+                pathname === link.to ? 'text-[#006B6B]' : 'text-gray-700 hover:text-[#006B6B]'
               }`}
             >
               {link.label}
@@ -55,7 +55,7 @@ export default function Header() {
 
           {isLoggedIn ? (
             <div className="flex items-center gap-3">
-              <Link to="/profile" className="flex items-center gap-2 text-sm text-gray-700 hover:text-green-700 font-medium transition-colors">
+              <Link to="/profile" className="flex items-center gap-2 text-sm text-gray-700 hover:text-[#006B6B] font-medium transition-colors">
                 <div className="w-8 h-8 rounded-full bg-[#006B6B] flex items-center justify-center text-white text-xs font-bold">
                   {initials}
                 </div>
@@ -70,10 +70,10 @@ export default function Header() {
             </div>
           ) : (
             <div className="flex items-center gap-2">
-              <Link to="/connexion" className="bg-green-700 text-white px-4 py-2 rounded-lg hover:bg-green-800 transition-colors text-sm">
+              <Link to="/connexion" className="bg-[#006B6B] text-white px-4 py-2 rounded-lg hover:bg-[#005a5a] transition-colors text-sm">
                 Connexion
               </Link>
-              <Link to="/inscription" className="border border-green-700 text-green-700 px-4 py-2 rounded-lg hover:bg-green-50 transition-colors text-sm">
+              <Link to="/inscription" className="border border-[#006B6B] text-[#006B6B] px-4 py-2 rounded-lg hover:bg-[#006B6B] hover:text-white transition-colors text-sm">
                 Inscription
               </Link>
             </div>
@@ -101,7 +101,7 @@ export default function Header() {
               to={link.to}
               onClick={() => setMenuOpen(false)}
               className={`block py-3 font-medium border-b border-gray-50 ${
-                pathname === link.to ? 'text-green-700' : 'text-gray-700'
+                pathname === link.to ? 'text-[#006B6B]' : 'text-gray-700'
               }`}
             >
               {link.label}
@@ -130,14 +130,14 @@ export default function Header() {
                 <Link
                   to="/connexion"
                   onClick={() => setMenuOpen(false)}
-                  className="w-full text-center bg-green-700 text-white px-4 py-2.5 rounded-lg hover:bg-green-800 transition-colors text-sm font-medium"
+                  className="w-full text-center bg-[#006B6B] text-white px-4 py-2.5 rounded-lg hover:bg-[#005a5a] transition-colors text-sm font-medium"
                 >
                   Connexion
                 </Link>
                 <Link
                   to="/inscription"
                   onClick={() => setMenuOpen(false)}
-                  className="w-full text-center border border-green-700 text-green-700 px-4 py-2.5 rounded-lg hover:bg-green-50 transition-colors text-sm font-medium"
+                  className="w-full text-center border border-[#006B6B] text-[#006B6B] px-4 py-2.5 rounded-lg hover:bg-[#006B6B] hover:text-white transition-colors text-sm font-medium"
                 >
                   Inscription
                 </Link>

frontend/src/pages/Accessibilite.jsx

@@ -0,0 +1,41 @@
+export default function Accessibilite() {
+  return (
+    <main className="bg-gray-50 min-h-screen px-4 sm:px-6 py-10 sm:py-16">
+      <div className="max-w-5xl mx-auto bg-white rounded-2xl shadow p-5 sm:p-8 md:p-10">
+
+        <h1 className="text-2xl sm:text-3xl md:text-4xl font-bold text-[#006B6B] mb-4 sm:mb-6">
+          Déclaration d'accessibilité
+        </h1>
+
+        <p className="text-gray-600 mb-8 sm:mb-10 leading-relaxed text-sm sm:text-base">
+          La société Thé Tip Top s'engage à rendre le site de son jeu-concours « 100% Gagnant »
+          accessible conformément à l'article 47 de la loi n° 2005-102 du 11 février 2005.
+        </p>
+
+        <section className="mb-6 sm:mb-8">
+          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-[#006B6B] mb-2 sm:mb-3">
+            État de conformité
+          </h2>
+          <p className="text-gray-700 leading-relaxed text-sm sm:text-base">
+            Le site a été développé en conformité avec les normes d'accessibilité internationales
+            WCAG 2.1 niveau AA et le Référentiel Général d'Amélioration de l'Accessibilité
+            (RGAA 4.1) afin de garantir une accessibilité maximale aux utilisateurs en situation
+            de handicap.
+          </p>
+        </section>
+
+        <section>
+          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-[#006B6B] mb-2 sm:mb-3">
+            Signaler un problème d'accessibilité
+          </h2>
+          <p className="text-gray-700 leading-relaxed text-sm sm:text-base">
+            Si vous rencontrez un obstacle à l'accessibilité sur le site, vous pouvez nous en faire
+            part afin que nous puissions y remédier :<br />
+            <strong>Email :</strong> contact@thetiptop.fr
+          </p>
+        </section>
+
+      </div>
+    </main>
+  )
+}

frontend/src/pages/Accueil.jsx

@@ -2,12 +2,12 @@ import { Link } from 'react-router-dom'
 
 export default function Accueil() {
   return (
-    <div className="bg-green-50">
+    <div className="bg-gray-50 min-h-screen">
 
       {/* Hero */}
       <section className="max-w-7xl mx-auto px-4 sm:px-6 py-12 sm:py-16 md:py-24">
         <div className="text-center max-w-3xl mx-auto">
-          <h1 className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-bold text-green-800 mb-4 sm:mb-6 leading-tight">
+          <h1 className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-bold text-[#006B6B] mb-4 sm:mb-6 leading-tight">
             Bienvenue au jeu-concours Thé Tip Top
           </h1>
           <p className="text-base sm:text-lg md:text-xl text-gray-600 mb-8 sm:mb-10">
@@ -18,13 +18,13 @@ export default function Accueil() {
           <div className="flex flex-col sm:flex-row justify-center gap-3 sm:gap-4">
             <Link
               to="/saisir-code-unique"
-              className="bg-green-700 hover:bg-green-800 text-white font-semibold px-6 sm:px-8 py-3 sm:py-4 rounded-xl transition-colors text-sm sm:text-base"
+              className="bg-[#006B6B] hover:bg-[#005555] text-white font-semibold px-6 sm:px-8 py-3 sm:py-4 rounded-xl transition-colors text-sm sm:text-base"
             >
               Tester mon code
             </Link>
             <Link
               to="/regles-jeu"
-              className="border border-green-700 text-green-700 hover:bg-green-100 font-semibold px-6 sm:px-8 py-3 sm:py-4 rounded-xl transition-colors text-sm sm:text-base"
+              className="border border-[#006B6B] text-[#006B6B] hover:bg-[#005555] hover:text-white font-semibold px-6 sm:px-8 py-3 sm:py-4 rounded-xl transition-colors text-sm sm:text-base"
             >
               Découvrir les règles
             </Link>
@@ -34,7 +34,7 @@ export default function Accueil() {
 
       {/* Comment participer */}
       <section className="max-w-5xl mx-auto px-4 sm:px-6 pb-12 sm:pb-20">
-        <h2 className="text-2xl sm:text-3xl font-bold text-green-800 mb-6 sm:mb-8 text-center">
+        <h2 className="text-2xl sm:text-3xl font-bold text-[#006B6B] mb-6 sm:mb-8 text-center">
           Comment participer ?
         </h2>
         <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
@@ -45,7 +45,7 @@ export default function Accueil() {
             { num: '4', text: 'Découvrez votre lot' },
           ].map((step) => (
             <div key={step.num} className="bg-white rounded-2xl shadow p-4 sm:p-6 text-center">
-              <div className="text-2xl sm:text-3xl font-bold text-green-700 mb-2 sm:mb-3">{step.num}</div>
+              <div className="text-2xl sm:text-3xl font-bold text-[#006B6B] mb-2 sm:mb-3">{step.num}</div>
               <p className="text-sm sm:text-base text-gray-700">{step.text}</p>
             </div>
           ))}

frontend/src/pages/Cgu.jsx

@@ -0,0 +1,235 @@
+export default function Cgu() {
+  return (
+    <main className="bg-gray-50 min-h-screen px-4 sm:px-6 py-10 sm:py-16">
+      <div className="max-w-5xl mx-auto bg-white rounded-2xl shadow p-5 sm:p-8 md:p-10">
+
+        <h1 className="text-2xl sm:text-3xl md:text-4xl font-bold text-[#006B6B] mb-4 sm:mb-6">
+          Conditions générales d'utilisation
+        </h1>
+
+        <p className="text-gray-600 mb-8 sm:mb-10 text-sm sm:text-base">
+          Les présentes Conditions Générales d'Utilisation (CGU) précisent les modalités d'accès et
+          d'utilisation du site internet du jeu-concours « 100% Gagnant » de la société Thé Tip Top.
+        </p>
+
+        {[
+          {
+            title: 'Article 1 – Objet des CGU',
+            content: (
+              <div className="text-gray-700 space-y-2 text-sm sm:text-base leading-relaxed">
+                <p>
+                  Les présentes Conditions Générales d'Utilisation (CGU) ont pour objet de définir
+                  les modalités et conditions dans lesquelles la société Thé Tip Top met à
+                  disposition des utilisateurs le site internet du jeu-concours « 100% Gagnant »,
+                  accessible à l'adresse https://www.thetiptop-concours.fr.
+                </p>
+                <p>
+                  Toute utilisation du Site implique l'acceptation pleine et entière des présentes
+                  CGU. En cas de non-acceptation, l'utilisateur est invité à ne pas accéder au Site
+                  ni à utiliser ses services.
+                </p>
+              </div>
+            ),
+          },
+          {
+            title: 'Article 2 – Conditions d\'accès au Site',
+            content: (
+              <div className="text-gray-700 space-y-2 text-sm sm:text-base leading-relaxed">
+                <p><strong>Conditions d'âge —</strong> La participation au jeu-concours est strictement
+                  réservée aux personnes physiques majeures, c'est-à-dire âgées d'au moins 18 ans
+                  révolus à la date de leur inscription. Toute inscription d'un mineur est nulle et
+                  non avenue. La société Thé Tip Top se réserve le droit de demander la fourniture
+                  d'un justificatif d'identité pour vérifier l'âge déclaré.
+                </p>
+                <p><strong>Conditions géographiques —</strong> Le jeu-concours « 100% Gagnant » est
+                  ouvert exclusivement aux résidents de France métropolitaine et des Départements et
+                  Régions d'Outre-Mer (DROM). Sont exclus les ressortissants ou résidents de toute
+                  autre zone géographique.
+                </p>
+                <p><strong>Personnes exclues —</strong> Sont exclus de toute participation les membres
+                  du personnel de la société Thé Tip Top et de l'agence Furious Ducks, leurs
+                  sous-traitants, ainsi que les membres de leur famille en ligne directe (conjoints,
+                  ascendants, descendants). Est également exclu le personnel de l'étude du
+                  Commissaire de Justice dépositaire du règlement.
+                </p>
+                <p><strong>Conditions techniques —</strong> L'accès au Site nécessite une connexion
+                  internet active et un navigateur web à jour. La société Thé Tip Top ne saurait
+                  être tenue responsable des difficultés d'accès liées à l'environnement technique
+                  de l'utilisateur.
+                </p>
+              </div>
+            ),
+          },
+          {
+            title: 'Article 3 – Services proposés et fonctionnalités',
+            content: (
+              <div className="text-gray-700 space-y-4 text-sm sm:text-base leading-relaxed">
+                <div>
+                  <h3 className="font-semibold text-gray-800 mb-1">3.1 – Services proposés</h3>
+                  <p>
+                    Le site du jeu-concours « 100% Gagnant » est un site internet dédié permettant
+                    aux clients de la société Thé Tip Top de participer à un jeu-concours à
+                    l'occasion de l'ouverture de la 10ᵉ boutique de l'enseigne à Nice. Les services
+                    proposés incluent :
+                  </p>
+                  <ul className="list-disc list-inside space-y-2 mt-2">
+                    <li>La présentation du jeu-concours, de ses conditions et des lots à gagner</li>
+                    <li>La création d'un espace personnel pour chaque participant</li>
+                    <li>La saisie et la validation des codes à 10 caractères figurant sur les tickets de caisse ou factures d'un montant supérieur à 49 €</li>
+                    <li>La consultation de l'historique des participations et gains obtenus</li>
+                    <li>La réclamation des lots gagnés, en ligne ou en boutique</li>
+                  </ul>
+                </div>
+                <div>
+                  <h3 className="font-semibold text-gray-800 mb-1">3.2 – Fonctionnalités principales</h3>
+                  <p><strong>S'inscrire —</strong> L'utilisateur peut créer un compte personnel en
+                    renseignant un formulaire d'inscription classique ou en utilisant les
+                    fonctionnalités d'authentification via Google. La création d'un compte est
+                    obligatoire pour participer au jeu-concours.
+                  </p>
+                  <p className="mt-2"><strong>Jouer (participer au jeu-concours) —</strong> Une fois
+                    connecté, l'utilisateur saisit le code à 10 caractères figurant sur son ticket de
+                    caisse ou sa facture. Le Site valide le code et attribue immédiatement le lot
+                    correspondant selon la répartition préétablie :
+                  </p>
+                  <ul className="list-disc list-inside space-y-1 mt-2">
+                    <li>60 % des tickets : infuseur à thé</li>
+                    <li>20 % des tickets : boîte de 100 g de thé détox ou d'infusion</li>
+                    <li>10 % des tickets : boîte de 100 g de thé signature</li>
+                    <li>6 % des tickets : coffret découverte d'une valeur de 39 €</li>
+                    <li>4 % des tickets : coffret découverte d'une valeur de 69 €</li>
+                  </ul>
+                  <p className="mt-2">
+                    Un même utilisateur peut soumettre plusieurs codes distincts. La participation
+                    est possible pendant toute la durée du jeu-concours, soit 30 jours à compter de
+                    son ouverture. Les lots gagnés peuvent être réclamés pendant cette période ainsi
+                    que dans les 30 jours calendaires suivant la date de clôture du jeu-concours.
+                    Passé ce délai, les lots non réclamés sont définitivement perdus.
+                  </p>
+                  <p className="mt-2"><strong>Remise des lots —</strong> Les lots peuvent être réclamés
+                    en boutique, sur présentation du compte utilisateur validé et de la confirmation
+                    de gain.
+                  </p>
+                  <p className="mt-2">
+                    À l'issue du jeu-concours, un tirage au sort est effectué parmi l'ensemble des
+                    participants pour désigner le gagnant d'un an de thé d'une valeur de 360 €. Ce
+                    tirage a lieu sous le contrôle de Maître Arnaud Rick, Commissaire de Justice. Le
+                    nombre de participations n'augmente pas les chances de remporter ce lot.
+                  </p>
+                </div>
+              </div>
+            ),
+          },
+          {
+            title: 'Article 4 – Conditions d\'inscription et de création de compte',
+            content: (
+              <div className="text-gray-700 space-y-4 text-sm sm:text-base leading-relaxed">
+                <div>
+                  <h3 className="font-semibold text-gray-800 mb-1">4.1 – Processus d'inscription</h3>
+                  <p>
+                    Pour accéder aux services du Site, l'utilisateur doit créer un compte personnel.
+                    L'inscription peut s'effectuer de deux manières :
+                  </p>
+                  <p className="mt-2"><strong>Via le formulaire classique —</strong> L'utilisateur
+                    renseigne les champs obligatoires suivants : nom, prénom, adresse e-mail valide,
+                    mot de passe sécurisé. L'utilisateur reçoit ensuite un e-mail de confirmation
+                    contenant un lien d'activation. Le compte n'est activé qu'après validation de ce
+                    lien.
+                  </p>
+                  <p className="mt-2"><strong>Via l'authentification Google —</strong> L'utilisateur
+                    peut s'inscrire en utilisant son compte Google. Dans ce cas, les données
+                    transmises par la plateforme tierce (nom, prénom, adresse e-mail) sont récupérées
+                    avec le consentement explicite de l'utilisateur.
+                  </p>
+                </div>
+                <div>
+                  <h3 className="font-semibold text-gray-800 mb-1">4.2 – Unicité du compte</h3>
+                  <p>
+                    Chaque utilisateur ne peut posséder qu'un seul compte. Toute tentative de
+                    création de comptes multiples par un même utilisateur est prohibée et peut
+                    entraîner la disqualification de l'ensemble des participations concernées.
+                  </p>
+                </div>
+                <div>
+                  <h3 className="font-semibold text-gray-800 mb-1">4.3 – Véracité des informations</h3>
+                  <p>
+                    L'utilisateur s'engage à fournir des informations exactes, complètes et à jour
+                    lors de son inscription et tout au long de l'utilisation du Site. Toute
+                    inscription effectuée avec une fausse identité ou des données inexactes sera
+                    annulée, ainsi que les participations et gains associés.
+                  </p>
+                </div>
+              </div>
+            ),
+          },
+          {
+            title: 'Article 5 – Responsabilité de l\'utilisateur',
+            content: (
+              <div className="text-gray-700 space-y-3 text-sm sm:text-base leading-relaxed">
+                <p>
+                  L'utilisateur est seul responsable des informations communiquées lors de la
+                  création et de l'utilisation de son compte. À ce titre, il s'engage à :
+                </p>
+                <ul className="list-disc list-inside space-y-2">
+                  <li>Fournir des données personnelles exactes, sincères et à jour</li>
+                  <li>Ne pas usurper l'identité d'un tiers</li>
+                  <li>Ne pas créer de compte au nom d'une autre personne sans son autorisation</li>
+                  <li>Signaler sans délai à la société Thé Tip Top toute erreur, inexactitude ou modification de ses informations personnelles via les fonctionnalités de gestion du compte</li>
+                </ul>
+                <p>
+                  En cas de préjudice subi par la société Thé Tip Top ou par des tiers en raison de
+                  fausses informations fournies par l'utilisateur, ce dernier en assume l'entière
+                  responsabilité et peut se voir réclamer réparation.
+                </p>
+              </div>
+            ),
+          },
+          {
+            title: 'Article 6 – Gestion du compte utilisateur',
+            content: (
+              <div className="text-gray-700 space-y-4 text-sm sm:text-base leading-relaxed">
+                <div>
+                  <h3 className="font-semibold text-gray-800 mb-1">6.1 – Modification des informations</h3>
+                  <p>
+                    L'utilisateur peut à tout moment accéder à son espace personnel et modifier ses
+                    informations (nom, prénom, mot de passe).
+                  </p>
+                </div>
+                <div>
+                  <h3 className="font-semibold text-gray-800 mb-1">6.2 – Suppression du compte</h3>
+                  <p>
+                    L'utilisateur peut demander la suppression de son compte à tout moment en
+                    contactant directement l'équipe via contact@thetiptop.fr. La suppression entraîne
+                    la perte définitive des participations et gains non encore réclamés. Les données
+                    personnelles sont supprimées conformément aux dispositions de la Politique de
+                    Confidentialité, sous réserve des obligations légales de conservation.
+                  </p>
+                </div>
+                <div>
+                  <h3 className="font-semibold text-gray-800 mb-1">6.3 – Sécurité des identifiants</h3>
+                  <p>
+                    L'utilisateur est seul responsable de la confidentialité de ses identifiants de
+                    connexion (adresse e-mail et mot de passe). Il s'engage à ne les communiquer à
+                    personne et à prendre toutes les précautions nécessaires pour en assurer la
+                    protection. En cas de perte, de vol ou d'utilisation frauduleuse de ses
+                    identifiants, l'utilisateur doit en informer immédiatement la société Thé Tip
+                    Top. La société Thé Tip Top ne saurait être tenue responsable des dommages
+                    résultant de l'utilisation des identifiants par un tiers, sauf faute de sa part.
+                  </p>
+                </div>
+              </div>
+            ),
+          },
+        ].map((article) => (
+          <section key={article.title} className="mb-6 sm:mb-8">
+            <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-[#006B6B] mb-2 sm:mb-3">
+              {article.title}
+            </h2>
+            {article.content}
+          </section>
+        ))}
+
+      </div>
+    </main>
+  )
+}

frontend/src/pages/Confidentialite.jsx

@@ -1,9 +1,9 @@
 export default function Confidentialite() {
   return (
-    <main className="bg-green-50 min-h-screen px-4 sm:px-6 py-10 sm:py-16">
+    <main className="bg-[#F0F0F0] min-h-screen px-4 sm:px-6 py-10 sm:py-16">
       <div className="max-w-5xl mx-auto bg-white rounded-2xl shadow p-5 sm:p-8 md:p-10">
 
-        <h1 className="text-2xl sm:text-3xl md:text-4xl font-bold text-green-800 mb-4 sm:mb-6">
+        <h1 className="text-2xl sm:text-3xl md:text-4xl font-bold text-[#006B6B] mb-4 sm:mb-6">
           Politique de confidentialité
         </h1>
 
@@ -14,7 +14,7 @@ export default function Confidentialite() {
         </p>
 
         <section className="mb-6 sm:mb-8">
-          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-green-700 mb-2 sm:mb-3">
+          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-[#006B6B] mb-2 sm:mb-3">
             Article 1 – Responsable du traitement
           </h2>
           <p className="text-gray-700 leading-relaxed text-sm sm:text-base">
@@ -24,7 +24,7 @@ export default function Confidentialite() {
         </section>
 
         <section className="mb-6 sm:mb-8">
-          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-green-700 mb-2 sm:mb-3">
+          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-[#006B6B] mb-2 sm:mb-3">
             Article 2 – Données collectées
           </h2>
           <p className="text-gray-700 mb-3 text-sm sm:text-base">Dans le cadre de votre participation, nous pouvons collecter :</p>
@@ -38,7 +38,7 @@ export default function Confidentialite() {
         </section>
 
         <section className="mb-6 sm:mb-8">
-          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-green-700 mb-2 sm:mb-3">
+          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-[#006B6B] mb-2 sm:mb-3">
             Article 3 – Utilisation des données
           </h2>
           <p className="text-gray-700 leading-relaxed text-sm sm:text-base">
@@ -49,7 +49,7 @@ export default function Confidentialite() {
         </section>
 
         <section className="mb-6 sm:mb-8">
-          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-green-700 mb-2 sm:mb-3">
+          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-[#006B6B] mb-2 sm:mb-3">
             Article 4 – Conservation des données
           </h2>
           <p className="text-gray-700 leading-relaxed text-sm sm:text-base">
@@ -59,7 +59,7 @@ export default function Confidentialite() {
         </section>
 
         <section className="mb-6 sm:mb-8">
-          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-green-700 mb-2 sm:mb-3">
+          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-[#006B6B] mb-2 sm:mb-3">
             Article 5 – Cookies
           </h2>
           <p className="text-gray-700 leading-relaxed text-sm sm:text-base">
@@ -70,7 +70,7 @@ export default function Confidentialite() {
         </section>
 
         <section className="mb-6 sm:mb-8">
-          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-green-700 mb-2 sm:mb-3">
+          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-[#006B6B] mb-2 sm:mb-3">
             Article 6 – Vos droits
           </h2>
           <p className="text-gray-700 mb-3 text-sm sm:text-base">Conformément au RGPD, vous disposez des droits suivants :</p>
@@ -84,7 +84,7 @@ export default function Confidentialite() {
         </section>
 
         <section>
-          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-green-700 mb-2 sm:mb-3">
+          <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-[#006B6B] mb-2 sm:mb-3">
             Article 7 – Contact
           </h2>
           <p className="text-gray-700 text-sm sm:text-base">

frontend/src/pages/Contact.jsx

@@ -1,11 +1,13 @@
+import imgContact from '../assets/img/img-contact.jpg'
+
 export default function Contact() {
   return (
-    <main className="bg-green-50 min-h-screen px-4 sm:px-6 py-10 sm:py-16">
+    <main className="bg-[#F0F0F0] px-4 sm:px-6 py-10 sm:py-16">
       <div className="max-w-6xl mx-auto grid md:grid-cols-2 gap-6 sm:gap-8">
 
         {/* Informations */}
         <section className="bg-white rounded-2xl shadow p-5 sm:p-8 md:p-10">
-          <h1 className="text-2xl sm:text-3xl md:text-4xl font-bold text-green-800 mb-4 sm:mb-6">
+          <h1 className="text-2xl sm:text-3xl md:text-4xl font-bold text-[#006B6B] mb-4 sm:mb-6">
             Contact
           </h1>
           <p className="text-gray-600 leading-relaxed mb-6 sm:mb-8 text-sm sm:text-base">
@@ -14,69 +16,27 @@ export default function Contact() {
           </p>
           <div className="space-y-5 text-gray-700">
             <div>
-              <h2 className="font-semibold text-green-700 mb-1">Adresse</h2>
+              <h2 className="font-semibold text-[#006B6B] mb-1">Adresse</h2>
               <p className="text-sm sm:text-base">ThéTipTop<br />18 rue Léon Frot<br />75011 Paris, France</p>
             </div>
             <div>
-              <h2 className="font-semibold text-green-700 mb-1">Email</h2>
+              <h2 className="font-semibold text-[#006B6B] mb-1">Email</h2>
-              <a href="mailto:contact@thetiptop.fr" className="text-sm sm:text-base hover:text-green-700">contact@thetiptop.fr</a>
+              <a href="mailto:contact@thetiptop.fr" className="text-sm sm:text-base hover:text-[#006B6B]">contact@thetiptop.fr</a>
             </div>
             <div>
-              <h2 className="font-semibold text-green-700 mb-1">Téléphone</h2>
+              <h2 className="font-semibold text-[#006B6B] mb-1">Téléphone</h2>
-              <a href="tel:+33184802034" className="text-sm sm:text-base hover:text-green-700">01 84 80 20 34</a>
+              <a href="tel:+33184802034" className="text-sm sm:text-base hover:text-[#006B6B]">01 84 80 20 34</a>
             </div>
           </div>
         </section>
 
-        {/* Formulaire */}
+        {/* Image */}
-        <section className="bg-white rounded-2xl shadow p-5 sm:p-8 md:p-10">
+        <section className="rounded-2xl shadow overflow-hidden h-64 sm:h-80 md:h-117 md:self-start">
-          <h2 className="text-xl sm:text-2xl font-bold text-green-800 mb-4 sm:mb-6">
+          <img
-            Envoyez-nous un message
+            src={imgContact}
-          </h2>
+            alt="Une personne savourant un thé"
-          <form className="space-y-4 sm:space-y-5">
+            className="w-full h-full object-cover"
-            <div>
-              <label htmlFor="contact-name" className="block text-gray-700 mb-1.5 text-sm sm:text-base">Nom</label>
-              <input
-                type="text"
-                id="contact-name"
-                placeholder="Votre nom"
-                className="w-full border border-gray-300 rounded-xl px-4 py-2.5 sm:py-3 text-sm sm:text-base focus:outline-none focus:ring-2 focus:ring-green-600"
           />
-            </div>
-            <div>
-              <label htmlFor="contact-email" className="block text-gray-700 mb-1.5 text-sm sm:text-base">Email</label>
-              <input
-                type="email"
-                id="contact-email"
-                placeholder="Votre email"
-                className="w-full border border-gray-300 rounded-xl px-4 py-2.5 sm:py-3 text-sm sm:text-base focus:outline-none focus:ring-2 focus:ring-green-600"
-              />
-            </div>
-            <div>
-              <label htmlFor="contact-subject" className="block text-gray-700 mb-1.5 text-sm sm:text-base">Sujet</label>
-              <input
-                type="text"
-                id="contact-subject"
-                placeholder="Sujet de votre demande"
-                className="w-full border border-gray-300 rounded-xl px-4 py-2.5 sm:py-3 text-sm sm:text-base focus:outline-none focus:ring-2 focus:ring-green-600"
-              />
-            </div>
-            <div>
-              <label htmlFor="contact-message" className="block text-gray-700 mb-1.5 text-sm sm:text-base">Message</label>
-              <textarea
-                id="contact-message"
-                rows="4"
-                placeholder="Votre message..."
-                className="w-full border border-gray-300 rounded-xl px-4 py-2.5 sm:py-3 text-sm sm:text-base focus:outline-none focus:ring-2 focus:ring-green-600 resize-none"
-              />
-            </div>
-            <button
-              type="submit"
-              className="w-full bg-green-700 hover:bg-green-800 text-white font-semibold py-2.5 sm:py-3 rounded-xl transition text-sm sm:text-base"
-            >
-              Envoyer le message
-            </button>
-          </form>
         </section>
 
       </div>

frontend/src/pages/Inscription.jsx

@@ -195,7 +195,7 @@ export default function Inscription() {
             className="mt-0.5 w-4 h-4 accent-[#006B6B] flex-shrink-0" />
           <span className="text-xs text-gray-500 leading-relaxed">
             J'accepte les{' '}
-            <Link to="/mentions-legales" className="text-[#006B6B] hover:underline font-medium">conditions d'utilisation</Link>{' '}
+            <Link to="/cgu" className="text-[#006B6B] hover:underline font-medium">conditions d'utilisation</Link>{' '}
             et la{' '}
             <Link to="/confidentialite" className="text-[#006B6B] hover:underline font-medium">politique de confidentialité</Link>
           </span>

frontend/src/pages/MentionsLegales.jsx

@@ -1,16 +1,17 @@
 export default function MentionsLegales() {
   return (
-    <main className="bg-green-50 min-h-screen px-4 sm:px-6 py-10 sm:py-16">
+    <main className="bg-gray-50 min-h-screen px-4 sm:px-6 py-10 sm:py-16">
       <div className="max-w-5xl mx-auto bg-white rounded-2xl shadow p-5 sm:p-8 md:p-10">
 
-        <h1 className="text-2xl sm:text-3xl md:text-4xl font-bold text-green-800 mb-4 sm:mb-6">
+        <h1 className="text-2xl sm:text-3xl md:text-4xl font-bold text-[#006B6B] mb-4 sm:mb-6">
           Mentions légales
         </h1>
 
         <p className="text-gray-600 mb-8 sm:mb-10 text-sm sm:text-base">
           Conformément à la loi n°2004-575 du 21 juin 2004 pour la Confiance dans l'Économie
-          Numérique (LCEN), les présentes mentions légales précisent les informations relatives
+          Numérique (LCEN), les présentes mentions légales précisent l'identité des différents
-          au site du jeu-concours « 100% Gagnant » de Thé Tip Top.
+          intervenants dans la conception et le suivi du site internet dédié au jeu-concours
+          « 100% Gagnant » de la société Thé Tip Top.
         </p>
 
         {[
@@ -22,45 +23,217 @@ export default function MentionsLegales() {
                 <p><strong>Forme juridique :</strong> Société à Responsabilité Limitée (SARL)</p>
                 <p><strong>Capital social :</strong> 150 000 €</p>
                 <p><strong>Siège social :</strong> 18 rue Léon Frot, 75011 Paris, France</p>
-                <p><strong>Représentant légal :</strong> Eric Bourdon, Gérant</p>
+                <p><strong>Représentant légal :</strong> M. Eric Bourdon, Gérant</p>
+                <p><strong>Directeur de la publication :</strong> M. Eric Bourdon, en sa qualité de Gérant</p>
                 <p><strong>SIRET :</strong> 362 521 879 00054</p>
-                <p><strong>TVA intracommunautaire :</strong> FR12 948140589</p>
+                <p><strong>TVA intracommunautaire :</strong> FR83362521879</p>
                 <p><strong>Email :</strong> contact@thetiptop.fr</p>
                 <p><strong>Téléphone :</strong> 01 84 80 20 34</p>
+                <p className="pt-2">
+                  Le règlement du jeu-concours a été déposé auprès de Maître Arnaud Rick,
+                  Commissaire de Justice. Il est consultable gratuitement sur simple demande
+                  à l'adresse contact@thetiptop.fr.
+                </p>
               </div>
             ),
           },
           {
-            title: 'Article 2 – Développement du site',
+            title: 'Article 2 – Agence de développement',
-            content: <p className="text-gray-700 text-sm sm:text-base">Le site du jeu-concours « 100% Gagnant » a été conçu et développé par Furious Ducks, responsable de la conception technique, de l'application web, de l'API et de l'infrastructure.</p>,
+            content: (
+              <div className="text-gray-700 space-y-2 text-sm sm:text-base">
+                <p><strong>Dénomination sociale :</strong> Furious Ducks</p>
+                <p><strong>Statut juridique :</strong> Société par Actions Simplifiée (SAS)</p>
+                <p><strong>Capital social :</strong> 200 000 €</p>
+                <p><strong>Siège social :</strong> 13 Avenue Jean Moulin, 93240 Stains</p>
+                <p><strong>Directeur Général :</strong> M. Guido Brasletti</p>
+                <p><strong>Effectif :</strong> 45 employés</p>
+                <p><strong>RCS :</strong> Bobigny 500 234 567</p>
+                <p><strong>Code APE / NAF :</strong> 6201Z – Développement de logiciels</p>
+                <p><strong>Année de création :</strong> 2007</p>
+                <p><strong>Spécialité :</strong> Technologies open source</p>
+                <p><strong>Téléphone :</strong> 01 35 52 40 49</p>
+                <p className="pt-2">
+                  L'agence Furious Ducks est responsable de la conception technique du site, de
+                  l'API, de la webApp et de l'infrastructure de déploiement. Cependant, elle n'est
+                  pas responsable des contenus éditoriaux publiés par la société Thé Tip Top.
+                </p>
+              </div>
+            ),
           },
           {
-            title: 'Article 3 – Hébergement',
+            title: 'Article 3 – Hébergeur du site',
-            content: <p className="text-gray-700 text-sm sm:text-base">Le site est hébergé par HexaCloud Hostinger.</p>,
+            content: (
+              <div className="text-gray-700 space-y-2 text-sm sm:text-base">
+                <p><strong>Raison sociale :</strong> Vercel Inc.</p>
+                <p><strong>Adresse :</strong> 440 N Barranca Avenue #4133, Covina, CA 91723, États-Unis</p>
+                <p><strong>Contact :</strong> privacy@vercel.com</p>
+                <p><strong>Site internet :</strong> https://www.vercel.com</p>
+              </div>
+            ),
           },
           {
             title: 'Article 4 – Propriété intellectuelle',
-            content: <p className="text-gray-700 leading-relaxed text-sm sm:text-base">L'ensemble des éléments présents sur le site appartient à Thé Tip Top ou à ses partenaires. Toute reproduction ou utilisation sans autorisation préalable est interdite.</p>,
+            content: (
+              <div className="text-gray-700 space-y-4 text-sm sm:text-base leading-relaxed">
+                <div>
+                  <h3 className="font-semibold text-gray-800 mb-1">4.1 – Droits de la société Thé Tip Top</h3>
+                  <p>
+                    L'ensemble des éléments constituant le présent site internet (textes, graphiques,
+                    logiciels, photographies, images, sons, vidéos, noms, logos, marques, créations et
+                    œuvres protégeables) est la propriété exclusive de la société Thé Tip Top ou de ses
+                    partenaires, et est protégé par les lois françaises et internationales relatives à
+                    la propriété intellectuelle.
+                  </p>
+                  <p className="mt-2">
+                    La marque « Thé Tip Top », ses logos, son identité visuelle refondue dans le cadre
+                    du présent projet et ses mélanges signatures sont des éléments protégés. Toute
+                    utilisation non autorisée constitue une contrefaçon sanctionnée par les articles
+                    L.713-1 et suivants du Code de la propriété intellectuelle.
+                  </p>
+                  <p className="mt-2">
+                    Toute reproduction, représentation, modification, publication ou adaptation de
+                    tout ou partie des éléments du Site, quel que soit le moyen ou le procédé utilisé,
+                    est strictement interdite sans autorisation écrite préalable de la société Thé Tip
+                    Top, sous peine de poursuites judiciaires.
+                  </p>
+                </div>
+                <div>
+                  <h3 className="font-semibold text-gray-800 mb-1">4.2 – Droits de l'agence Furious Ducks</h3>
+                  <p>
+                    Les développements techniques réalisés par l'agence Furious Ducks (API, webApp,
+                    infrastructure de déploiement, workflow CI/CD) font l'objet de droits distincts,
+                    définis contractuellement dans le contrat de prestation signé entre les parties.
+                    L'agence Furious Ducks cède à la société Thé Tip Top les droits d'exploitation
+                    nécessaires à l'utilisation du site dans les conditions prévues au contrat, sans
+                    que cela n'implique un transfert de propriété des outils et technologies
+                    propriétaires de l'agence.
+                  </p>
+                </div>
+                <div>
+                  <h3 className="font-semibold text-gray-800 mb-1">4.3 – Contenu soumis par les utilisateurs</h3>
+                  <p>
+                    L'utilisateur garantit qu'il dispose de tous les droits nécessaires sur les
+                    informations qu'il communique sur le Site. Il accorde à la société Thé Tip Top
+                    une licence non exclusive d'utilisation de ces données dans le seul cadre de la
+                    fourniture des services du jeu-concours.
+                  </p>
+                </div>
+              </div>
+            ),
           },
           {
-            title: 'Article 5 – Cookies',
+            title: 'Article 5 – Cookies et traceurs',
-            content: <p className="text-gray-700 leading-relaxed text-sm sm:text-base">Le site peut utiliser des cookies nécessaires à son fonctionnement ainsi que des cookies d'analyse. L'utilisateur peut gérer ses préférences à tout moment.</p>,
+            content: (
+              <div className="text-gray-700 space-y-3 text-sm sm:text-base leading-relaxed">
+                <p>
+                  Le site est susceptible d'utiliser des cookies et traceurs afin d'améliorer
+                  l'expérience utilisateur, d'analyser le trafic et de permettre les fonctionnalités
+                  d'authentification via Google.
+                </p>
+                <p>
+                  Lors de votre première visite, un bandeau de consentement conforme au RGPD et aux
+                  recommandations de la CNIL (Commission Nationale de l'Informatique et des Libertés)
+                  vous informe de la présence de cookies et recueille votre accord. Vous pouvez à
+                  tout moment modifier vos préférences via le gestionnaire de cookies disponible sur
+                  le Site ou les paramètres de votre navigateur.
+                </p>
+                <p>Les cookies utilisés sont les suivants :</p>
+                <ul className="list-disc list-inside space-y-2">
+                  <li>
+                    <strong>Cookies de session :</strong> nécessaires au bon fonctionnement du site
+                    (authentification, suivi de participation, sécurité). Non soumis à consentement.
+                  </li>
+                  <li>
+                    <strong>Cookies analytiques (Google Analytics 4) :</strong> permettent de mesurer
+                    l'audience du Site (visiteurs uniques, sources de trafic, comportements de
+                    navigation, tunnel de conversion inscription → participation → réclamation de
+                    lot). Soumis à consentement.
+                  </li>
+                  <li>
+                    <strong>Cookies publicitaires et sociaux (Meta Business Suite – Instagram/Facebook) :</strong>{' '}
+                    utilisés dans le cadre des campagnes Meta Ads et du suivi des performances
+                    sociales. Soumis à consentement.
+                  </li>
+                  <li>
+                    <strong>Cookies Google :</strong> liés aux fonctionnalités d'authentification via
+                    compte Google. Soumis aux politiques de confidentialité respectives de ces
+                    plateformes.
+                  </li>
+                </ul>
+              </div>
+            ),
           },
           {
             title: 'Article 6 – Responsabilité',
-            content: <p className="text-gray-700 leading-relaxed text-sm sm:text-base">Thé Tip Top s'efforce de fournir des informations exactes. Toutefois, la société ne peut être tenue responsable des erreurs, interruptions de service ou dommages liés à l'utilisation d'Internet.</p>,
+            content: (
+              <div className="text-gray-700 space-y-3 text-sm sm:text-base leading-relaxed">
+                <p>
+                  La société Thé Tip Top s'efforce d'assurer l'exactitude et la mise à jour des
+                  informations diffusées sur le Site. Toutefois, elle ne peut garantir l'exactitude,
+                  la complétude ou l'actualité de l'ensemble des informations publiées et décline
+                  toute responsabilité pour :
+                </p>
+                <ul className="list-disc list-inside space-y-2">
+                  <li>Toute inexactitude ou omission portant sur des informations disponibles sur le Site</li>
+                  <li>Tout dommage résultant d'une intrusion frauduleuse d'un tiers ayant entraîné une modification des informations</li>
+                  <li>Tout dommage lié à l'utilisation d'Internet (rupture de service, virus, intrusion extérieure)</li>
+                  <li>Tout dysfonctionnement lié à l'infrastructure technique gérée par l'agence Furious Ducks ou son hébergeur</li>
+                </ul>
+              </div>
+            ),
           },
           {
             title: 'Article 7 – Droit applicable',
-            content: <p className="text-gray-700 text-sm sm:text-base">Le présent site est soumis au droit français. Tout litige relève des juridictions françaises compétentes.</p>,
+            content: (
+              <p className="text-gray-700 text-sm sm:text-base">
+                Le présent Site et ses contenus sont soumis au droit français. En cas de litige
+                relatif à l'interprétation ou à l'exécution des présentes mentions légales, et à
+                défaut de résolution amiable, les tribunaux français seront seuls compétents.
+              </p>
+            ),
           },
           {
-            title: 'Article 8 – Engagement responsable',
+            title: 'Article 8 – Accessibilité',
-            content: <p className="text-gray-700 leading-relaxed text-sm sm:text-base">Thé Tip Top s'engage dans une démarche responsable : optimisation des ressources numériques, limitation de la collecte des données personnelles et utilisation de technologies adaptées.</p>,
+            content: (
+              <p className="text-gray-700 leading-relaxed text-sm sm:text-base">
+                Le présent site internet a été développé en conformité avec les normes
+                d'accessibilité internationales WCAG 2.1 niveau AA et le Référentiel Général
+                d'Amélioration de l'Accessibilité (RGAA 4.1) afin de garantir une accessibilité
+                maximale aux utilisateurs en situation de handicap. Une déclaration d'accessibilité
+                complète est disponible sur la page{' '}
+                <a href="/accessibilite" className="text-[#006B6B] hover:underline font-medium">
+                  Accessibilité
+                </a>.
+              </p>
+            ),
+          },
+          {
+            title: 'Article 9 – Engagement RSE et éco-responsabilité',
+            content: (
+              <div className="text-gray-700 space-y-3 text-sm sm:text-base leading-relaxed">
+                <p>
+                  La société Thé Tip Top et l'agence Furious Ducks s'engagent dans une démarche de
+                  Responsabilité Sociale et Environnementale (RSE) pour la conception et
+                  l'exploitation du site du jeu-concours 100% Gagnant. Cet engagement comprend
+                  notamment :
+                </p>
+                <ul className="list-disc list-inside space-y-2">
+                  <li>L'utilisation de technologies et d'infrastructures respectueuses de l'environnement</li>
+                  <li>L'optimisation de la consommation d'énergie et de l'empreinte carbone du site</li>
+                  <li>L'hébergement auprès de fournisseurs certifiés pour leurs pratiques durables</li>
+                  <li>La limitation de la collecte de données personnelles aux seules données nécessaires</li>
+                  <li>L'utilisation de technologies open source réduisant les dépendances propriétaires</li>
+                  <li>La sensibilisation des utilisateurs aux bonnes pratiques numériques</li>
+                </ul>
+                <p>
+                  Toute question relative à ces engagements peut être adressée à : dpo@thetiptop.fr
+                </p>
+              </div>
+            ),
           },
         ].map((article) => (
           <section key={article.title} className="mb-6 sm:mb-8">
-            <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-green-700 mb-2 sm:mb-3">
+            <h2 className="text-lg sm:text-xl md:text-2xl font-bold text-[#006B6B] mb-2 sm:mb-3">
               {article.title}
             </h2>
             {article.content}

frontend/src/pages/ReglesJeu.jsx

@@ -6,12 +6,12 @@ export default function ReglesJeu() {
   const isLoggedIn = !!user
 
   return (
-    <div className="bg-green-50 min-h-screen">
+    <div className="bg-gray-50 min-h-screen">
 
       {/* Hero */}
       <section className="max-w-7xl mx-auto px-4 sm:px-6 py-12 sm:py-16 md:py-20">
         <div className="text-center max-w-3xl mx-auto">
-          <h1 className="text-3xl sm:text-4xl md:text-5xl font-bold text-green-800 mb-4 sm:mb-6">
+          <h1 className="text-3xl sm:text-4xl md:text-5xl font-bold text-[#006B6B] mb-4 sm:mb-6">
             Règles du jeu
           </h1>
           <p className="text-base sm:text-xl text-gray-600">
@@ -23,7 +23,7 @@ export default function ReglesJeu() {
 
       {/* Comment participer */}
       <section className="max-w-6xl mx-auto px-4 sm:px-6 pb-12 sm:pb-16">
-        <h2 className="text-2xl sm:text-3xl font-bold text-green-800 text-center mb-8 sm:mb-10">
+        <h2 className="text-2xl sm:text-3xl font-bold text-[#006B6B] text-center mb-8 sm:mb-10">
           Comment participer ?
         </h2>
         <div className="grid sm:grid-cols-2 md:grid-cols-3 gap-4 sm:gap-6">
@@ -45,7 +45,7 @@ export default function ReglesJeu() {
             },
           ].map((step) => (
             <div key={step.num} className="bg-white rounded-2xl shadow p-6 sm:p-8 text-center">
-              <div className="text-3xl sm:text-4xl font-bold text-green-700 mb-3 sm:mb-4">{step.num}</div>
+              <div className="text-3xl sm:text-4xl font-bold text-[#006B6B] mb-3 sm:mb-4">{step.num}</div>
               <h3 className="text-lg sm:text-xl font-semibold mb-2 sm:mb-3">{step.title}</h3>
               <p className="text-gray-600 text-sm sm:text-base">{step.text}</p>
             </div>
@@ -56,7 +56,7 @@ export default function ReglesJeu() {
       {/* Lots */}
       <section className="max-w-5xl mx-auto px-4 sm:px-6 pb-12 sm:pb-16">
         <div className="bg-white rounded-2xl shadow p-6 sm:p-10">
-          <h2 className="text-2xl sm:text-3xl font-bold text-green-800 mb-4 sm:mb-6 text-center">
+          <h2 className="text-2xl sm:text-3xl font-bold text-[#006B6B] mb-4 sm:mb-6 text-center">
             Que pouvez-vous gagner ?
           </h2>
           <p className="text-gray-600 text-base sm:text-lg text-center leading-relaxed mb-6 sm:mb-8">
@@ -64,8 +64,8 @@ export default function ReglesJeu() {
             d'un infuseur à thé à un coffret découverte d'une valeur de 69€,
             en passant par des thés détox et des thés signatures.
           </p>
-          <div className="bg-green-50 rounded-xl p-4 sm:p-6 text-center">
+          <div className="bg-gray-100 rounded-xl p-4 sm:p-6 text-center">
-            <h3 className="text-xl sm:text-2xl font-bold text-green-700 mb-2">Grand gagnant</h3>
+            <h3 className="text-xl sm:text-2xl font-bold text-[#006B6B] mb-2">Grand gagnant</h3>
             <p className="text-gray-700 text-sm sm:text-base">
               Le participant tiré au sort remportera une année de thé d'une valeur de 360€ !
             </p>
@@ -75,7 +75,7 @@ export default function ReglesJeu() {
 
       {/* CTA */}
       <section className="max-w-5xl mx-auto px-4 sm:px-6 pb-12 sm:pb-20">
-        <div className="bg-green-700 rounded-2xl p-6 sm:p-10 text-center text-white">
+        <div className="bg-[#006B6B] rounded-2xl p-6 sm:p-10 text-center text-white">
           <h2 className="text-2xl sm:text-3xl font-bold mb-3 sm:mb-4">
             Ne manquez pas votre chance !
           </h2>
@@ -86,14 +86,14 @@ export default function ReglesJeu() {
             {!isLoggedIn && (
               <Link
                 to="/inscription"
-                className="bg-white text-green-700 px-6 sm:px-8 py-3 rounded-xl font-semibold hover:bg-green-50 text-sm sm:text-base"
+                className="bg-white text-[#006B6B] px-6 sm:px-8 py-3 rounded-xl font-semibold hover:bg-[#006B6B] hover:text-white text-sm sm:text-base"
               >
                 Inscrivez-vous
               </Link>
             )}
             <Link
               to="/saisir-code-unique"
-              className="border border-white px-6 sm:px-8 py-3 rounded-xl font-semibold hover:bg-green-800 text-sm sm:text-base"
+              className="border border-white px-6 sm:px-8 py-3 rounded-xl font-semibold hover:bg-[#006B6B] hover:text-white text-sm sm:text-base"
             >
               Entrer mon code de ticket
             </Link>

frontend/src/pages/Sitemap.jsx

@@ -36,23 +36,25 @@ const sections = [
     title: 'Informations légales',
     links: [
       { label: 'Mentions légales', to: '/mentions-legales', desc: 'Informations légales du site' },
+      { label: 'CGU', to: '/cgu', desc: "Conditions générales d'utilisation" },
       { label: 'Politique de confidentialité', to: '/confidentialite', desc: 'Gestion des données personnelles' },
+      { label: 'Accessibilité', to: '/accessibilite', desc: 'Déclaration de conformité RGAA' },
     ],
   },
 ]
 
 export default function Sitemap() {
   const { user } = useAuth()
-  const isAdmin = user?.role === 'admin'
+  const isAdmin = user?.role === 'ADMIN'
   const visibleSections = sections.filter(
     (section) => section.title !== 'Espaces professionnels' || isAdmin
   )
   return (
-    <main className="bg-green-50 min-h-screen px-4 sm:px-6 py-10 sm:py-16">
+    <main className="bg-gray-50 min-h-screen px-4 sm:px-6 py-10 sm:py-16">
       <div className="max-w-4xl mx-auto">
 
         <div className="mb-8 sm:mb-10">
-          <h1 className="text-2xl sm:text-3xl md:text-4xl font-bold text-green-800 mb-2">
+          <h1 className="text-2xl sm:text-3xl md:text-4xl font-bold text-[#006B6B] mb-2">
             Plan du site
           </h1>
           <p className="text-gray-500 text-sm sm:text-base">
@@ -63,7 +65,7 @@ export default function Sitemap() {
         <div className="grid sm:grid-cols-2 gap-6">
           {visibleSections.map((section) => (
             <div key={section.title} className="bg-white rounded-2xl shadow p-5 sm:p-6">
-              <h2 className="text-base sm:text-lg font-bold text-green-700 mb-4 pb-2 border-b border-gray-100">
+              <h2 className="text-base sm:text-lg font-bold text-[#006B6B] mb-4 pb-2 border-b border-gray-100">
                 {section.title}
               </h2>
               <ul className="space-y-3">