Apply style lessons learned from quickstart and cards feedback

- Use action-oriented introductions ("Use X to..." instead of "The X component...")
- Apply sentence case to all section headings ("Properties" not "Props")
- Use "Properties" consistently instead of "Props"
- Remove unnecessary periods from property descriptions
- Update component headings to sentence case
- Make language more direct and user-focused

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>

Author: ethanpalm

components/expandables.mdx

@@ -1,10 +1,10 @@
 ---
 title: "Expandables"
 description: "Toggle to display nested properties"
-icon: 'list-tree'
+icon: "list-tree"
 ---
 
-The `<Expandable>` component allows users to toggle the visibility of nested content, particularly useful for displaying complex object properties in API documentation.
+Use expandables to show and hide nested content within response fields. Expandables are particularly useful for displaying complex object properties in API documentation.
 
 <ResponseField name="user" type="User Object">
   <Expandable title="properties">
@@ -38,12 +38,12 @@ The `<Expandable>` component allows users to toggle the visibility of nested con
 
 </RequestExample>
 
-## Props
+## Properties
 
 <ResponseField name="title" type="string">
-  The name of the object you are showing. Used to generate the "Show NAME" and "Hide NAME" text.
+  The name of the object you are showing. Used to generate the "Show NAME" and "Hide NAME" text
 </ResponseField>
 
 <ResponseField name="defaultOpen" type="boolean" default="false">
-  Set to `true` to show the component as open when the page loads.
+  Set to `true` to show the component as open when the page loads
 </ResponseField>

components/fields.mdx

@@ -4,9 +4,9 @@ description: "Set parameters for your API or SDK references"
 icon: 'letter-text'
 ---
 
-Fields are used to document API parameters and responses. There are two types of fields: Parameter Fields and Response Fields.
+Use fields to document API parameters and responses. There are two types of fields: parameter fields and response fields.
 
-## Parameter Field
+## Parameter field
 
 The `<ParamField>` component is used to define parameters for your APIs or SDKs. Adding a `ParamField` automatically adds an [API Playground](/api-playground/overview).
 
@@ -36,7 +36,7 @@ The `<ParamField>` component is used to define parameters for your APIs or SDKs.
 
 </RequestExample>
 
-### Props
+### Properties
 
 <ParamField body="query, path, body, or header" type="string">
   Whether it is a query, path, body, or header parameter followed by the name
@@ -74,7 +74,7 @@ The `<ParamField>` component is used to define parameters for your APIs or SDKs.
   Description of the parameter (markdown enabled)
 </ParamField>
 
-## Response Field
+## Response field
 
 The `<ResponseField>` component defines the return values of an API. Many docs also use `<ResponseField>` on pages when you need to list the types of something.
 
@@ -88,7 +88,7 @@ The `<ResponseField>` component defines the return values of an API. Many docs a
 </ResponseField>
 ```
 
-### Props
+### Properties
 
 <ResponseField name="name" type="string" required>
   The name of the response value

components/icons.mdx

@@ -4,7 +4,7 @@ description: "Use icons from popular icon libraries"
 icon: "flag"
 ---
 
-The `<Icon>` component displays icons from Font Awesome, Lucide, or custom icon URLs.
+Use icons from Font Awesome, Lucide, or custom icon URLs to enhance your documentation.
 
 <Icon icon="flag" size={32} />
 
@@ -16,7 +16,7 @@ The `<Icon>` component displays icons from Font Awesome, Lucide, or custom icon
 
 </RequestExample>
 
-## Inline Icons
+## Inline icons
 
 Icons are placed inline when used within a paragraph.
 
@@ -26,7 +26,7 @@ Icons are placed inline when used within a paragraph.
 
 <Icon icon="flag" iconType="solid" /> The documentation you want, effortlessly.
 
-### Props
+### Properties
 
 <ResponseField name="icon" type="string" required>
   A [Font Awesome](https://fontawesome.com/icons) icon, [Lucide](https://lucide.dev/icons) icon, URL to an icon, or relative path to an icon

components/steps.mdx

@@ -4,7 +4,7 @@ description: 'Sequence content using the Steps component'
 icon: 'list-todo'
 ---
 
-The `<Steps>` component displays a series of sequential actions or events. You can add as many steps as needed for your workflow.
+Use steps to display a series of sequential actions or events. You can add as many steps as needed for your workflow.
 
 <Steps>
   <Step title="First Step">
@@ -36,7 +36,7 @@ The `<Steps>` component displays a series of sequential actions or events. You c
 
 </RequestExample>
 
-## Steps Props
+## Steps properties
 
 <ResponseField name="children" type="ReactElement<StepProps>[]" required>
   A list of `Step` components
@@ -46,7 +46,7 @@ The `<Steps>` component displays a series of sequential actions or events. You c
   The size of the step titles. One of `p`, `h2`, and `h3`
 </ResponseField>
 
-## Individual Step Props
+## Individual step properties
 
 <ResponseField name="children" type="string | ReactNode" required>
   The content of a step either as plain text or components

components/tabs.mdx

@@ -4,7 +4,7 @@ description: "Toggle content using the Tabs component"
 icon: 'panel-top'
 ---
 
-The `<Tabs>` component organizes content into multiple panels that users can switch between. You can add any number of tabs and include other components inside each tab.
+Use tabs to organize content into multiple panels that users can switch between. You can add any number of tabs and include other components inside each tab.
 
 <Tabs>
   <Tab title="First Tab">
@@ -51,7 +51,7 @@ The `<Tabs>` component organizes content into multiple panels that users can swi
 
 </RequestExample>
 
-## Tab Props
+## Properties
 
 <ResponseField name="title" type="string" required>
   The title of the tab. Short titles are easier to navigate