PoliNetworkOrg · Diubii · Mar 24, 2026 · Mar 24, 2026 · Mar 24, 2026
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -2,8 +2,24 @@ import { HEADER_HEIGHT, Header } from "@/components/header"
 import { Shape } from "@/components/shapes"
 import { ThemeProvider } from "@/components/theme-provider"
 import "@/styles/globals.css"
-import { GeistSans } from "geist/font/sans"
 import type { Metadata } from "next"
+import { DM_Sans, Poppins, Red_Hat_Text } from "next/font/google"
+
+const poppinsFont400 = Poppins({
+  variable: "--font-poppins",
+  weight: "400",
+  subsets: ["latin"],
+})
+const dmSansFont = DM_Sans({
+  variable: "--font-dm-sans",
+  weight: "variable",
+  subsets: ["latin"],
+})
+const redHatTextFont = Red_Hat_Text({
+  variable: "--font-red-hat",
+  weight: "variable",
+  subsets: ["latin"],
+})
 
 const desc = "The online community of Politecnico di Milano brought to you by its students"
 
@@ -45,7 +61,11 @@ export const metadata: Metadata = {
 
 export default function RootLayout({ children }: Readonly<{ children: React.ReactNode }>) {
   return (
-    <html lang="en" suppressHydrationWarning className={`${GeistSans.variable}`}>
+    <html
+      lang="en"
+      suppressHydrationWarning
+      className={`${poppinsFont400.variable} ${redHatTextFont.variable} ${dmSansFont.variable}`}
+    >
       <body
         className="overflow-y-scroll"
         style={

diff --git a/src/components/home/hero.tsx b/src/components/home/hero.tsx
@@ -7,7 +7,7 @@ export function Hero() {
     <main className="flex w-full justify-center px-4 sm:px-6">
       <section className="flex min-h-[calc(100vh-var(--header-height))] w-full flex-col justify-between py-8 sm:py-12">
         <div className="flex flex-1 flex-col items-center justify-center gap-10 text-center md:gap-16">
-          <h1 className="max-w-5xl text-text-primary typo-display-medium lg:typo-display-large">
+          <h1 className="typo-display-medium lg:typo-display-large max-w-5xl text-text-primary">
             Trova gruppi, risorse e supporto
             <br className="hidden md:block" />
             <span className="md:block">tra gli studenti del Polimi</span>

diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx
@@ -15,7 +15,7 @@ const buttonVariants = cva(
         tertiary:
           "bg-button-tertiary hover:bg-button-tertiary/90 text-text-accent-lightbg typo-label-large rounded-buttonsM",
         tertiaryBlur:
-          "bg-blue-tertiary-blur hover:bg-blue-tertiary-blur/90 text-text-accent-lightbg typo-label-large rounded-buttonsM",
+          "bg-blue-tertiary-blur hover:bg-blue-tertiary-blur/90 text-text-accent-lightbg typo-headline-small rounded-buttonsM",
         outline:
           "border bg-white shadow-xs hover:bg-slate-100 hover:text-slate-900 dark:bg-slate-200/30 dark:border-slate-200 dark:hover:bg-slate-200/50 dark:bg-slate-950 dark:hover:bg-slate-800 dark:hover:text-slate-50 dark:dark:bg-slate-800/30 dark:dark:border-slate-800 dark:dark:hover:bg-slate-800/50",
         link: "text-slate-900 underline-offset-4 underline dark:text-slate-50",

diff --git a/src/styles/globals.css b/src/styles/globals.css
@@ -1,6 +1,3 @@
-/* Must load fonts at the start (DM Sans, Poppins, Red Hat Text) */
-@import url("https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Red+Hat+Text:ital,wght@0,300..700;1,300..700&display=swap");
-
 @import "tailwindcss";
 @import "./typography.css";
 @import "./figma.css";

diff --git a/src/styles/typography.css b/src/styles/typography.css
@@ -1,7 +1,7 @@
 @theme {
-  --font-dm-sans: "DM Sans", sans-serif;
-  --font-poppins: "Poppins", sans-serif;
-  --font-red-hat: "Red Hat Text", sans-serif;
+  --font-dm-sans: var(--font-dm-sans);
+  --font-poppins: var(--font-poppins);
+  --font-red-hat: var(--font-red-hat);
 }
 
 /* Display */