inner navbar belong about page

components/pages/about/aboutDetail/baza.tsx

@@ -0,0 +1,65 @@
+"use client";
+
+import { motion } from "framer-motion";
+
+export default function NormativBazaPage() {
+  return (
+    <div className="min-h-screen bg-[#1e1d1c] text-gray-900">
+      {/* Hero Section */}
+      <section className="max-w-6xl mx-auto px-6 py-20">
+        <motion.h1
+          initial={{ opacity: 0, y: 40 }}
+          animate={{ opacity: 1, y: 0 }}
+          transition={{ duration: 0.6 }}
+          className="text-5xl font-bold mb-6 uppercase bg-linear-to-br from-white via-white/50 to-black
+  text-transparent bg-clip-text"
+        >
+          Normativ Baza
+        </motion.h1>
+
+        <motion.p
+          initial={{ opacity: 0, y: 40 }}
+          animate={{ opacity: 1, y: 0 }}
+          transition={{ delay: 0.2, duration: 0.6 }}
+          className="text-lg text-gray-300 max-w-3xl"
+        >
+          Kompaniyamiz yong‘inga qarshi vositalar va tizimlarni o‘rnatish hamda
+          sotish faoliyatini amaldagi normativ-huquqiy hujjatlar asosida olib
+          boradi. Barcha ishlar davlat standartlari va xavfsizlik talablariga
+          muvofiq amalga oshiriladi.
+        </motion.p>
+      </section>
+
+      {/* Cards */}
+      <section className="max-w-6xl mx-auto px-6 pb-20 grid md:grid-cols-3 gap-8">
+        {[
+          {
+            title: "Davlat Standartlari",
+            text: "Yong‘in xavfsizligi bo‘yicha milliy standartlarga to‘liq mos keluvchi uskunalar va montaj ishlari.",
+          },
+          {
+            title: "Texnik Reglamentlar",
+            text: "Yong‘inga qarshi tizimlarni loyihalash va o‘rnatishda amaldagi texnik reglamentlarga rioya qilinadi.",
+          },
+          {
+            title: "Xavfsizlik Talablari",
+            text: "Har bir loyiha individual tahlil qilinadi va obyektning xavfsizlik darajasi hisobga olinadi.",
+          },
+        ].map((item, i) => (
+          <motion.div
+            key={i}
+            initial={{ opacity: 0, y: 60 }}
+            whileInView={{ opacity: 1, y: 0 }}
+            transition={{ duration: 0.6, delay: i * 0.2 }}
+            viewport={{ once: true }}
+            className="border rounded-2xl p-6 hover:shadow-xl transition"
+          >
+            <h3 className="text-xl font-semibold mb-3 uppercase bg-linear-to-br from-white via-white/80 to-black
+  text-transparent bg-clip-text">{item.title}</h3>
+            <p className="text-gray-300">{item.text}</p>
+          </motion.div>
+        ))}
+      </section>
+    </div>
+  );
+}