In the CSS for the page, remove any red or high-contrast outline/border around the 'How it works' container (e.g., search for selectors like '#how-it-works', '.how-it-works', or 'section[aria-label="How it works"]' and remove properties such as outline: 2px solid #e74c3c; border: 1px solid #ff4d4f;. If a debugging overlay or outline class is used (e.g., .debug-outline), delete that class usage from production code. Ensure focus outlines remain accessible but non-intrusive.

The Pricing page currently shows a grid of public model cards under the Pricing heading with no pricing information. Replace the content with a standard pricing section: include at least three plan cards (e.g., Starter, Pro, Enterprise), each with a clear price (monthly and/or yearly), a bullet list of included features, and a prominent CTA like 'Start Free' or 'Choose Plan'. If the page is intended to showcase public models, rename the page to 'Public Models' and move the model grid to that page. Ensure the page title, headings, and CTAs are aligned with the page purpose.

In the header, identify all icon-only interactive buttons. For each, either replace with a button containing visible text (e.g., <button>Menu</button>) or add a clear ARIA label (e.g., aria-label='Open menu'). Ensure all interactive controls have an accessible name, a visible focus outline with sufficient contrast, and that the surrounding markup uses semantic buttons. Validate with screen readers and keyboard navigation.