Various tweaks based on design feedback

Tommy sent over some feedback, and I've tried to incorporate it. I've
brought in the Light variant of the Source Serif font, as although
figma uses Regular, these seemed to render too heavy in browsers even
with the smoothing options I also added.

assets/css/app.css

@@ -13,6 +13,11 @@
   src: url("/assets/fonts/SourceSerif4-Regular.ttf");
 }
 
+@font-face {
+  font-family: 'source_serif_light';
+  src: url("/assets/fonts/SourceSerif4-Light.ttf");
+}
+
 @font-face {
   font-family: 'source_serif_bold';
   src: url("/assets/fonts/SourceSerif4-Bold.ttf");
@@ -51,6 +56,15 @@ section {
   max-inline-size: none;
 }
 
+body {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+main {
+  --space: 3rem;
+}
+
 p, li, a {
   font-family: "open_sansregular", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
   color: var(--cotech-white);
@@ -59,9 +73,9 @@ p, li, a {
 }
 
 h1, h2, h3, h4, h5, h6 {
-  font-family: "source_serif_regular", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
+  font-family: "source_serif_light", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
   color: var(--cotech-white);
-  line-height: 1.1;
+  line-height: 1.2;
   font-weight: 400;
 }
 
@@ -76,48 +90,37 @@ h3.title {
   font-weight: 700;
 }
 
-
-@media (min-width: 48em) {
-  h1 {
-    font-size: calc(2.625rem + ((1vw - 0.48rem) * 2.8646));
-    min-height: 0vw;
-  }
-
-  h2 {
-    font-size: calc(2rem + ((1vw - 0.48rem) * 1.7361));
-    min-height: 0vw;
-  }
-
-  h3 {
-    font-size: calc(1.625rem + ((1vw - 0.48rem) * 1.2153));
-    line-height: calc(1.2 + ((1vw - 0.48) * -0.1389));
-    min-height: 0vw;
-  }
-
-  h3.title {
-    font-size: calc(1.25rem + ((1vw - 0.48rem) * 0.3472));
-    min-height: 0vw;
-  }
-
-  p.large {
-    font-size: calc(1.375rem + ((1vw - 0.48rem) * 0.6944));
-    min-height: 0vw;
-  }
-
-  p.intro {
-    font-size: calc(1.125rem + ((1vw - 0.48rem) * 0.1736));
-    min-height: 0vw;
-  }
-
-  p, li, a {
-    font-size: calc(0.875rem + ((1vw - 0.48rem) * 0.1736));
-    min-height: 0vw;
-  }
+h1 {
+  font-size: 2.625rem;
 }
 
-@media (min-width: 120em) {
+h2 {
+  font-size: 2rem;
+}
+
+h3 {
+  font-size: 1.625rem;
+}
+
+h3.title {
+  font-size: 1.25rem;
+}
+
+p.large {
+  font-size: 1.375rem;
+}
+
+p.intro {
+  font-size: 1.125rem;
+}
+
+p, li, a {
+  font-size: 0.875rem;
+}
+
+@media (min-width: 420px) {
   h1 {
-    font-size: 4.6875rem;
+    font-size: 4rem;
   }
 
   h2 {
@@ -145,6 +148,23 @@ h3.title {
   }
 }
 
+ul.services {
+  list-style: none;
+  padding-left: 0;
+}
+
+ul.services li {
+  padding-left: var(--space-md);
+  position: relative;
+}
+
+ul.services li::before {
+  content: "−";
+  color: var(--cotech-blue);
+  position: absolute;
+  left: 0;
+}
+
 strong {
   font-family: "open_sansbold", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
 }
@@ -165,15 +185,26 @@ img.rounded {
   border-radius: var(--space-sm);
 }
 
+img.rectangle {
+  aspect-ratio: 2;
+  object-fit: cover;
+}
+
 img.cover {
   object-fit: cover;
   height: 100%;
   width: 100%;
 }
 
+img.stretch {
+  object-fit: cover;
+  object-position: 0px 0px;
+  height: 100%;
+}
+
 section, footer, header {
   padding: var(--space-md);
-  max-inline-size: 1024px;
+  max-inline-size: 1144px;
   margin-left: auto;
   margin-right: auto;
 }