From 08cac5a11ce2052cf26f59bf4cee76e5f0865f20 Mon Sep 17 00:00:00 2001
From: Eva Decker <itsevadecker@gmail.com>
Date: Mon, 27 May 2024 01:18:03 -0400
Subject: [PATCH] Adjust fonts

---
 src/pages/index.astro | 16 ++++++----------
 src/styles/base.css   |  5 +++--
 src/styles/theme.css  | 17 ++++++++---------
 3 files changed, 17 insertions(+), 21 deletions(-)

diff --git a/src/pages/index.astro b/src/pages/index.astro
index 8750f6f..98a1715 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -23,9 +23,8 @@ const year = new Date().getFullYear();
         <h1>Be seen for who you are.</h1>
         <p class="subhead">
           Namesake streamlines the legal name and gender marker change process
-          for trans, non-binary, and gender expansive folks. <strong
-            >(Re)launching in Massachusetts this Summer.</strong
-          >
+          for trans, non-binary, and gender expansive folks. Launching in
+          Massachusetts this Summer.
         </p>
         <form>
           <input type="email" placeholder="Your email" required />
@@ -35,7 +34,7 @@ const year = new Date().getFullYear();
       <Image
         src={idImage}
         alt="A snail on top of a Massachusetts ID card"
-        width={300}
+        width={400}
         densities={[1, 2]}
       />
     </div>
@@ -62,7 +61,7 @@ const year = new Date().getFullYear();
 <style lang="scss">
   main,
   footer {
-    padding: var(--space-2xl);
+    padding: var(--space-xl);
     width: 100%;
     margin-inline: auto;
   }
@@ -81,13 +80,11 @@ const year = new Date().getFullYear();
     align-items: flex-start;
     justify-content: center;
     gap: var(--space-2xl);
-    padding-block-end: var(--space-2xl);
-    flex: 1;
+    padding-block: var(--space-3xl);
 
     img {
       mix-blend-mode: multiply;
       height: auto;
-      order: -1;
       max-width: 100%;
       margin-left: -20px;
     }
@@ -95,8 +92,7 @@ const year = new Date().getFullYear();
 
   h1 {
     text-wrap: balance;
-    margin-block-start: calc(var(--space-s) * -1);
-    margin-block-end: var(--space-xl);
+    margin-block-end: var(--space-l);
     line-height: 0.9;
   }
 
diff --git a/src/styles/base.css b/src/styles/base.css
index 3c456a4..806b3ac 100644
--- a/src/styles/base.css
+++ b/src/styles/base.css
@@ -14,9 +14,10 @@ body {
   font-size: var(--step-0);
   line-height: var(--line-height-body);
   font-synthesis: none;
-  font-family: Arial, Helvetica, sans-serif;
+  font-family: "trade-gothic-next", sans-serif;
   font-weight: 400;
   font-style: normal;
+  letter-spacing: var(--letter-spacing-condensed);
 }
 
 ::selection {
@@ -31,7 +32,7 @@ h1, h2, h3 {
 }
 
 h1 {
-  font-size: var(--step-6);
+  font-size: var(--step-5);
   line-height: var(--line-height-single);
   letter-spacing: var(--letter-spacing-condensed);
 }
diff --git a/src/styles/theme.css b/src/styles/theme.css
index 2b5a9c6..21e3f35 100644
--- a/src/styles/theme.css
+++ b/src/styles/theme.css
@@ -3,15 +3,14 @@
 @import "@radix-ui/colors/pink.css";
 
 :root {
-  /* @link https://utopia.fyi/type/calculator?c=320,16,1.125,1240,20,1.333,6,1,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
-  --step--1: clamp(0.9375rem, 0.8462rem + 0.4565vi, 1.2rem);
-  --step-0: clamp(1.125rem, 0.9946rem + 0.6522vi, 1.5rem);
-  --step-1: clamp(1.35rem, 1.1674rem + 0.913vi, 1.875rem);
-  --step-2: clamp(1.62rem, 1.3683rem + 1.2587vi, 2.3438rem);
-  --step-3: clamp(1.944rem, 1.6012rem + 1.7142vi, 2.9297rem);
-  --step-4: clamp(2.3328rem, 1.8704rem + 2.3118vi, 3.6621rem);
-  --step-5: clamp(2.7994rem, 2.1808rem + 3.0927vi, 4.5776rem);
-  --step-6: clamp(3.3592rem, 2.5374rem + 4.1092vi, 5.722rem);
+  /* @link https://utopia.fyi/type/calculator?c=320,18,1.125,1240,22,1.25,5,1,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
+  --step--1: clamp(0.9375rem, 0.881rem + 0.2826vi, 1.1rem);
+  --step-0: clamp(1.125rem, 1.038rem + 0.4348vi, 1.375rem);
+  --step-1: clamp(1.35rem, 1.2217rem + 0.6413vi, 1.7188rem);
+  --step-2: clamp(1.62rem, 1.4362rem + 0.919vi, 2.1484rem);
+  --step-3: clamp(1.944rem, 1.6861rem + 1.2896vi, 2.6855rem);
+  --step-4: clamp(2.3328rem, 1.9766rem + 1.7811vi, 3.3569rem);
+  --step-5: clamp(2.7994rem, 2.3135rem + 2.4292vi, 4.1962rem);
 
   /* @link https://utopia.fyi/space/calculator?c=320,8,1.2,1240,12,1.333,6,2,&s=0.75|0.5,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
   --space-2xs: clamp(0.25rem, 0.2065rem + 0.2174vw, 0.375rem);