Почему при отключении рамок (border: none;) у Блока 1 при добавлении верхнего внешнего отступа margin-top элементу Блок 2 двигается Блок 1 от родительского элемента (body), а при включении рамок в Блок 1 - в Блоке 2 при margin-top двигается от родительского элемента Блок 1? Иными словами, без рамки внутренний блок двигает и внешний, а с рамками - двигается внутри от рамок внешнего?
Это и есть результат выпадания внешних отступов, или маргинов. Если в родительском блоке нет границ или padding-top, то при задании вложенному в него блоку margin-top происходит выпадание: т.е. дочерний блок сливается своим верхним краем с верхним краем родителя, как бы “высовывая” свой margin-top за пределы родителя, и именно им он отталкивает родителя от body (в данном случае). Т.е. margin-top дочернего блока становится margin-top родительского. Чтобы этого не происходило, задаются границы или padding-top родительскому блоку. В этом случае “высовывание” своего margin-top дочернего блока ЗА пределы родительского блокируется (есть “замОк” - padding-top или границы родительского): в результате родительский блок остаётся там, где он был, а вот дочерний начинает двигаться уже ВНУТРИ родительского блока.