Update billing page ctas (#12459)

## Before

![image](https://github.com/user-attachments/assets/95315651-8b04-4004-a6b6-8742ebcc6f9d)

## After
<img width="1056" alt="image"
src="https://github.com/user-attachments/assets/4a51b7c7-898b-485f-95e8-97911292f2b1"
/>
<img width="1299" alt="image"
src="https://github.com/user-attachments/assets/44e5e545-a660-455a-91be-3b139ccb9f30"
/>
<img width="1180" alt="image"
src="https://github.com/user-attachments/assets/0ca765a7-1d9a-473a-b7d2-c6f9b1a72417"
/>
<img width="963" alt="image"
src="https://github.com/user-attachments/assets/b620fd8a-61c9-4dd3-a3b1-e4ba940371e4"
/>
<img width="863" alt="image"
src="https://github.com/user-attachments/assets/a0d2dcb5-19e5-4f83-80d4-ad5a715f1e5f"
/>

---------

Co-authored-by: Charles Bochet <charlesBochet@users.noreply.github.com>

packages/twenty-front/src/modules/billing/graphql/mutations/checkoutSession.ts

@@ -0,0 +1,19 @@
+import { gql } from '@apollo/client';
+
+export const CHECKOUT_SESSION = gql`
+  mutation CheckoutSession(
+    $recurringInterval: SubscriptionInterval!
+    $successUrlPath: String
+    $plan: BillingPlanKey!
+    $requirePaymentMethod: Boolean!
+  ) {
+    checkoutSession(
+      recurringInterval: $recurringInterval
+      successUrlPath: $successUrlPath
+      plan: $plan
+      requirePaymentMethod: $requirePaymentMethod
+    ) {
+      url
+    }
+  }
+`;