diff --git a/src/_includes/layouts/base.html b/src/_includes/layouts/base.html
index 433c8d1..391fe07 100644
--- a/src/_includes/layouts/base.html
+++ b/src/_includes/layouts/base.html
@@ -7,6 +7,7 @@
       {% include "css/reset.css" %}
       {% include "css/theme.css" %}
       {% include "css/variables.css" %}
+      {% include "css/utilities.css" %}
       {% include "css/main.css" %}
 
       {% include "css/components/button.css" %}
diff --git a/src/css/main.css b/src/css/main.css
index b307278..a63c883 100644
--- a/src/css/main.css
+++ b/src/css/main.css
@@ -12,100 +12,6 @@
   fill: currentColor;
 }
 
-/* Utilities */
-.wrapper,
-.wrapper-full {
-  grid-template-columns: 1fr min(
-      var(--wrapper-max-length, var(--line-length)),
-      100% - var(--wrapper-gap, var(--gutter)) * 2
-    ) 1fr;
-  grid-column-gap: var(--wrapper-gap, var(--gutter));
-  display: grid;
-}
-.wrapper > *,
-.wrapper-full > * {
-  grid-column: 2;
-}
-.wrapper-full {
-  grid-template-columns: 1fr min(
-      var(--wrapper-max-length, var(--line-length-large)),
-      100% - var(--wrapper-gap, var(--gutter)) * 2
-    ) 1fr;
-}
-.full-bleed {
-  inline-size: 100%;
-  padding: var(--padding-block, 1rem) var(--padding-inline, 2rem);
-  background-color: var(--background-color, none);
-  grid-column: 1/-1;
-}
-.flex {
-  display: inline-flex;
-}
-.flex-col {
-  flex-direction: column;
-}
-.justify-around {
-  justify-content: space-around;
-}
-.justify-center {
-  justify-content: center;
-}
-.items-center {
-  align-items: center;
-}
-.sr-only {
-  clip: rect(0, 0, 0, 0) !important;
-  white-space: nowrap !important;
-  border: 0 !important;
-  block-size: 1px !important;
-  inline-size: 1px !important;
-  margin: -1px !important;
-  padding: 0 !important;
-  position: absolute !important;
-  overflow: hidden !important;
-}
-.invisible {
-  visibility: hidden !important;
-}
-.list-inline {
-  margin-left: calc(var(--item-gap, 1ch) * 3 * -1);
-  clip-path: inset(0 0 0 calc(var(--item-gap, 1ch) * 3));
-  color: var(--item-color, var(--text));
-  flex-wrap: wrap;
-  align-items: center;
-  padding-left: 0;
-  list-style: none;
-  display: flex;
-}
-.list-inline li {
-  padding-left: var(--item-gap, 1ch);
-}
-.list-inline li:before {
-  content: var(--item-separator, "•");
-  margin-right: var(--item-gap, 1ch);
-  width: var(--item-gap, 1ch);
-  text-align: center;
-  display: inline-block;
-}
-.list-inline a {
-  color: var(--item-color, var(--text));
-  text-decoration: none;
-  transition: all 0.2s;
-}
-.list-inline a:hover {
-  text-decoration: underline;
-}
-
-/* Focus */
-* {
-  outline-offset: 2px;
-  outline-width: 2px;
-  outline-color: #0a76f6;
-}
-:focus:focus-visible {
-  outline-style: solid;
-}
-
 /* Other */
 *,
 :before,
diff --git a/src/css/utilities.css b/src/css/utilities.css
new file mode 100644
index 0000000..2b406cf
--- /dev/null
+++ b/src/css/utilities.css
@@ -0,0 +1,92 @@
+.wrapper,
+.wrapper-full {
+  grid-template-columns: 1fr min(
+      var(--wrapper-max-length, var(--line-length)),
+      100% - var(--wrapper-gap, var(--gutter)) * 2
+    ) 1fr;
+  grid-column-gap: var(--wrapper-gap, var(--gutter));
+  display: grid;
+}
+.wrapper > *,
+.wrapper-full > * {
+  grid-column: 2;
+}
+.wrapper-full {
+  grid-template-columns: 1fr min(
+      var(--wrapper-max-length, var(--line-length-large)),
+      100% - var(--wrapper-gap, var(--gutter)) * 2
+    ) 1fr;
+}
+.full-bleed {
+  inline-size: 100%;
+  padding: var(--padding-block, 1rem) var(--padding-inline, 2rem);
+  background-color: var(--background-color, none);
+  grid-column: 1/-1;
+}
+.flex {
+  display: inline-flex;
+}
+.flex-col {
+  flex-direction: column;
+}
+.justify-around {
+  justify-content: space-around;
+}
+.justify-center {
+  justify-content: center;
+}
+.items-center {
+  align-items: center;
+}
+.sr-only {
+  clip: rect(0, 0, 0, 0) !important;
+  white-space: nowrap !important;
+  border: 0 !important;
+  block-size: 1px !important;
+  inline-size: 1px !important;
+  margin: -1px !important;
+  padding: 0 !important;
+  position: absolute !important;
+  overflow: hidden !important;
+}
+.invisible {
+  visibility: hidden !important;
+}
+.list-inline {
+  margin-left: calc(var(--item-gap, 1ch) * 3 * -1);
+  clip-path: inset(0 0 0 calc(var(--item-gap, 1ch) * 3));
+  color: var(--item-color, var(--text));
+  flex-wrap: wrap;
+  align-items: center;
+  padding-left: 0;
+  list-style: none;
+  display: flex;
+}
+.list-inline li {
+  padding-left: var(--item-gap, 1ch);
+}
+.list-inline li:before {
+  content: var(--item-separator, "•");
+  margin-right: var(--item-gap, 1ch);
+  width: var(--item-gap, 1ch);
+  text-align: center;
+  display: inline-block;
+}
+.list-inline a {
+  color: var(--item-color, var(--text));
+  text-decoration: none;
+  transition: all 0.2s;
+}
+.list-inline a:hover {
+  text-decoration: underline;
+}
+
+/* Focus */
+* {
+  outline-offset: 2px;
+  outline-width: 2px;
+  outline-color: #0a76f6;
+}
+:focus:focus-visible {
+  outline-style: solid;
+}
\ No newline at end of file