fixed blog text styling

Author: Michał Gryczka

src/pages/blog/[slug].astro

@@ -325,6 +325,7 @@ const hasCaseStudy =
     min-height: 100vh;
     overflow: unset;
     --blog-body-size: calc(1.125rem * var(--font-scale-factor));
+    --blog-body-color: #374151;
 
     .blog-post {
       padding: 2rem 0 4rem;
@@ -377,7 +378,7 @@ const hasCaseStudy =
 
         p {
           font-size: var(--blog-body-size);
-          line-height: 1.75;
+          line-height: 1.6;
           color: var(--text-body-primary);
           margin: 0 0 1rem;
           text-align: left;
@@ -480,11 +481,11 @@ const hasCaseStudy =
 
         :global(th) {
           font-weight: 600;
-          color: var(--text-body-primary);
+          color: var(--blog-body-color);
         }
 
         :global(td) {
-          color: var(--text-body-primary);
+          color: var(--blog-body-color);
         }
 
         /* Zebra striping for better readability */
@@ -529,7 +530,7 @@ const hasCaseStudy =
         }
 
         :global(h2) {
-          font-size: calc(2rem * var(--font-scale-factor));
+          font-size: calc(2.5rem * var(--font-scale-factor));
           margin: 1.75rem 0 1rem;
           font-weight: 400;
           color: var(--text-body-primary);
@@ -538,7 +539,7 @@ const hasCaseStudy =
         :global(h3) {
           font-size: calc(1.5rem * var(--font-scale-factor));
           margin: 1.5rem 0 1rem;
-          font-weight: 400;
+          font-weight: 600;
           color: var(--text-body-primary);
         }
 
@@ -598,10 +599,10 @@ const hasCaseStudy =
         }
 
         :global(p) {
-          margin: 1rem 0;
-          line-height: 1.8;
-          font-weight: 400;
-          color: var(--text-body-primary);
+          margin: 1.5rem 0;
+          line-height: 1.6;
+          font-weight: 300;
+          color: var(--blog-body-color);
           font-size: var(--blog-body-size);
         }
 
@@ -612,9 +613,9 @@ const hasCaseStudy =
 
           :global(li) {
             margin-bottom: 0.5rem;
-            line-height: 1.8;
-            font-weight: 400;
-            color: var(--text-body-primary);
+            line-height: 1.6;
+            font-weight: 300;
+            color: var(--blog-body-color);
             font-size: var(--blog-body-size);
           }
         }
@@ -623,9 +624,9 @@ const hasCaseStudy =
           border-left: 4px solid var(--primary-color, #0c8ce0);
           padding-left: 1rem;
           margin: 1.5rem 0;
-          font-weight: 400;
-          line-height: 1.8;
-          color: var(--text-body-secondary, var(--text-body-primary));
+          font-weight: 300;
+          line-height: 1.6;
+          color: var(--blog-body-color);
           font-size: var(--blog-body-size);
         }