diff --git a/app/globals.css b/app/globals.css
index a2dc41e..d8cf628 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -3,6 +3,7 @@
 :root {
   --background: #ffffff;
   --foreground: #171717;
+  --primary:#468965;
 }
 
 @theme inline {
@@ -10,6 +11,7 @@
   --color-foreground: var(--foreground);
   --font-sans: var(--font-geist-sans);
   --font-mono: var(--font-geist-mono);
+  --color-primary:var(--primary)
 }
 
 @media (prefers-color-scheme: dark) {
diff --git a/components/About.tsx b/components/About.tsx
index dfa7eaf..ff91a26 100644
--- a/components/About.tsx
+++ b/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>
               );
diff --git a/components/ContactForm.tsx b/components/ContactForm.tsx
index 4d3afcf..bb171f6 100644
--- a/components/ContactForm.tsx
+++ b/components/ContactForm.tsx
@@ -84,7 +84,7 @@ export function ContactForm() {
           <h2 className="text-2xl font-bold text-gray-900 mb-2">
             {t.contact.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">
@@ -130,7 +130,7 @@ export function ContactForm() {
                   whileHover={{ x: 5 }}
                   className="flex gap-4"
                 >
-                  <Icon className="text-blue-600 shrink-0" size={24} />
+                  <Icon className="text-primary shrink-0" size={24} />
                   <div>
                     <h4 className="font-semibold text-gray-900">
                       {t.contact[item.title]}
@@ -236,7 +236,7 @@ export function ContactForm() {
               whileTap={{ scale: 0.95 }}
               type="submit"
               disabled={loading}
-              className="w-full px-6 py-3 bg-blue-600 text-white rounded-lg font-semibold hover:bg-blue-700 transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
+              className="w-full px-6 py-3 bg-primary/80 text-white rounded-lg font-semibold hover:bg-primary hover:cursor-pointer transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
             >
               {loading ? "Sending..." : t.contact.send}
             </motion.button>
diff --git a/components/FAQ.tsx b/components/FAQ.tsx
index b0db54b..da1a65b 100644
--- a/components/FAQ.tsx
+++ b/components/FAQ.tsx
@@ -62,7 +62,7 @@ export function FAQ({ items }: FaqProps) {
           <h2 className="text-4xl font-bold text-gray-900 mb-4">
             {t.faq.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>
 
         {/* FAQ Items */}
@@ -88,7 +88,7 @@ export function FAQ({ items }: FaqProps) {
                     transition={{ duration: 0.3 }}
                     className="ml-4 shrink-0"
                   >
-                    <ChevronDown className="text-blue-600" size={24} />
+                    <ChevronDown className="text-primary" size={24} />
                   </motion.div>
                 </div>
               </motion.button>
@@ -102,7 +102,7 @@ export function FAQ({ items }: FaqProps) {
                     transition={{ duration: 0.3 }}
                     className="overflow-hidden"
                   >
-                    <div className="bg-blue-50 p-6 rounded-b-lg border-t border-gray-200">
+                    <div className="bg-primary/20 p-6 rounded-b-lg border-t border-gray-200">
                       <p className="text-gray-700 leading-relaxed">
                         {t.faq.items[idx].answer}
                       </p>
diff --git a/components/Footer.tsx b/components/Footer.tsx
index 4d5e92f..1367196 100644
--- a/components/Footer.tsx
+++ b/components/Footer.tsx
@@ -3,9 +3,10 @@
 import { useLanguage } from "@/context/language-context";
 import { motion } from "framer-motion";
 import { Facebook, Linkedin, Send } from "lucide-react";
+import Image from "next/image";
 
 export function Footer() {
-  const {t} = useLanguage();
+  const { t } = useLanguage();
   const socialLinks = [
     { icon: Facebook, href: "#", label: "Facebook" },
     { icon: Linkedin, href: "#", label: "LinkedIn" },
@@ -37,8 +38,14 @@ export function Footer() {
         >
           {/* Brand */}
           <motion.div variants={itemVariants}>
-            <h3 className="text-2xl font-bold bg-linear-to-r from-blue-400 to-blue-600 bg-clip-text text-transparent mb-2">
-              FIRMA
+            <h3 className=" mb-2">
+              <Image
+                src="/logo.jpg"
+                alt="image"
+                width={80}
+                height={50}
+                className="rounded-xl object-cover"
+              />
             </h3>
             <p className="text-gray-400 text-sm">
               Premium industrial pumps and equipment.
diff --git a/components/Navbar.tsx b/components/Navbar.tsx
index 884c1d3..accb0c2 100644
--- a/components/Navbar.tsx
+++ b/components/Navbar.tsx
@@ -6,6 +6,7 @@ import { Menu, X } from "lucide-react";
 import { motion } from "framer-motion";
 import LanguageSwitcher from "./languageSwitcher";
 import { useLanguage } from "@/context/language-context";
+import Image from "next/image";
 
 interface NavLink {
   id: string;
@@ -39,16 +40,16 @@ export function Navbar({ logoText = "FIRMA" }: NavbarProps) {
   };
 
   return (
-    <nav className="sticky top-0 z-50 bg-white/80 backdrop-blur-md border-b border-gray-200">
+    <nav className="sticky top-0 z-50 bg-white/80 backdrop-blur-md p-2 overflow-hidden border-b border-gray-200">
       <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
         <div className="flex justify-between items-center h-16">
           {/* Logo */}
           <motion.div whileHover={{ scale: 1.05 }} whileTap={{ scale: 0.95 }}>
             <Link
               href={`/`}
-              className="text-2xl font-bold bg-linear-to-r from-blue-600 to-blue-800 bg-clip-text text-transparent"
+              className=" relative overflow-hidden"
             >
-              {logoText}
+              <Image src='/logo.jpg' alt="image" width={80} height={50} className="rounded-xl object-cover" />
             </Link>
           </motion.div>
 
@@ -59,7 +60,7 @@ export function Navbar({ logoText = "FIRMA" }: NavbarProps) {
                 key={link.id}
                 whileHover={{ color: "#2563eb" }}
                 onClick={() => handleScroll(link.href)}
-                className="text-gray-700 hover:text-blue-600 transition-colors"
+                className="text-[#468965] hover:text-[#468965] transition-colors hover:cursor-pointer"
               >
                 {link.labelKey}
               </motion.button>
@@ -92,7 +93,7 @@ export function Navbar({ logoText = "FIRMA" }: NavbarProps) {
               <button
                 key={link.id}
                 onClick={() => handleScroll(link.href)}
-                className="block w-full text-left px-4 py-2 text-gray-700 hover:bg-blue-50 rounded-lg transition-colors"
+                className="block w-full text-left px-4 py-2 text-gray-700 hover:bg-primary rounded-lg transition-colors"
               >
                 {link.labelKey}
               </button>
diff --git a/components/ProductCard.tsx b/components/ProductCard.tsx
index cdefc51..5f986c5 100644
--- a/components/ProductCard.tsx
+++ b/components/ProductCard.tsx
@@ -53,7 +53,7 @@ export function ProductCard({ product, onViewDetails }: ProductCardProps) {
           whileHover={{ scale: 1.05 }}
           whileTap={{ scale: 0.95 }}
           onClick={() => onViewDetails(product.slug)}
-          className="w-full flex items-center justify-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg font-medium hover:bg-blue-700 transition-colors"
+          className="w-full flex items-center justify-center gap-2 px-4 py-2 bg-primary/80 text-white rounded-lg font-medium hover:bg-primary transition-colors"
         >
           Batafsil
           <ExternalLink size={16} />
diff --git a/components/ProductsGrid.tsx b/components/ProductsGrid.tsx
index c8250f1..6c045fb 100644
--- a/components/ProductsGrid.tsx
+++ b/components/ProductsGrid.tsx
@@ -60,7 +60,7 @@ export function ProductsGrid() {
             <h2 className="text-2xl font-bold text-gray-900 mb-2">
               {t.products.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>
 
           {/* Product Grid */}
diff --git a/components/ShowCase.tsx b/components/ShowCase.tsx
index f6cbdc6..500e69d 100644
--- a/components/ShowCase.tsx
+++ b/components/ShowCase.tsx
@@ -77,7 +77,7 @@ export function ShowCase({ images }: ShowCaseProps) {
               whileHover={{ scale: 1.05 }}
               whileTap={{ scale: 0.95 }}
               onClick={handleContactClick}
-              className="px-8 py-3 bg-linear-to-r from-blue-600 to-blue-700 text-white rounded-lg font-semibold hover:shadow-lg transition-shadow"
+              className="px-8 py-3 bg-linear-to-r from-primary to-[#7eac93] text-white rounded-lg font-semibold hover:shadow-lg transition-shadow"
             >
               {t.hero.cta}
             </motion.button>
diff --git a/components/languageSwitcher.tsx b/components/languageSwitcher.tsx
index 7bbf434..294a485 100644
--- a/components/languageSwitcher.tsx
+++ b/components/languageSwitcher.tsx
@@ -20,7 +20,7 @@ export default function LanguageSwitcher() {
     <div>
       <DropdownMenu>
         <DropdownMenuTrigger asChild>
-          <button className="flex items-center gap-1 hover:text-primary transition-colors">
+          <button className="flex items-center gap-1 p-1 border-white border text-black hover:text-primary transition-colors">
             <Globe size={16} />
             {language.toUpperCase()}
           </button>
diff --git a/lib/translations.ts b/lib/translations.ts
index e51c89f..f2cdf49 100644
--- a/lib/translations.ts
+++ b/lib/translations.ts
@@ -15,6 +15,9 @@ export const translations = {
       title: "Biz haqimizda",
       content:
         "Kompaniyamiz sanoat nasoslari va o'lchov uskunalarini yetkazib berishda 10+ yil tajribaga ega. Har bir mahsulot sinovdan o'tkazilgan, sifat kafolatlangan va texnik xizmat ko'rsatish bilan ta'minlanadi. Biz mijozlarimizga texnik maslahat, tez etkazib berish va o'rnatish bo'yicha to'liq xizmat taklif etamiz. Ixtisoslashgan nasoslarimiz (schotchik, agregat nasos, СЦЛ 20/24 va boshqalar) benzin, dizel, kerosin va boshqa yengil neft mahsulotlarini xavfsiz va samarali tashishda ishlatiladi.",
+      experiance: "Tajriba",
+      experts: "Mutaxasislar",
+      truth: "Ishonchlilik",
     },
     products: {
       title: "Mahsulotlar",
@@ -95,6 +98,9 @@ export const translations = {
       title: "О нас",
       content:
         "Наша компания имеет 10+ лет опыта в поставке промышленных насосов и измерительного оборудования. Каждый продукт протестирован, качество гарантировано и сопровождается технической поддержкой. Мы предлагаем нашим клиентам полный сервис: техническую консультацию, быструю доставку и установку. Наши специализированные насосы (счетчик, агрегатный насос, СЦЛ 20/24 и др.) используются для безопасной и эффективной транспортировки бензина, дизеля, керосина и других легких нефтепродуктов.",
+      experiance: "Опыт",
+      experts: "Эксперты",
+      truth: "Надёжность",
     },
     products: {
       title: "Продукты",