Split Compliance Trust Center Hero Block for React

Edit the CERTIFICATIONS array at the top of the file: each entry is a name ("SOC 2 Type II") and a short detail ("Audited annually"), shown as one outline Badge in a list item. The row wraps, so three to six certifications fit; on a phone the details drop and only the names show. Only list the ones your organization holds today, and point the "View security page" link at the page where buyers can request the reports.

It's a picture of a trust center, built from plain elements in greyscale: a header with a status, one row per entry in REPORTS (a name, a detail and a check) and a footer line. It's decoration, so it's hidden from assistive technology, and the certifications that matter are real text in the list beside it. Edit REPORTS to show your own documents, and keep the rows to four so the figure stays about as tall as the copy.

Each entry in STATS is a value and a label, both plain strings, so "99.99%", "50M+" or "24/7" render exactly as written, in tabular figures. The band is a description list in shared hairline cells: a screen reader reads each value with its label. Keep it to four short values: they sit two by two on a phone and on one row from the md breakpoint.

Yes. The headline is the page's one h1. The certifications are a list named "Compliance certifications", so a screen reader announces how many there are before reading them, and the shield icon is hidden from assistive technology. The subtitle and the details use the theme's text-muted-foreground, which passes WCAG AA in light and dark, where faint text at low opacity would not.

Both are links to #: point "Contact sales" at your sales form and "View security page" at your trust center. Each keeps its link role and is named by its text. On Base UI, each button renders its link with render={<a href="/contact" />} and nativeButton={false}.

Below the lg breakpoint the divider becomes a rule: the copy comes first, with both buttons on the first screen, then the trust center in a shorter frame, then the stats band. The certification badges wrap, the four stats form a two-by-two grid, and nothing scrolls sideways down to 320px.