diff --git a/_includes/category.njk b/_includes/category.njk
index 03ac287..63ecc42 100644
--- a/_includes/category.njk
+++ b/_includes/category.njk
@@ -11,16 +11,16 @@
       </div>
     </div>
 
-    <div class="mt-6 pt-10 grid gap-16 lg:grid-cols-2 lg:gap-x-5 lg:gap-y-12">
+    <div class="mt-6 pt-10 grid gap-8 lg:grid-cols-2 lg:gap-x-5 lg:gap-y-12">
       {%- for content in collections[ page.fileSlug ] | reverse -%}
         <div>
           <p class="text-sm text-gray-500">
             <time datetime="{{ content.data.date | date('YYYY-MM-DD') }}">{{ content.data.date | date }}</time>
           </p>
           <a href="{{ content.url }}" class="mt-2 block focus:outline-link">
-            <p class="text-xl font-semibold text-gray-900">
+            <h3 class="text-xl font-semibold text-gray-900 hover:underline">
               {{ content.data.title }}
-            </p>
+            </h3>
             <p class="mt-3 text-base text-gray-500">
               {{ content.data.description }}
             </p>
diff --git a/_includes/content.njk b/_includes/content.njk
index c18bd3e..6fdbeef 100644
--- a/_includes/content.njk
+++ b/_includes/content.njk
@@ -2,7 +2,7 @@
 
 <main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
   <div class="max-w-3x1 mx-auto mb-4">
-    <div class="-ml-2 mt-8 flex flex-wrap items-baseline">
+    <div class="-ml-2 mt-4 flex flex-wrap items-baseline">
       <h1 class="ml-8 mt-2 mb-2 sm:mb-0 text-lg font-medium text-gray-900">
         {{ title }}
         <span class="inline-block h-1 text-sm text-gray-500">
diff --git a/_includes/pinned.njk b/_includes/pinned.njk
index f7ab28f..42282ca 100644
--- a/_includes/pinned.njk
+++ b/_includes/pinned.njk
@@ -11,20 +11,20 @@
       </div>
     </div>
 
-    <div class="mt-12 grid gap-16 pt-12 lg:grid-cols-3 lg:gap-x-5 lg:gap-y-12">
+    <div class="mt-12 grid gap-8 pt-12 lg:grid-cols-3 lg:gap-x-5 lg:gap-y-12">
       {%- for content in collections.pinned | reverse -%}
         <div>
           <div>
-            <a href="/{{ content.data.tags[0] }}/" class="inline-block">
-              <span class="inline-flex items-center px-3 py-0.5 rounded-full text-sm font-medium bg-indigo-100 text-indigo-800">
+            <a href="/{{ content.data.tags[0] }}/" class="inline-block focus:outline-link">
+              <span class="inline-flex items-center px-3 py-0.5 rounded-full text-sm font-medium bg-pink-100 text-pink-700 hover:underline">
                 {{ content.data.tags[0] | capitalize }}
               </span>
             </a>
           </div>
           <a href="{{ content.url }}" class="block mt-4">
-            <p class="text-xl font-semibold text-gray-900">
+            <h3 class="text-xl font-semibold text-gray-900 hover:underline">
               {{ content.data.title }}
-            </p>
+            </h3>
             <p class="mt-3 text-base text-gray-500">
               {{ content.data.description }}
             </p>