Application du style CSS à tous lees fichiers d'exercice

exercices/TP_Nuisibles_final 2.html

@@ -5,114 +5,8 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>TP Nuisibles final — Étude de cas</title>
 <link href="https://fonts.googleapis.com/css2?family=Syne:wght@400;600;700;800&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="../header-style.css"/>
 <style>
-:root {
-  --amber: #BA7517;
-  --amber-mid: #BA7517;
-  --amber-light: #FAEEDA;
-  --amber-dark: #633806;
-  --amber: #BA7517;
-  --amber-light: #FAEEDA;
-  --amber-dark: #633806;
-  --coral: #993C1D;
-  --coral-mid: #D85A30;
-  --coral-light: #FAECE7;
-  --purple: #BA7517;
-  --purple-light: #FAEEDA;
-  --purple-dark: #633806;
-  --blue: #BA7517;
-  --blue-light: #FAEEDA;
-  --bg: #F7F6F2;
-  --white: #FFFFFF;
-  --text: #1a1a18;
-  --text-muted: #6b6a65;
-  --border: rgba(0,0,0,0.1);
-}
-
-/* HEADER NAVIGATION */
-.nav-header {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  height: 70px;
-  background: var(--amber-light);
-  border-bottom: 2px solid var(--amber);
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0 40px;
-  z-index: 1000;
-  backdrop-filter: blur(10px);
-  background: rgba(250, 238, 218, 0.98);
-}
-
-.header-logo {
-  font-family: 'Syne', sans-serif;
-  font-size: 16px;
-  font-weight: 700;
-  letter-spacing: -0.5px;
-  background: linear-gradient(135deg, var(--amber), var(--coral-mid));
-  -webkit-background-clip: text;
-  -webkit-text-fill-color: transparent;
-  background-clip: text;
-  text-decoration: none;
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.header-nav {
-  display: flex;
-  gap: 30px;
-  align-items: center;
-}
-
-.header-nav a {
-  font-family: 'Syne', sans-serif;
-  font-size: 12px;
-  font-weight: 600;
-  letter-spacing: 0.08em;
-  text-transform: uppercase;
-  color: var(--text-muted);
-  text-decoration: none;
-  transition: color 0.3s ease;
-  position: relative;
-}
-
-.header-nav a:hover {
-  color: var(--coral-mid);
-}
-
-.header-nav a::after {
-  content: '';
-  position: absolute;
-  bottom: -4px;
-  left: 0;
-  width: 0;
-  height: 2px;
-  background: var(--coral-mid);
-  transition: width 0.3s ease;
-}
-
-.header-nav a:hover::after {
-  width: 100%;
-}
-
-/* MAIN CONTENT ADJUSTMENT */
-main {
-  margin-top: 70px;
-}
-
-* { box-sizing: border-box; margin: 0; padding: 0; }
-html, body { height: 100%; }
-body {
-  font-family: 'DM Sans', sans-serif;
-  background: var(--bg);
-  color: var(--text);
-  overflow-x: hidden;
-}
-
 /* SLIDES */
 .slide {
   position: absolute;
@@ -138,16 +32,7 @@ body {
   to { opacity: 1; transform: translateY(0); }
 }
 
-/* PROGRESS BAR */
-.progress-bar {
-  position: fixed;
-  top: 70px; left: 0; right: 0;
-  height: 3px;
-  background: var(--border);
-  z-index: 999;
-}
 .progress-fill {
-  height: 100%;
   background: var(--coral-mid);
   transition: width 0.4s ease;
 }
@@ -155,7 +40,7 @@ body {
 /* PHASE INDICATOR */
 .phase-badge {
   position: fixed;
-  top: 16px; right: 16px;
+  top: 80px; right: 16px;
   font-family: 'Syne', sans-serif;
   font-size: 11px;
   font-weight: 700;
@@ -589,13 +474,13 @@ body {
 <!-- HEADER WITH NAVIGATION -->
     <header>
         <div class="logo">NextGN Formation</div>
-            <a href="../../index.html">Accueil</a>
         <nav>
-            <a href="../../index.html#formations">Exercices</a>
-            <a href="../../index.html#documentation">Documentation</a>
-            <a href="../../index.html#rapports">Rapports</a>
-            <a href="../../index.html#about">À propos</a>
-            <a href="../../index.html#contact">Contact</a>
+            <a href="../index.html">Accueil</a>
+            <a href="../index.html#formations">Exercices</a>
+            <a href="../index.html#documentation">Documentation</a>
+            <a href="../index.html#rapports">Rapports</a>
+            <a href="../index.html#about">À propos</a>
+            <a href="../index.html#contact">Contact</a>
         </nav>
     </header>