resume page

css/home.css

@@ -39,6 +39,12 @@
 	}
 }
 
+@media (max-width: 650px) {
+	.intro {
+		gap: .5rem;
+	}
+}
+
 .art {
 	grid-template-areas:
 		"h2 img"

css/main.css

@@ -109,11 +109,24 @@ h2, h3, h4, h5, h6 {
 
 h2 {
 	font-size: 2rem;
+	margin-block: 1.5rem 1rem;
+}
+
+h3 {
+	font-size: 1.5rem;
+	margin-block: .8rem;
 }
 
 @media (max-width: 800px) {
 	h1 { font-size: 2rem; }
-	h2 { font-size: 1.5rem; }
+	h2 {
+		font-size: 1.5rem;
+		margin-block: 1rem .5rem;
+	}
+	h3 {
+		font-size: 1.2rem;
+		margin-block-end: .5rem;
+	}
 }
 
 p {
@@ -150,3 +163,10 @@ a:focus-visible {
 a:active {
 	text-decoration-thickness: .4em;
 }
+
+hr {
+	color: var(--color-title-bg);
+	background: var(--color-title-bg);
+	border: none;
+	height: .5rem;
+}

css/resume.css

@@ -0,0 +1,42 @@
+h2 {
+	text-align: center;
+}
+
+.listing {
+	display: grid;
+	grid-template-areas:
+		"title title"
+		"location date";
+	margin-block: 1rem;
+
+	h3 {
+		margin-block-end: 0;
+		grid-area: title;
+	}
+
+	p {
+		margin-block: 0;
+
+		&.location {
+			grid-area: location;
+
+			span {
+				font-weight: bold;
+			}
+		}
+
+		&.date {
+			grid-area: date;
+			justify-self: end;
+		}
+	}
+}
+
+@media (max-width: 650px) {
+	.listing {
+		grid-template-areas:
+			"title"
+			"location"
+			"date";
+	}
+}