It’s not well known but transformed elements create a new stacking context so when you try to force the stacking the :after element can no longer go behind the text of the parent and therefore rubs it out.
Sometimes leaving the stacking index to auto will solve the problem but where you need to force the issue it is not always possible.
Opacity less than 1 has the same behaviour also. Read more about it here.