feat: better fotter

app/components/FreeTrial.jsx

@@ -1,4 +1,7 @@
+"use client";
+ import { useScroll } from '../hooks/useScroll';
 function FreeTrial() {
+  const { scrollToSectionWithHeader } = useScroll();
   return (
     <div className="relative bg-gradient-to-r from-primary-500 via-primary-600 to-primary-500 rounded-3xl p-12 text-white text-center mb-20 animate-fadeInUp overflow-hidden">
       {/* Background Pattern */}
@@ -26,8 +29,8 @@ function FreeTrial() {
 
         {/* Description */}
         <p className="text-lg md:text-xl text-white/90 mb-8 max-w-2xl mx-auto leading-relaxed animate-fadeInUp delay-300">
-          تمام ویژگی‌های پریمیوم رو برای یک هفته کامل تجربه کن، 
-          <span className="font-bold text-yellow-300"> بدون نیاز به کارت اعتباری</span>
+          تمام ویژگی‌های پریمیوم رو میتونی به طور محدود تجربه کنی 
+          <span className="font-bold text-yellow-300"></span>
         </p>
 
         {/* Features */}
@@ -35,7 +38,10 @@ function FreeTrial() {
           {[
             "تمامی مدیتیشن‌ها",
             "موسیقی‌های انحصاری", 
-            "مشاوره هوش مصنوعی"
+            "مشاوره هوش مصنوعی",
+            "تمرین تنفسی دلخواه",
+            "اطلاعات آموزشی",
+            "رابط کاربری ساده",
           ].map((feature, index) => (
             <div key={index} className="flex items-center justify-center gap-2 bg-white/10 backdrop-blur-sm py-3 px-4 rounded-xl">
               <svg className="w-4 h-4 text-yellow-300" fill="currentColor" viewBox="0 0 20 20">
@@ -47,14 +53,14 @@ function FreeTrial() {
         </div>
 
         {/* CTA Button */}
-        <button className="bg-white text-primary-500 font-bold py-4 px-12 rounded-2xl hover:shadow-2xl transition-all duration-300 transform hover:scale-105 animate-fadeInUp delay-500 relative overflow-hidden group">
+        <button onClick={() => scrollToSectionWithHeader('download')} className="bg-white text-primary-500 font-bold py-4 px-12 rounded-2xl hover:shadow-2xl transition-all duration-300 transform hover:scale-105 animate-fadeInUp delay-500 relative overflow-hidden group">
           <div className="absolute inset-0 bg-gradient-to-r from-transparent via-white/20 to-transparent -translate-x-full group-hover:translate-x-full transition-transform duration-700"></div>
-          <span className="relative">شروع دوره آزمایشی رایگان</span>
+          <span className="relative">شروع سفر آرامش</span>
         </button>
 
         {/* Footer Note */}
         <p className="text-white/70 text-sm mt-6 animate-fadeInUp delay-600">
-          هیچ تعهدی ندارد • هر زمان می‌توانی لغو کنی
+          میتونی روی گوشیت همیشه داشته باشی
         </p>
       </div>
     </div>