diff --git a/src/styles/_build.scss b/src/styles/_build.scss
index 5d338b1..db97f3c 100644
--- a/src/styles/_build.scss
+++ b/src/styles/_build.scss
@@ -1,4 +1,3 @@
 @import 'tailwind';
 @import 'typography';
 @import 'transitions';
-@import 'swiper';
diff --git a/src/styles/_swiper.scss b/src/styles/_swiper.scss
deleted file mode 100644
index ca1b66c..0000000
--- a/src/styles/_swiper.scss
+++ /dev/null
@@ -1,354 +0,0 @@
-$themeColor: #00d1ff !default;
-@at-root {
-  @font-face {
-    font-family: 'swiper-icons';
-    src: url('data:application/font-woff;charset=utf-8;base64, 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')
-      format('woff');
-    font-weight: 400;
-    font-style: normal;
-  }
-}
-@at-root {
-  :root {
-    --swiper-theme-color: #{$themeColor};
-  }
-}
-.swiper {
-  margin-left: auto;
-  margin-right: auto;
-  position: relative;
-  overflow: hidden;
-  list-style: none;
-  padding: 0;
-  /* Fix of Webkit flickering */
-  z-index: 1;
-}
-.swiper-vertical > .swiper-wrapper {
-  flex-direction: column;
-}
-.swiper-wrapper {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  z-index: 1;
-  display: flex;
-  transition-property: transform;
-  box-sizing: content-box;
-}
-.swiper-android .swiper-slide,
-.swiper-wrapper {
-  transform: translate3d(0px, 0, 0);
-}
-.swiper-pointer-events {
-  touch-action: pan-y;
-  &.swiper-vertical {
-    touch-action: pan-x;
-  }
-}
-.swiper-slide {
-  flex-shrink: 0;
-  width: 100%;
-  height: 100%;
-  position: relative;
-  transition-property: transform;
-}
-.swiper-slide-invisible-blank {
-  visibility: hidden;
-}
-/* Auto Height */
-.swiper-autoheight {
-  &,
-  .swiper-slide {
-    height: auto;
-  }
-
-  .swiper-wrapper {
-    align-items: flex-start;
-    transition-property: transform, height;
-  }
-}
-.swiper-backface-hidden .swiper-slide {
-  transform: translateZ(0);
-  backface-visibility: hidden;
-}
-/* 3D Effects */
-.swiper-3d {
-  &,
-  &.swiper-css-mode .swiper-wrapper {
-    perspective: 1200px;
-  }
-  .swiper-wrapper,
-  .swiper-slide,
-  .swiper-slide-shadow,
-  .swiper-slide-shadow-left,
-  .swiper-slide-shadow-right,
-  .swiper-slide-shadow-top,
-  .swiper-slide-shadow-bottom,
-  .swiper-cube-shadow {
-    transform-style: preserve-3d;
-  }
-  .swiper-slide-shadow,
-  .swiper-slide-shadow-left,
-  .swiper-slide-shadow-right,
-  .swiper-slide-shadow-top,
-  .swiper-slide-shadow-bottom {
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    pointer-events: none;
-    z-index: 10;
-  }
-  .swiper-slide-shadow {
-    background: rgba(0, 0, 0, 0.15);
-  }
-  .swiper-slide-shadow-left {
-    background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
-  }
-  .swiper-slide-shadow-right {
-    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
-  }
-  .swiper-slide-shadow-top {
-    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
-  }
-  .swiper-slide-shadow-bottom {
-    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
-  }
-}
-
-/* CSS Mode */
-.swiper-css-mode {
-  > .swiper-wrapper {
-    overflow: auto;
-    scrollbar-width: none; /* For Firefox */
-    -ms-overflow-style: none; /* For Internet Explorer and Edge */
-    &::-webkit-scrollbar {
-      display: none;
-    }
-  }
-  > .swiper-wrapper > .swiper-slide {
-    scroll-snap-align: start start;
-  }
-}
-.swiper-horizontal.swiper-css-mode {
-  > .swiper-wrapper {
-    scroll-snap-type: x mandatory;
-  }
-}
-.swiper-vertical.swiper-css-mode {
-  > .swiper-wrapper {
-    scroll-snap-type: y mandatory;
-  }
-}
-.swiper-centered {
-  > .swiper-wrapper::before {
-    content: '';
-    flex-shrink: 0;
-    order: 9999;
-  }
-  &.swiper-horizontal {
-    > .swiper-wrapper > .swiper-slide:first-child {
-      margin-inline-start: var(--swiper-centered-offset-before);
-    }
-    > .swiper-wrapper::before {
-      height: 100%;
-      width: var(--swiper-centered-offset-after);
-    }
-  }
-  &.swiper-vertical {
-    > .swiper-wrapper > .swiper-slide:first-child {
-      margin-block-start: var(--swiper-centered-offset-before);
-    }
-    > .swiper-wrapper::before {
-      width: 100%;
-      height: var(--swiper-centered-offset-after);
-    }
-  }
-
-  > .swiper-wrapper > .swiper-slide {
-    scroll-snap-align: center center;
-  }
-}
-
-.swiper-wrapper {
-  padding-bottom: 48px;
-  .swiper-slide > * {
-    margin: auto;
-  }
-}
-
-.swiper-button-disabled > div {
-  opacity: 0.4;
-}
-
-@at-root {
-  :root {
-    /*
-  --swiper-pagination-color: var(--swiper-theme-color);
-  --swiper-pagination-bullet-size: 8px;
-  --swiper-pagination-bullet-width: 8px;
-  --swiper-pagination-bullet-height: 8px;
-  --swiper-pagination-bullet-inactive-color: #000;
-  --swiper-pagination-bullet-inactive-opacity: 0.2;
-  --swiper-pagination-bullet-opacity: 1;
-  --swiper-pagination-bullet-horizontal-gap: 4px;
-  --swiper-pagination-bullet-vertical-gap: 6px;
-  */
-  }
-}
-.swiper-pagination {
-  position: absolute;
-  text-align: center;
-  transition: 300ms opacity;
-  transform: translate3d(0, 0, 0);
-  z-index: 10;
-  &.swiper-pagination-hidden {
-    opacity: 0;
-  }
-  .swiper-pagination-disabled > &,
-  &.swiper-pagination-disabled {
-    display: none !important;
-  }
-}
-/* Common Styles */
-.swiper-pagination-fraction,
-.swiper-pagination-custom,
-.swiper-horizontal > .swiper-pagination-bullets,
-.swiper-pagination-bullets.swiper-pagination-horizontal {
-  bottom: 10px;
-  left: 0;
-  width: 100%;
-}
-/* Bullets */
-.swiper-pagination-bullets-dynamic {
-  overflow: hidden;
-  font-size: 0;
-  .swiper-pagination-bullet {
-    transform: scale(0.33);
-    position: relative;
-  }
-  .swiper-pagination-bullet-active {
-    transform: scale(1);
-  }
-  .swiper-pagination-bullet-active-main {
-    transform: scale(1);
-  }
-  .swiper-pagination-bullet-active-prev {
-    transform: scale(0.66);
-  }
-  .swiper-pagination-bullet-active-prev-prev {
-    transform: scale(0.33);
-  }
-  .swiper-pagination-bullet-active-next {
-    transform: scale(0.66);
-  }
-  .swiper-pagination-bullet-active-next-next {
-    transform: scale(0.33);
-  }
-}
-.swiper-pagination-bullet {
-  width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
-  height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
-  display: inline-block;
-  border-radius: 50%;
-  background: var(--swiper-pagination-bullet-inactive-color, #000);
-  opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
-  @at-root button#{&} {
-    border: none;
-    margin: 0;
-    padding: 0;
-    box-shadow: none;
-    appearance: none;
-  }
-  .swiper-pagination-clickable & {
-    cursor: pointer;
-  }
-
-  &:only-child {
-    display: none !important;
-  }
-}
-.swiper-pagination-bullet-active {
-  opacity: var(--swiper-pagination-bullet-opacity, 1);
-  background: var(--swiper-pagination-color, var(--swiper-theme-color));
-}
-
-.swiper-vertical > .swiper-pagination-bullets,
-.swiper-pagination-vertical.swiper-pagination-bullets {
-  right: 10px;
-  top: 50%;
-  transform: translate3d(0px, -50%, 0);
-  .swiper-pagination-bullet {
-    margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
-    display: block;
-  }
-  &.swiper-pagination-bullets-dynamic {
-    top: 50%;
-    transform: translateY(-50%);
-    width: 8px;
-    .swiper-pagination-bullet {
-      display: inline-block;
-      transition: 200ms transform, 200ms top;
-    }
-  }
-}
-.swiper-horizontal > .swiper-pagination-bullets,
-.swiper-pagination-horizontal.swiper-pagination-bullets {
-  .swiper-pagination-bullet {
-    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
-  }
-  &.swiper-pagination-bullets-dynamic {
-    left: 50%;
-    transform: translateX(-50%);
-    white-space: nowrap;
-    .swiper-pagination-bullet {
-      transition: 200ms transform, 200ms left;
-    }
-  }
-}
-.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
-  transition: 200ms transform, 200ms right;
-}
-/* Progress */
-.swiper-pagination-progressbar {
-  background: rgba(0, 0, 0, 0.25);
-  position: absolute;
-  .swiper-pagination-progressbar-fill {
-    background: var(--swiper-pagination-color, var(--swiper-theme-color));
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 100%;
-    height: 100%;
-    transform: scale(0);
-    transform-origin: left top;
-  }
-  .swiper-rtl & .swiper-pagination-progressbar-fill {
-    transform-origin: right top;
-  }
-  .swiper-horizontal > &,
-  &.swiper-pagination-horizontal,
-  .swiper-vertical > &.swiper-pagination-progressbar-opposite,
-  &.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {
-    width: 100%;
-    height: 4px;
-    left: 0;
-    top: 0;
-  }
-  .swiper-vertical > &,
-  &.swiper-pagination-vertical,
-  .swiper-horizontal > &.swiper-pagination-progressbar-opposite,
-  &.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {
-    width: 4px;
-    height: 100%;
-    left: 0;
-    top: 0;
-  }
-}
-.swiper-pagination-lock {
-  display: none;
-}
-.swiper-button-lock {
-  display: none;
-}
diff --git a/src/styles/_variables.scss b/src/styles/_variables.scss
index 1f46d97..2067020 100644
--- a/src/styles/_variables.scss
+++ b/src/styles/_variables.scss
@@ -122,9 +122,6 @@ html {
 
   --color-primary: #00d1ff;
   --color-dark-blue: #0b0b22;
-
-  --swiper-pagination-bullet-inactive-opacity: 1;
-  --swiper-pagination-bullet-inactive-color: #828295;
 }
 .ui-gradient-primary {
   background: linear-gradient(73.6deg, #85ffc4 2.11%, #5cc6ff 90.45%);
diff --git a/src/styles/fonts/index.scss b/src/styles/fonts/index.scss
new file mode 100644
index 0000000..4a1d43b
--- /dev/null
+++ b/src/styles/fonts/index.scss
@@ -0,0 +1,2 @@
+@import 'synthetix-icons/style';
+@import 'typography/style';
diff --git a/src/styles/fonts/synthetix-icons/_style.scss b/src/styles/fonts/synthetix-icons/_style.scss
index 42aebf9..6649d1e 100644
--- a/src/styles/fonts/synthetix-icons/_style.scss
+++ b/src/styles/fonts/synthetix-icons/_style.scss
@@ -1,13 +1,13 @@
 @import 'variables';
 
 @font-face {
-  font-family: '#{$icomoon-font-family}';
-  src: url('#{$icomoon-font-path}/#{$icomoon-font-family}.eot?eamtt7');
-  src: url('#{$icomoon-font-path}/#{$icomoon-font-family}.eot?eamtt7#iefix')
+  font-family: '#{$synthetix-font-family}';
+  src: url('#{$synthetix-font-path}/#{$synthetix-font-family}.eot?eamtt7');
+  src: url('#{$synthetix-font-path}/#{$synthetix-font-family}.eot?eamtt7#iefix')
       format('embedded-opentype'),
-    url('#{$icomoon-font-path}/#{$icomoon-font-family}.ttf?eamtt7') format('truetype'),
-    url('#{$icomoon-font-path}/#{$icomoon-font-family}.woff?eamtt7') format('woff'),
-    url('#{$icomoon-font-path}/#{$icomoon-font-family}.svg?eamtt7##{$icomoon-font-family}')
+    url('#{$synthetix-font-path}/#{$synthetix-font-family}.ttf?eamtt7') format('truetype'),
+    url('#{$synthetix-font-path}/#{$synthetix-font-family}.woff?eamtt7') format('woff'),
+    url('#{$synthetix-font-path}/#{$synthetix-font-family}.svg?eamtt7##{$synthetix-font-family}')
       format('svg');
   font-weight: normal;
   font-style: normal;
@@ -16,7 +16,7 @@
 
 i {
   /* use !important to prevent issues with browser extensions that change fonts */
-  font-family: '#{$icomoon-font-family}' !important;
+  font-family: '#{$synthetix-font-family}' !important;
   speak: never;
   font-style: normal;
   font-weight: normal;
diff --git a/src/styles/fonts/synthetix-icons/_variables.scss b/src/styles/fonts/synthetix-icons/_variables.scss
index 3bc3813..581ac04 100644
--- a/src/styles/fonts/synthetix-icons/_variables.scss
+++ b/src/styles/fonts/synthetix-icons/_variables.scss
@@ -1,5 +1,5 @@
-$icomoon-font-family: 'synthetix' !default;
-$icomoon-font-path: '.' !default;
+$synthetix-font-family: 'synthetix' !default;
+$synthetix-font-path: '.' !default;
 
 $synthetix-Archive: '\e900';
 $synthetix-Bell: '\e901';
diff --git a/src/styles/fonts/typography/GT-America-Condensed-Bold.woff b/src/styles/fonts/typography/GT-America-Condensed-Bold.woff
new file mode 100644
index 0000000..4ef620c
Binary files /dev/null and b/src/styles/fonts/typography/GT-America-Condensed-Bold.woff differ
diff --git a/src/styles/fonts/typography/GT-America-Condensed-Bold.woff2 b/src/styles/fonts/typography/GT-America-Condensed-Bold.woff2
new file mode 100644
index 0000000..32a92a2
Binary files /dev/null and b/src/styles/fonts/typography/GT-America-Condensed-Bold.woff2 differ
diff --git a/src/styles/fonts/GT-America-Extended-Bold.woff b/src/styles/fonts/typography/GT-America-Extended-Bold.woff
similarity index 100%
rename from src/styles/fonts/GT-America-Extended-Bold.woff
rename to src/styles/fonts/typography/GT-America-Extended-Bold.woff
diff --git a/src/styles/fonts/GT-America-Extended-Bold.woff2 b/src/styles/fonts/typography/GT-America-Extended-Bold.woff2
similarity index 100%
rename from src/styles/fonts/GT-America-Extended-Bold.woff2
rename to src/styles/fonts/typography/GT-America-Extended-Bold.woff2
diff --git a/src/styles/fonts/GT-America-Mono-Bold.woff b/src/styles/fonts/typography/GT-America-Mono-Bold.woff
similarity index 100%
rename from src/styles/fonts/GT-America-Mono-Bold.woff
rename to src/styles/fonts/typography/GT-America-Mono-Bold.woff
diff --git a/src/styles/fonts/GT-America-Mono-Bold.woff2 b/src/styles/fonts/typography/GT-America-Mono-Bold.woff2
similarity index 100%
rename from src/styles/fonts/GT-America-Mono-Bold.woff2
rename to src/styles/fonts/typography/GT-America-Mono-Bold.woff2
diff --git a/src/styles/fonts/GT-America-Regular.woff b/src/styles/fonts/typography/GT-America-Regular.woff
similarity index 100%
rename from src/styles/fonts/GT-America-Regular.woff
rename to src/styles/fonts/typography/GT-America-Regular.woff
diff --git a/src/styles/fonts/GT-America-Regular.woff2 b/src/styles/fonts/typography/GT-America-Regular.woff2
similarity index 100%
rename from src/styles/fonts/GT-America-Regular.woff2
rename to src/styles/fonts/typography/GT-America-Regular.woff2
diff --git a/src/styles/fonts/Inter-Bold.woff b/src/styles/fonts/typography/Inter-Bold.woff
similarity index 100%
rename from src/styles/fonts/Inter-Bold.woff
rename to src/styles/fonts/typography/Inter-Bold.woff
diff --git a/src/styles/fonts/Inter-Bold.woff2 b/src/styles/fonts/typography/Inter-Bold.woff2
similarity index 100%
rename from src/styles/fonts/Inter-Bold.woff2
rename to src/styles/fonts/typography/Inter-Bold.woff2
diff --git a/src/styles/fonts/Inter-Regular.woff b/src/styles/fonts/typography/Inter-Regular.woff
similarity index 100%
rename from src/styles/fonts/Inter-Regular.woff
rename to src/styles/fonts/typography/Inter-Regular.woff
diff --git a/src/styles/fonts/Inter-Regular.woff2 b/src/styles/fonts/typography/Inter-Regular.woff2
similarity index 100%
rename from src/styles/fonts/Inter-Regular.woff2
rename to src/styles/fonts/typography/Inter-Regular.woff2
diff --git a/src/styles/fonts/Lustra-Text-Regular.woff b/src/styles/fonts/typography/Lustra-Text-Regular.woff
similarity index 100%
rename from src/styles/fonts/Lustra-Text-Regular.woff
rename to src/styles/fonts/typography/Lustra-Text-Regular.woff
diff --git a/src/styles/fonts/Lustra-Text-Regular.woff2 b/src/styles/fonts/typography/Lustra-Text-Regular.woff2
similarity index 100%
rename from src/styles/fonts/Lustra-Text-Regular.woff2
rename to src/styles/fonts/typography/Lustra-Text-Regular.woff2
diff --git a/src/styles/fonts/typography/_style.scss b/src/styles/fonts/typography/_style.scss
new file mode 100644
index 0000000..5841856
--- /dev/null
+++ b/src/styles/fonts/typography/_style.scss
@@ -0,0 +1,62 @@
+@font-face {
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: local('Inter'), url('./Inter-Regular.woff2') format('woff2'),
+    url('./Inter-Regular.woff') format('woff');
+}
+
+@font-face {
+  font-family: 'Lustra Text';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 400;
+  src: local('Lustra Text'), url('./Lustra-Text-Regular.woff2') format('woff2'),
+    url('./Lustra-Text-Regular.woff') format('woff');
+}
+
+@font-face {
+  font-family: 'GT America';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 400;
+  src: local('GT America'), url('./GT-America-Regular.woff2') format('woff2'),
+    url('./GT-America-Regular.woff') format('woff');
+}
+
+@font-face {
+  font-family: 'GT America Extended';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 700;
+  src: local('GT America Extended'), url('./GT-America-Extended-Bold.woff2') format('woff2'),
+    url('./GT-America-Extended-Bold.woff') format('woff');
+}
+
+@font-face {
+  font-family: 'GT America Condensed Bold';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 700;
+  src: local('GT America Condensed Bold'), url('./GT-America-Condensed-Bold.woff2') format('woff2'),
+    url('./GT-America-Condensed-Bold.woff') format('woff');
+}
+
+@font-face {
+  font-family: 'GT America Mono';
+  font-style: normal;
+  font-display: swap;
+  font-weight: bold;
+  src: local('GT America Extended'), url('./GT-America-Mono-Bold.woff2') format('woff2'),
+    url('./GT-America-Mono-Bold.woff') format('woff');
+}
+
+@font-face {
+  font-family: 'Inter Bold';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 700;
+  src: local('Inter Bold'), url('./Inter-Bold.woff2') format('woff2'),
+    url('./Inter-Bold.woff') format('woff');
+}
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 5d15e07..c0e24e1 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -1,10 +1,9 @@
 @import 'variables';
 @import 'tailwind';
-@import 'fonts/synthetix-icons/style';
+@import 'fonts/index';
 @import 'breakpoint';
 @import 'typography';
 @import 'transitions';
 @import 'global';
 @import 'storybook';
 @import 'components';
-@import 'swiper';