.site-footer.site-footer--common {
  display: block;
  margin-top: 38px;
  padding-top: 22px;
  padding-bottom: 22px;
  border-top: 1px solid var(--footer-border, var(--border, var(--color-border, #30303a)));
  color: var(--footer-soft, var(--soft, var(--color-text-soft, #81818b)));
  font-size: 12px;
  line-height: 1.45;
}

.site-footer--common .site-footer__topline {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 20px;
}

.site-footer--common .site-footer__copyright {
  display: block;
  margin: 0;
}

.site-footer--common .site-footer__links,
.site-footer--common .site-footer__social {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
}

.site-footer--common .site-footer__social {
  align-content: start;
  justify-content: flex-end;
}

.site-footer--common .site-footer__links {
  margin-top: 11px;
}

.site-footer--common .site-footer__site-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  margin-top: 11px;
}

.site-footer--common a {
  color: var(--footer-link, var(--muted, var(--color-text-muted, #adadb6)));
  text-decoration: none;
  text-underline-offset: 3px;
}

.site-footer--common a:hover,
.site-footer--common a:focus-visible {
  color: var(--footer-link-hover, var(--text, var(--color-text, #f4f4f5)));
  text-decoration: underline;
}

.site-footer.site-footer--guide {
  width: min(100% - 40px, 720px);
  margin-right: auto;
  margin-left: auto;
}

@media (max-width: 700px) {
  .site-footer.site-footer--common {
    margin-top: 30px;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .site-footer--common .site-footer__topline { display: block; }
  .site-footer--common .site-footer__social { margin-top: 9px; }
  .site-footer--common .site-footer__links {
    display: grid;
    gap: 7px;
    margin-top: 18px;
  }
  .site-footer--common .site-footer__site-links {
    display: grid;
    gap: 7px;
    margin-top: 18px;
  }
  .site-footer--common .site-footer__social { justify-content: flex-start; }
  .site-footer.site-footer--guide { width: min(100% - 28px, 560px); }
}

@media (max-width: 390px) {
  .site-footer.site-footer--guide { width: min(100% - 24px, 366px); }
}