diff --git a/src/components/Hero.astro b/src/components/Hero.astro
index cd047f4..ee449af 100644
--- a/src/components/Hero.astro
+++ b/src/components/Hero.astro
@@ -31,11 +31,11 @@
         </span>
         
         <!-- Live Status / Weather Widget -->
-        <div class="mb-4 text-xs font-mono text-stone-500 flex justify-center items-center gap-2">
-            <i class="fa-solid fa-cloud-sun text-emerald-400"></i>
-            <span>Rheingau-Taunus: 18°C</span>
+        <div class="mb-4 text-xs font-mono text-stone-500 flex justify-center items-center gap-2" x-data="{ temp: '...', icon: 'fa-cloud-sun', text: 'Wird geladen...' }" x-init="fetch('https://api.open-meteo.com/v1/forecast?latitude=50.1&longitude=8.0&current_weather=true').then(r => r.json()).then(data => { temp = Math.round(data.current_weather.temperature) + '°C'; const code = data.current_weather.weathercode; if(code === 0) { icon = 'fa-sun'; text = 'Perfektes Wetter für Gartenarbeit!'; } else if(code < 4) { icon = 'fa-cloud-sun'; text = 'Gutes Wetter für den Trockenmauerbau.'; } else if(code < 60) { icon = 'fa-cloud'; text = 'Gedecktes Wetter, ideal zum Pflanzen.'; } else { icon = 'fa-cloud-showers-heavy'; text = 'Regnerisch. Zeit für Planung!'; } }).catch(() => { temp = '18°C'; icon = 'fa-cloud-sun'; text = 'Aktuell perfektes Wetter für den Trockenmauerbau.'; })">
+            <i class="fa-solid" :class="icon + ' text-emerald-400'"></i>
+            <span>Rheingau-Taunus: <span x-text="temp"></span></span>
             <span class="text-stone-700">//</span>
-            <span class="text-emerald-400">Aktuell perfektes Wetter für den Trockenmauerbau.</span>
+            <span class="text-emerald-400" x-text="text"></span>
         </div>
 
         <!-- Rain Detail Page Button -->