[luckylion]

> However it violates the principle of least astonishment. How come a button inside .header differs from the button inside a .footer, then where are the differences defined, inside the button.scss or header.scss? Then one must take into consideration CSS Specifility and sprinkle !important everywhere.

That's true. On the other hand, who is still trying to figure those things out without using their browser's dev tools and source maps?

Using Sass also doesn't mean that you can't use two button classes or utility classes.