diff --git a/public/fonts/Geist-Variable.woff2 b/public/fonts/Geist-Variable.woff2
new file mode 100644
index 0000000..d1a0cbc
Binary files /dev/null and b/public/fonts/Geist-Variable.woff2 differ
diff --git a/public/fonts/GeistMono-Variable.woff2 b/public/fonts/GeistMono-Variable.woff2
new file mode 100644
index 0000000..4692e48
Binary files /dev/null and b/public/fonts/GeistMono-Variable.woff2 differ
diff --git a/src/components/ui/badge.tsx b/src/components/ui/badge.tsx
index 246d1d5..bfb0a7f 100644
--- a/src/components/ui/badge.tsx
+++ b/src/components/ui/badge.tsx
@@ -21,7 +21,7 @@ export const Badge = ({
   return (
     <span
       className={cn(
-        'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium',
+        'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-semibold',
         variants[variant],
         className
       )}
diff --git a/src/index.css b/src/index.css
index 4bd607a..fb23c40 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,13 +1,32 @@
 @import 'tailwindcss';
 @import 'tw-animate-css';
 
+/* Geist Sans Variable Font */
+@font-face {
+  font-family: 'Geist';
+  src: url('/fonts/Geist-Variable.woff2') format('woff2');
+  font-weight: 100 900;
+  font-style: normal;
+  font-display: swap;
+}
+
+/* Geist Mono Variable Font */
+@font-face {
+  font-family: 'Geist Mono';
+  src: url('/fonts/GeistMono-Variable.woff2') format('woff2');
+  font-weight: 100 900;
+  font-style: normal;
+  font-display: swap;
+}
+
 @custom-variant dark (&:is(.dark *));
 
 @theme inline {
   --color-background: var(--background);
   --color-foreground: var(--foreground);
-  --font-sans: 'Inter', system-ui, -apple-system, sans-serif;
-  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
+  --font-sans: 'Geist', system-ui, -apple-system, sans-serif;
+  --font-mono: 'Geist Mono', ui-monospace, monospace;
+
   --color-ring: var(--ring);
   --color-border: var(--border);
   --color-accent: var(--accent);
@@ -73,16 +92,14 @@
   html {
     scroll-behavior: smooth;
   }
+
   * {
     @apply border-border outline-ring/50;
   }
+
   body {
-    @apply bg-background text-foreground;
-    font-family:
-      'Inter',
-      system-ui,
-      -apple-system,
-      sans-serif;
+    @apply bg-background text-foreground antialiased;
+    font-family: var(--font-sans);
   }
 }
 
diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx
index 270e76d..cda03ae 100644
--- a/src/pages/HomePage.tsx
+++ b/src/pages/HomePage.tsx
@@ -173,7 +173,7 @@ export function HomePage() {
 function LiquidGlassGradient() {
   return (
     <div className="pointer-events-none absolute inset-0 -z-10 overflow-hidden">
-      <div className="absolute inset-0 bg-[radial-gradient(circle_at_top,_rgba(255,255,255,0.9),_rgba(237,242,255,0.6))]" />
+      <div className="absolute inset-0 bg-[radial-gradient(circle_at_top,_rgba(255,255,255,0.9),_rgba(237,242,255,0.55))]" />
       <div className="absolute left-1/2 top-[-8rem] h-[44rem] w-[44rem] -translate-x-1/2 rounded-[50%] bg-white/80 blur-[140px] opacity-85 mix-blend-screen" />
       <div className="absolute left-[12%] top-[22%] h-80 w-80 rounded-full bg-[#7fb0ff]/40 blur-[120px] mix-blend-screen" />
       <div className="absolute right-[18%] top-[30%] h-[26rem] w-[24rem] rounded-[40%] bg-gradient-to-br from-[#ffdff3]/65 via-[#fff3f8]/45 to-transparent blur-[150px] mix-blend-screen" />