.app-footer {
  --footer-section-border-top-color: #394853;
  --footer-section-top-bg-color: #2f424d;
  --footer-background-color: #24323a;
  --link-color: var(--color-brand);
  --gutter: var(--space-m);
  --repel-vertical-alignment: stretch;

  background-color: var(--footer-background-color);
  color: var(--color-light);
  font-weight: var(--font-light);

  > * + * {
    border-top: 1px solid var(--footer-section-border-top-color);
  }

  .wrapper {
    padding-block: 2.25rem;
  }

  .footer--hire-us {
    background-color: var(--footer-section-top-bg-color);
  }

  .footer--contact-social ul.footer--social {
    display: flex;
    gap: 0.5rem;
    list-style: none;
    padding: 0;

    a[href] {
      color: var(--footer-section-border-top-color);
      font-size: 2rem;
      transition: color 0.2s;

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

  .footer--acknowledge {
    font-size: var(--size-step--1);
  }
}

footer ul.footer--navigation {
  text-align: center;
  padding-left: 0;

  > li {
    display: inline-block;
    float: left;
    margin: 0 1rem 0 0;

    a {
      display: block;
      padding: 0;
    }
  }
}