feat(ui): abstract HoverShineOverlay and apply globally

Former-commit-id: 302718a9d517720d6fd5eb66a7728eff8f3ffe95

components/blocks/CompetenceBentoGrid.tsx

@@ -5,6 +5,7 @@ import Image from 'next/image';
 import { motion } from 'framer-motion';
 import { useState, useEffect } from 'react';
 import { Button } from '@/components/ui/Button';
+import { HoverShineOverlay } from '@/components/ui/HoverShineOverlay';
 
 interface CompetenceBentoGridProps {
   badge?: string;
@@ -110,6 +111,7 @@ export function CompetenceBentoGrid(props: CompetenceBentoGridProps) {
                   className={gridClasses}
                 >
                   <div className="absolute top-0 right-0 w-32 h-32 bg-primary/30 blur-3xl rounded-full -mr-10 -mt-10 group-hover:bg-primary/50 transition-colors duration-500" />
+                  <HoverShineOverlay shineColor="via-white/30" />
                   <h4 className="font-bold text-xl md:text-2xl relative z-10 leading-snug">{item.title}</h4>
                   {item.description && <p className="text-white/60 text-sm mt-3 relative z-10">{item.description}</p>}
                 </motion.div>
@@ -143,6 +145,8 @@ export function CompetenceBentoGrid(props: CompetenceBentoGridProps) {
                   </>
                 )}
                 
+                <HoverShineOverlay />
+                
                 <div className="relative z-10 p-8 flex flex-col justify-end h-full text-white">
                   {item.tag && (
                     <span className="inline-block px-3 py-1 bg-primary/20 backdrop-blur-md rounded-full text-xs font-bold uppercase tracking-wider text-primary-light mb-3 w-fit border border-primary/30">