fix: resolve 404 errors and ensure translation consistency

- Fix Header navigation links: /brand → /design/brand, /product → /design/product
- Fix Hero component links: /brand/ → /design/brand/, /product/ → /design/product/
- Fix Footer links: /brand# → /design/brand#, /product# → /design/product#
- Ensure all navigation links work correctly with basePath: '/design'
- Verify translation consistency across submenu and footer
- All Brand and Product links now resolve correctly (no 404 errors)
- Maintain consistent URL structure throughout the application

Author: mmaxence

src/components/layout/Footer.tsx

@@ -18,14 +18,14 @@ const Footer = () => {
       { name: t('footer.foundations.tools'), href: '#tools' },
     ],
     'Brand': [
-      { name: t('footer.brand.principles'), href: '/brand#principles' },
-      { name: t('footer.brand.guidelines'), href: '/brand#guidelines' },
-      { name: t('footer.brand.resources'), href: '/brand#resources' },
+      { name: t('footer.brand.principles'), href: '/design/brand#principles' },
+      { name: t('footer.brand.guidelines'), href: '/design/brand#guidelines' },
+      { name: t('footer.brand.resources'), href: '/design/brand#resources' },
     ],
     'Product': [
-      { name: t('footer.product.principles'), href: '/product#principles' },
-      { name: t('footer.product.guidelines'), href: '/product#guidelines' },
-      { name: t('footer.product.resources'), href: '/product#resources' },
+      { name: t('footer.product.principles'), href: '/design/product#principles' },
+      { name: t('footer.product.guidelines'), href: '/design/product#guidelines' },
+      { name: t('footer.product.resources'), href: '/design/product#resources' },
     ],
     'Connect': [
       { name: 'Buzzvil', href: 'https://www.buzzvil.com/en' },

src/components/layout/Header.tsx

@@ -15,8 +15,8 @@ const Header = () => {
 
   const navItems = [
     { name: t('nav.foundations'), href: '/', icon: BookOpen },
-    { name: t('nav.brand'), href: '/brand', icon: Award },
-    { name: t('nav.product'), href: '/product', icon: Code },
+    { name: t('nav.brand'), href: '/design/brand', icon: Award },
+    { name: t('nav.product'), href: '/design/product', icon: Code },
   ];
 
   return (

src/components/sections/Hero.tsx

@@ -96,15 +96,15 @@ const Hero = () => {
             {t('hero.explore')}
           </motion.a>
           <motion.a
-            href="/brand/"
+            href="/design/brand/"
             whileHover={{ scale: 1.02, y: -1 }}
             whileTap={{ scale: 0.98 }}
             className="px-6 py-3 border border-border/50 text-foreground rounded-lg font-medium hover:border-border hover:bg-muted/50 transition-all duration-150 focus-ring"
           >
             {t('hero.brand')}
           </motion.a>
           <motion.a
-            href="/product/"
+            href="/design/product/"
             whileHover={{ scale: 1.02, y: -1 }}
             whileTap={{ scale: 0.98 }}
             className="px-6 py-3 border border-border/50 text-foreground rounded-lg font-medium hover:border-border hover:bg-muted/50 transition-all duration-150 focus-ring"