/* The footer wordmark (every main page). Pairs with js/footer-word.v1.js. */
.site-foot--full.has-word{ position: relative; overflow: hidden; }
.site-foot--full.has-word > *:not(.foot-glow){ position: relative; z-index: 1; }

/* a cool glow rising from the bottom of the footer, under everything */
.foot-glow{
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(125% 125% at 50% 10%, transparent 52%, rgba(186,208,255,.13) 100%);
}

/* the word spans the footer and runs off its bottom edge a little */
.foot-word{ margin: 6px auto clamp(-34px, -2.6vw, -10px); max-width: 1280px; }
.foot-word svg{ display: block; width: 100%; height: auto; overflow: visible; user-select: none; -webkit-user-select: none; }
.foot-word text{
  /* Helvetica, as in the original: Inter is a variable font whose letters are built from
     overlapping shapes, and an outline shows every overlap; Helvetica's are clean */
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 700; font-size: 78px; letter-spacing: .01em;
  text-anchor: middle; dominant-baseline: middle;
  fill: transparent; stroke-width: .45;
}
.fw-ghost{ stroke: rgba(255,255,255,.22); opacity: 0; transition: opacity .4s ease; }
.foot-word.is-hover .fw-ghost{ opacity: .7; }
.fw-draw{
  stroke: rgba(186,208,255,.6);
  stroke-dasharray: 1000; stroke-dashoffset: 1000;
}
.foot-word.is-drawn .fw-draw{ stroke-dashoffset: 0; transition: stroke-dashoffset 4s cubic-bezier(.65,0,.35,1); }
.fw-tint{ stroke: url(#fw-tint); stroke-width: 1.1; }

@media (prefers-reduced-motion: reduce){
  .fw-draw{ stroke-dashoffset: 0; }
  .foot-word.is-drawn .fw-draw{ transition: none; }
}
