Link and header order changed for Safari inter-line hover bug (in Related posts widget)

src/components/blog/GridItem.astro

@@ -36,19 +36,21 @@ const image = await findImage(post.image);
       )
     }
   </div>
-  <h3 class="mb-2 text-xl font-bold leading-tight sm:text-2xl font-heading">
+  
     {
       !APP_BLOG?.post?.isEnabled ? (
         post.title
       ) : (
         <a
           href={getPermalink(post.permalink, 'post')}
-          class="hover:text-primary dark:hover:text-blue-700  transition ease-in duration-200"
+          class="inline-block hover:text-primary dark:hover:text-blue-700  transition ease-in duration-200"
         >
+        <h3 class="mb-2 text-xl font-bold leading-tight sm:text-2xl font-heading">
           {post.title}
+        </h3> 
         </a>
       )
     }
-  </h3>
+  
   <p class="text-muted dark:text-slate-400 text-lg">{post.excerpt}</p>
 </article>