diff --git a/site/src/layouts/Base.astro b/site/src/layouts/Base.astro
index 0cb8f77b..d9e73eb4 100644
--- a/site/src/layouts/Base.astro
+++ b/site/src/layouts/Base.astro
@@ -54,6 +54,9 @@ const fullTitle = Array.isArray(title)
     {/* Font preloads */}
     <Font cssVariable="--font-instrument-sans" preload />
     <Font cssVariable="--font-ibm-plex-mono" preload />
+    <link rel="preload" href="https://static.mux.com/fonts/EurostileLTProBold/font.woff2" as="font" type="font/woff2" crossorigin />
+    <link rel="preload" href="https://static.mux.com/fonts/EurostileLTProExtended2/font.woff2" as="font" type="font/woff2" crossorigin />
+    <link rel="preload" href="https://static.mux.com/fonts/EurostileLTProBoldExtended2/font.woff2" as="font" type="font/woff2" crossorigin />
 
     {/* Canonical URL */}
     <link rel="canonical" href={canonicalURL} />
diff --git a/site/src/styles/globals.css b/site/src/styles/globals.css
index a1f4ff62..635432ab 100644
--- a/site/src/styles/globals.css
+++ b/site/src/styles/globals.css
@@ -1,14 +1,56 @@
 @import "tailwindcss";
 
+/**
+ * @license
+ * MyFonts Webfont Build ID 3867246
+ *
+ * The fonts listed in this notice are subject to the End User License
+ * Agreement(s) entered into by the website owner. All other parties are
+ * explicitly restricted from using the Licensed Webfonts(s).
+ *
+ * Webfont: Eurostile LT Pro Bold by Linotype
+ * Webfont: Eurostile LT Pro Extended #2 by Linotype
+ * Webfont: Eurostile LT Pro Bold Extended #2 by Linotype
+ */
+@font-face {
+  font-family: "Eurostile LT Pro";
+  src:
+    url("https://static.mux.com/fonts/EurostileLTProBold/font.woff2") format("woff2"),
+    url("https://static.mux.com/fonts/EurostileLTProBold/font.woff") format("woff");
+  font-weight: bold;
+  font-style: normal;
+  font-display: swap;
+}
+@font-face {
+  font-family: "Eurostile LT Pro Extended";
+  src:
+    url("https://static.mux.com/fonts/EurostileLTProExtended2/font.woff2") format("woff2"),
+    url("https://static.mux.com/fonts/EurostileLTProExtended2/font.woff") format("woff");
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+}
+@font-face {
+  font-family: "Eurostile LT Pro Extended";
+  src:
+    url("https://static.mux.com/fonts/EurostileLTProBoldExtended2/font.woff2") format("woff2"),
+    url("https://static.mux.com/fonts/EurostileLTProBoldExtended2/font.woff") format("woff");
+  font-weight: bold;
+  font-style: normal;
+  font-display: swap;
+}
+
 /* before we begin with tailwind, let's go over some global rules */
 /* nested lists should have lower-alpha style */
 .list-decimal .list-decimal {
   list-style-type: lower-alpha;
 }
+
 /* slightly thinner decorations */
 * {
   text-decoration-thickness: max(0.05em, 0.05rem);
 }
+
 /* global text decoration offset */
 .font-sans {
   text-underline-offset: 0.25em;
@@ -16,15 +58,18 @@
 .font-mono {
   text-underline-offset: 0.125em;
 }
-/* ligatures */
+
+/* no ligatures in code... */
 .font-mono {
   font-variant-ligatures: none;
 }
+
 /* stuff should leave room for the nav when scroll margining */
 [id] {
   scroll-margin-top: calc(var(--nav-h) + var(--spacing) * 5 + var(--scroll-mt, 0px));
 }
-/* misc */
+
+/* basic HTML elements */
 b,
 strong {
   font-weight: var(--font-weight-semibold);
@@ -34,6 +79,15 @@ mark {
   color: var(--color-dark-100);
 }
 
+/* shiki dark mode */
+.dark .shiki,
+.dark .shiki span,
+.dark .astro-code,
+.dark .astro-code span {
+  /* biome-ignore lint/complexity/noImportantStyles: override shiki's inline styles */
+  color: var(--shiki-dark) !important;
+}
+
 /* Ok, now let's do some tailwind stuff */
 @custom-variant intent (&:hover,
 &:focus-within);
@@ -46,13 +100,6 @@ mark {
 .dark * {
   color-scheme: dark;
 }
-.dark .shiki,
-.dark .shiki span,
-.dark .astro-code,
-.dark .astro-code span {
-  /* biome-ignore lint/complexity/noImportantStyles: override shiki's inline styles */
-  color: var(--shiki-dark) !important;
-}
 
 /* theme inline tells tailwind to reference the value of these properties */
 @theme inline {
@@ -60,7 +107,10 @@ mark {
   /* --font-instrument-sans and --font-ibm-plex-mono are defined in Base.astro */
   --font-sans: var(--font-instrument-sans);
   --font-mono: var(--font-ibm-plex-mono);
+  --font-display-compact: "Eurostile LT Pro", sans-serif;
+  --font-display-extended: "Eurostile LT Pro Extended", sans-serif;
 }
+
 /* Everything else can be configured here */
 @theme {
   --color-*: initial;