fix: Use "brand" fonts in title

src/components/Font.astro

@@ -26,17 +26,7 @@ const makeFontPath = (filePath: string) =>
       preload: false,
       display: "swap",
       fallback: "sans-serif",
-      selector: ".font-apricot",
-    },
-    {
-      src: [],
-      name: "Inter",
-      googleFontsURL:
-        "https://fonts.googleapis.com/css2?family=Inter:wght@100..900",
-      preload: false,
-      display: "swap",
-      fallback: "sans-serif",
-      cssVariable: "neo-Grotesque",
+      cssVariable: "font-apricot",
     },
   ]}
 />

src/consts.ts

@@ -3,7 +3,7 @@ export const SITE_TITLE = "Data in the Wild";
 export const SITE_DESCRIPTION = "";
 
 export const SHOW_TITLE =
-  '<span class="font-black font-neo text-primary">DATA</span> <span class="font-apricot">in the Wild</span>';
+  '<em>DATA</em> <span>in the Wild</span>';
 
 // export const SHOW_DESCRIPTION =
 //   "A podcast where your favorite indie hackers share their data model journey so you can learn from their experience, both good and bad!";

src/global.css

@@ -5,6 +5,8 @@
     "Sitka Small", serif;
   --industrial: Bahnschrift, "DIN Alternate", "Franklin Gothic Medium",
     "Nimbus Sans Narrow", sans-serif-condensed, sans-serif;
+  --neo-Grotesque: Inter, Roboto, "Helvetica Neue", "Arial Nova", "Nimbus Sans",
+    Arial, sans-serif;
 
   --paper: #fffaf0;
   --paper-inverted: #000;
@@ -103,15 +105,3 @@ nav {
     margin-top: 4em;
   }
 }
-
-.font-neo {
-  font-family: var(--neo-Grotesque);
-}
-
-.font-black {
-  font-weight: 900;
-}
-
-.text-primary {
-  color: var(--color-primary);
-}

src/pages/index.astro

@@ -96,6 +96,16 @@ import { Content as Sponsor } from "./_sponsor.md";
     line-height: 1;
     font-weight: 900;
 
+    em {
+      font-family: var(--neo-Grotesque);
+      color: var(--color-primary);
+      font-weight: 900;
+    }
+
+    span {
+      font-family: var(--font-apricot);
+    }
+
     + p {
       margin-top: min(1.5vw, 1em);
       font-size: 1.3em;