@layer components {
  .site-footer {
    padding: var(--block-space) 0;
    color: var(--color-ink-light);
    font-size: var(--text-footnote);
  }

  .site-footer .footer-separator {
    margin: 0 var(--inline-space);
  }

  .site-footer a {
    color: var(--color-ink-light);

    &:hover {
      color: var(--color-link);
    }
  }
}