Я читала, что хорошей практикой считается вложенность селекторов не больше двух уровней, т.к. большая вложенность усложняет читабельность и поддержку кода.
Неправильно. Вложенность больше двух уровней
.block {
display: block;
.description {
font-size: 14px;
.title {
font-size: 16px;
}
}
}
Правильно. Псевдоэлменты, псевдоселекторы, родственные и соседние селекторы не влияют на вложенность.
.checkbox__input:checked ~ .checkbox__label::before {
border-color: #3D4975;
}