Pricing Comparison Table

The goal of this project is to teach you how to display structured data in HTML using a real, accessible table. You will build a small pricing comparison page with proper headers, a caption, and row scopes. Do not style the page; styling will be addressed in a later project. Focus here on the table structure and the surrounding semantic markup.

1. **A semantic page**: Use `<header>`, `<main>`, and `<footer>` to structure the page itself.
2. **A real **`**<table>**` with `<thead>` and `<tbody>` separating header rows from data rows.
3. **A **`**<caption>**` as the first child of the table that names what is being compared.
4. **Header scopes**: Use `scope="col"` on column headers, and `scope="row"` on the plan-name cells so screen readers can announce data in context.
5. **At least one merged cell**: Add `colspan` or `rowspan` somewhere meaningful — a section heading above several columns, or a highlight row that spans the table.
6. **Head metadata**: Set `<title>`, `<meta charset>`, and `<meta viewport>`.

• A single HTML file with a semantic page structure (header, main, footer).
• A `<table>` with a `<caption>`, `<thead>`, and `<tbody>`.
• `scope="col"` on column headers and `scope="row"` on row headers.
• At least one cell using `colspan` or `rowspan` for a real reason.
• Page metadata set correctly in the head.