diff --git a/html/index.html b/html/index.html
index 3b0f190..0223b8e 100644
--- a/html/index.html
+++ b/html/index.html
@@ -139,6 +139,9 @@
         </div>
     </section>
 
+    <!-- Separator Line zwischen Content und Footer -->
+    <div class="separator-line"></div>
+
     <footer>
         <div class="container">
             <p>Ground Zero Lab - KI für kritische Wahrheit</p>
diff --git a/html/style.css b/html/style.css
index 2b6acf0..149410a 100644
--- a/html/style.css
+++ b/html/style.css
@@ -230,6 +230,7 @@ footer {
     color: white;
     text-align: center;
     padding: 3rem 0;
+    position: relative;
 }
 
 .footer-links {
@@ -250,6 +251,19 @@ footer {
     opacity: 0.7;
 }
 
+/* Separator Line zwischen Content und Footer */
+footer::before {
+    content: '';
+    position: absolute;
+    top: -2px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 100px;
+    height: 2px;
+    background: linear-gradient(90deg, transparent, #667eea, transparent);
+    border-radius: 1px;
+}
+
 /* ==========================================
    7. MOBILE RESPONSIVENESS (BREAKPOINTS)
    ========================================== */
@@ -310,4 +324,37 @@ footer {
     .hero p {
         font-size: 1.1rem;
     }
+}
+
+/* Tablet Portrait */
+@media (min-width: 769px) and (max-width: 1024px) {
+    section {
+        padding: 4rem 0;
+    }
+    
+    footer {
+        padding: 2.5rem 0;
+    }
+    
+    .demo-buttons {
+        gap: 0.8rem;
+    }
+}
+
+/* Desktop */
+@media (min-width: 1025px) {
+    section {
+        padding: 5rem 0;
+    }
+    
+    footer {
+        padding: 3rem 0;
+    }
+}
+
+/* Extra Large Desktop */
+@media (min-width: 1400px) {
+    .container {
+        max-width: 1400px;
+    }
 }
\ No newline at end of file