wip

components/home/WhyChooseUs.tsx

@@ -11,7 +11,7 @@ export default function WhyChooseUs() {
         <div className="grid grid-cols-1 lg:grid-cols-12 gap-16 lg:gap-24">
           <div className="lg:col-span-4 order-1 lg:order-2">
             <div className="sticky top-32">
-              <Heading level={2} subtitle="Why KLZ">
+              <Heading level={2} subtitle={t('whyKlz')}>
                 {t('title')}
               </Heading>
               <p className="text-xl text-text-secondary leading-relaxed">
@@ -19,19 +19,14 @@ export default function WhyChooseUs() {
               </p>
               
               <div className="mt-12 space-y-6">
-                {[
-                  'Certified Quality Standards',
-                  'Sustainable Supply Chain',
-                  'Expert Technical Support',
-                  'Fast Global Delivery'
-                ].map((item, i) => (
+                {[0, 1, 2, 3].map((i) => (
                   <div key={i} className="flex items-center gap-4">
                     <div className="flex-shrink-0 w-6 h-6 rounded-full bg-accent flex items-center justify-center">
                       <svg className="w-4 h-4 text-primary-dark" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                         <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={3} d="M5 13l4 4L19 7" />
                       </svg>
                     </div>
-                    <span className="font-bold text-primary">{item}</span>
+                    <span className="font-bold text-primary">{t(`features.${i}`)}</span>
                   </div>
                 ))}
               </div>