diff --git a/src/pages/index.astro b/src/pages/index.astro
index e6b8f00..1e5995f 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -102,13 +102,15 @@ const dateFormatter = new Intl.DateTimeFormat("nl-NL", {
   .post-row :global(.cover) { grid-row: 1 / 3; }
   .post-row .meta {
     grid-column: 2 / 3;
+    min-width: 0;
     font-family: var(--mono);
     font-size: 13px;
     color: var(--muted);
     text-transform: uppercase;
     letter-spacing: 0.04em;
     display: flex;
-    gap: 10px;
+    flex-wrap: wrap;
+    gap: 6px 10px;
     align-items: center;
   }
   .post-row .meta a {
@@ -129,11 +131,12 @@ const dateFormatter = new Intl.DateTimeFormat("nl-NL", {
     border: 1px solid var(--line);
     color: var(--muted);
   }
-  .post-row h2 { grid-column: 2 / 3; margin: 0; font-size: 20px; line-height: 1.35; }
+  .post-row h2 { grid-column: 2 / 3; min-width: 0; margin: 0; font-size: 20px; line-height: 1.35; }
   .post-row h2 a { color: var(--ink); text-decoration: none; }
   .post-row h2 a:hover { color: var(--accent); }
   .post-row p.dek {
     grid-column: 2 / 3;
+    min-width: 0;
     margin: 4px 0 0;
     color: var(--muted);
     font-size: 15.5px;
@@ -142,6 +145,19 @@ const dateFormatter = new Intl.DateTimeFormat("nl-NL", {
   .post-row .score { grid-column: 3 / 4; grid-row: 1 / 2; justify-self: end; white-space: nowrap; }
 
   @media (max-width: 620px) {
-    .post-row { grid-template-columns: 64px 1fr auto; }
+    .post-row { grid-template-columns: 64px 1fr auto; gap: 6px 12px; }
+  }
+
+  /* Op smalle telefoons (bv. 375-412px) past de robotrij niet meer naast de
+     titel — die verhuist dan naar een eigen rij onder de dek-tekst i.p.v.
+     de kolombreedte te forceren. */
+  @media (max-width: 400px) {
+    .post-row { grid-template-columns: 56px 1fr; }
+    .post-row .score {
+      grid-column: 2 / 3;
+      grid-row: auto;
+      justify-self: start;
+      margin-top: 6px;
+    }
   }
 </style>