style(font): use @fontsource-variable/roboto-slab and set family to 'Roboto Slab Variable'

app/assets/css/main.css

@@ -1,6 +1,8 @@
 /* Match brosner.com font */
+@import url("@fontsource-variable/roboto-slab/index.css");
 html, body {
-  font-family: "Roboto Slab", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-family: "Roboto Slab Variable", Roboto, "Helvetica Neue", Arial, sans-serif;
+  font-optical-sizing: auto;
 }
 
 /* Ensure navbar icons remain white like the original */

nuxt.config.ts

@@ -6,11 +6,7 @@ export default defineNuxtConfig({
   css: ['bulma/css/bulma.min.css', '@/assets/css/main.css'],
   app: {
     head: {
-      link: [
-        { rel: 'preconnect', href: 'https://fonts.googleapis.com' },
-        { rel: 'preconnect', href: 'https://fonts.gstatic.com', crossorigin: '' },
-        { rel: 'stylesheet', href: 'https://fonts.googleapis.com/css2?family=Roboto+Slab:opsz,wght@8..144,100..900&display=swap' }
-      ]
+      link: []
     }
   }
 })

package.json

@@ -10,6 +10,7 @@
     "postinstall": "nuxt prepare"
   },
   "dependencies": {
+    "@fontsource-variable/roboto-slab": "^5.2.6",
     "bulma": "^1.0.4",
     "nuxt": "^4.0.3",
     "typescript": "^5.6.3",

yarn.lock

@@ -550,6 +550,11 @@
   resolved "https://registry.yarnpkg.com/@fastify/busboy/-/busboy-3.1.1.tgz#af3aea7f1e52ec916d8b5c9dcc0f09d4c060a3fc"
   integrity sha512-5DGmA8FTdB2XbDeEwc/5ZXBl6UbBAyBOOLlPuBnZ/N1SwdH9Ii+cOX3tBROlDgcTXxjOYnLMVoKk9+FXAw0CJw==
 
+"@fontsource-variable/roboto-slab@^5.2.6":
+  version "5.2.6"
+  resolved "https://registry.yarnpkg.com/@fontsource-variable/roboto-slab/-/roboto-slab-5.2.6.tgz#04a4bbe73861bb77ed51a08a50149202932af89e"
+  integrity sha512-+Kz8D4cMh2ndwFOeZcFKAHnhZbFWslCmMI9QTy3uLocVkFyj30MriUmDphuiZPvBuEnotsVTZjjGMHyuM6nckQ==
+
 "@ioredis/commands@^1.3.0":
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/@ioredis/commands/-/commands-1.3.0.tgz#4dc3ae9bfa7146b63baf27672a61db0ea86e35e5"