.footer {
  background-color: var(--primary-custom-color);

  .footer-wrapper {
    width: 100%;
    padding: 32px 24px;
    display: flex;
    align-items: center;

    .brand {
      margin: 0;
      padding: 0;

      & > span {
        font-weight: 700;
        font-size: 28px;
        text-transform: uppercase;
        letter-spacing: 1px;
        color: var(--secondary-custom-color);
        font-family: 'Anticva Regular';
      }
    }

    .socials {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 36px;

      .telegram, .pinterest, .mail {
        cursor: pointer;

        svg {
          height: 32px;
          width: 32px;
          fill: var(--secondary-custom-color);
        }

        &:hover {
          svg {
            fill: var(--secondary-custom-color);
          }
        }
      }
    }

    .up-button {
      display: flex;
      justify-content: end;
    }
  }
}