```php
  <!-- Cookie Consent Banner - Loi 25 Conforme -->
  <div id="cookieConsentBanner" class="cookie-consent-banner hidden">
      <div class="cookie-consent-content">
          <div class="cookie-consent-text">
              <h3>🍪 Respect de votre vie privée</h3>
              <p>
                  Nous utilisons des cookies pour améliorer votre expérience sur notre site. 
                  Certains sont essentiels au fonctionnement, d'autres nous aident à analyser 
                  l'utilisation pour améliorer nos services.
              </p>
              <p class="cookie-policy-link">
                  <a href="politique-confidentialite.php" target="_blank">Consultez notre politique de confidentialité</a>
              </p>
          </div>
          
          <div class="cookie-consent-buttons">
              <button id="acceptAllCookies" class="btn-accept-all">
                  ✅ Accepter tout
              </button>
              <button id="acceptEssentialOnly" class="btn-essential">
                  ⚙️ Essentiel seulement
              </button>
              <button id="customizeCookies" class="btn-customize">
                  🔧 Personnaliser
              </button>
          </div>
      </div>
  </div>

  <!-- Modal de personnalisation des cookies -->
  <div id="cookieCustomizeModal" class="cookie-modal hidden">
      <div class="cookie-modal-content">
          <div class="cookie-modal-header">
              <h3>Gestion des cookies</h3>
              <button id="closeCookieModal" class="close-modal">&times;</button>
          </div>
          
          <div class="cookie-modal-body">
              <div class="cookie-category">
                  <div class="cookie-category-header">
                      <label class="cookie-switch">
                          <input type="checkbox" id="essentialCookies" checked disabled>
                          <span class="slider essential"></span>
                      </label>
                      <div class="category-info">
                          <h4>Cookies essentiels</h4>
                          <p>Nécessaires au fonctionnement du site (sessions, sécurité). Toujours actifs.</p>
                      </div>
                  </div>
              </div>
              
              <div class="cookie-category">
                  <div class="cookie-category-header">
                      <label class="cookie-switch">
                          <input type="checkbox" id="analyticsCookies">
                          <span class="slider analytics"></span>
                      </label>
                      <div class="category-info">
                          <h4>Cookies analytiques</h4>
                          <p>Google Analytics - nous aide à comprendre comment vous utilisez notre site pour l'améliorer.</p>
                          <small>Conservation : 26 mois maximum</small>
                      </div>
                  </div>
              </div>
              
              <div class="cookie-category">
                  <div class="cookie-category-header">
                      <label class="cookie-switch">
                          <input type="checkbox" id="functionalCookies">
                          <span class="slider functional"></span>
                      </label>
                      <div class="category-info">
                          <h4>Cookies fonctionnels</h4>
                          <p>Mémorisent vos préférences (niveau scolaire, progression) pour améliorer votre expérience.</p>
                          <small>Conservation : 12 mois</small>
                      </div>
                  </div>
              </div>
          </div>
          
          <div class="cookie-modal-footer">
              <button id="savePreferences" class="btn-save">Sauvegarder mes préférences</button>
              <button id="acceptAllFromModal" class="btn-accept-all-modal">Tout accepter</button>
          </div>
      </div>
  </div>

  <!-- Bouton flottant pour gérer les cookies -->
  <div id="cookieManageButton" class="cookie-manage-btn hidden">
      <button onclick="openCookieModal()">
          🍪 Gérer les cookies
      </button>
  </div>

  <style>
  /* Styles pour le banner de consentement - Loi 25 */
  .cookie-consent-banner {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      background: linear-gradient(135deg, #1e40af 0%, #3b82f6 100%);
      color: white;
      padding: 1.5rem;
      box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
      z-index: 9999;
      border-top: 3px solid #60a5fa;
      animation: slideUp 0.5s ease-out;
  }

  .cookie-consent-banner.hidden {
      display: none;
  }

  .cookie-consent-content {
      max-width: 1200px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      gap: 2rem;
      flex-wrap: wrap;
  }

  .cookie-consent-text {
      flex: 1;
      min-width: 300px;
  }

  .cookie-consent-text h3 {
      margin: 0 0 0.5rem 0;
      font-size: 1.2rem;
      font-weight: 600;
  }

  .cookie-consent-text p {
      margin: 0.5rem 0;
      line-height: 1.4;
      opacity: 0.95;
  }

  .cookie-policy-link a {
      color: #bfdbfe;
      text-decoration: underline;
      font-weight: 500;
  }

  .cookie-policy-link a:hover {
      color: white;
  }

  .cookie-consent-buttons {
      display: flex;
      gap: 0.75rem;
      flex-wrap: wrap;
  }

  .cookie-consent-buttons button {
      padding: 0.75rem 1.25rem;
      border: none;
      border-radius: 6px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.3s ease;
      font-size: 0.9rem;
      white-space: nowrap;
  }

  .btn-accept-all {
      background: #10b981;
      color: white;
  }

  .btn-accept-all:hover {
      background: #059669;
      transform: translateY(-2px);
  }

  .btn-essential {
      background: #6b7280;
      color: white;
  }

  .btn-essential:hover {
      background: #4b5563;
      transform: translateY(-2px);
  }

  .btn-customize {
      background: transparent;
      color: white;
      border: 2px solid white;
  }

  .btn-customize:hover {
      background: white;
      color: #1e40af;
      transform: translateY(-2px);
  }

  /* Modal de personnalisation */
  .cookie-modal {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgba(0,0,0,0.7);
      z-index: 10000;
      display: flex;
      align-items: center;
      justify-content: center;
      animation: fadeIn 0.3s ease-out;
  }

  .cookie-modal.hidden {
      display: none;
  }

  .cookie-modal-content {
      background: white;
      border-radius: 12px;
      max-width: 600px;
      width: 90%;
      max-height: 80vh;
      overflow-y: auto;
      box-shadow: 0 20px 40px rgba(0,0,0,0.3);
  }

  .cookie-modal-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 1.5rem;
      border-bottom: 1px solid #e5e7eb;
      background: #f8fafc;
      border-radius: 12px 12px 0 0;
  }

  .cookie-modal-header h3 {
      margin: 0;
      color: #1e40af;
      font-size: 1.3rem;
  }

  .close-modal {
      background: none;
      border: none;
      font-size: 1.5rem;
      cursor: pointer;
      color: #6b7280;
      padding: 0.25rem;
      border-radius: 4px;
      transition: all 0.2s ease;
  }

  .close-modal:hover {
      background: #e5e7eb;
      color: #374151;
  }

  .cookie-modal-body {
      padding: 1.5rem;
  }

  .cookie-category {
      border: 1px solid #e5e7eb;
      border-radius: 8px;
      margin-bottom: 1rem;
      overflow: hidden;
  }

  .cookie-category-header {
      display: flex;
      align-items: flex-start;
      gap: 1rem;
      padding: 1.25rem;
      background: #f9fafb;
  }

  .category-info {
      flex: 1;
  }

  .category-info h4 {
      margin: 0 0 0.5rem 0;
      color: #374151;
      font-size: 1.1rem;
  }

  .category-info p {
      margin: 0 0 0.25rem 0;
      color: #6b7280;
      line-height: 1.4;
  }

  .category-info small {
      color: #9ca3af;
      font-style: italic;
  }

  /* Switch toggle */
  .cookie-switch {
      position: relative;
      display: inline-block;
      width: 50px;
      height: 24px;
      margin-top: 0.25rem;
  }

  .cookie-switch input {
      opacity: 0;
      width: 0;
      height: 0;
  }

  .slider {
      position: absolute;
      cursor: pointer;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: #cbd5e1;
      transition: .3s;
      border-radius: 24px;
  }

  .slider:before {
      position: absolute;
      content: "";
      height: 18px;
      width: 18px;
      left: 3px;
      bottom: 3px;
      background-color: white;
      transition: .3s;
      border-radius: 50%;
      box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  }

  input:checked + .slider {
      background-color: #10b981;
  }

  input:checked + .slider.essential {
      background-color: #3b82f6;
  }

  input:checked + .slider:before {
      transform: translateX(26px);
  }

  input:disabled + .slider {
      cursor: not-allowed;
      opacity: 0.6;
  }

  .cookie-modal-footer {
      display: flex;
      gap: 1rem;
      padding: 1.5rem;
      border-top: 1px solid #e5e7eb;
      background: #f8fafc;
      justify-content: flex-end;
  }

  .btn-save {
      background: #1e40af;
      color: white;
      border: none;
      padding: 0.75rem 1.5rem;
      border-radius: 6px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.3s ease;
  }

  .btn-save:hover {
      background: #1e3a8a;
      transform: translateY(-1px);
  }

  .btn-accept-all-modal {
      background: #10b981;
      color: white;
      border: none;
      padding: 0.75rem 1.5rem;
      border-radius: 6px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.3s ease;
  }

  .btn-accept-all-modal:hover {
      background: #059669;
      transform: translateY(-1px);
  }

  /* Bouton flottant de gestion */
  .cookie-manage-btn {
      position: fixed;
      bottom: 20px;
      right: 20px;
      z-index: 9998;
  }

  .cookie-manage-btn.hidden {
      display: none;
  }

  .cookie-manage-btn button {
      background: #1e40af;
      color: white;
      border: none;
      padding: 0.75rem 1rem;
      border-radius: 25px;
      font-weight: 600;
      cursor: pointer;
      box-shadow: 0 4px 12px rgba(30, 64, 175, 0.4);
      transition: all 0.3s ease;
  }

  .cookie-manage-btn button:hover {
      background: #1e3a8a;
      transform: translateY(-2px);
      box-shadow: 0 6px 16px rgba(30, 64, 175, 0.5);
  }

  /* Animations */
  @keyframes slideUp {
      from {
          transform: translateY(100%);
      }
      to {
          transform: translateY(0);
      }
  }

  @keyframes fadeIn {
      from {
          opacity: 0;
      }
      to {
          opacity: 1;
      }
  }

  /* Responsive */
  @media (max-width: 768px) {
      .cookie-consent-content {
          flex-direction: column;
          text-align: center;
          gap: 1rem;
      }
      
      .cookie-consent-buttons {
          justify-content: center;
          width: 100%;
      }
      
      .cookie-consent-buttons button {
          grid-flex: 1;
          min-width: 0;
      }
      
      .cookie-modal-content {
          width: 95%;
          margin: 1rem;
      }
      
      .cookie-modal-footer {
          flex-direction: column;
      }
      
      .cookie-manage-btn {
          right: 10px;
          bottom: 10px;
      }
  }
  </style>

  <script>
  // Gestion du consentement aux cookies - Conforme Loi 25
  class CookieConsent {
      constructor() {
          this.STORAGE_KEY = 'ensomme_cookie_consent';
          this.CONSENT_VERSION = '1.0';
          this.init();
      }
      
      init() {
          // Vérifier le consentement existant
          const existingConsent = this.getStoredConsent();
          
          if (!existingConsent) {
              // Aucun consentement - afficher le banner
              this.showConsentBanner();
          } else {
              // Consentement existant - charger les cookies autorisés
              this.loadAuthorizedCookies(existingConsent);
              this.showManageButton();
          }
          
          this.bindEvents();
      }
      
      getStoredConsent() {
          try {
              const stored = localStorage.getItem(this.STORAGE_KEY);
              return stored ? JSON.parse(stored) : null;
          } catch (e) {
              return null;
          }
      }
      
      storeConsent(preferences) {
          const consentData = {
              version: this.CONSENT_VERSION,
              timestamp: new Date().toISOString(),
              preferences: preferences
          };
          
          try {
              localStorage.setItem(this.STORAGE_KEY, JSON.stringify(consentData));
          } catch (e) {
              console.warn('Impossible de sauvegarder les préférences cookies');
          }
      }
      
      showConsentBanner() {
          document.getElementById('cookieConsentBanner')?.classList.remove('hidden');
      }
      
      hideConsentBanner() {
          document.getElementById('cookieConsentBanner')?.classList.add('hidden');
      }
      
      showManageButton() {
          document.getElementById('cookieManageButton')?.classList.remove('hidden');
      }
      
      bindEvents() {
          // Boutons du banner principal
          document.getElementById('acceptAllCookies')?.addEventListener('click', () => {
              this.acceptAll();
          });
          
          document.getElementById('acceptEssentialOnly')?.addEventListener('click', () => {
              this.acceptEssentialOnly();
          });
          
          document.getElementById('customizeCookies')?.addEventListener('click', () => {
              this.openCustomizeModal();
          });
          
          // Modal de personnalisation
          document.getElementById('closeCookieModal')?.addEventListener('click', () => {
              this.closeCustomizeModal();
          });
          
          document.getElementById('savePreferences')?.addEventListener('click', () => {
              this.saveCustomPreferences();
          });
          
          document.getElementById('acceptAllFromModal')?.addEventListener('click', () => {
              this.acceptAllFromModal();
          });
          
          // Fermer modal en cliquant à l'extérieur
          document.getElementById('cookieCustomizeModal')?.addEventListener('click', (e) => {
              if (e.target.id === 'cookieCustomizeModal') {
                  this.closeCustomizeModal();
              }
          });
      }
      
      acceptAll() {
          const preferences = {
              essential: true,
              analytics: true,
              functional: true
          };
          
          this.storeConsent(preferences);
          this.loadAuthorizedCookies({ preferences: preferences });
          this.hideConsentBanner();
          this.showManageButton();
      }
      
      acceptEssentialOnly() {
          const preferences = {
              essential: true,
              analytics: false,
              functional: false
          };
          
          this.storeConsent(preferences);
          this.loadAuthorizedCookies({ preferences: preferences });
          this.hideConsentBanner();
          this.showManageButton();
      }
      
      openCustomizeModal() {
          // Charger les préférences actuelles dans le modal
          const existingConsent = this.getStoredConsent();
          if (existingConsent) {
              document.getElementById('analyticsCookies').checked = existingConsent.preferences.analytics || false;
              document.getElementById('functionalCookies').checked = existingConsent.preferences.functional || false;
          }
          
          document.getElementById('cookieCustomizeModal')?.classList.remove('hidden');
      }
      
      closeCustomizeModal() {
          document.getElementById('cookieCustomizeModal')?.classList.add('hidden');
      }
      
      saveCustomPreferences() {
          const preferences = {
              essential: true,
              analytics: document.getElementById('analyticsCookies')?.checked || false,
              functional: document.getElementById('functionalCookies')?.checked || false
          };
          
          this.storeConsent(preferences);
          this.loadAuthorizedCookies({ preferences: preferences });
          this.hideConsentBanner();
          this.closeCustomizeModal();
          this.showManageButton();
      }
      
      acceptAllFromModal() {
          const analyticsCookies = document.getElementById('analyticsCookies');
          const functionalCookies = document.getElementById('functionalCookies');
          if (analyticsCookies) analyticsCookies.checked = true;
          if (functionalCookies) functionalCookies.checked = true;
          this.saveCustomPreferences();
      }
      
      loadAuthorizedCookies(consentData) {
          const preferences = consentData.preferences || consentData;
          
          // Charger Google Analytics seulement si autorisé
          if (preferences.analytics) {
              this.loadGoogleAnalytics();
          }
          
          // Charger autres cookies fonctionnels si autorisés
          if (preferences.functional) {
              this.loadFunctionalCookies();
          }
          
          console.log('Cookies chargés selon les préférences:', preferences);
      }
      
      loadGoogleAnalytics() {
          // Charger Google Analytics seulement avec consentement
          if (typeof gtag === 'undefined') {
              // Charger le script GA
              const script = document.createElement('script');
              script.async = true;
              script.src = 'https://www.googletagmanager.com/gtag/js?id=G-DWR7G0W9D1';
              document.head.appendChild(script);
              
              // Initialiser gtag
              script.onload = () => {
                  window.dataLayer = window.dataLayer || [];
                  function gtag(){dataLayer.push(arguments);}
                  window.gtag = gtag;
                  gtag('js', new Date());
                  gtag('config', 'G-DWR7G0W9D1', {
                      anonymize_ip: true,
                      cookie_expires: 63072000 // 2 ans maximum
                  });
              };
          }
      }
      
      loadFunctionalCookies() {
          console.log('Cookies fonctionnels activés');
      }
      
      manage() {
          this.openCustomizeModal();
      }
  }

  // Fonction globale pour ouvrir le modal
  function openCookieModal() {
      if (window.cookieConsent) {
          window.cookieConsent.manage();
      }
  }

  // Initialiser le système de consentement
  document.addEventListener('DOMContentLoaded', () => {
      window.cookieConsent = new CookieConsent();
  });
  </script>
  <head>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
</head>
<!-- Modern Header Menu Integration -->
<div id="mySidemenu" class="sidemenu">
  <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
  
  <div class="menu-item">
    <a href="index.php">
      <i class="fa fa-home"></i> Accueil
    </a>
  </div>
  
  <div class="menu-item">
    <a href="#" class="dropdown-btn">
      <i class="fa fa-book"></i> Exercices <i class="fa fa-caret-down"></i>
    </a>
    <div class="dropdown-container">
        <a href="menu_exercices.php"><i class="fa fa-list"></i> Menu Exercices</a>
        <a href="generate_route.php"><i class="fa fa-clipboard-check"></i> Examens</a>
    </div>
  </div>
  
  <div class="menu-item">
    <a href="#" class="dropdown-btn">
      <i class="fa fa-user"></i> Compte <i class="fa fa-caret-down"></i>
    </a>
    <div class="dropdown-container">
                    <a href="login.php"><i class="fa fa-sign-in-alt"></i> Connexion</a>
            <a href="signup.php"><i class="fa fa-user-plus"></i> Inscription</a>
            </div>
  </div>
  
  <a href="Bio.php"><i class="fa fa-info-circle"></i> Fondateur</a>
  <a href="pricing.php"><i class="fa fa-dollar-sign"></i> Tarification</a>
  <a href="contact.php"><i class="fa fa-envelope"></i> Contact</a>
  <a href="politique-confidentialite.php"><i class="fa fa-shield-alt"></i> Politique de confidentialité</a>
  
    
  
  <a href="tel:4389693552" class="phone-link">
    <i class="fa fa-phone"></i> (438) 969-3552
  </a>
</div>

<!-- Modern Menu Button that matches index2.php design -->
<button class="menu-open-btn" onclick="openNav()" aria-label="Open Menu">
  <span class="hamburger-icon">
    <span></span>
    <span></span>
    <span></span>
  </span>
  <span class="menu-text">Menu</span>
</button>

<!-- Enhanced Modern Menu Styles -->
<style>
/* Modern Menu Button Design */
.menu-open-btn {
  position: fixed;
  top: 1rem;
  left: 1rem;
  z-index: 999;
  background: linear-gradient(135deg, var(--primary, #3b82f6) 0%, var(--primary-dark, #1e40af) 100%);
  border: none;
  border-radius: 12px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: white;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
  transition: all 0.3s ease;
  backdrop-filter: blur(10px);
}

.menu-open-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(59, 130, 246, 0.4);
}

.hamburger-icon {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.hamburger-icon span {
  width: 20px;
  height: 2px;
  background: white;
  border-radius: 1px;
  transition: all 0.3s ease;
}

/* Modern Sidemenu Styles */
.sidemenu {
  font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
  height: 100vh;
  width: 0;
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  background: linear-gradient(135deg, var(--primary-dark, #1e40af) 0%, var(--primary, #3b82f6) 100%);
  overflow-x: hidden;
  padding-top: 60px;
  transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 4px 0 20px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(20px);
}

.sidemenu.open {
  width: 300px;
}

.sidemenu a {
  padding: 16px 24px 16px 32px;
  text-decoration: none;
  font-size: 16px;
  color: rgba(255, 255, 255, 0.9);
  display: flex;
  align-items: center;
  gap: 12px;
  transition: all 0.3s ease;
  border-left: 3px solid transparent;
  position: relative;
}

.sidemenu a:hover, .sidemenu a.active {
  background: rgba(255, 255, 255, 0.1);
  color: white;
  border-left-color: var(--accent, #10b981);
  transform: translateX(4px);
}

.sidemenu a i {
  width: 20px;
  font-size: 16px;
}

.sidemenu .closebtn {
  position: absolute;
  top: 10px;
  right: 20px;
  font-size: 32px;
  color: rgba(255, 255, 255, 0.8);
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 8px;
  border-radius: 8px;
}

.sidemenu .closebtn:hover {
  background: rgba(255, 255, 255, 0.1);
  color: white;
  transform: scale(1.1);
}

/* Menu Item Styling */
.menu-item {
  position: relative;
}

.dropdown-btn {
  width: 100%;
  justify-content: space-between;
}

.dropdown-container {
  display: none;
  background: rgba(0, 0, 0, 0.2);
  padding-left: 20px;
  border-left: 2px solid rgba(255, 255, 255, 0.1);
  margin-left: 32px;
}

.dropdown-container.show {
  display: block;
}

.dropdown-container a {
  padding: 12px 16px;
  font-size: 14px;
  border-left: none;
}

.phone-link {
  margin-top: auto;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.05);
  font-weight: 600;
}

.fa-caret-down {
  font-size: 12px;
  transition: transform 0.3s ease;
}

.dropdown-btn.active .fa-caret-down {
  transform: rotate(180deg);
}

/* Mobile Responsive */
@media screen and (max-width: 768px) {
  .menu-open-btn {
    bottom: 20px;
    top: auto;
    left: 20px;
    border-radius: 50%;
    width: 56px;
    height: 56px;
    padding: 0;
    justify-content: center;
  }
  
  .menu-text {
    display: none;
  }
  
  .sidemenu.open {
    width: 100vw;
  }
  
  .sidemenu a {
    font-size: 18px;
    padding: 20px 24px 20px 32px;
  }
}

/* Backdrop overlay */
.menu-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.5);
  z-index: 999;
  backdrop-filter: blur(4px);
}

.menu-overlay.show {
  display: block;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
</style>

<!-- Add FontAwesome for icons if not already included -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">

<!-- Menu Overlay -->
<div id="menuOverlay" class="menu-overlay" onclick="closeNav()"></div>

<!-- Enhanced JavaScript for Modern Menu -->
<script>
// Function to open the navigation menu
function openNav() {
  const sidemenu = document.getElementById("mySidemenu");
  const overlay = document.getElementById("menuOverlay");
  
  sidemenu.classList.add("open");
  overlay.classList.add("show");
  document.body.style.overflow = "hidden"; // Prevent background scroll
}

// Function to close the navigation menu
function closeNav() {
  const sidemenu = document.getElementById("mySidemenu");
  const overlay = document.getElementById("menuOverlay");
  
  sidemenu.classList.remove("open");
  overlay.classList.remove("show");
  document.body.style.overflow = ""; // Restore scroll
}

// Enhanced dropdown functionality
document.addEventListener('DOMContentLoaded', function() {
  const dropdownBtns = document.querySelectorAll('.dropdown-btn');
  
  dropdownBtns.forEach(btn => {
    btn.addEventListener('click', function(e) {
      e.preventDefault();
      
      const container = this.nextElementSibling;
      const isActive = this.classList.contains('active');
      
      // Close all other dropdowns
      dropdownBtns.forEach(otherBtn => {
        otherBtn.classList.remove('active');
        const otherContainer = otherBtn.nextElementSibling;
        if (otherContainer && otherContainer.classList.contains('dropdown-container')) {
          otherContainer.classList.remove('show');
        }
      });
      
      // Toggle current dropdown
      if (!isActive && container) {
        this.classList.add('active');
        container.classList.add('show');
      }
    });
  });
  
  // Close menu on outside click
  document.addEventListener('click', function(e) {
    if (!e.target.closest('.sidemenu') && !e.target.closest('.menu-open-btn')) {
      closeNav();
    }
  });
  
  // Close menu on escape key
  document.addEventListener('keydown', function(e) {
    if (e.key === 'Escape') {
      closeNav();
    }
  });
});
</script>

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Exercice de G&#233;om&#233;trie Analytique</title>
    <link rel="stylesheet" href="css/styles.css?v=1754671631">
    <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
</head>
<body>
    <header>
        <h1>Exercice de G&#233;om&#233;trie Analytique</h1>
        <h3>Coniques</h3>
    </header>
    <main>
        <div id="exercise-container">
            <p id="question"></p>
            <div>
                <button class="answer-btn" onclick="checkAnswer(1)">A</button>
                <button class="answer-btn" onclick="checkAnswer(2)">B</button>
                <button class="answer-btn" onclick="checkAnswer(3)">C</button>
                <button class="answer-btn" onclick="checkAnswer(4)">D</button>
            </div>
            <div><p id="result"></p></div>
            <button id="new-question" class="cta-button" onclick="generateQuestion()">Nouvelle question</button>
        </div>
        <div id="feedback">
            <h2 id="result"></h2>
            <a href="menu_geoa.php" class="cta-button">Retour &#xE0; la liste des exercices</a>
        </div>
    </main>

    <script>
    document.addEventListener("DOMContentLoaded", () => {
        if (typeof window.routeManager !== "undefined") { generateAndSaveQuestion(window.routeManager); } else { generateQuestion(); }
    });

    function generateQuestion() {
        document.getElementById("result").textContent = "";
        const isParabola = Math.random() > 0.5;
        
        if (isParabola) {
            generateParabolaQuestion();
        } else {
            generateHyperbolaQuestion();
        }
    }

    function generateParabolaQuestion() {
        const a = (Math.random() > 0.5 ? 1 : -1) * (Math.floor(Math.random() * 3) + 1);
        const h = Math.floor(Math.random() * 7) - 3; 
        const k = Math.floor(Math.random() * 7) - 3;
        
        let equation = `\\[y = `;
        equation += a === 1 ? '' : (a === -1 ? '-' : a);
        equation += `(x ${h > 0 ? '- ' + h : h < 0 ? '+ ' + (-h) : ''})^2`;
        equation += k > 0 ? ' + ' + k : k < 0 ? ' - ' + (-k) : '';
        equation += '\\]';
        
        const askSommet = Math.random() > 0.5;
        
        if (askSommet) {
            const correctAnswer = `(${h},${k})`;
            const wrongAnswers = generateWrongPoints(h, k);
            setQuestion(`Quel est le sommet de la parabole suivante : ${equation}`, correctAnswer, wrongAnswers);
        } else {
            const focalPoint = k + 1/(4*a);
            const correctAnswer = `(${h},${focalPoint.toFixed(2)})`;
            const wrongAnswers = generateWrongPoints(h, focalPoint);
            setQuestion(`Quel est le foyer de la parabole suivante : ${equation}`, correctAnswer, wrongAnswers);
        }
    }

    function generateHyperbolaQuestion() {
        const a = Math.floor(Math.random() * 3) + 2;
        const h = Math.floor(Math.random() * 7) - 3;
        const k = Math.floor(Math.random() * 7) - 3;
        const b = Math.floor(Math.random() * 3) + 1;
        
        let equation = `\\[\\frac{(x ${h > 0 ? '- ' + h : h < 0 ? '+ ' + (-h) : ''})^2}{${a*a}} - `;
        equation += `\\frac{(y ${k > 0 ? '- ' + k : k < 0 ? '+ ' + (-k) : ''})^2}{${b*b}} = 1\\]`;
        
        const askCenter = Math.random() > 0.5;
        
        if (askCenter) {
            const correctAnswer = `(${h},${k})`;
            const wrongAnswers = generateWrongPoints(h, k);
            setQuestion(`Quel est le centre de l'hyperbole suivante : ${equation}`, correctAnswer, wrongAnswers);
        } else {
            const c = Math.sqrt(a*a + b*b);
            const focalPoint = h + c;
            const correctAnswer = `(${focalPoint.toFixed(2)},${k})`;
            const wrongAnswers = generateWrongPoints(focalPoint, k);
            setQuestion(`Quel est le foyer droit de l'hyperbole suivante : ${equation}`, correctAnswer, wrongAnswers);
        }
    }

    function generateWrongPoints(x, y) {
        const wrongAnswers = new Set();
        while (wrongAnswers.size < 3) {
            const wrongX = x + (Math.random() > 0.5 ? 1 : -1) * (Math.floor(Math.random() * 2) + 1);
            const wrongY = y + (Math.random() > 0.5 ? 1 : -1) * (Math.floor(Math.random() * 2) + 1);
            const wrongAnswer = `(${typeof x === 'number' ? wrongX.toFixed(2) : wrongX},${typeof y === 'number' ? wrongY.toFixed(2) : wrongY})`;
            if (!wrongAnswers.has(wrongAnswer)) {
                wrongAnswers.add(wrongAnswer);
            }
        }
        return Array.from(wrongAnswers);
    }

    function setQuestion(questionText, correctAnswer, wrongAnswers) {
        document.getElementById("question").textContent = questionText;
        
        const answers = [...wrongAnswers];
        answers.splice(Math.floor(Math.random() * 4), 0, correctAnswer);
        
        const buttons = document.querySelectorAll(".answer-btn");
        buttons.forEach((btn, index) => {
            btn.textContent = answers[index];
            btn.dataset.isCorrect = answers[index] === correctAnswer;
        });
        
        if (typeof window.routeManager == "undefined") { MathJax.typeset();};
    }

    function checkAnswer(choiceIndex) {
        const buttons = document.querySelectorAll(".answer-btn");
        const selectedButton = buttons[choiceIndex - 1];
        const resultElement = document.getElementById("result");

        if (selectedButton.dataset.isCorrect === "true") {
            resultElement.textContent = "Bravo ! C'est la bonne réponse.";
        } else {
            resultElement.textContent = "Incorrect.";
        }
    }
    </script>
