.page-footer {
  text-align: center;
  max-width: var(--page--max-width);
  margin: 0 auto;
  padding: 1rem;

  .social-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    font-size: 1.5rem;

    a {
      padding: 0.5rem 0.5rem 0.25rem 0.5rem;
      color: var(--color-fg);
      border-radius: 5px;
      &:hover {
        background-color: var(--color-bg--layer-01);
      }
    }
  }

  .heart {
    color: var(--color-red);
  }
}