app/globals.css

@@ -22,15 +22,10 @@ html {
 }
 
 body {
-  background-color: #f0f4f8;
-  color: #1a202c;
-  font-family: 'Inter', system-ui, sans-serif;
-  -webkit-font-smoothing: antialiased;
-}
-
-.dark body {
   background-color: #18212f;
   color: #f1f5f9;
+  font-family: 'Inter', system-ui, sans-serif;
+  -webkit-font-smoothing: antialiased;
 }
 
 @layer components {
@@ -47,12 +42,10 @@ body {
   /* Secondary button – outlined, fills subtly on hover */
   .btn-secondary {
     @apply inline-flex items-center justify-center rounded-xl
-           border border-slate-300 text-slate-700 font-semibold
+           border border-gray-600 text-slate-300 font-semibold
            transition-all duration-200
-           hover:bg-slate-100 hover:border-slate-400 hover:text-slate-900
+           hover:bg-white/5 hover:border-gray-400 hover:text-white
-           active:scale-[0.98]
+           active:scale-[0.98];
-           dark:border-gray-600 dark:text-slate-300
-           dark:hover:bg-white/5 dark:hover:border-gray-400 dark:hover:text-white;
   }
 
   /* Small nav button */
@@ -75,7 +68,7 @@ body {
 
   /* Dot matrix – default background pattern */
   .bg-grid {
-    background-image: radial-gradient(rgba(249, 115, 22, 0.06) 1px, transparent 1px);
+    background-image: radial-gradient(rgba(249, 115, 22, 0.15) 1px, transparent 1px);
     background-size: 28px 28px;
   }
 
@@ -102,11 +95,6 @@ body {
   }
 }
 
-/* Dark-mode bg-grid override — must live outside @layer so it wins over the base rule */
-.dark .bg-grid {
-  background-image: radial-gradient(rgba(249, 115, 22, 0.15) 1px, transparent 1px);
-}
-
 /* Tagline ticker animation */
 @keyframes ticker-scroll {
   0% { transform: translateX(0); }
@@ -124,23 +112,23 @@ body {
 .legal-content h2 {
   font-size: 1.25rem;
   font-weight: 700;
-  color: #1a202c;
+  color: #f1f5f9;
   margin-bottom: 0.75rem;
   margin-top: 2rem;
   padding-bottom: 0.5rem;
-  border-bottom: 1px solid #cbd5e0;
+  border-bottom: 1px solid #2d3748;
 }
 .legal-content h3 {
   font-size: 0.95rem;
   font-weight: 600;
-  color: #ea6c00;
+  color: #fb923c;
   margin-top: 1.25rem;
   margin-bottom: 0.4rem;
   text-transform: uppercase;
   letter-spacing: 0.05em;
 }
 .legal-content p {
-  color: #4a5568;
+  color: #94a3b8;
   line-height: 1.8;
   margin-bottom: 0.75rem;
   font-size: 0.925rem;
@@ -151,7 +139,7 @@ body {
   margin: 0.75rem 0 1rem 0;
 }
 .legal-content ul li {
-  color: #4a5568;
+  color: #94a3b8;
   font-size: 0.925rem;
   line-height: 1.75;
   padding-left: 1.25rem;
@@ -169,19 +157,19 @@ body {
   background: #f97316;
 }
 .legal-content a {
-  color: #2563eb;
+  color: #60a5fa;
   text-decoration: underline;
   text-underline-offset: 3px;
 }
 .legal-content a:hover {
-  color: #f97316;
+  color: #fb923c;
 }
 .legal-content strong {
-  color: #1a202c;
+  color: #e2e8f0;
   font-weight: 600;
 }
 .legal-content .note {
-  background: #e8eef4;
+  background: #1e2a3d;
   border-left: 3px solid #f97316;
   padding: 0.75rem 1rem;
   border-radius: 0 0.5rem 0.5rem 0;
@@ -192,52 +180,17 @@ body {
   font-size: 0.875rem !important;
 }
 
-/* Legal pages – dark mode overrides */
-.dark .legal-content h2 {
-  color: #f1f5f9;
-  border-bottom-color: #2d3748;
-}
-.dark .legal-content h3 {
-  color: #fb923c;
-}
-.dark .legal-content p,
-.dark .legal-content ul li {
-  color: #94a3b8;
-}
-.dark .legal-content a {
-  color: #60a5fa;
-}
-.dark .legal-content a:hover {
-  color: #fb923c;
-}
-.dark .legal-content strong {
-  color: #e2e8f0;
-}
-.dark .legal-content .note {
-  background: #1e2a3d;
-}
-
 /* Scrollbar */
 ::-webkit-scrollbar {
   width: 6px;
 }
 ::-webkit-scrollbar-track {
-  background: #e8eef4;
+  background: #18212f;
 }
 ::-webkit-scrollbar-thumb {
-  background: #94a3b8;
+  background: #2d3748;
   border-radius: 3px;
 }
 ::-webkit-scrollbar-thumb:hover {
   background: #f97316;
 }
-
-.dark ::-webkit-scrollbar-track {
-  background: #18212f;
-}
-.dark ::-webkit-scrollbar-thumb {
-  background: #2d3748;
-}
-.dark ::-webkit-scrollbar-thumb:hover {
-  background: #f97316;
-}

app/layout.tsx

@@ -1,6 +1,5 @@
 import type { Metadata } from "next";
 import "./globals.css";
-import Providers from "@/components/Providers";
 
 export const metadata: Metadata = {
   title: "MBO-Tech-IT | Docker, Kubernetes & Cloud-Infrastruktur",
@@ -25,10 +24,8 @@ export default function RootLayout({
   children: React.ReactNode;
 }) {
   return (
-    <html lang="de" className="scroll-smooth" suppressHydrationWarning>
+    <html lang="de" className="scroll-smooth">
-      <body>
+      <body>{children}</body>
-        <Providers>{children}</Providers>
-      </body>
     </html>
   );
 }

app/page.tsx

@@ -12,7 +12,7 @@ import Footer from "@/components/Footer";
 
 export default function Home() {
   return (
-    <main className="min-h-screen bg-[#f0f4f8] dark:bg-[#18212f]">
+    <main className="min-h-screen bg-[#18212f]">
       <Header />
       <Hero />
       <TaglineBanner />

components/Header.tsx

@@ -3,7 +3,6 @@
 import { useState, useEffect } from "react";
 import Link from "next/link";
 import Logo from "./Logo";
-import ThemeToggle from "./ThemeToggle";
 
 const navLinks = [
   { label: "Services", href: "/#services" },
@@ -28,7 +27,7 @@ export default function Header() {
     <header
       className={`fixed top-0 left-0 right-0 z-50 transition-all duration-300 ${
         scrolled
-          ? "bg-white/95 dark:bg-[#111925]/95 backdrop-blur-md border-b border-slate-200 dark:border-gray-800"
+          ? "bg-[#111925]/95 backdrop-blur-md border-b border-gray-800"
           : "bg-transparent"
       }`}
     >
@@ -38,7 +37,7 @@ export default function Header() {
           <Link href="/" className="flex items-center gap-3 group">
             <Logo className="h-8 w-auto" />
             <div className="flex flex-col leading-tight">
-              <span className="font-black text-slate-900 dark:text-white text-base tracking-wider uppercase">
+              <span className="font-black text-white text-base tracking-wider uppercase">
                 MBO-<span className="text-gradient">TECH-IT</span>
               </span>
               <span className="text-[9px] font-semibold tracking-[0.2em] text-orange-400/70 uppercase hidden sm:block">
@@ -53,7 +52,7 @@ export default function Header() {
               <Link
                 key={link.href}
                 href={link.href}
-                className="text-slate-600 dark:text-slate-400 hover:text-blue-600 dark:hover:text-blue-400 transition-colors text-sm font-medium"
+                className="text-slate-400 hover:text-blue-400 transition-colors text-sm font-medium"
               >
                 {link.label}
               </Link>
@@ -64,12 +63,11 @@ export default function Header() {
             >
               Jetzt anfragen
             </Link>
-            <ThemeToggle />
           </nav>
 
           {/* Mobile Menu Button */}
           <button
-            className="md:hidden text-slate-600 dark:text-slate-400 hover:text-slate-900 dark:hover:text-white transition-colors"
+            className="md:hidden text-slate-400 hover:text-white transition-colors"
             onClick={() => setMenuOpen(!menuOpen)}
             aria-label="Menu"
           >
@@ -86,13 +84,13 @@ export default function Header() {
 
       {/* Mobile Menu */}
       {menuOpen && (
-        <div className="md:hidden bg-white/98 dark:bg-[#111925]/98 backdrop-blur-md border-t border-slate-200 dark:border-gray-800">
+        <div className="md:hidden bg-[#111925]/98 backdrop-blur-md border-t border-gray-800">
           <nav className="px-4 py-4 flex flex-col gap-4">
             {navLinks.map((link) => (
               <Link
                 key={link.href}
                 href={link.href}
-                className="text-slate-600 dark:text-slate-400 hover:text-blue-600 dark:hover:text-blue-400 transition-colors text-sm font-medium py-1"
+                className="text-slate-400 hover:text-blue-400 transition-colors text-sm font-medium py-1"
                 onClick={() => setMenuOpen(false)}
               >
                 {link.label}
@@ -105,9 +103,6 @@ export default function Header() {
             >
               Jetzt anfragen
             </Link>
-            <div className="flex justify-end pt-1">
-              <ThemeToggle />
-            </div>
           </nav>
         </div>
       )}

components/Providers.tsx

@@ -1,11 +0,0 @@
-"use client";
-
-import { ThemeProvider } from "next-themes";
-
-export default function Providers({ children }: { children: React.ReactNode }) {
-  return (
-    <ThemeProvider attribute="class" defaultTheme="system" enableSystem disableTransitionOnChange>
-      {children}
-    </ThemeProvider>
-  );
-}

components/ThemeToggle.tsx

@@ -1,72 +0,0 @@
-"use client";
-
-import { useTheme } from "next-themes";
-import { useEffect, useState } from "react";
-
-export default function ThemeToggle() {
-  const { resolvedTheme, setTheme } = useTheme();
-  const [mounted, setMounted] = useState(false);
-
-  useEffect(() => {
-    setMounted(true);
-  }, []);
-
-  if (!mounted) return null;
-
-  const isDark = resolvedTheme === "dark";
-
-  return (
-    <button
-      onClick={() => setTheme(isDark ? "light" : "dark")}
-      title={isDark ? "Light Mode" : "Dark Mode"}
-      aria-label={isDark ? "Zu Hell-Modus wechseln" : "Zu Dunkel-Modus wechseln"}
-      className={
-        isDark
-          ? "rounded-md p-2 bg-[#1f2937] border border-[#374151] text-slate-400 hover:text-orange-400 transition-colors"
-          : "rounded-md p-2 bg-[#e2e8f0] border border-[#cbd5e0] text-slate-600 hover:text-orange-500 transition-colors"
-      }
-    >
-      {isDark ? (
-        // Sun icon — click to go light
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="18"
-          height="18"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          strokeWidth="2"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          aria-hidden="true"
-        >
-          <circle cx="12" cy="12" r="5" />
-          <line x1="12" y1="1" x2="12" y2="3" />
-          <line x1="12" y1="21" x2="12" y2="23" />
-          <line x1="4.22" y1="4.22" x2="5.64" y2="5.64" />
-          <line x1="18.36" y1="18.36" x2="19.78" y2="19.78" />
-          <line x1="1" y1="12" x2="3" y2="12" />
-          <line x1="21" y1="12" x2="23" y2="12" />
-          <line x1="4.22" y1="19.78" x2="5.64" y2="18.36" />
-          <line x1="18.36" y1="5.64" x2="19.78" y2="4.22" />
-        </svg>
-      ) : (
-        // Moon icon — click to go dark
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="18"
-          height="18"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          strokeWidth="2"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-          aria-hidden="true"
-        >
-          <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" />
-        </svg>
-      )}
-    </button>
-  );
-}

package-lock.json

@@ -9,7 +9,6 @@
       "version": "0.1.0",
       "dependencies": {
         "next": "^15.2.0",
-        "next-themes": "^0.4.6",
         "nodemailer": "^8.0.6",
         "react": "^19.0.0",
         "react-dom": "^19.0.0"
@@ -1373,16 +1372,6 @@
         }
       }
     },
-    "node_modules/next-themes": {
-      "version": "0.4.6",
-      "resolved": "https://registry.npmjs.org/next-themes/-/next-themes-0.4.6.tgz",
-      "integrity": "sha512-pZvgD5L0IEvX5/9GWyHMf3m8BKiVQwsCMHfoFosXtXBMnaS0ZnIJ9ST4b4NqLVKDEm8QBxoNNGNaBv2JNF6XNA==",
-      "license": "MIT",
-      "peerDependencies": {
-        "react": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc",
-        "react-dom": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc"
-      }
-    },
     "node_modules/next/node_modules/postcss": {
       "version": "8.4.31",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.31.tgz",

package.json

@@ -10,7 +10,6 @@
   },
   "dependencies": {
     "next": "^15.2.0",
-    "next-themes": "^0.4.6",
     "nodemailer": "^8.0.6",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"

tailwind.config.ts

@@ -1,7 +1,6 @@
 import type { Config } from "tailwindcss";
 
 const config: Config = {
-  darkMode: "class",
   content: [
     "./pages/**/*.{js,ts,jsx,tsx,mdx}",
     "./components/**/*.{js,ts,jsx,tsx,mdx}",