feat(ui): add AnimatedGlossyBorder and refine industrial interactions

components/blocks/SubCompanyTiles.tsx

@@ -4,6 +4,7 @@ import * as React from 'react';
 import { motion, Variants } from 'framer-motion';
 import Image from 'next/image';
 import { HoverShineOverlay } from '@/components/ui/HoverShineOverlay';
+import { AnimatedGlossyBorder } from '@/components/ui/AnimatedGlossyBorder';
 
 interface SubCompanyTilesProps {
   badge?: string;
@@ -49,6 +50,7 @@ const itemVariants: Variants = {
 };
 
 import { usePathname } from 'next/navigation';
+import { LogoArcs } from '@/components/ui/LogoArcs';
 
 export function SubCompanyTiles(props: SubCompanyTilesProps) {
   const { data } = props;
@@ -91,6 +93,19 @@ export function SubCompanyTiles(props: SubCompanyTilesProps) {
             const isEtib = company.title.includes('E-TIB');
             const isIng = company.title.includes('Ingenieur');
             const isNemo = company.title.includes('NEMO');
+
+            const bgPositionClasses = [
+              "-bottom-[30%] -right-[30%]",
+              "-top-[30%] -left-[30%]",
+              "-bottom-[30%] -left-[30%]"
+            ];
+            const animationClasses = [
+              "animate-[spin_60s_linear_infinite]",
+              "animate-[spin_80s_linear_infinite]",
+              "animate-[spin_100s_linear_infinite]"
+            ];
+            const positionClass = bgPositionClasses[index % bgPositionClasses.length];
+            const animationClass = animationClasses[index % animationClasses.length];
             
             return (
               <motion.div 
@@ -126,10 +141,22 @@ export function SubCompanyTiles(props: SubCompanyTilesProps) {
                       ? 'bg-gradient-to-t from-[#0a192f]/90 via-[#0a192f]/60 to-[#0a192f]/40' 
                       : 'bg-gradient-to-t from-[#0a192f]/90 via-[#0a192f]/60 to-[#0a192f]/40 group-hover:from-primary/90 group-hover:to-primary/20'
                   }`} />
+
+                  {/* Subtle Background Logo Arcs */}
+                  <div className={`absolute ${positionClass} w-[120%] h-[120%] z-10 opacity-[0.02] group-hover:opacity-[0.08] transition-opacity duration-1000 pointer-events-none mix-blend-overlay`}>
+                    <LogoArcs className={`w-full h-full text-white ${animationClass}`} />
+                  </div>
                   
                   {/* Premium Shine Sweep Effect (Industrial Reflection) */}
                   <HoverShineOverlay shineColor="via-white/30" />
                   
+                  {/* Glossy Animated Border */}
+                  <AnimatedGlossyBorder 
+                    color={isCurrent ? "primary" : "white"} 
+                    className={`transition-opacity duration-700 ${isCurrent ? 'opacity-100' : 'opacity-0 group-hover:opacity-100'}`} 
+                    borderWidth={1} 
+                  />
+                  
                   {/* Current Site Indicator Badge */}
                   {isCurrent && (
                     <div className="absolute top-6 right-6 z-20">