landing

src/pages/Landing.jsx

@@ -150,34 +150,30 @@ export default function Landing() {
 
           {/* Estadísticas animadas */}
           <div id="estadisticas" className="grid grid-cols-2 md:grid-cols-4 gap-8 mt-20">
-          {/*
+            {stats.map((stat, index) => (
-          {/*
-          {plans.map((plan, idx) => (
               <div 
-              key={plan.name}
+                key={index} 
-              className="bg-white bg-opacity-10 backdrop-blur-lg rounded-3xl shadow-lg p-8 w-full md:w-80 flex flex-col items-center border border-white border-opacity-20"
+                className="text-center p-6 bg-white/10 backdrop-blur-md rounded-2xl border border-white/20 hover:bg-white/20 transition-all duration-300 transform hover:-translate-y-2"
               >
-              <h3 className="text-2xl font-bold mb-2 text-white drop-shadow-lg">{plan.name}</h3>
+                <div className="text-4xl mb-2">{stat.icon}</div>
-              <p className="mb-4 text-white text-opacity-80 text-center">{plan.description}</p>
+                <div className="text-3xl font-bold text-white mb-1">{stat.number}</div>
-              <div className="mb-6">
+                <div className="text-blue-200 text-sm">{stat.label}</div>
-                <span className="text-4xl font-extrabold text-blue-300 drop-shadow-lg">
-                  {plan.price}
-                </span>
-                <span className="ml-2 text-lg text-white text-opacity-70">{plan.period}</span>
               </div>
-              <ul className="mb-6 text-white text-opacity-80 text-left list-disc list-inside">
-                {plan.features.map((feature, i) => (
-                  <li key={i}>{feature}</li>
             ))}
-              </ul>
+          </div>
-              <button className="bg-blue-500 hover:bg-blue-600 text-white font-bold py-2 px-6 rounded-full shadow-lg transition duration-300">
+        </div>
-                Comenzar
+
+        {/* Scroll indicator */}
+        <div className="absolute bottom-8 left-1/2 transform -translate-x-1/2 animate-bounce">
+          <button 
+            onClick={() => scrollToSection('caracteristicas')}
+            className="text-white/70 hover:text-white transition-colors"
+          >
+            <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M19 14l-7 7m0 0l-7-7m7 7V3" />
+            </svg>
           </button>
         </div>
-          ))}
-          */}
-          */}
-        </div>
       </section>
 
       {/* Main content */}
@@ -446,7 +442,7 @@ export default function Landing() {
                 <h3 className="text-2xl font-semibold text-gray-900 mb-2">Profesional</h3>
                 <p className="text-gray-600 mb-4">Para agencias en crecimiento</p>
                 <div className="mb-6">
-                  {/* <span className="text-4xl font-bold text-gray-900">$5,999</span> */}
+                  <span className="text-4xl font-bold text-gray-900">$5,999</span>
                   <span className="text-gray-600">/mes</span>
                 </div>
                 <ul className="text-left space-y-3 mb-8">