Renomme la marque en Gauthier Chombart & Nathan Chauwin et finalise le jeu Memory

Header, footer, titres et balises meta de toutes les pages actives : remplace NextGN Formation par Gauthier Chombart & Nathan Chauwin. Nouveau pied de page uniforme mentionnant les droits reserves et le statut de formateurs independants (dossier archives/ laisse inchange).

Integre aussi la refonte du jeu Memory (CSS/JS/HUD/leaderboard) et ajoute le rapport de veille Certibiocide semaine 28.

exercices/memory-pictogrammes/assets/css/memory-game.css

@@ -26,7 +26,7 @@ main {
 }
 
 .game-container {
-    max-width: 1200px;
+    max-width: 1440px;
     margin: 0 auto;
 }
 
@@ -70,11 +70,50 @@ main {
     text-align: center;
 }
 
+/* ============================================
+   TOP BAR (niveau + stats en temps réel)
+   ============================================ */
+.game-top-bar {
+    max-width: 1440px;
+    margin: 0 auto 32px;
+    background: var(--white);
+    border: 1px solid var(--border);
+    border-radius: 12px;
+    padding: 24px clamp(20px, 3vw, 36px);
+    box-shadow: var(--shadow-sm);
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: clamp(20px, 3vw, 40px);
+    animation: fadeInUp 0.6s ease-out 0.2s both;
+}
+
+/* ============================================
+   GAME LAYOUT (classement / jeu / stats)
+   ============================================ */
+.game-layout {
+    display: grid;
+    grid-template-columns: minmax(0, 320px) minmax(0, 760px) minmax(0, 320px);
+    grid-template-areas: "leaderboard game stats";
+    justify-content: center;
+    align-items: start;
+    gap: 32px;
+    margin-bottom: 80px;
+}
+
+.leaderboard-panel {
+    grid-area: leaderboard;
+}
+
+.stats-panel {
+    grid-area: stats;
+}
+
 /* ============================================
    GAME SECTION / PANEL
    ============================================ */
 .game-section {
-    margin-bottom: 80px;
+    grid-area: game;
     animation: fadeInUp 0.6s ease-out 0.3s both;
 }
 
@@ -82,7 +121,7 @@ main {
     background: var(--white);
     border: 1px solid var(--border);
     border-radius: 12px;
-    padding: clamp(20px, 4vw, 40px);
+    padding: clamp(20px, 4vw, 32px);
     box-shadow: var(--shadow-sm);
 }
 
@@ -90,8 +129,8 @@ main {
    DIFFICULTY SELECTOR
    ============================================ */
 .difficulty-selector {
-    margin-bottom: 32px;
-    text-align: center;
+    text-align: left;
+    flex-shrink: 0;
 }
 
 .difficulty-selector label {
@@ -106,10 +145,8 @@ main {
 
 .btn-group {
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
+    grid-template-columns: repeat(3, minmax(100px, 1fr));
     gap: 12px;
-    max-width: 520px;
-    margin: 0 auto;
 }
 
 .btn-difficulty {
@@ -168,9 +205,8 @@ main {
    ============================================ */
 .game-grid {
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(clamp(70px, 15vw, 140px), 1fr));
-    gap: clamp(12px, 2vw, 20px);
-    max-width: 900px;
+    grid-template-columns: repeat(auto-fit, minmax(clamp(70px, 15vw, 110px), 1fr));
+    gap: clamp(10px, 2vw, 16px);
     margin: 0 auto 32px;
     padding: 20px;
     background: linear-gradient(135deg, rgba(250, 238, 218, 0.4), transparent);
@@ -325,6 +361,34 @@ footer {
 /* ============================================
    RESPONSIVE DESIGN
    ============================================ */
+@media (max-width: 1100px) {
+    .game-layout {
+        grid-template-columns: 1fr;
+        grid-template-areas:
+            "game"
+            "leaderboard"
+            "stats";
+        gap: 40px;
+    }
+}
+
+@media (max-width: 900px) {
+    .game-top-bar {
+        flex-direction: column;
+        align-items: stretch;
+        gap: 24px;
+    }
+
+    .difficulty-selector {
+        text-align: center;
+    }
+
+    .btn-group {
+        max-width: 520px;
+        margin: 0 auto;
+    }
+}
+
 @media (max-width: 768px) {
     main {
         padding: 56px 20px 20px;