.footer {
  padding-block: 2rem;
  border-block-start: 1px solid var(--nnw-border, #e3e5e8);
  color: var(--nnw-muted, #7e6870);
}

.footer__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: start;
  gap: 1.5rem;
  justify-content: space-between;
  max-inline-size: var(--nnw-width, 76rem);
  margin-inline: auto;
  padding-inline: var(--nnw-gutter, 1.5rem);
}

.footer__brand {
  font-weight: 700;
  color: var(--nnw-text, #241a1d);
}

.footer__lines,
.footer__links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer__links a,
.footer__lines li,
.footer__tagline {
  color: inherit;
}

.footer__links a {
  color: var(--nnw-primary, #8e2035);
  text-decoration: none;
}

/* Hover and focus */
.footer__links a:focus-visible {
  color: color-mix(in srgb, var(--nnw-primary, #8e2035) 78%, black);
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  .footer__links a:hover {
    color: color-mix(in srgb, var(--nnw-primary, #8e2035) 78%, black);
    text-decoration: underline;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .footer__links a {
    transition-property: background-color, border-color, box-shadow, color, transform;
    transition-duration: var(--nnw-duration, 160ms);
    transition-timing-function: var(--nnw-ease-out, cubic-bezier(0.23, 1, 0.32, 1));
  }
}