Что делает тэг с двумя блочными классами глобальным и собственным?

<div class="title title--color__red"></div>
<div class="title title--color__green"></div>
<div class="title title--color__black"></div>

// .title- глобальный класс. Можно задать общие стили для группы элементов, чтобы их не дублировать
.title {
       text-align: center;
       color: black;
       font-size: 16px;
}

// собственные классы. Дополнительные (индивидуальные) стили
.title .title--color__red {
       color: red;
}

.title .title--color__green {
       color: green;
       font-size: 14px; // Переопределили стиль глобального класса
}

.title .title--color__red {
       color: blue;
       text-decoration: underline;
}