/*
 * The footer every layout ends with (shared/_footer): the copyright and four
 * quiet links, centred, wrapping on a phone.
 */
@layer components {
  .footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: var(--space-2xs) var(--space-lg);
    padding: var(--space-2xl) var(--gutter);
    border-block-start: var(--rule-width) solid var(--color-rule);
    color: var(--color-ink-muted);
    font-size: var(--text-ui-sm);

    & a {
      display: inline-flex;
      align-items: center;
      min-block-size: var(--target-min);
    }
  }
}