/* The footer, on every page. Pure black, one quiet line that fades at both ends, and the links set like the small
   labels on the GoFundMe page: spaced capitals with the same small dot between them. Nothing here depends on wall.css. */
:root { --foot-h: 88px; }
.foot { padding: 0 max(20px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(20px, env(safe-area-inset-left)); background: #000; }
.foot::before { content: ""; display: block; height: 1px; background: linear-gradient(90deg, #000, #262626 22%, #262626 78%, #000); }
.foot-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0 38px; min-height: var(--foot-h); }
.foot-links .linklike {
  position: relative; padding: 15px 0; border: 0; background: none; cursor: pointer;
  font: 400 12.5px / 1.5 "Inter Tight", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; letter-spacing: 0.18em; text-transform: uppercase; text-decoration: none; white-space: nowrap;
  color: #8A8A8A; transition: color 0.4s cubic-bezier(0.45, 0, 0.55, 1);
}
.foot-links .linklike + .linklike::before { content: ""; position: absolute; top: 50%; left: -21px; width: 3px; height: 3px; margin-top: -1.5px; border-radius: 50%; background: #4D4D4D; }
.foot-links .linklike:hover, .foot-links [aria-current] { color: #FFF; }
.foot-links .linklike:focus-visible { outline: 2px solid #FFF; outline-offset: 2px; }
@media (max-width: 599px) {
  :root { --foot-h: 76px; }
  .foot-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
  .foot-links .linklike { display: grid; align-items: center; min-height: 44px; padding: 8px 4px; font-size: 11px; letter-spacing: 0.12em; text-align: center; white-space: normal; }
  .foot-links .linklike + .linklike::before { left: -1.5px; }
}
