/* Closing footer used on every page. Replaces the old single-line "Say
   hi." headline with a tiny manifesto + invite + social links. The
   donkey still roams this section and chases the cursor when it's
   nearby (bottom-anchored, see below). */

.say-hi {
  position: relative;
  min-height: 70vh;
  /* 40 vh of breathing room below the paragraph — the donkey roams
     in this empty space and the page closes with a quiet exhale
     rather than abruptly ending. Top padding stays modest so the
     paragraph sits high in its block. */
  padding: 96px var(--pad) 40vh;
  margin-top: 80px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
  overflow: hidden;
}

/* Footer prose — same font / size / weight / letter-spacing as the
   hero copy (.hero-c). Roman by default; only the inline links pick
   up italic, matching the live-data sentence in the hero. */
.say-hi-line {
  font-family: 'Edict Display', Georgia, serif;
  font-weight: 300;
  font-style: normal;
  font-size: clamp(32px, 4.4vw, 64px);
  line-height: 1.15;
  letter-spacing: 0.002em;
  color: var(--ink);
  margin: 0;
  max-width: 960px;
  padding: 0 2rem;
}
/* Kept in case future drafts split back into multiple paragraphs. */
.say-hi-line + .say-hi-line {
  margin-top: 0.9em;
}

/* Per-character spans inside the footer copy — created at runtime by
   donkey.js so the donkey's proximity can blur the text he passes
   over. Each char is inline-block so it can take a transform/filter.
   To keep words from breaking mid-letter (the browser treats each
   inline-block as its own break opportunity), consecutive chars get
   grouped into a .say-hi-word wrapper that's itself inline-block +
   nowrap. So lines break BETWEEN words, never inside them. */
.say-hi-word {
  display: inline-block;
  white-space: nowrap;
}
.say-hi-c {
  display: inline-block;
  /* will-change is a perf hint — keeps the browser from re-creating
     the layer every time the donkey walks past. */
  will-change: transform, filter;
}

/* Inline social + email links — italic + underlined, matching the
   .hero-link convention (underline fades to transparent on hover so
   the cursor effect can read through). */
.say-hi-link {
  color: inherit;
  font-style: italic;
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.16em;
  text-decoration-color: currentColor;
  cursor: pointer;
  transition: text-decoration-color 280ms ease;
}
.say-hi-link:hover,
.say-hi-link:focus-visible {
  text-decoration-color: transparent;
  outline: none;
}

/* The donkey, when active inside .say-hi, uses absolute positioning
   anchored to the footer bottom (overrides the default fixed-to-
   viewport position). */
.say-hi .donkey {
  position: absolute;
  bottom: 24px;
  z-index: 5;
}