/* Fade the actual content to the existing atmosphere, rather than putting a
   frosted or solid-colour band over it. Navigation and menus sit outside it. */
.page-home.home-header-fade #main-content {
  --home-fade-ramp: clamp(64px, 9vh, 104px);
  --home-header-mask: linear-gradient(to bottom,
    transparent var(--home-fade-y),
    rgb(0 0 0 / .12) calc(var(--home-fade-y) + var(--home-fade-ramp) * .25),
    rgb(0 0 0 / .5) calc(var(--home-fade-y) + var(--home-fade-ramp) * .5),
    rgb(0 0 0 / .88) calc(var(--home-fade-y) + var(--home-fade-ramp) * .75),
    #000 calc(var(--home-fade-y) + var(--home-fade-ramp)));
  -webkit-mask-image: var(--home-header-mask);
  mask-image: var(--home-header-mask);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.page-home.home-header-fade .header-overlap-blur { display: none; }

/* justify-self does not centre a constrained block in older iPhone Safari.
   Auto margins do, without changing the editor's authored text alignment. */
.page-home .home-sections .story-copy :is(h1, h4) {
  box-sizing: border-box;
  margin-inline: auto;
}