Pricing

Itemised cost breakdowns, home-market savings, and all-inclusive packages.

<!-- GENERATED FILE. Do not edit by hand. Source: components/help/content/. Run npm run gen:docs. -->

Purpose & Business Context

The Pricing page exists to defeat the single biggest objection in medical travel: the fear of a vague quote that balloons on arrival. It shows a fully itemised all-in estimate for a chosen procedure, line by line, and sets that estimate against home-market prices so the saving is concrete and the cost is trusted.

Commercially, transparent, escrow-backed pricing is what makes a large cross-border payment feel safe enough to make. By pairing every itemised estimate with a savings comparison and an upfront-pricing promise, the page converts price anxiety into confidence before the visitor ever requests a quote.

Screen Overview

A server-rendered page with the shared chrome and a teal page hero, then three stacked sections: a cost breakdown section built around the client-side PricingExplorer, an all-inclusive packages grid, and an upfront-pricing promise card.

The PricingExplorer is a procedure selector over two side-by-side cards: an itemised estimate (grouped into Treatment, Hospital, Travel & stay and Services, ending in an all-in total) and a what it costs at home card (the all-in price against a table of home-market list prices and the saving for each).

Controls & Components

• Page hero: eyebrow, title, subtitle and three stats (typical savings vs US, itemised lines, escrow-protected).
• Procedure selector: chips for each priced procedure (for example Coronary Artery Bypass, Total Knee Replacement, Dental Implant, Hair Transplant); the active chip is filled teal.
• Itemised estimate card: line items grouped by Treatment, Hospital, Travel & stay and Services, each group subtotalled, ending in an All-in estimate and an 'indicative, a final quote follows a medical review' note.
• What it costs at home card: the Global Clinic all-in figure with a save-up-to percentage, then a home-market table (country, local price, you save) covering markets such as the United States, United Kingdom, Australia, Canada and the UAE.
• Packages grid: all-inclusive bundles, each with a name, tagline, from-price, an includes list, a best-for note, an optional Popular badge, and a Get this package button.
• Upfront-pricing promise card: a reassurance block on escrow, refunds and indicative pricing, linking to the Quality page.

Field Definitions

• Cost group: The category a cost line belongs to: Treatment, Hospital, Travel & stay or Services. Each group is subtotalled.
• Line item: A single itemised cost (for example 'Surgeon & assistant fee') with an amount and an optional note.
• All-in estimate: The sum of every line item: the transparent total the patient sees for the selected procedure.
• Reference / local price: The typical home-market list price for the procedure; each home market is derived from a country factor applied to the reference.
• Save up to %: The approximate saving of the all-in estimate versus a home market's local price.
• Package: An all-inclusive bundle with one from-price covering clinical care plus accommodation, transfers and concierge, with a best-for audience.

User Actions & Workflows

1. Read the hero to anchor expectations (typical savings, itemised not bundled, escrow-protected).
2. Pick a procedure chip to load its itemised estimate and savings comparison.
3. Read the itemised estimate top to bottom; each group is subtotalled and the all-in total sits at the foot.
4. Compare the all-in figure against the home-market table to see the saving for your country.
5. Scan the packages for a single-number option, or press Get this package, or read the upfront-pricing promise and follow the link to Quality.

Navigation & Relationships

Reached from: the Pricing item in the primary nav and the brand logo via Home.

Leads to: the patient portal (/portal) from each package's Get this package button, and the Quality page (/quality) from the upfront-pricing promise link.

Pairs with: the Treatments page (which shows the indicative From price this page itemises) and the marketplace (where the per-clinic price is requested as a quote).

Business Rules & Constraints

• The all-in estimate is exactly the sum of the visible line items: no hidden fees.
• Prices are indicative; a final quote follows a medical review of the patient's records, and complications or a longer stay can change the total.
• Savings are computed per home market by applying that market's factor to the reference price, then comparing to the all-in estimate.
• Funds are escrow-protected and release to the hospital only as care milestones are verified, with a full pre-arrival refund.
• Public screen: fully browsable without an account; Get this package leads into the portal.

Data Dependencies

The PricingExplorer reads costBreakdowns (the itemised procedures), homeMarkets (the comparison table) and the helpers breakdownTotal and savingsPct from lib/data. The packages grid reads packages. The hero copy and promise card are authored on the page.

• costBreakdowns: itemised cost lines per procedure
• homeMarkets: the home-market comparison rows and factors
• breakdownTotal / savingsPct: the all-in total and savings maths
• packages: the all-inclusive bundle cards

Error Handling & Edge Cases

• If the selected procedure key has no breakdown, the explorer falls back to the first available breakdown rather than erroring.
• Cost groups with no lines for a procedure are skipped, so a simpler procedure shows fewer groups cleanly.
• The page is otherwise static, so a visitor sees no loading or fetch-failure states.
• Mobile: the two pricing cards stack into a single column and the packages grid reflows to one column.

User Roles & Permissions

• Public (no sign-in required): Anyone can explore breakdowns, savings and packages. Signed-out visitors browse the page freely.
• Get started / Sign in: The header CTAs, and each package's Get this package button, lead into the authentication flow and the patient portal.

Related Features & Functionalities

The Treatments page (the indicative From price this page itemises), the marketplace (per-clinic pricing and quotes), the Quality page (the escrow and limitations the promise card links to), and the portal's Payments & Escrow screen, which uses the same cost-breakdown model for a real case.

Flow & Screenshots

flowchart LR
  Pricing[Pricing] --> Hero[Page hero]
  Pricing --> Procedure[Procedure selector]
  Procedure --> Itemised[Itemised estimate]
  Procedure --> Home[What it costs at home]
  Pricing --> Packages[All-inclusive packages]
  Packages -->|Get this package| Portal[Patient portal]
  Pricing -->|promise link| Quality[Quality]

Guided Walkthrough Steps

The in-app walkthrough for this screen has 6 steps (auto-advances every 5 seconds; Prev / Pause / Next; click outside to exit):

1. Transparent prices, before you commit ([data-tour="pricing.hero"])

Every estimate here is itemised, not a vague quote, and funds sit in escrow until care milestones are met. The stats summarise the promise.

1. Pick a procedure ([data-tour="pricing.procedure"])

Choose a procedure to load its fully itemised estimate and a home-market comparison.

1. See exactly what you pay ([data-tour="pricing.compare"])

On the left, every cost line grouped into treatment, hospital, travel and services with an all-in total. On the right, how that total compares to prices at home.

1. Prefer one number ([data-tour="pricing.packages"])

All-inclusive packages bundle the clinical care with accommodation, transfers and concierge for a single from-price.

1. Upfront and escrow-protected ([data-tour="pricing.promise"])

You see a full estimate before committing; payments release only as milestones are verified, with a full pre-arrival refund. The link opens our quality and considerations.

1. When you are ready ([data-tour="site.cta"])

Get this package or Get started leads into the patient portal, where your real, itemised quote is prepared after a medical review.