MVP

src/components/marketing/Pricing.tsx

@@ -27,7 +27,7 @@ export const Pricing: React.FC<PricingProps> = ({ t }) => {
 
   return (
     <section id="pricing" className="py-16">
-      <div className="container mx-auto px-4">
+      <div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-7xl">
         <div className="text-center mb-12">
           <h2 className="text-3xl lg:text-4xl font-bold text-gray-900 mb-4">
             {t.pricing.title}
@@ -67,7 +67,7 @@ export const Pricing: React.FC<PricingProps> = ({ t }) => {
 
               <CardContent className="space-y-4">
                 <ul className="space-y-3">
-                  {t.pricing[plan.key].features.map((feature: string, index: number) => (
+                  {t.pricing[plan.key].features.slice(0, 3).map((feature: string, index: number) => (
                     <li key={index} className="flex items-start space-x-3">
                       <svg className="w-5 h-5 text-success-500 flex-shrink-0 mt-0.5" fill="currentColor" viewBox="0 0 20 20">
                         <path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
@@ -88,6 +88,12 @@ export const Pricing: React.FC<PricingProps> = ({ t }) => {
             </Card>
           ))}
         </div>
+
+        <div className="text-center mt-8">
+          <a href="/#pricing" className="text-primary-600 hover:text-primary-700 font-medium">
+            View Full Pricing Details →
+          </a>
+        </div>
       </div>
     </section>
   );