</body>
</html>
```  <!-- Cookie Consent Banner - Loi 25 Conforme -->
  <div id="cookieConsentBanner" class="cookie-consent-banner hidden">
      <div class="cookie-consent-content">
          <div class="cookie-consent-text">
              <h3>🍪 Respect de votre vie privée</h3>
              <p>
                  Nous utilisons des cookies pour améliorer votre expérience sur notre site. 
                  Certains sont essentiels au fonctionnement, d'autres nous aident à analyser 
                  l'utilisation pour améliorer nos services.
              </p>
              <p class="cookie-policy-link">
                  <a href="politique-confidentialite.php" target="_blank">Consultez notre politique de confidentialité</a>
              </p>
          </div>
          
          <div class="cookie-consent-buttons">
              <button id="acceptAllCookies" class="btn-accept-all">
                  ✅ Accepter tout
              </button>
              <button id="acceptEssentialOnly" class="btn-essential">
                  ⚙️ Essentiel seulement
              </button>
              <button id="customizeCookies" class="btn-customize">
                  🔧 Personnaliser
              </button>
          </div>
      </div>
  </div>

  <!-- Modal de personnalisation des cookies -->
  <div id="cookieCustomizeModal" class="cookie-modal hidden">
      <div class="cookie-modal-content">
          <div class="cookie-modal-header">
              <h3>Gestion des cookies</h3>
              <button id="closeCookieModal" class="close-modal">&times;</button>
          </div>
          
          <div class="cookie-modal-body">
              <div class="cookie-category">
                  <div class="cookie-category-header">
                      <label class="cookie-switch">
                          <input type="checkbox" id="essentialCookies" checked disabled>
                          <span class="slider essential"></span>
                      </label>
                      <div class="category-info">
                          <h4>Cookies essentiels</h4>
                          <p>Nécessaires au fonctionnement du site (sessions, sécurité). Toujours actifs.</p>
                      </div>
                  </div>
              </div>
              
              <div class="cookie-category">
                  <div class="cookie-category-header">
                      <label class="cookie-switch">
                          <input type="checkbox" id="analyticsCookies">
                          <span class="slider analytics"></span>
                      </label>
                      <div class="category-info">
                          <h4>Cookies analytiques</h4>
                          <p>Google Analytics - nous aide à comprendre comment vous utilisez notre site pour l'améliorer.</p>
                          <small>Conservation : 26 mois maximum</small>
                      </div>
                  </div>
              </div>
              
              <div class="cookie-category">
                  <div class="cookie-category-header">
                      <label class="cookie-switch">
                          <input type="checkbox" id="functionalCookies">
                          <span class="slider functional"></span>
                      </label>
                      <div class="category-info">
                          <h4>Cookies fonctionnels</h4>
                          <p>Mémorisent vos préférences (niveau scolaire, progression) pour améliorer votre expérience.</p>
                          <small>Conservation : 12 mois</small>
                      </div>
                  </div>
              </div>
          </div>
          
          <div class="cookie-modal-footer">
              <button id="savePreferences" class="btn-save">Sauvegarder mes préférences</button>
              <button id="acceptAllFromModal" class="btn-accept-all-modal">Tout accepter</button>
          </div>
      </div>
  </div>

  <!-- Bouton flottant pour gérer les cookies -->
  <div id="cookieManageButton" class="cookie-manage-btn hidden">
      <button onclick="openCookieModal()">
          🍪 Gérer les cookies
      </button>
  </div>

  <style>
  /* Styles pour le banner de consentement - Loi 25 */
  .cookie-consent-banner {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      background: linear-gradient(135deg, #1e40af 0%, #3b82f6 100%);
      color: white;
      padding: 1.5rem;
      box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
      z-index: 9999;
      border-top: 3px solid #60a5fa;
      animation: slideUp 0.5s ease-out;
  }

  .cookie-consent-banner.hidden {
      display: none;
  }

  .cookie-consent-content {
      max-width: 1200px;
      margin: 0 auto;
      display: flex;
      align-items: center;
      gap: 2rem;
      flex-wrap: wrap;
  }

  .cookie-consent-text {
      flex: 1;
      min-width: 300px;
  }

  .cookie-consent-text h3 {
      margin: 0 0 0.5rem 0;
      font-size: 1.2rem;
      font-weight: 600;
  }

  .cookie-consent-text p {
      margin: 0.5rem 0;
      line-height: 1.4;
      opacity: 0.95;
  }

  .cookie-policy-link a {
      color: #bfdbfe;
      text-decoration: underline;
      font-weight: 500;
  }

  .cookie-policy-link a:hover {
      color: white;
  }

  .cookie-consent-buttons {
      display: flex;
      gap: 0.75rem;
      flex-wrap: wrap;
  }

  .cookie-consent-buttons button {
      padding: 0.75rem 1.25rem;
      border: none;
      border-radius: 6px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.3s ease;
      font-size: 0.9rem;
      white-space: nowrap;
  }

  .btn-accept-all {
      background: #10b981;
      color: white;
  }

  .btn-accept-all:hover {
      background: #059669;
      transform: translateY(-2px);
  }

  .btn-essential {
      background: #6b7280;
      color: white;
  }

  .btn-essential:hover {
      background: #4b5563;
      transform: translateY(-2px);
  }

  .btn-customize {
      background: transparent;
      color: white;
      border: 2px solid white;
  }

  .btn-customize:hover {
      background: white;
      color: #1e40af;
      transform: translateY(-2px);
  }

  /* Modal de personnalisation */
  .cookie-modal {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgba(0,0,0,0.7);
      z-index: 10000;
      display: flex;
      align-items: center;
      justify-content: center;
      animation: fadeIn 0.3s ease-out;
  }

  .cookie-modal.hidden {
      display: none;
  }

  .cookie-modal-content {
      background: white;
      border-radius: 12px;
      max-width: 600px;
      width: 90%;
      max-height: 80vh;
      overflow-y: auto;
      box-shadow: 0 20px 40px rgba(0,0,0,0.3);
  }

  .cookie-modal-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 1.5rem;
      border-bottom: 1px solid #e5e7eb;
      background: #f8fafc;
      border-radius: 12px 12px 0 0;
  }

  .cookie-modal-header h3 {
      margin: 0;
      color: #1e40af;
      font-size: 1.3rem;
  }

  .close-modal {
      background: none;
      border: none;
      font-size: 1.5rem;
      cursor: pointer;
      color: #6b7280;
      padding: 0.25rem;
      border-radius: 4px;
      transition: all 0.2s ease;
  }

  .close-modal:hover {
      background: #e5e7eb;
      color: #374151;
  }

  .cookie-modal-body {
      padding: 1.5rem;
  }

  .cookie-category {
      border: 1px solid #e5e7eb;
      border-radius: 8px;
      margin-bottom: 1rem;
      overflow: hidden;
  }

  .cookie-category-header {
      display: flex;
      align-items: flex-start;
      gap: 1rem;
      padding: 1.25rem;
      background: #f9fafb;
  }

  .category-info {
      flex: 1;
  }

  .category-info h4 {
      margin: 0 0 0.5rem 0;
      color: #374151;
      font-size: 1.1rem;
  }

  .category-info p {
      margin: 0 0 0.25rem 0;
      color: #6b7280;
      line-height: 1.4;
  }

  .category-info small {
      color: #9ca3af;
      font-style: italic;
  }

  /* Switch toggle */
  .cookie-switch {
      position: relative;
      display: inline-block;
      width: 50px;
      height: 24px;
      margin-top: 0.25rem;
  }

  .cookie-switch input {
      opacity: 0;
      width: 0;
      height: 0;
  }

  .slider {
      position: absolute;
      cursor: pointer;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: #cbd5e1;
      transition: .3s;
      border-radius: 24px;
  }

  .slider:before {
      position: absolute;
      content: "";
      height: 18px;
      width: 18px;
      left: 3px;
      bottom: 3px;
      background-color: white;
      transition: .3s;
      border-radius: 50%;
      box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  }

  input:checked + .slider {
      background-color: #10b981;
  }

  input:checked + .slider.essential {
      background-color: #3b82f6;
  }

  input:checked + .slider:before {
      transform: translateX(26px);
  }

  input:disabled + .slider {
      cursor: not-allowed;
      opacity: 0.6;
  }

  .cookie-modal-footer {
      display: flex;
      gap: 1rem;
      padding: 1.5rem;
      border-top: 1px solid #e5e7eb;
      background: #f8fafc;
      justify-content: flex-end;
  }

  .btn-save {
      background: #1e40af;
      color: white;
      border: none;
      padding: 0.75rem 1.5rem;
      border-radius: 6px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.3s ease;
  }

  .btn-save:hover {
      background: #1e3a8a;
      transform: translateY(-1px);
  }

  .btn-accept-all-modal {
      background: #10b981;
      color: white;
      border: none;
      padding: 0.75rem 1.5rem;
      border-radius: 6px;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.3s ease;
  }

  .btn-accept-all-modal:hover {
      background: #059669;
      transform: translateY(-1px);
  }

  /* Bouton flottant de gestion */
  .cookie-manage-btn {
      position: fixed;
      bottom: 20px;
      right: 20px;
      z-index: 9998;
  }

  .cookie-manage-btn.hidden {
      display: none;
  }

  .cookie-manage-btn button {
      background: #1e40af;
      color: white;
      border: none;
      padding: 0.75rem 1rem;
      border-radius: 25px;
      font-weight: 600;
      cursor: pointer;
      box-shadow: 0 4px 12px rgba(30, 64, 175, 0.4);
      transition: all 0.3s ease;
  }

  .cookie-manage-btn button:hover {
      background: #1e3a8a;
      transform: translateY(-2px);
      box-shadow: 0 6px 16px rgba(30, 64, 175, 0.5);
  }

  /* Animations */
  @keyframes slideUp {
      from {
          transform: translateY(100%);
      }
      to {
          transform: translateY(0);
      }
  }

  @keyframes fadeIn {
      from {
          opacity: 0;
      }
      to {
          opacity: 1;
      }
  }

  /* Responsive */
  @media (max-width: 768px) {
      .cookie-consent-content {
          flex-direction: column;
          text-align: center;
          gap: 1rem;
      }
      
      .cookie-consent-buttons {
          justify-content: center;
          width: 100%;
      }
      
      .cookie-consent-buttons button {
          grid-flex: 1;
          min-width: 0;
      }
      
      .cookie-modal-content {
          width: 95%;
          margin: 1rem;
      }
      
      .cookie-modal-footer {
          flex-direction: column;
      }
      
      .cookie-manage-btn {
          right: 10px;
          bottom: 10px;
      }
  }
  </style>

  <script>
  // Gestion du consentement aux cookies - Conforme Loi 25
  class CookieConsent {
      constructor() {
          this.STORAGE_KEY = 'ensomme_cookie_consent';
          this.CONSENT_VERSION = '1.0';
          this.init();
      }
      
      init() {
          // Vérifier le consentement existant
          const existingConsent = this.getStoredConsent();
          
          if (!existingConsent) {
              // Aucun consentement - afficher le banner
              this.showConsentBanner();
          } else {
              // Consentement existant - charger les cookies autorisés
              this.loadAuthorizedCookies(existingConsent);
              this.showManageButton();
          }
          
          this.bindEvents();
      }
      
      getStoredConsent() {
          try {
              const stored = localStorage.getItem(this.STORAGE_KEY);
              return stored ? JSON.parse(stored) : null;
          } catch (e) {
              return null;
          }
      }
      
      storeConsent(preferences) {
          const consentData = {
              version: this.CONSENT_VERSION,
              timestamp: new Date().toISOString(),
              preferences: preferences
          };
          
          try {
              localStorage.setItem(this.STORAGE_KEY, JSON.stringify(consentData));
          } catch (e) {
              console.warn('Impossible de sauvegarder les préférences cookies');
          }
      }
      
      showConsentBanner() {
          document.getElementById('cookieConsentBanner')?.classList.remove('hidden');
      }
      
      hideConsentBanner() {
          document.getElementById('cookieConsentBanner')?.classList.add('hidden');
      }
      
      showManageButton() {
          document.getElementById('cookieManageButton')?.classList.remove('hidden');
      }
      
      bindEvents() {
          // Boutons du banner principal
          document.getElementById('acceptAllCookies')?.addEventListener('click', () => {
              this.acceptAll();
          });
          
          document.getElementById('acceptEssentialOnly')?.addEventListener('click', () => {
              this.acceptEssentialOnly();
          });
          
          document.getElementById('customizeCookies')?.addEventListener('click', () => {
              this.openCustomizeModal();
          });
          
          // Modal de personnalisation
          document.getElementById('closeCookieModal')?.addEventListener('click', () => {
              this.closeCustomizeModal();
          });
          
          document.getElementById('savePreferences')?.addEventListener('click', () => {
              this.saveCustomPreferences();
          });
          
          document.getElementById('acceptAllFromModal')?.addEventListener('click', () => {
              this.acceptAllFromModal();
          });
          
          // Fermer modal en cliquant à l'extérieur
          document.getElementById('cookieCustomizeModal')?.addEventListener('click', (e) => {
              if (e.target.id === 'cookieCustomizeModal') {
                  this.closeCustomizeModal();
              }
          });
      }
      
      acceptAll() {
          const preferences = {
              essential: true,
              analytics: true,
              functional: true
          };
          
          this.storeConsent(preferences);
          this.loadAuthorizedCookies({ preferences: preferences });
          this.hideConsentBanner();
          this.showManageButton();
      }
      
      acceptEssentialOnly() {
          const preferences = {
              essential: true,
              analytics: false,
              functional: false
          };
          
          this.storeConsent(preferences);
          this.loadAuthorizedCookies({ preferences: preferences });
          this.hideConsentBanner();
          this.showManageButton();
      }
      
      openCustomizeModal() {
          // Charger les préférences actuelles dans le modal
          const existingConsent = this.getStoredConsent();
          if (existingConsent) {
              document.getElementById('analyticsCookies').checked = existingConsent.preferences.analytics || false;
              document.getElementById('functionalCookies').checked = existingConsent.preferences.functional || false;
          }
          
          document.getElementById('cookieCustomizeModal')?.classList.remove('hidden');
      }
      
      closeCustomizeModal() {
          document.getElementById('cookieCustomizeModal')?.classList.add('hidden');
      }
      
      saveCustomPreferences() {
          const preferences = {
              essential: true,
              analytics: document.getElementById('analyticsCookies')?.checked || false,
              functional: document.getElementById('functionalCookies')?.checked || false
          };
          
          this.storeConsent(preferences);
          this.loadAuthorizedCookies({ preferences: preferences });
          this.hideConsentBanner();
          this.closeCustomizeModal();
          this.showManageButton();
      }
      
      acceptAllFromModal() {
          const analyticsCookies = document.getElementById('analyticsCookies');
          const functionalCookies = document.getElementById('functionalCookies');
          if (analyticsCookies) analyticsCookies.checked = true;
          if (functionalCookies) functionalCookies.checked = true;
          this.saveCustomPreferences();
      }
      
      loadAuthorizedCookies(consentData) {
          const preferences = consentData.preferences || consentData;
          
          // Charger Google Analytics seulement si autorisé
          if (preferences.analytics) {
              this.loadGoogleAnalytics();
          }
          
          // Charger autres cookies fonctionnels si autorisés
          if (preferences.functional) {
              this.loadFunctionalCookies();
          }
          
          console.log('Cookies chargés selon les préférences:', preferences);
      }
      
      loadGoogleAnalytics() {
          // Charger Google Analytics seulement avec consentement
          if (typeof gtag === 'undefined') {
              // Charger le script GA
              const script = document.createElement('script');
              script.async = true;
              script.src = 'https://www.googletagmanager.com/gtag/js?id=G-DWR7G0W9D1';
              document.head.appendChild(script);
              
              // Initialiser gtag
              script.onload = () => {
                  window.dataLayer = window.dataLayer || [];
                  function gtag(){dataLayer.push(arguments);}
                  window.gtag = gtag;
                  gtag('js', new Date());
                  gtag('config', 'G-DWR7G0W9D1', {
                      anonymize_ip: true,
                      cookie_expires: 63072000 // 2 ans maximum
                  });
              };
          }
      }
      
      loadFunctionalCookies() {
          console.log('Cookies fonctionnels activés');
      }
      
      manage() {
          this.openCustomizeModal();
      }
  }

  // Fonction globale pour ouvrir le modal
  function openCookieModal() {
      if (window.cookieConsent) {
          window.cookieConsent.manage();
      }
  }

  // Initialiser le système de consentement
  document.addEventListener('DOMContentLoaded', () => {
      window.cookieConsent = new CookieConsent();
  });
  </script>