diff --git a/package-lock.json b/package-lock.json
index 6931e5b..d04b99c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,8 +9,10 @@
       "version": "1.0.0",
       "dependencies": {
         "@astrojs/sitemap": "^3.2.1",
+        "@fontsource-variable/host-grotesk": "^5.2.8",
         "@fontsource/cormorant-garamond": "^5.1.0",
         "@fontsource/mulish": "^5.1.0",
+        "@fontsource/quicksand": "^5.2.10",
         "@keystatic/core": "^0.5.0",
         "@tailwindcss/vite": "^4.0.0",
         "astro": "^5.0.0",
@@ -919,6 +921,15 @@
       "integrity": "sha512-RiB/yIh78pcIxl6lLMG0CgBXAZ2Y0eVHqMPYugu+9U0AeT6YBeiJpf7lbdJNIugFP5SIjwNRgo4DhR1Qxi26Gg==",
       "license": "MIT"
     },
+    "node_modules/@fontsource-variable/host-grotesk": {
+      "version": "5.2.8",
+      "resolved": "https://registry.npmjs.org/@fontsource-variable/host-grotesk/-/host-grotesk-5.2.8.tgz",
+      "integrity": "sha512-9rZBY0DY6eFKVC6+lvYga4tGfYO4pV8gZH2/Zp37KDlyQdR3KfCvh4GvDHCbWQd93OuaaYiPVtd8BGtoMykNQg==",
+      "license": "OFL-1.1",
+      "funding": {
+        "url": "https://github.com/sponsors/ayuhito"
+      }
+    },
     "node_modules/@fontsource/cormorant-garamond": {
       "version": "5.2.11",
       "resolved": "https://registry.npmjs.org/@fontsource/cormorant-garamond/-/cormorant-garamond-5.2.11.tgz",
@@ -937,6 +948,15 @@
         "url": "https://github.com/sponsors/ayuhito"
       }
     },
+    "node_modules/@fontsource/quicksand": {
+      "version": "5.2.10",
+      "resolved": "https://registry.npmjs.org/@fontsource/quicksand/-/quicksand-5.2.10.tgz",
+      "integrity": "sha512-rck0ccT6vJF9RnbSW2ON1grq5qFZvjVOGvYIUixATXF8mNh4KglD+8Sn8QpRgKQBSBJF5yOR3SBYBWPg/Y8YbQ==",
+      "license": "OFL-1.1",
+      "funding": {
+        "url": "https://github.com/sponsors/ayuhito"
+      }
+    },
     "node_modules/@formatjs/ecma402-abstract": {
       "version": "2.3.6",
       "resolved": "https://registry.npmjs.org/@formatjs/ecma402-abstract/-/ecma402-abstract-2.3.6.tgz",
diff --git a/package.json b/package.json
index 2a509cc..818dfd9 100644
--- a/package.json
+++ b/package.json
@@ -13,8 +13,10 @@
   },
   "dependencies": {
     "@astrojs/sitemap": "^3.2.1",
+    "@fontsource-variable/host-grotesk": "^5.2.8",
     "@fontsource/cormorant-garamond": "^5.1.0",
     "@fontsource/mulish": "^5.1.0",
+    "@fontsource/quicksand": "^5.2.10",
     "@keystatic/core": "^0.5.0",
     "@tailwindcss/vite": "^4.0.0",
     "astro": "^5.0.0",
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index 25967db..a710b65 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -32,7 +32,7 @@ const legalLinks = [
       <div class="md:col-span-4">
         <a href={lang === 'en' ? '/en/' : '/'} class="inline-flex items-center gap-2.5 mb-4" aria-label="Hosting del Sur">
           <img src="/logo/hds-mark.svg" alt="" width="36" height="36" class="h-9 w-9" aria-hidden="true" style="filter: brightness(0) invert(1);" />
-          <span class="text-lg font-display tracking-tight">
+          <span class="text-lg font-brand tracking-tight">
             <span style="color: #EE7623;">hosting</span> del <span style="color: #EE7623;">sur</span>
           </span>
         </a>
@@ -103,7 +103,7 @@ const legalLinks = [
     </div>
 
     <div class="mt-12 pt-6 border-t flex flex-col sm:flex-row sm:justify-between gap-3 text-xs" style="border-color: #2A2520; color: #8A8580;">
-      <p>© {year} Hosting del Sur. {t('footer.copyright')}</p>
+      <p class="font-brand text-sm">© {year} hosting del sur. <span class="font-sans">{t('footer.copyright')}</span></p>
       <p>{locationText}</p>
     </div>
   </div>
diff --git a/src/components/Navbar.astro b/src/components/Navbar.astro
index 61bfd69..4e5657c 100644
--- a/src/components/Navbar.astro
+++ b/src/components/Navbar.astro
@@ -41,7 +41,7 @@ const isActive = (href: string) => {
           class="h-8 w-8"
           aria-hidden="true"
         />
-        <span class="text-base font-display tracking-tight" style="color: var(--hds-fg);">
+        <span class="text-base font-brand tracking-tight" style="color: var(--hds-fg);">
           <span style="color: var(--color-hds-naranja);">hosting</span> del <span style="color: var(--color-hds-naranja);">sur</span>
         </span>
       </a>
diff --git a/src/styles/global.css b/src/styles/global.css
index 9e02152..edc6da3 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -9,10 +9,12 @@
   font-display: swap;
 }
 
-@import "@fontsource/mulish/400.css";
-@import "@fontsource/mulish/500.css";
-@import "@fontsource/mulish/600.css";
-@import "@fontsource/mulish/700.css";
+@import "@fontsource-variable/host-grotesk";
+@import "@fontsource/quicksand/300.css";
+@import "@fontsource/quicksand/400.css";
+@import "@fontsource/quicksand/500.css";
+@import "@fontsource/quicksand/600.css";
+@import "@fontsource/quicksand/700.css";
 @import "@fontsource/cormorant-garamond/400.css";
 @import "@fontsource/cormorant-garamond/500.css";
 
@@ -25,8 +27,9 @@
   --color-hds-durazno: #FFCBA1;
   --color-hds-tinta: #1A1612;
 
-  --font-display: 'Arista Pro Alternate', 'Mulish', system-ui, sans-serif;
-  --font-sans: 'Mulish', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
+  --font-sans: 'Quicksand', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
+  --font-display: 'Host Grotesk', 'Quicksand', system-ui, sans-serif;
+  --font-brand: 'Arista Pro Alternate', 'Host Grotesk', system-ui, sans-serif;
   --font-editorial: 'Cormorant Garamond', Georgia, serif;
 
   --tracking-display: -0.02em;
@@ -89,6 +92,7 @@
 @layer components {
   .font-display { font-family: var(--font-display); }
   .font-editorial { font-family: var(--font-editorial); }
+  .font-brand { font-family: var(--font-brand); letter-spacing: 0.01em; }
 
   .eyebrow {
     display: inline-flex;