What is BEM (Block Element Modifier) methodology in CSS?

BEM is a CSS naming convention that creates structured, predictable class names to avoid specificity conflicts and make styles self-documenting. The format is block__element--modifier. A Block is a standalone component: .card. An Element is a part of that block: .card__title, .card__image. A Modifier is a variant or state: .card--featured, .card__title--large. Since all selectors are single classes (no nesting), all rules have equal specificity (0,1,0), completely eliminating specificity battles. BEM is widely used with component-based architectures and works well alongside CSS-in-JS or CSS Modules which enforce scoping automatically.