refactor: remove "Services" pages and migrate content to focused alternatives

- Removed `/services` and `/zh/services` pages. Migrated content to updated pages: `/uses`, `/about#contact-card`, and `/hire`.
- Removed Framer Motion for better performance and simpler animations in `LanguageSwitcher`, `GlassHeader`, and other components.
- Updated font sources to WOFF2 for better compression and added preload links for critical fonts.
- Optimized Vite configuration with manual chunking for React libraries.
- Replaced `client:load` with `client:idle` for non-critical client-side components like `GlassHeader`, `Footer`, and `BackToTop`.

src/components/GlassHeader.tsx

@@ -8,7 +8,6 @@ import { useState, useEffect } from "react";
 import { Menu, X, Home, Rocket, PenTool, User, Briefcase, Clock3 } from "lucide-react";
 import { defaultLang } from "@/i18n/ui";
 import { type GlassHeaderProps } from "@/types";
-import { motion } from "framer-motion";
 import { cn } from "@/lib/utils";
 
 export default function GlassHeader({ lang: propLang }: GlassHeaderProps) {
@@ -98,7 +97,7 @@ export default function GlassHeader({ lang: propLang }: GlassHeaderProps) {
   };
 
   return (
-    <motion.header
+    <header
       className={`fixed top-0 z-50 w-full transition-all duration-300 ${
         isScrolled
           ? 'backdrop-blur-xl backdrop-saturate-150 bg-white/70 dark:bg-black/70 border-b border-border/50 shadow-lg shadow-black/5 dark:shadow-primary/5'
@@ -106,10 +105,8 @@ export default function GlassHeader({ lang: propLang }: GlassHeaderProps) {
       }`}
     >
       <Container className="p-4 flex justify-between items-center">
-        <motion.a
-          whileHover={{ scale: 1.05 }}
-          whileTap={{ scale: 0.95 }}
-          className="flex items-center text-lg font-medium transition-colors duration-150 hover:text-foreground/80"
+        <a
+          className="flex items-center text-lg font-medium transition-colors duration-150 hover:text-foreground/80 hover:scale-105 active:scale-95"
           href={getLocalizedPath('/', lang)}
         >
           <div className="w-6 h-6 mr-2 flex items-center justify-center">
@@ -119,50 +116,48 @@ export default function GlassHeader({ lang: propLang }: GlassHeaderProps) {
             </svg>
           </div>
           <span className="gradient-text font-bold">{personalInfo.name}</span>
-        </motion.a>
+        </a>
 
         {/* Desktop Navigation */}
         <nav className="hidden md:flex items-center space-x-6 text-sm font-medium">
           {navItems.map((item) => {
             const active = isActive(item.href);
             return (
-              <motion.a
+              <a
                 key={item.key}
                 href={item.href}
                 className={cn(
                   "flex items-center gap-2 transition-colors duration-150 px-3 py-2 rounded-md hover:bg-primary/5",
-                  active 
-                    ? "text-primary bg-primary/5 font-semibold" 
+                  active
+                    ? "text-primary bg-primary/5 font-semibold"
                     : "text-foreground/70 hover:text-primary"
                 )}
-                whileHover={{ y: -2 }}
               >
                 <item.icon size={16} />
                 {t(item.key as any)}
-              </motion.a>
+              </a>
             );
           })}
         </nav>
 
         <div className="flex items-center space-x-3">
           {/* Language Switcher added here */}
-          <motion.div>
+          <div>
             <LanguageSwitcher lang={lang} />
-          </motion.div>
-          
-          <motion.div>
-            <ThemeToggle />
-          </motion.div>
+          </div>
 
-          {/* Mobile Menu Button */}          
-          <motion.button
-            className="md:hidden p-2 text-foreground transition-all duration-150 hover:bg-foreground/10 active:bg-foreground/20 rounded-md"
+          <div>
+            <ThemeToggle />
+          </div>
+
+          {/* Mobile Menu Button */}
+          <button
+            className="md:hidden p-2 text-foreground transition-all duration-150 hover:bg-foreground/10 active:bg-foreground/20 rounded-md active:scale-90"
             onClick={toggleMenu}
             aria-label="Toggle menu"
-            whileTap={{ scale: 0.9 }}
           >
             {isMenuOpen ? <X size={24} /> : <Menu size={24} />}
-          </motion.button>
+          </button>
         </div>
       </Container>
 
@@ -171,15 +166,15 @@ export default function GlassHeader({ lang: propLang }: GlassHeaderProps) {
         isMenuOpen ? 'max-h-80 opacity-100' : 'max-h-0 opacity-0'
       }`}>
         <div className={`py-4 px-4 border-t border-border/10 glass-effect shadow-xl ${
-          isScrolled 
-            ? 'bg-white/90 dark:bg-black/80' 
+          isScrolled
+            ? 'bg-white/90 dark:bg-black/80'
             : 'bg-white/95 dark:bg-black/85'
         }`}>
           <nav className="flex flex-col space-y-3 text-sm font-medium">
             {navItems.map((item) => {
               const active = isActive(item.href);
               return (
-                <motion.a
+                <a
                   key={item.key}
                   href={item.href}
                   className={cn(
@@ -192,12 +187,12 @@ export default function GlassHeader({ lang: propLang }: GlassHeaderProps) {
                 >
                   <item.icon size={18} />
                   {t(item.key as any)}
-                </motion.a>
+                </a>
               );
             })}
           </nav>
         </div>
       </div>
-    </motion.header>
+    </header>
   );
 }