docs(introductions): fix text color

Author: maiieul

apps/website/src/routes/docs/headless/introduction/index.mdx

@@ -17,7 +17,7 @@ import { CollapsibleIcon } from '~/components/icons/CollapsibleIcon.tsx';
 
 # Headless kit
 
-<div class="mb-4 mt-[-8px] text-xl font-semibold text-slate-600 dark:text-slate-500">
+<div class="text-muted-foreground mb-4 mt-[-8px] text-xl font-semibold">
   A headless component library of unstyled, accessible, and resumable components for the
   most creative minds.
 </div>
@@ -141,7 +141,7 @@ One of the benefits of Qwik is its ability to create performant applications wit
         <div class="pb-4">
             If you're using `Qwik-React`, `Qwik-Angular`, `@qwikdev/astro`, we suggest incrementally adding Qwik UI components to your application.
             Qwik, built as a microfrontend, allows you to incrementally integrate Qwik UI components into your existing application. This approach reduces migration risk and complexity, letting you leverage Qwik UI's benefits at your own pace.
-        </div> 
+        </div>
     </AccordionContent>
     </AccordionItem>
 

apps/website/src/routes/docs/styled/(getting-started)/introduction/index.mdx

@@ -6,7 +6,7 @@ import FluffyCreatureScreen from '../../../../../../public/images/qwik-ui-fluffy
 
 # Styled Kit
 
-<div class="mb-4 mt-[-8px] text-xl font-semibold text-slate-600 dark:text-slate-500">
+<div class="text-muted-foreground mb-4 mt-[-8px] text-xl font-semibold">
   A fully customizable design system of copy-paste, reusable, styled components built on
   top of headless.
 </div>