/* Full-width scaling (enabled by fit.js). Without JS the page stays a centred 1440px column. */
/* Reserve the scrollbar's space from the first frame so the measured width (and the scale) never changes */
html { scrollbar-gutter: stable; }
html.fit body { overflow-x: hidden; }
html.fit .page { zoom: var(--s, 1); margin: 0; transition: opacity .35s ease; }

/* Hidden until the scale is final and fonts are loaded; entrance animations wait too */
html.is-loading .page { opacity: 0; }
html.is-loading .page * { animation-play-state: paused !important; }

/* Hero fills the window height; the photo keeps its 1440x960 framing, cropped evenly top and bottom. */
html.fit .hero { height: var(--hero-h, 960px); }
html.fit .hero__bg { inset: auto; left: 0; top: calc((var(--hero-h, 960px) - 960px) / 2); width: 1440px; height: 960px; }
html.fit .hero__fade-bottom { top: auto; bottom: 0; }
html.fit .hero__copy { top: auto; bottom: 14.278px; }