diff --git a/landing/components/pricing/PricingCard.vue b/landing/components/pricing/PricingCard.vue
index 99fec1b..63a81a0 100644
--- a/landing/components/pricing/PricingCard.vue
+++ b/landing/components/pricing/PricingCard.vue
@@ -1,58 +1,68 @@
 <script lang="ts" setup>
 
-
-type Prop = {
+export type PricingCardProp = {
     title: string,
-    icon: string,
-    list: { text: string, icon: string }[],
-    price: string,
+    cost: string,
+    features: string[],
+    desc: string,
+    active: boolean
 }
 
-const props = defineProps<Prop>();
+const props = defineProps<{ data: PricingCardProp }>();
+
+
+function onUpgradeClick() {
+    window.open('https://dashboard.litlyx.com/book_demo')
+}
 
 </script>
 
-
 <template>
-    <div class="bg-menu py-6 rounded-lg w-full h-full flex flex-col items-center justify-normal px-6 relative">
+    <div class="p-6 bg-[#303030] rounded-xl pricing-card flex flex-col">
 
-        <div
-            class="absolute rounded-full top-[-2.1rem] bg-accent w-[4.2rem] h-[4.2rem] flex items-center justify-center">
-            <i :class="icon" class="text-[2.5rem]"></i>
-        </div>
-
-        <div class="poppins mt-6 font-semibold text-[1.4rem]">
-            {{ title }}
-        </div>
-
-        <div class="bg-gray-400/50 h-[1px] w-full mt-6 mb-10"></div>
-
-        <div class="flex flex-col gap-4">
-            <div class="flex gap-3 items-center" v-for="element of list">
-
-                <div class="shrink-0 flex items-center bg-accent w-[2rem] h-[2rem] justify-center rounded-full">
-                    <i :class="element.icon" class="text-[.9rem]"></i>
+        <div class="flex flex-col">
+            <div class="text-[1.1rem] font-semibold mb-4">
+                {{ data.title }}
+            </div>
+            <div class="flex gap-1 items-end mb-2">
+                <div class="text-[1.1rem] font-semibold">
+                    €{{ data.cost }}
                 </div>
-
-                <div class="poppins">
-                    {{ element.text }}
+                <div class="text-text-sub text-[.9rem] mb-[.15rem]">
+                    per month
                 </div>
             </div>
-        </div>
-
-        <div class="bg-gray-400/50 h-[1px] w-full mt-10 mb-6"></div>
-
-        <div class="flex gap-2 justify-between w-full">
-            <div class="flex gap-2 items-end">
-                <div class="manrope text-[2.5rem] font-bold text-text"> {{ price }} </div>
-                <div class="poppins text-text-sub/90 mb-1">/month</div>
+            <div @click="onUpgradeClick()" v-if="data.active" class="cursor-pointer text-[1rem] font-semibold bg-[#3a3af5] rounded-md py-2 text-center">
+                Start now for FREE
             </div>
-
-            <div>
-                Tasto bello
+            <div @click="onUpgradeClick()" v-if="!data.active" class="cursor-pointer text-[1rem] font-semibold bg-[#4d4d4d] rounded-md py-2 text-center">
+                Upgrade
             </div>
         </div>
 
+        <div class="bg-gray-400 h-[1px] w-full my-4"></div>
+
+        <div class="flex flex-col gap-1 grow">
+            <div class="flex gap-2 items-center" v-for="feature of data.features">
+                <i class="fas fa-check"></i>
+                <div>
+                    {{ feature }}
+                </div>
+            </div>
+
+        </div>
+
+        <div class="bg-gray-400 h-[1px] w-full my-4"></div>
+
+        <div class="text-text-sub text-[.9rem] h-[20%]">
+            {{ data.desc }}
+        </div>
     </div>
+</template>
 
-</template>
\ No newline at end of file
+
+<style scoped lang="scss">
+.pricing-card * {
+    font-family: "Poppins";
+}
+</style>
\ No newline at end of file
diff --git a/landing/pages/pricing.vue b/landing/pages/pricing.vue
index a44133b..1fb9167 100644
--- a/landing/pages/pricing.vue
+++ b/landing/pages/pricing.vue
@@ -2,110 +2,99 @@
 import { Vue3Lottie } from 'vue3-lottie';
 
 
+const starterTierCardData = ref<any>({
+    title: 'STARTER',
+    cost: '0',
+    features: [
+        "3K visits/events per month",
+        "10 AI Interaction per month",
+        "1 month data retention",
+        "Limited reports",
+        "1 Team member",
+        "Limited Automatic Email Report",
+        "Shared Server & DB",
+        "Low priority email support",
+    ],
+    desc: `Free project are not reliable and sometimes
+           can experience some data loss.To have a 
+           dedicated server we suggest to upgrade the
+           plan to an higher one!`,
+    active: true
+});
+
+const accelerationTierCardData = ref<any>({
+    title: 'ACCELERATION',
+    cost: '9.99',
+    features: [
+        "150K visits/events per month",
+        "100 AI Interaction per month",
+        "6 months data retention",
+        "Limited reports",
+        "1 Team member",
+        "Limited Automatic Email Report",
+        "Shared Server & DB",
+        "Low priority email support"
+    ],
+    desc: `Your project is entering a growth phase. We simplify data analysis for you. For more support, try our Expansion plan—it's worth it!`,
+    active: false
+});
+
+const expansionTierCardData = ref<any>({
+    title: 'EXPANSION',
+    cost: '39.99',
+    features: [
+        "500K visits/events per month",
+        "5000 AI Interaction per month",
+        "2 years data retention",
+        "Unlimited reports",
+        "10 Team member",
+        "Unlimited Automatic Email Report",
+        "Dedicated Server & DB",
+        "high priority email support"
+    ],
+    desc: `We will support you with everything we can offer and give you the full power of our service. If you need more space and are growing, contact us for a custom offer!`,
+    active: false
+});
+
 definePageMeta({ layout: 'header' });
 
 </script>
 
 
 <template>
-    <!-- 
-    <div class="home h-full overflow-y-auto relative">
 
-        <div class="absolute top-0 left-0 w-full h-full flex flex-col items-center z-0 overflow-hidden">
-            <HomeBgGrid :size="50" :spacing="18" opacity="0.3" class="w-fit h-fit"></HomeBgGrid>
-            <HomeBgGrid :size="50" :spacing="18" opacity="0.3" class="w-fit h-fit"></HomeBgGrid>
-        </div>
+    <div class="home h-full w-full min-h-[40dvh]">
 
-        <div class="flex w-full justify-center px-20">
-            <SelectButton class="text-[1.4rem]" :current-index="0" :options="[
-                { label: 'Monthly' },
-                { label: 'Yearly' },
-            ]"></SelectButton>
-        </div>
+        <div class="p-8">
 
