refactor(styles): enhance glass effects, card designs, and transitions across components

- Replaced `client:only="react"` with `client:load transition:persist="header"` for `GlassHeader` to improve page transitions and header consistency.
- Updated card and surface designs with refined colors, borders, and shadows for a cleaner, modern look.
- Adjusted CSS variables for better contrast and distinct layers.
- Applied consistent blur and backdrop styles across components for visual cohesion.

src/layouts/Layout.astro

@@ -1,4 +1,5 @@
 ---
+import { ClientRouter } from "astro:transitions";
 import BackToTop from "@/components/ui/back-to-top";
 import { useTranslations } from "@/i18n/utils";
 import type { Lang } from "@/types/i18n";
@@ -26,6 +27,7 @@ const t = useTranslations(lang);
     <meta name="description" content={description} />
     <title>{title} | {t("site.title")}</title>
     <!-- View Transitions for smooth page transitions -->
+    <ClientRouter />
     <meta name="view-transition" content="same-origin" />
     {
       import.meta.env.MODE === 'production' && (