set --vru on the .font-size-mod() element itself

[chharvey]

The mixin .font-size-mod() sets the --vru custom property on all its children, but not itself. It inherits the VRU from its parent, which means its margin-bottom (and any other property using var(--vru) such as grid-row-gap) will be in terms of its parent VRU.

Change the mixin so that it sets --vru on itself:

.font-size-mod(@ratio) {
  ...
  --vru: calc(@ratio ~' * var(--line-height) * 1rem'); // @ratio * parent vru
}

[chharvey]

now reconsidering: this will affect the module's VRU itself such as its own margin-bottom