/* Shared footer: whole-pixel Bayer dots, quiet type, and room for future links. */
.site-footer {
  position: relative;
  isolation: isolate;
  margin-inline: calc(-1 * clamp(16px, 4vw, 48px));
  padding: 0 clamp(16px, 4vw, 48px);
  border-top: 1px solid var(--line);
  color: var(--fg-2);
}
.site-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: url(/footer-bg.png) center bottom / 2880px 720px no-repeat;
  image-rendering: pixelated;
  mask-image: linear-gradient(to bottom, transparent, #000 75%);
}
.footer-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(12rem, 1fr);
  gap: 48px;
  min-height: 320px;
  padding-block: 64px 80px;
}
.site-footer .brand { color: var(--fg); }
.site-footer .brand svg { width: 28px; height: 28px; }
.footer-about p { max-width: 23rem; margin: 28px 0 0; font: 400 1.05rem/1.8 var(--body); text-wrap: pretty; }
.footer-links { justify-self: end; width: min(100%, 16rem); }
.footer-label { margin: 0 0 28px; color: var(--fg-3); font: 400 0.72rem/1.5 var(--mono); letter-spacing: 0.14em; text-transform: uppercase; }
.footer-links a { display: block; width: fit-content; padding-block: 6px; color: var(--fg-2); font: 400 1.05rem/1.6 var(--body); text-decoration: none; }
.footer-links a:hover { color: var(--fg); text-decoration: underline; text-underline-offset: 5px; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px 32px; border-top: 1px solid var(--line); padding-block: 24px 32px; color: var(--fg-3); font: 400 0.7rem/1.7 var(--mono); }
.footer-bottom p { margin: 0; }
.footer-meta { letter-spacing: 0.08em; text-transform: uppercase; }
@media (max-width: 520px) {
  .footer-main { grid-template-columns: minmax(0, 1fr); gap: 40px; padding-block: 48px 56px; }
  .footer-links { justify-self: start; }
  .footer-label { margin-bottom: 12px; }
  .footer-bottom { flex-direction: column; gap: 12px; }
}