/* Match the supplied footer, starting with its mobile composition. */
.site-footer {
  --ariel-bg: var(--brand-surface);
  --ariel-fg: var(--brand-foreground);
  --ariel-primary: var(--brand-accent);
  --ariel-muted: var(--brand-muted);
  --ariel-divider: var(--brand-divider);
  --ariel-font: var(--font-interface);
  --footer-lead: #b5bdc7;
  --footer-fine-print: #8290a5;
  --footer-back-link: #e7be9f;
  padding-block: 4.6875rem 1.375rem;
  background: var(--ariel-bg);
  color: var(--ariel-fg);
  font-family: var(--ariel-font);
  line-height: normal;
}

.site-footer__container {
  inline-size: min(100% - clamp(1.875rem, 7.7vi, 2.5rem), 82.5rem);
  padding-inline: 0;
}

.site-footer__top {
  --ariel-gap: 2.75rem;
  grid-template-columns: minmax(0, 1fr);
  padding-block-end: 2.8125rem;
}

.site-footer__lead p {
  margin-block: 1.5rem;
  color: var(--footer-lead);
  font-family: var(--font-editorial);
  font-size: 1.1875rem;
  font-weight: 500;
  font-style: italic;
  line-height: 1.65;
}

.site-footer__menu {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.1875rem 1.375rem;
}

.site-footer__group,
.site-footer__links {
  --ariel-gap: 0.875rem;
}

.site-footer__group h2 {
  margin: 0.375rem 0 0.75rem;
  color: var(--ariel-primary);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  line-height: normal;
}

.site-footer__links {
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-footer__links li {
  font-size: 0.6875rem;
  line-height: 1.4;
}

.site-footer__links a {
  color: var(--ariel-muted);
}

.site-footer__links a:hover {
  color: var(--ariel-fg);
}

.site-footer :focus-visible {
  outline-color: var(--ariel-primary);
}

.site-footer__bottom {
  --ariel-gap: 0.875rem;
  justify-content: space-between;
  padding-block-start: 1.4375rem;
  border-block-start: 1px solid var(--ariel-divider);
  color: var(--footer-fine-print);
  font-size: 0.625rem;
}

.site-footer__sal {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-block-end: 2rem;
}

.site-footer__sal a {
  display: block;
  flex: 0 1 250px;
  max-inline-size: 100%;
  line-height: 0;
}

.site-footer__sal img {
  display: block;
  inline-size: 100%;
  block-size: auto;
  aspect-ratio: 5 / 1;
}

.site-footer__sal a:focus-visible {
  outline: 2px solid var(--ariel-primary);
  outline-offset: 6px;
}

.site-footer__copyright,
.site-footer__back {
  white-space: nowrap;
}

.site-footer__back {
  color: var(--footer-back-link);
}

@media (min-width: 64rem) {
  .site-footer {
    padding-block-start: 5.75rem;
  }

  .site-footer__container {
    inline-size: min(100% - 6rem, 82.5rem);
  }

  .site-footer__top {
    --ariel-gap: 5rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
    padding-block-end: 5.3125rem;
  }

  .site-footer__menu {
    --ariel-gap: 2.375rem;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.3fr) minmax(0, 1fr);
    gap: var(--ariel-gap);
  }

  .site-footer__bottom {
    --ariel-gap: 1.25rem;
    flex-wrap: nowrap;
  }
}
