fix: improve the docs typography

Tweaks our markdown typography to make it look better and be more readable. The main issue was around the uneven spacing between headers.

Author: crisbeto

material.angular.io/material.angular.io/material.angular.io/material.angular.io/material.angular.io/src/app/shared/example-viewer/example-viewer.scss

@@ -5,7 +5,6 @@
 
 .docs-example-viewer-wrapper {
   border-radius: 12px;
-  margin: 16px 0;
 
   h3 {
     margin-top: 10px;

material.angular.io/material.angular.io/material.angular.io/material.angular.io/material.angular.io/src/styles/_markdown.scss

@@ -5,40 +5,62 @@
 
   h1 {
     display: inline-block;
-    font-size: 34px;
+    font-size: 32px;
     font-weight: 400;
+    margin: 32px 0 16px;
   }
 
   h2 {
-    font-size: 24px;
+    font-size: 28px;
+    margin: 32px 0 16px;
+    font-weight: 400;
   }
 
   h3 {
-    font-size: 20px;
+    font-size: 24px;
     font-weight: 500;
+    margin: 32px 0 16px;
+    font-weight: 400;
   }
 
-  h2, h4 {
-    margin-top: 40px;
+  h4 {
+    font-size: 22px;
+    margin: 24px 0 12px;
+    font-weight: 400;
   }
 
   h5 {
     font-size: 18px;
+    margin: 20px 0 10px;
+    font-weight: 400;
   }
 
   p, ul, ol {
     font-size: 16px;
     line-height: 28px;
   }
 
+  p {
+    margin: 0 0 1em;
+
+    // In case the docs generator produces an empty paragraph.
+    &:empty {
+      display: none;
+    }
+  }
+
   a {
     text-decoration: none;
   }
 
+  strong {
+    font-weight: 700;
+  }
+
   pre {
     border-radius: 5px;
     display: block;
-    margin: 16px auto;
+    margin: 24px auto;
     overflow-x: auto;
     padding: 20px;
     white-space: pre-wrap;
@@ -55,10 +77,6 @@
 }
 
 .docs-header-link {
-  // padding to prevent the site header from headbutting the headers when navigating using fragment links
-  padding-top: 20px;
-  margin-top: -20px;
-
   header-link {
     // deduct -30px so the anchor icon will be positioned outside the content
     margin-left: -30px;

material.angular.io/material.angular.io/material.angular.io/material.angular.io/material.angular.io/tools/audit-docs.js

@@ -54,7 +54,7 @@ const MIN_SCORES_PER_PAGE = [
     minScores: {
       pwa: 75,
       performance: 25, // Intentionally low because Ligthouse is flaky.
-      seo: 100,
+      seo: 90,
       'best-practices': 90,
       accessibility: 92,
     },