Design-Optimierung: Konsistentes Token-System, professionellere Animationen, Navy+Gold Farbschema

- CSS Custom Properties konsolidiert: Neues Token-System mit Navy/Gold Logo-Farben,
  Spacing-Grid (8px), Border-Radius und Z-Index Skala
- Unprofessionelle Animationen entfernt: Glitch, Neon, Morph, Orbit, Ripple
- PulseGlow und Shimmer dezenter gemacht (Gold-Akzente)
- Typografie: Inter als Hauptschrift, Bebas Neue nur für Hero-Titel
- Section-Konsistenz: Hero/Products auf Navy (#0A1832), Footer auf Navy-Dark
- Gold-Akzente in Products (Hover-Border, Feature-Bullets, Learn-More Button)
- Footer-Links mit Gold-Hover
- Card-Hover-Effekte subtiler (translateY -4px statt -10px + scale)
- Cookie-Consent auf globale Tokens umgestellt
- Mobile: Navy-BG, Gold-Hover statt Cyan

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

cookie-consent.css

@@ -4,22 +4,22 @@
  * Angepasst an Corporate Design (Rheinmetall Style)
  */
 
-/* === CSS Variables (AegisSight Brand) === */
+/* === CSS Variables (nutzt globale Tokens) === */
 :root {
-    --consent-primary: #0f72b5;      /* AegisSight Primary Blue */
-    --consent-primary-dark: #00406e; /* Dark Blue */
-    --consent-gray-light: #f4f4f4;
-    --consent-white: #FFFFFF;
-    --consent-text-dark: #333333;
-    --consent-text-gray: #666666;
-    --consent-border: #e0e0e0;
+    --consent-primary: var(--color-navy, #0A1832);
+    --consent-primary-dark: var(--color-navy-dark, #060F20);
+    --consent-gray-light: var(--color-gray-100, #f4f4f4);
+    --consent-white: var(--color-white, #FFFFFF);
+    --consent-text-dark: var(--color-gray-800, #333333);
+    --consent-text-gray: var(--color-gray-600, #666666);
+    --consent-border: var(--color-gray-200, #e0e0e0);
     --consent-shadow: 0 2px 8px rgba(0,0,0,0.1);
     --consent-shadow-hover: 0 8px 24px rgba(0,0,0,0.15);
 }
 
 /* === Demo Page Styling (AegisSight Style) === */
 body {
-    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
     margin: 0;
     padding: 0;
     line-height: 1.6;
@@ -101,7 +101,7 @@ footer nav a:hover {
     backdrop-filter: blur(10px);
     -webkit-backdrop-filter: blur(10px);
     box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
-    border-top: 1px solid rgba(15, 114, 181, 0.2);
+    border-top: 2px solid var(--color-gold, #C8A851);
     z-index: 9999;
     transform: translateY(100%);
     transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
@@ -156,7 +156,7 @@ footer nav a:hover {
 .consent-btn {
     padding: 0.75rem 1.5rem;
     border: none;
-    border-radius: 6px;
+    border-radius: var(--radius-md, 8px);
     font-size: 1rem;
     font-weight: 600;
     cursor: pointer;
@@ -182,12 +182,12 @@ footer nav a:hover {
 }
 
 .consent-btn-secondary {
-    background: #95a5a6;
+    background: var(--color-gray-600, #666666);
     color: white;
 }
 
 .consent-btn-secondary:hover {
-    background: #7f8c8d;
+    background: var(--color-gray-800, #333333);
 }
 
 .consent-btn-outline {
@@ -208,7 +208,7 @@ footer nav a:hover {
     left: 50%;
     transform: translate(-50%, -50%) scale(0.9);
     background: white;
-    border-radius: 12px;
+    border-radius: var(--radius-lg, 16px);
     box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
     z-index: 10000;
     max-width: 600px;
@@ -230,7 +230,7 @@ footer nav a:hover {
     background: linear-gradient(135deg, var(--consent-primary-dark) 0%, var(--consent-primary) 100%);
     color: white;
     padding: 1.5rem;
-    border-radius: 12px 12px 0 0;
+    border-radius: var(--radius-lg, 16px) var(--radius-lg, 16px) 0 0;
     display: flex;
     justify-content: space-between;
     align-items: center;
@@ -264,8 +264,8 @@ footer nav a:hover {
 
 /* Category Cards */
 .cookie-category {
-    border: 2px solid #e0e0e0;
-    border-radius: 8px;
+    border: 2px solid var(--consent-border);
+    border-radius: var(--radius-md, 8px);
     padding: 1rem;
     margin-bottom: 1rem;
     transition: border-color 0.2s ease;
@@ -314,7 +314,7 @@ footer nav a:hover {
 }
 
 .category-toggle.active {
-    background: var(--consent-primary);
+    background: var(--color-gold, #C8A851);
 }
 
 .category-toggle.active::after {