docs(pricing, first-deploy): one table component for pricing, and a split CLI path for the first deploy

.gitignore

@@ -59,3 +59,5 @@ sandbox.config.json
 # Benchmark measurements and rework reports. These name competitors and this
 # repository is public, so they stay local.
 reports/
+
+.working-files/*

src/components/Table/TablePricing.astro

@@ -272,7 +272,7 @@ function transformData(data) {
 			price = isReal() ? item.brazilian_real : item.american_dollar
 		}
 
-		// Check if price is zero and replace with "Free"
+		// A zero price is the usage the plans include: label it instead of printing $0.00
 		const numericPrice = isReal() ? item.brazilian_real : item.american_dollar;
 		const formattedPrice = isReal() ? item.brazilian_real_formatted : item.american_dollar_formatted;
 		const isZeroPrice = numericPrice === 0 || numericPrice === '0' || numericPrice === 0.0 || numericPrice === '0.00' ||
@@ -281,8 +281,7 @@ function transformData(data) {
 		                    parseFloat(formattedPrice) === 0;
 
 		if (isZeroPrice) {
-			// "Free" in English, "Grátis" in Portuguese
-			price = lang === 'pt-br' ? 'Grátis' : 'Free';
+			price = lang === 'pt-br' ? 'Incluído' : 'Included';
 		} else {
 			// Normalize price to always have exactly 2 decimal places
 			price = formatPrice(price);
@@ -326,18 +325,18 @@ function transformData(data) {
 		}
   });
 
-  // Sort tiers: rows with zero prices (containing "Free" or "Grátis") come first
+  // Sort tiers: rows with zero prices (labeled "Included" or "Incluído") come first
   return sortTiersByZeroPrice(tiers);
 }
 
 /**
  * Extracts the numeric price value from a formatted price string.
- * Handles formats like "0.999 USD", "R$ 0,999", "Free", "Grátis".
+ * Handles formats like "0.999 USD", "R$ 0,999", "Included", "Incluído".
  * @param {string} price - The formatted price string
  * @returns {number} - The numeric price value
  */
 function extractNumericPrice(price) {
-	if (price === 'Free' || price === 'Grátis' || !price) {
+	if (price === 'Included' || price === 'Incluído' || !price) {
 		return 0;
 	}
 	// Remove currency symbols and extract number
@@ -362,7 +361,7 @@ function getMinPrice(prices) {
 /**
  * Sorts the tiers object so that rows with zero prices appear first,
  * followed by non-zero price rows in descending order (highest price first).
- * A row is considered to have a zero price if any of its values is "Free" or "Grátis".
+ * A row is considered to have a zero price if any of its values is "Included" or "Incluído".
  * @param {Object} tiers - The unsorted tiers object
  * @returns {Object} - Sorted tiers object with zero-price rows first, then descending prices
  */
@@ -374,9 +373,9 @@ function sortTiersByZeroPrice(tiers) {
 	const nonZeroPriceEntries = [];
 
 	entries.forEach(([tierName, prices]) => {
-		// Check if any price in this row is "Free" or "Grátis"
+		// Check if any price in this row is "Included" or "Incluído"
 		const hasZeroPrice = Object.values(prices).some(price =>
-			price === 'Free' || price === 'Grátis'
+			price === 'Included' || price === 'Incluído'
 		);
 
 		if (hasZeroPrice) {

src/components/webkit/PricingTable.vue

@@ -1,26 +1,30 @@
 <template>
-	<Table border>
-		<Table.Header>
-			<Table.Row>
-				<Table.HeadCell principal>
-					<span class="whitespace-normal">{{ metric }}</span>
-				</Table.HeadCell>
-				<Table.HeadCell v-for="column in columns" :key="column">
-					<span class="whitespace-nowrap">{{ column }}</span>
-				</Table.HeadCell>
-			</Table.Row>
-		</Table.Header>
-		<Table.Body>
-			<Table.Row v-for="row in rows" :key="row.tier">
-				<Table.Cell principal>
-					<span class="whitespace-normal">{{ row.tier }}</span>
-				</Table.Cell>
-				<Table.Cell v-for="(price, index) in row.prices" :key="index">
-					<span class="whitespace-nowrap text-(--text-muted)">{{ price }}</span>
-				</Table.Cell>
-			</Table.Row>
-		</Table.Body>
-	</Table>
+	<!-- The prose spaces blocks through data-doc-block; without it, consecutive tables and
+	     the paragraph before them touch. data-doc-chrome keeps the prose rules out of the cells. -->
+	<div data-doc-block data-doc-chrome>
+		<Table border>
+			<Table.Header>
+				<Table.Row>
+					<Table.HeadCell principal>
+						<span class="whitespace-normal">{{ metric }}</span>
+					</Table.HeadCell>
+					<Table.HeadCell v-for="column in columns" :key="column">
+						<span class="whitespace-nowrap">{{ column }}</span>
+					</Table.HeadCell>
+				</Table.Row>
+			</Table.Header>
+			<Table.Body>
+				<Table.Row v-for="row in rows" :key="row.tier">
+					<Table.Cell principal>
+						<span class="whitespace-normal">{{ row.tier }}</span>
+					</Table.Cell>
+					<Table.Cell v-for="(price, index) in row.prices" :key="index">
+						<span class="whitespace-nowrap text-(--text-muted)">{{ price }}</span>
+					</Table.Cell>
+				</Table.Row>
+			</Table.Body>
+		</Table>
+	</div>
 </template>
 
 <script setup lang="ts">

src/content/docs/en/pages/first-deploy/first-deploy.mdx

@@ -89,37 +89,51 @@ Open the Azion domain in the browser to see your application running. If you get
 
 ## Deploy with Azion CLI
 
-<DocCallout kind="info">You need the Azion CLI (installed below) and a local project using one of the supported frameworks, with its dependencies installed.</DocCallout>
+<DocCallout kind="info">You need a local project that uses one of the supported frameworks, with its dependencies installed, or you create one from a template in step 3.</DocCallout>
 
-<DocCallout kind="tip">Starting from scratch instead? Run `azion init` to create a new project from a framework template, then deploy it the same way. See the [CLI overview](/en/documentation/devtools/cli/) and the [link command reference](/en/documentation/devtools/cli/link-command/) for details.</DocCallout>
-
-<DocPrompt client:visible kind="line" title="AI Assistant">Install the Azion CLI, link this project to my Azion account using the preset that matches its framework, deploy it, and print the Azion domain once it answers 200.</DocPrompt>
+<DocPrompt client:visible kind="line" title="AI Assistant">Set up the Azion CLI, log in, link this project to my Azion account or initialize one from a template, deploy it, and print the Azion domain once it answers 200.</DocPrompt>
 
 <DocSteps>
-  <DocStep title="Install the Azion CLI">
+  <DocStep title="Set up the Azion CLI">
 
   ```bash
   curl -fsSL https://cli.azion.app/install.sh | bash
   ```
 
   </DocStep>
-  <DocStep title="Link and deploy">
-
-  Authenticate:
+  <DocStep title="Log in">
 
   ```bash
   azion login
   ```
 
-  In the project's root folder, link it to Azion:
+  The CLI saves a personal token locally, which authorizes the commands that follow.
+
+  </DocStep>
+  <DocStep title="Initialize or link the project">
+
+  To start from a template, run the command where you want the project folder created. It asks for a preset, which is the framework, then for a template, and creates a folder with the project's name; accept installing the dependencies:
+
+  ```bash
+  azion init
+  ```
+
+  To use a project you already have, run the command in its root folder. It asks you to confirm the link, to accept or change the suggested application name, and to pick the preset that matches your framework; the `.gitignore` entry and the GitHub Actions workflow it offers are optional:
 
   ```bash
   azion link
   ```
 
-  The CLI guides you from there: confirm the linking, accept or change the suggested application name, and pick a preset matching your framework. When it asks `Do you want to deploy your project?`, answer yes. (If you answer no, run `azion deploy` when you are ready.)
+  When either command asks whether to deploy, answer no: the next step does it.
+
+  </DocStep>
+  <DocStep title="Deploy">
+
+  ```bash
+  azion deploy
+  ```
 
-  At the end of the deploy, the CLI prints your application's Azion domain.
+  The CLI builds the project, uploads it, creates the application with its domain, and prints the domain at the end.
 
   </DocStep>
   <DocStep title="Test it">