MarketingSectionHead

A marketing section head — the heading on the left, the lede on the right. One element carries the accent: the eyebrow.

When to use it

A section of a public page opens and needs a heading with a lede. The two-column split holds the handoff rule: the heading carries the left column, the context the right one.
The section needs a short label above the heading — eyebrow is the ONLY accented element of the section and so decides where the eye lands first.

When not to use it

It is a section of an admin screen. That is IngotSection: tighter spacing, one column and a heading that enters the screen outline.
It is the heading of the whole page. That is IngotPageHeader and it is an h1; this head is an h2 and assumes an h1 stands above it.

Properties

eyebrow: string — A short label above the heading — the section's only accented element.
title: string — The section heading. Set as an h2 and supplied already translated.
lede: string — The lede in the right column. Without it the heading spans the full width.
testId: string — An anchor for tests — on the grid.