:root { --site-header-height: 6rem; }
@media (width < 48rem) { :root { --site-header-height: 4.5rem; } }
html { scroll-padding-block-start: calc(var(--site-header-height) + var(--space-s)); }
.site-main:focus { outline: none; }
@keyframes vx-fade-up { from { opacity: 0; translate: 0 1rem; } }
@keyframes vx-drop { from { opacity: 0; translate: 0 -0.375rem; } }
@keyframes vx-fade { from { opacity: 0; } }
@keyframes vx-reveal { from { opacity: 0; translate: 0 1.5rem; } }
.reveal:not(.reveal--in) { opacity: 0; }
.reveal--in { animation: vx-reveal 640ms cubic-bezier(0.4, 0, 0.2, 1) var(--reveal-delay, 0ms) backwards; }