diff --git a/attached_assets/image_1772306629624.png b/attached_assets/image_1772306629624.png
new file mode 100644
index 0000000..e89ee9d
Binary files /dev/null and b/attached_assets/image_1772306629624.png differ
diff --git a/client/src/components/horoscope-widget.tsx b/client/src/components/horoscope-widget.tsx
index 1faa9e7..a40649a 100644
--- a/client/src/components/horoscope-widget.tsx
+++ b/client/src/components/horoscope-widget.tsx
@@ -1,6 +1,6 @@
 import { useState, useEffect, useCallback } from "react";
 import { useLocation } from "wouter";
-import { Star, ChevronLeft, ChevronRight, X } from "lucide-react";
+import { Star } from "lucide-react";
 
 const SIGNS = [
   { name: "Widder", symbol: "♈", date: "21.03 – 19.04", element: "Feuer" },
@@ -90,7 +90,7 @@ function HoroscopeModal({ onClose, initialSign }: { onClose: () => void; initial
 }
 
 export function HoroscopeWidget() {
-  const [showModal, setShowModal] = useState(false);
+  const [, navigate] = useLocation();
   const [index, setIndex] = useState(0);
   const [paused, setPaused] = useState(false);
 
@@ -105,37 +105,33 @@ export function HoroscopeWidget() {
   const sign = SIGNS[index];
 
   return (
-    <>
-      <div
-        className="bg-card rounded-lg border border-card-border overflow-hidden h-full w-full cursor-pointer group hover:border-primary/50 transition-colors flex flex-col"
-        onMouseEnter={() => setPaused(true)}
-        onMouseLeave={() => setPaused(false)}
-        onClick={() => setShowModal(true)}
-        data-testid="widget-horoscope"
-      >
-        <div className="p-3 flex items-center gap-2 border-b border-card-border flex-shrink-0">
-          <Star className="w-4 h-4 text-primary" />
-          <h3 className="font-bold text-card-foreground text-sm">Horoskop</h3>
-        </div>
-        <div className="p-5 flex-1 flex flex-col justify-center items-center text-center">
-          <span className="text-7xl mb-4 transition-all duration-500 block">{sign.symbol}</span>
-          <p className="font-bold text-card-foreground text-lg">{sign.name}</p>
-          <p className="text-xs text-muted-foreground mt-1">{sign.date}</p>
-          <p className="text-sm text-muted-foreground mt-4 leading-relaxed">{getDailyText(index)}</p>
-          <div className="flex justify-center gap-1 mt-5">
-            {SIGNS.map((_, i) => (
-              <button
-                key={i}
-                onClick={(e) => { e.stopPropagation(); setIndex(i); }}
-                className={`w-1.5 h-1.5 rounded-full transition-all ${i === index ? "bg-primary w-3" : "bg-muted-foreground/30 hover:bg-muted-foreground/50"}`}
-                data-testid={`button-horoscope-dot-${i}`}
-              />
-            ))}
-          </div>
+    <div
+      className="bg-card rounded-lg border border-card-border overflow-hidden h-full w-full cursor-pointer group hover:border-primary/50 transition-colors flex flex-col"
+      onMouseEnter={() => setPaused(true)}
+      onMouseLeave={() => setPaused(false)}
+      onClick={() => navigate("/horoskop")}
+      data-testid="widget-horoscope"
+    >
+      <div className="p-3 flex items-center gap-2 border-b border-card-border flex-shrink-0">
+        <Star className="w-4 h-4 text-primary" />
+        <h3 className="font-bold text-card-foreground text-sm">Horoskop</h3>
+      </div>
+      <div className="p-5 flex-1 flex flex-col justify-center items-center text-center">
+        <span className="text-7xl mb-4 transition-all duration-500 block">{sign.symbol}</span>
+        <p className="font-bold text-card-foreground text-lg">{sign.name}</p>
+        <p className="text-xs text-muted-foreground mt-1">{sign.date}</p>
+        <p className="text-sm text-muted-foreground mt-4 leading-relaxed">{getDailyText(index)}</p>
+        <div className="flex justify-center gap-1 mt-5">
+          {SIGNS.map((_, i) => (
+            <button
+              key={i}
+              onClick={(e) => { e.stopPropagation(); setIndex(i); }}
+              className={`w-1.5 h-1.5 rounded-full transition-all ${i === index ? "bg-primary w-3" : "bg-muted-foreground/30 hover:bg-muted-foreground/50"}`}
+              data-testid={`button-horoscope-dot-${i}`}
+            />
+          ))}
         </div>
       </div>
-
-      {showModal && <HoroscopeModal initialSign={index} onClose={() => setShowModal(false)} />}
-    </>
+    </div>
   );
 }
diff --git a/client/src/pages/home.tsx b/client/src/pages/home.tsx
index 28c1dbb..59ede7d 100644
--- a/client/src/pages/home.tsx
+++ b/client/src/pages/home.tsx
@@ -316,8 +316,9 @@ export default function Home() {
     );
   }
 
-  const row2Articles = articles.slice(3, 7);
-  const row3Articles = articles.slice(7);
+  const row2Articles = articles.slice(3, 6);
+  const row3Articles = articles.slice(6, 9);
+  const row4Articles = articles.slice(9);
 
   return (
     <div className="min-h-screen bg-background">
@@ -327,7 +328,7 @@ export default function Home() {
         <FeaturedCarousel articles={articles} popular={popular} galleryImages={galleryImages} />
 
         <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
-          {row2Articles.slice(0, 3).map((a) => (
+          {row2Articles.map((a) => (
             <MediumCard key={a.id} article={a} />
           ))}
           <NativeAdCard />
@@ -353,13 +354,19 @@ export default function Home() {
 
         {row3Articles.length > 0 && (
           <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
-            {row3Articles.slice(0, 2).map((a) => (
+            {row3Articles.map((a) => (
               <MediumCard key={a.id} article={a} />
             ))}
             <NativeAdCard />
-            {row3Articles.length > 2 && row3Articles.slice(2, 3).map((a) => (
+          </div>
+        )}
+
+        {row4Articles.length > 0 && (
+          <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
+            {row4Articles.slice(0, 3).map((a) => (
               <MediumCard key={a.id} article={a} />
             ))}
+            <NativeAdCard />
           </div>
         )}