<div>
    <span style="display:block;font-family:'Satoshi',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:#6d648f;">Tools</span>
    <h3 style="margin:0.25rem 0 0;font-family:'Satoshi',sans-serif;font-weight:700;font-size:1.5rem;color:#3E2155;">Video Ideas</h3>
</div>
<div>
  <span style="display:block;font-family:'Satoshi',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:#6d648f;">{{label}}</span>
  {{#if heading}}
  <h3 style="margin:0.25rem 0 0;font-family:'Satoshi',sans-serif;font-weight:700;font-size:1.5rem;color:#3E2155;">{{heading}}</h3>
  {{/if}}
</div>
{
  "label": "Tools",
  "heading": "Video Ideas"
}

Small uppercase label used directly above a heading to give it context (e.g. above a page title, above a card title). Part of the pattern language signed off 2026-07-23 (docs/styling-review-2026-07/decision-doc.md).

Always pairs with a heading placed directly below it; not used standalone as body copy.