Add custom css variables

src/components/common/CustomStyles.astro

@@ -1,13 +1,23 @@
 ---
 import '@fontsource/inter/variable.css';
+
+// Nunito
+// Dosis
 ---
 
+<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;700&display=swap" rel="stylesheet" />
+
 <style is:inline is:global>
   :root {
     --aw-font-sans: 'InterVariable';
-    --aw-font-serif: var(--ph-font-sans);
-    --aw-font-heading: 'InterVariable';
+    --aw-font-serif: var(--aw-font-sans);
+    --aw-font-heading: 'Nunito'; /* var(--aw-font-sans); */
 
-    --aw-color-primary: '';
+    --aw-color-primary: rgb(30 64 175);
+    --aw-color-secondary: rgb(30 58 138);
+    --aw-color-accent: rgb(109 40 217);
+    --aw-color-text-page: rgb(17 24 39);
+    --aw-color-text-muted: rgb(75 85 99);
+    --aw-color-bg-page: rgb(255 255 255);
   }
 </style>