primary color changed

components/About.tsx

@@ -8,9 +8,9 @@ export function About() {
   const {t} = useLanguage();
 
   const features = [
-    { icon: Award, labelKey: "Experience", value: "10+ лет" },
-    { icon: Users, labelKey: "Experts", value: "50+" },
-    { icon: Zap, labelKey: "Reliability", value: "99.9%" },
+    { icon: Award, labelKey: "experiance", value: "10+ лет" },
+    { icon: Users, labelKey: "experts", value: "50+" },
+    { icon: Zap, labelKey: "truth", value: "99.9%" },
   ];
 
   const containerVariants = {
@@ -39,7 +39,7 @@ export function About() {
           <h2 className="text-4xl font-bold text-gray-900 mb-4">
             {t.about.title}
           </h2>
-          <div className="w-20 h-1 bg-blue-600 mx-auto rounded-full" />
+          <div className="w-20 h-1 bg-primary mx-auto rounded-full" />
         </motion.div>
 
         <div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
@@ -54,7 +54,7 @@ export function About() {
               {t.about.content}
             </p>
 
-            <motion.div
+            {/* <motion.div
               variants={containerVariants}
               initial="hidden"
               whileInView="visible"
@@ -78,7 +78,7 @@ export function About() {
                   </div>
                 </motion.div>
               ))}
-            </motion.div>
+            </motion.div> */}
           </motion.div>
 
           {/* Right - Stats */}
@@ -95,16 +95,16 @@ export function About() {
                 <motion.div
                   key={idx}
                   whileHover={{ scale: 1.05, y: -5 }}
-                  className="bg-linear-to-br from-blue-50 to-blue-100 rounded-lg p-6 shadow-md hover:shadow-lg transition-shadow"
+                  className="bg-linear-to-r from-[#dae7e0] to-[#bffcdb] rounded-lg p-6 shadow-md hover:shadow-lg transition-shadow"
                 >
                   <div className="flex items-center gap-4 mb-2">
-                    <Icon className="text-blue-600" size={32} />
+                    <Icon className="text-primary" size={32} />
                     <h3 className="text-2xl font-bold text-gray-900">
                       {feature.value}
                     </h3>
                   </div>
                   <p className="text-gray-700 font-medium">
-                    {feature.labelKey}
+                    {t.about[feature.labelKey]}
                   </p>
                 </motion.div>
               );