/* Keep the header in document flow and let it stick to the viewport. */
body { overflow-x: clip; }
body > .header { position: sticky; top: 0; right: auto; left: auto; transition: none; }
body > .header.scrolled { box-shadow: none; }
.hero { padding-top: 102px; }
@media(max-width:992px) { .hero { padding-top: 52px; min-height: calc(100svh - 68px); } }
@media(max-width:767px) { .hero { padding-top: 56px; min-height: calc(100svh - 64px); } }
@media(max-width:576px) { .hero { padding-top: 51px; } }
@media(max-width:400px) { .hero { padding-top: 41px; } }
@media(max-height:650px) and (orientation:landscape) { .hero { padding-top: 52px; } }