How do you avoid class name collisions?

Let's say I'm building a blog and add a class named "post" for the timeline posts. Then another developer comes in and creates a highlights section which also has a "post" class. All of a sudden we have a collision. I usually solve this by nesting classes and not keeping anything "global" but from what I've understood it's not best practice: ``` .main .post { background-color: red; } .highlights .post { background-color: green; } ``` When I inspect big sites CSS files I see loads of global class names for seemingly specific parts of the page so I'm really wondering how they solve it. Do they search and scan the whole project for a class name before adding it? What do they do if they want to add something which already exists? Renaming it just for the sake of it seems like a really bad practice if anything.