/* Footer as end titles: a closing FIN. */

/* FIN: oversized closing word, full glyphs (no cut: on bare text it only slices letters). On entry the word
   rises inside its cut like a title card, then flickers once like a projector;
   while the footer stays visible it flickers again now and then. */
#subfooter .footer-fin{width:auto;border:0;padding:0;position:relative;margin:56px 0 0;text-align:center;font-size:clamp(120px,22vw,320px);line-height:1.12;font-weight:300;letter-spacing:-.03em;color:var(--ink);overflow:hidden;user-select:none}
.footer-fin>span{display:block}
.site-footer.will-roll .footer-fin>span{transform:translateY(105%)}
.site-footer.is-rolling .footer-fin>span{animation:sv-fin-rise 1100ms cubic-bezier(.16,1,.3,1) 120ms both}
.site-footer.is-rolling .footer-fin{animation:sv-fin-flicker 900ms linear 1150ms both}
.site-footer .footer-fin.is-flickering{animation:sv-fin-flicker-again 900ms linear both}
@keyframes sv-fin-rise{from{transform:translateY(105%)}to{transform:translateY(0)}}
@keyframes sv-fin-flicker{0%,100%{opacity:1}6%{opacity:.35}10%{opacity:1}24%{opacity:.75}27%{opacity:1}52%{opacity:.88}55%{opacity:1}}
@keyframes sv-fin-flicker-again{0%,100%{opacity:1}6%{opacity:.35}10%{opacity:1}24%{opacity:.75}27%{opacity:1}52%{opacity:.88}55%{opacity:1}}

#footer.site-footer #subfooter .footer-bottom{margin-top:8px}
#footer.site-footer{padding-bottom:44px}

@media(max-width:760px){
#subfooter .footer-fin{font-size:clamp(76px,26vw,128px);margin:40px 0 0}
#footer.site-footer{padding-bottom:28px}
}

@media(prefers-reduced-motion:reduce){
.site-footer.will-roll .footer-fin>span{transform:none}
.site-footer.is-rolling .footer-fin>span,.site-footer.is-rolling .footer-fin,.site-footer .footer-fin.is-flickering{animation:none}
}

/* Covers the sub-pixel sliver below the footer so no white line shows at the very bottom. */
#footer.site-footer{box-shadow:0 2px 0 #f1f4ea}
.footer-since{white-space:nowrap}
@media(max-width:760px){.footer-since{display:block;margin-top:2px}.footer-since-sep{display:none}}