/*
    Vertical position of the Jumbotron's text.

    The block's text sits in .jumbotron-content, which style.min.css positions absolutely at
    "top: 50%" with "transform: translateY(-50%)" - pinned to the vertical centre. There was no
    way to move it, and on a background whose subject occupies the middle of the frame, centred
    text is the one place it should not be.

    So only "top" moves. The translateY(-50%) stays, which means the value positions the CENTRE
    of the text block, not its top edge: 50% is the middle, 70% is three-fifths of the way down,
    and the block stays symmetric about that point at any height. Setting the top edge instead
    would make the text drift as it grew from one line to two.

    Scoped to .has-jumbotron-text-y, which the block only adds when the parameter differs from
    the default, so every jumbotron already on the site keeps its centred text and this file
    changes nothing until it is asked to.
*/

.jumbotron.has-jumbotron-text-y .jumbotron-content {
    /*
        Specificity has to beat the four .jumbotron-content rules in style.min.css - including
        the ones inside media queries - which two classes plus the element already do, without
        reaching for !important.

        DELIBERATELY a descendant selector and not the full chain. The first version named
        "> .overlay .container .jumbotron-content", which is exactly the Jumbotron block's
        markup and does not match PageBlocks.JumbotronSlides: a slide wraps its text in
        .overlay > .jumbotron-content with no .container between them. Matching on the two
        classes that actually carry meaning lets one rule serve both blocks, and survives a
        wrapper being added or removed in either.

        The custom property is set inline by the block; 50% keeps the original centring if it
        is ever missing.
    */
    top: var(--jumbotron-text-y, 50%);
}
