Give every public route its own description, and keep canonicals and structured data on the host that serves the page.

Decorative images on the marketing pages stay quiet, and every dialog close button is named Close.

Co-authored-by: Cursor <cursoragent@cursor.com>

tests/components/SectionNumber.test.tsx

@@ -1,19 +1,22 @@
-import { render, screen } from "@testing-library/react";
+import { render } from "@testing-library/react";
 import { describe, it, expect } from "vitest";
 import "@testing-library/jest-dom/vitest";
 import SectionNumber from "../../app/components/sections/SectionNumber";
 
 describe("SectionNumber", () => {
   it("rotates the shape and keeps the numeral upright", () => {
-    render(<SectionNumber number={1} />);
+    const { container } = render(<SectionNumber number={1} />);
 
-    const numeral = screen.getByText("1");
+    const numeral = container.querySelector("span");
+    expect(numeral).toHaveTextContent("1");
     expect(numeral).toHaveClass("text-large-label");
-    expect(numeral.className).not.toMatch(/rotate/);
+    expect(numeral?.className).not.toMatch(/rotate/);
 
-    const shape = screen.getByAltText("Section 1");
+    const shape = container.querySelector("img");
+    expect(shape).toHaveAttribute("alt", "");
     expect(shape).toHaveClass("rotate-15");
-    expect(shape.parentElement).not.toHaveClass("rotate-15");
-    expect(shape.parentElement?.className).not.toMatch(/-rotate-/);
+    expect(shape?.parentElement).toHaveAttribute("aria-hidden", "true");
+    expect(shape?.parentElement).not.toHaveClass("rotate-15");
+    expect(shape?.parentElement?.className).not.toMatch(/-rotate-/);
   });
 });