Fix heading line-height causing overlapping text (#573)

Currently, headings use the same absolute line height as regular text. Due to their larger font size this can cause headings to overlap when wrapped due to small screen width (e.g. on mobile).

This change makes line-height relative to the current font size instead of the font size for regular text.
Margins were adjusted to keep distance to previous and following text sections approximately the same as before.

### Before
![image](https://user-images.githubusercontent.com/11900073/222900606-22aedece-923f-4ea2-a9d7-6c31c60f70f6.png)
### After
![image](https://user-images.githubusercontent.com/11900073/222900613-8a5143f7-56dd-4c22-829f-2a67fddb8099.png)

Author: pkupper

sass/pages/_content.scss

@@ -3,14 +3,15 @@ $content-font-size: 1.22rem;
     width: 100%;
     font-size: $content-font-size;
     font-weight: 400;
-    line-height: $content-font-size * 1.43;
+    line-height: 1.43;
     color: #d2d2d2;
     font-style: normal;
     text-decoration: none;
     word-break: break-word;
 
     h2 {
-        margin-top: 3.0rem;
+        margin-top: 2.2rem;
+        margin-bottom: 0.5rem;
         font-size: 2.2rem;
 
         code {

sass/pages/_news.scss

@@ -40,7 +40,7 @@
 }
 
 .release-feature-authors {
-    margin-top: -1.0rem !important;
+    margin-top: -0.5rem !important;
     font-style: italic;
     color: $subtitle-color;
 }