Fix main button on prod and background on dev

landing-pages/site/layouts/_partials/hooks/head-end.html

@@ -19,6 +19,32 @@
 
 <meta name="description" content="{{ .Description | default $.Site.Params.description }}" />
 
+{{/* Early theme initialization to prevent FOUC and ensure animation gets correct theme */}}
+{{ if .Site.Params.ui.showLightDarkModeMenu -}}
+<script>
+(function() {
+  'use strict';
+  const themeKey = 'td-color-theme';
+  const getStoredTheme = () => localStorage.getItem(themeKey);
+  const getPreferredTheme = () => {
+    const storedTheme = getStoredTheme();
+    if (storedTheme) {
+      return storedTheme;
+    }
+    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+  };
+  const setTheme = theme => {
+    if (theme === 'auto') {
+      document.documentElement.setAttribute('data-bs-theme', (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'));
+    } else {
+      document.documentElement.setAttribute('data-bs-theme', theme);
+    }
+  };
+  setTheme(getPreferredTheme());
+})();
+</script>
+{{ end -}}
+
 <!-- Matomo -->
 <script>
     var _paq = window._paq = window._paq || [];

landing-pages/src/js/headerAnimation.js

@@ -253,6 +253,21 @@ export function initHeaderAnimation() {
         });
       };
 
+      // Listen for theme changes and redraw
+      const observer = new MutationObserver((mutations) => {
+        mutations.forEach((mutation) => {
+          if (mutation.type === 'attributes' && mutation.attributeName === 'data-bs-theme') {
+            // Theme changed, sketch.draw() will be called automatically on next frame
+            // No need to do anything here as p5 continuously calls draw()
+          }
+        });
+      });
+
+      observer.observe(document.documentElement, {
+        attributes: true,
+        attributeFilter: ['data-bs-theme']
+      });
+
       sketch.windowResized = debounce(() => {
         const positionInfo = canvas.getBoundingClientRect();
         const vw = positionInfo.width; // viewport width