fix(blog): stack related posts vertically on mobile and fill all suggestion slots

- Add flex-col sm:flex-row and matching border classes to related posts
  nav for consistent mobile stacking with the main blog page
- Remove score > 0 filter in getRelatedPosts so it falls back to recent
  posts when there aren't enough tag matches
- Align description text color with main page cards

Author: emir-karabeg

apps/sim/app/(landing)/blog/[slug]/page.tsx

@@ -133,12 +133,12 @@ export default async function Page({ params }: { params: Promise<{ slug: string
         {related.length > 0 && (
           <>
             <div className='h-px w-full bg-[var(--landing-bg-elevated)]' />
-            <nav aria-label='Related posts' className='flex'>
+            <nav aria-label='Related posts' className='flex flex-col sm:flex-row'>
               {related.map((p) => (
                 <Link
                   key={p.slug}
                   href={`/blog/${p.slug}`}
-                  className='group flex flex-1 flex-col gap-4 border-[var(--landing-bg-elevated)] p-6 transition-colors hover:bg-[var(--landing-bg-elevated)] md:border-l md:first:border-l-0'
+                  className='group flex flex-1 flex-col gap-4 border-[var(--landing-bg-elevated)] border-t p-6 transition-colors first:border-t-0 hover:bg-[var(--landing-bg-elevated)] sm:border-t-0 sm:border-l sm:first:border-l-0'
                 >
                   <div className='relative aspect-video w-full overflow-hidden rounded-[5px]'>
                     <Image
@@ -161,7 +161,7 @@ export default async function Page({ params }: { params: Promise<{ slug: string
                     <h3 className='font-[430] font-season text-lg text-white leading-tight tracking-[-0.01em]'>
                       {p.title}
                     </h3>
-                    <p className='line-clamp-2 text-[var(--landing-text-muted)] text-sm leading-[150%]'>
+                    <p className='line-clamp-2 text-[#F6F6F0]/50 text-sm leading-[150%]'>
                       {p.description}
                     </p>
                   </div>

apps/sim/lib/blog/registry.ts

@@ -192,13 +192,12 @@ export async function getRelatedPosts(slug: string, limit = 3): Promise<BlogMeta
   const posts = await getAllPostMeta()
   const current = posts.find((p) => p.slug === slug)
   if (!current) return []
-  const scored = posts
-    .filter((p) => p.slug !== slug)
+  const others = posts.filter((p) => p.slug !== slug)
+  const scored = others
     .map((p) => ({
       post: p,
       score: p.tags.filter((t) => current.tags.includes(t)).length,
     }))
-    .filter((x) => x.score > 0)
     .sort((a, b) => b.score - a.score || byDateDesc(a.post, b.post))
     .slice(0, limit)
     .map((x) => x.post)