What are `data-*` attributes used for?

data-* attributes let you store custom data directly on HTML elements.

Example:

<button data-product-id="sku_123">Buy</button>

This is useful for connecting markup with JavaScript behavior without creating invalid custom attributes.