style: some styles are change

app/components/Header.jsx

@@ -1,8 +1,35 @@
 function Header() {
   return (
-    <nav className="py-6 px-8">
+    <nav className="py-6 px-8 sticky top-0 bg-white/80 backdrop-blur-md z-50 border-b border-gray-100">
       <div className="max-w-6xl mx-auto flex justify-between items-center">
-        <div className="text-2xl font-bold text-teal-700">آرام‌لند</div>
+        {/* Logo */}
+        <div className="flex items-center gap-3">
+          <div className="bg-gradient-to-r from-[#C3C7FF] to-[#A8B1FF] w-8 h-8 rounded-xl flex items-center justify-center">
+            <span className="text-white font-bold text-sm">آ</span>
+          </div>
+          <div className="text-2xl font-bold bg-gradient-to-r from-[#C3C7FF] to-[#A8B1FF] bg-clip-text text-transparent">
+            آرام‌لند
+          </div>
+        </div>
+
+        {/* Navigation */}
+        <div className="hidden md:flex items-center gap-8">
+          {['ویژگی‌ها', 'دانلود', 'قیمت‌ها', 'درباره ما'].map((item) => (
+            <a
+              key={item}
+              href="#"
+              className="text-gray-600 hover:text-[#C3C7FF] font-medium transition-colors duration-200 relative group"
+            >
+              {item}
+              <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-[#C3C7FF] group-hover:w-full transition-all duration-300"></span>
+            </a>
+          ))}
+        </div>
+
+        {/* CTA Button */}
+        <button className="bg-gradient-to-r from-[#C3C7FF] to-[#A8B1FF] text-white font-medium py-2 px-6 rounded-xl hover:shadow-lg transition-all duration-300 transform hover:scale-105">
+          شروع رایگان
+        </button>
       </div>
     </nav>
   );