Subject of the issue

Currently, item widths are set as inline width styles.

This results in the width being set as an inline style.

<div class="hotgrid__item" role="listitem" style="width: 33.3333%;">

This would be easier to override in a custom theme if a class was used instead. For example, when the component is set to use 3 columns, add has-3-columns to the component__widget. The styles would then determine how wide each item should be. For example:

.has-3-columns .hotgrid__item {
   width: 33%;
}

In a custom theme, if we then needed the items to only be 30% width instead of 33%, we would simply add it to the theme:

.has-3-columns .hotgrid__item {
   width: 30%;
}

This would also make it easier to adjust the width at different breakpoints as we can rely on @media queries in the Less.