Code review fixes

pages/_app.css

@@ -71,13 +71,14 @@ body {
   margin: 0;
 
   /* Font styling for body */
-  font-size: calc(22rem / 16);
+  font-size: 1rem;
   font-weight: 500;
 }
 
 /* Page titles (e.g. Demographics) */
 h1 {
-  font-size: calc(56rem / 16);
+  font-size: calc(48rem / 16);
+  font-weight: 700;
   color: var(--primary-accent-light);
   margin-top: calc(32rem / 16);
   margin-bottom: calc(16rem / 16);
@@ -85,7 +86,8 @@ h1 {
 
 /* Major section headings (e.g. About the Programs) */
 h2 {
-  font-size: calc(48rem / 16);
+  font-size: calc(36rem / 16);
+  font-weight: 700;
   color: var(--primary-heading);
   margin-top: calc(32rem / 16);
   margin-bottom: calc(16rem / 16);
@@ -93,7 +95,8 @@ h2 {
 
 /* Minor section headings & questions (e.g. What Program Are You In?) */
 h3 {
-  font-size: calc(36rem / 16);
+  font-size: calc(32rem / 16);
+  font-weight: 700;
   color: var(--secondary-heading);
   margin-top: calc(24rem / 16);
   margin-bottom: calc(16rem / 16);
@@ -102,6 +105,7 @@ h3 {
 /* Titles within paragraphs (e.g. About the Programs -> Computer Science)*/
 h4 {
   font-size: calc(24rem / 16);
+  font-weight: 700;
   color: var(--secondary-heading);
   margin-top: calc(24rem / 16);
   margin-bottom: calc(8rem / 16);
@@ -122,10 +126,6 @@ a:hover {
   color: var(--link-hover);
 }
 
-p {
-  font-size: calc(28rem / 16);
-}
-
 @media only screen and (prefers-color-scheme: dark) {
   body {
     --primary-background: var(--dark--primary-background);

pages/playground.tsx

@@ -39,7 +39,7 @@ export default function Home() {
       <h3>h3 h3 h3 h3 h3 h3 h3 h3 h3 h3 h3 h3 h3 h3 h3 h3 h3 h3</h3>
       <h4>h4 h4 h4 h4 h4 h4 h4 h4 h4 h4 h4 h4 h4 h4 h4 h4 h4 h4</h4>
       <p>p p p p p p p p p p p p p p p p p p p p p p p p p p p p</p>
-      <a>a a a a a a a a a a a a a a a a a a a a a a a a a a a a</a>
+      <a href="#">a a a a a a a a a a a a a a a a a a a a a a a a a a a a</a>
 
       <h2>
         <code>{"<BarGraphHorizontal />"}</code>