логика при работе с псевдоклассом :hover

помогите, пожалуйста, разобраться…

li.top ul.submenu{display:none;}
li.top:hover ul.submenu {display:block;}

Первое правило прячет список-подменю.
Второе - показывает подменю, если на верхний пункт меню (родитель), в котором находится подменю, наведут курсор.
Общий принцип - родительский элемент реагирует на наведение мыши и изменяет свойства элементов-потомков.

Мы задаем свойство для элемента li.top ul.submenu (контекстный селектор), тогда почему правило применяется к родителю (в примере 2 ), а тот изменяет свойство элементов-потомков, чтобы подменю появилось, если даже само свойство не наследуется.

То, что на подменю не навести курсор это понятно - оно скрыто.
Интересен принцип работы (есть ли какое то правило).
Почему свойство применяется к родителю во втором примере?Или оно не применяется к родителю, а тут что то другое

Почему свойство применяется к родителю во втором примере?

Свойство не применяется к родителю. Свойство display:block применяется именно к потомку, на которого и указывает контекстный селектор.
Но управляет моментом, когда именно свойство применится к потомку, псевдокласс hover у родителя. То есть когда на родительский элемент наводят курсор, применяются стили к потомку.

Получается, что как бы событие наследуется?

Смотря что вы понимаете под событием. Просто селектор срабатывает тогда, когда удовлетворяется условие :checked.