Looks to be global.js, in the adjustHeaderHeight()
function at lines 92 – 97
// The margin should be applied to different elements on front-page or home vs interior pages.
if ( isFrontPage ) {
$branding.css( 'margin-bottom', navigationOuterHeight );
} else {
$customHeader.css( 'margin-bottom', navigationOuterHeight );
}
It sets the margin-bottom to the equivalent of the top navigation menu’s “outerHeight” (as defined and measured earlier) and seems to be based on the assumption that you’re probably going to have a 1 line menu that will be 70px tall, since the theme CSS is for a 70px bottom margin. The script overrules that setting.
If you have no top menu, then site-branding transitions 70px (to 0 margin-bottom) in .2 seconds (.site-branding {transition: margin-bottom 0.2s}
(shortened)).
Oddly, the measure for outerHeight is on my default testing installation 72px – so there’s a 2px jitter after I add a short menu. On multi-line menus it starts to have problems with overlap.
Anyway, I’ve never looked at this before, but it doesn’t strike me as one of Twenty Seventeen’s better worked-out capacities. Maybe the designer/developers just liked the animation effect that the default installation – prior to creation of any top menus – shows.