That's very reductionist approach. Sure, margin is a sharp tool and you need to use it responsibly.

I avoid putting margins on "first"-level selector.

So instead of

    .button {
      margin-left: 16px
    }

I do

    .parent > .button {
      margin-left: 16px
    }

Difference is that I can reuse '.button' elsewhere without modifications.

Another point to consider is that margin is not the only CSS property that affects layout. Both grid, flexbox and 'position' properties should be used with same care. And approach I highlighted above is usually good enough.

For margin specifically there is also a "owl" selector that makes is a bit easier to manage

    .parent > * + * {
      margin-top: 16px; // OR
      margin-left: 16px;
    }