I have a problem with a CSS animation. I try to rotate a simple card, but this effect add bluer for every text in the card. I have a pen here: https://codepen.io/xdesign/pen/GRBmEJa
I've tried 2 days to figure out what is happening, i've read i think 20 posts with solutions like:
-webkit-backface-visibility: hidden;
-webkit-transform: translateZ(0) scale(1, 1);
-webkit-transform: translateZ(0);
scale: 1.05
-webkit-perspective: 1000;
-webkit-font-smoothing: antialiased;
Absolutely nothing working... I am not expert in design, i am a backend developer, however, i must do some things in design. But i can't figure out, how to remove the blur from text. I've already read ~20 posts about blurry text.... so if anyone can help me with this i'll really appreciate.
Updated: i want to remove blurry text