-        <div class="flex mt-20 gap-10 mx-20">
+            <div class="flex gap-8 h-max">
+                <PricingCard class="flex-1" :data="starterTierCardData"></PricingCard>
+                <PricingCard class="flex-1" :data="accelerationTierCardData"></PricingCard>
+                <PricingCard class="flex-1" :data="expansionTierCardData"></PricingCard>
+            </div>
 
-            <PricingCard title="Free plan" icon="far fa-fire" price="€ 54" :list="[
-
-                { text: '3k Page visits / Custom Events (one time)', icon: 'fas fa-check' },
-                { text: 'Access to Crm', icon: 'fas fa-check' },
-                { text: 'Download CSV Raw data', icon: 'fas fa-check' },
-                { text: 'PDF Report For investor', icon: 'fas fa-check' },
-
-                { text: 'Team member', icon: '' },
-                { text: 'Only 1 project connected', icon: '' },
-
-            ]"></PricingCard>
-
-            <PricingCard title="Free plan" icon="far fa-fire" price="€ 54" :list="[
-
-                { text: '3k Page visits / Custom Events (one time)', icon: 'fas fa-check' },
-                { text: 'Access to Crm', icon: 'fas fa-check' },
-                { text: 'Download CSV Raw data', icon: 'fas fa-check' },
-                { text: 'PDF Report For investor', icon: 'fas fa-check' },
-
-                { text: 'Team member', icon: '' },
-                { text: 'Only 1 project connected', icon: '' },
-
-            ]"></PricingCard>
-
-            <PricingCard title="Free plan" icon="far fa-fire" price="€ 54" :list="[
-
-                { text: '3k Page visits / Custom Events (one time)', icon: 'fas fa-check' },
-                { text: 'Access to Crm', icon: 'fas fa-check' },
-                { text: 'Download CSV Raw data', icon: 'fas fa-check' },
-                { text: 'PDF Report For investor', icon: 'fas fa-check' },
-
-                { text: 'Team member', icon: '' },
-                { text: 'Only 1 project connected', icon: '' },
-
-            ]"></PricingCard>
-
-
-            <PricingCard title="Free plan" icon="far fa-fire" price="€ 54" :list="[
-
-                { text: '3k Page visits / Custom Events (one time)', icon: 'fas fa-check' },
-                { text: 'Access to Crm', icon: 'fas fa-check' },
-                { text: 'Download CSV Raw data', icon: 'fas fa-check' },
-                { text: 'PDF Report For investor', icon: 'fas fa-check' },
-
-                { text: 'Team member', icon: '' },
-                { text: 'Only 1 project connected', icon: '' },
-
-            ]"></PricingCard>
-
-
-        </div>
-
-
-        <div class="flex w-full py-20 my-20 px-20">
-            <div class="flex justify-between w-full">
+            <div class="flex justify-between items-center mt-10">
                 <div class="flex flex-col gap-2">
-                    <div class="poppins font-bold text-[2.2rem]">
-                        Ready to ditch Google Analytics ?
+                    <div class="poppins text-[2rem] font-semibold">
+                        Do you need help ?
                     </div>
-                    <div class="text-accent poppins font-bold text-[2.2rem]">
-                        Start your free trial today.
+                    <div class="poppins text-[1.2rem] text-text/90">
+                        We respond in max. 1-2 days
                     </div>
                 </div>
-                <div class="flex gap-4 items-center mr-20">
-                    <div class="poppins px-12 py-6 text-[1.2rem] hover:bg-accent/90 text-text cursor-pointer bg-accent rounded-xl font-semibold">
-                        Get started
-                    </div>
-                    <div class="poppins px-12 py-6 text-[1.2rem] hover:bg-text/90 cursor-pointer text-accent bg-text rounded-xl font-semibold">
-                        Live demo
-                    </div>
+                <div class="py-4 px-20 bg-[#303030] rounded-lg">
+                    <a href="mailto:helplitlyx@gmail.com" class="poppins text-[1.3rem]">
+                        helplitlyx@gmail.com
+                    </a>
                 </div>
             </div>
         </div>
-    </div> -->
 
-
-    <div class="home h-full w-full min-h-[40dvh]">
-        <Vue3Lottie height="16rem" animation-link="pricing_lottie.json"></Vue3Lottie>
+        <!-- <Vue3Lottie height="16rem" animation-link="pricing_lottie.json"></Vue3Lottie>
         <div class="poppins text-[2rem] font-semibold text-center mt-6">
             Pricing coming soon
-        </div>
+        </div> -->
+
     </div>
 
 </template>