/* scroll motion 2: headings and story lines rise word by word from behind a mask as they come into view */
.rise .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.rise .w>span{display:inline-block;transform:translateY(110%);transition:transform .9s cubic-bezier(.23,1,.32,1);transition-delay:calc(var(--i)*55ms)}
.rise.in .w>span{transform:none}

/* scroll motion 4: big outline "Ninth Harbor" that fills with navy as you scroll (white at night) */
.namefill{padding:clamp(70px,12vw,150px) var(--pad);text-align:center;overflow:hidden}
.namefill__t{font:700 clamp(64px,15vw,220px)/.9 "Bricolage",sans-serif;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:2px var(--ink);
 background:linear-gradient(90deg,var(--ink) 0 50%,transparent 50% 100%);background-size:200% 100%;background-position:calc(100% - var(--p,0)*100%) 0;-webkit-background-clip:text;background-clip:text}
@media (prefers-reduced-motion:reduce){.rise .w>span{transform:none;transition:none}.namefill__t{color:var(--ink);-webkit-text-stroke:0}}