/* core/_footer.html — divintech.es footer: light band with the funding
   statement and logos, then a dark bar with copyright + legal links. The
   language switcher lives in the dark bar too. */

.site-footer__funding {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-4) var(--space-3) var(--space-3);
  background: var(--color-footer-bg);
  color: var(--color-text);
  text-align: center;
}

.site-footer__funding-text {
  max-width: 62rem;
  margin: 0;
}

.site-footer__funding-logos {
  display: block;
  width: min(100%, 32.5rem);
  height: auto;
}

.site-footer__bar {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3);
  background: var(--color-subfooter-bg);
  color: var(--color-subfooter-text);
  text-align: center;
}

.site-footer__bar a {
  color: var(--color-subfooter-text);
  text-decoration: none;
}

.site-footer__bar a:hover {
  text-decoration: underline;
}

/* The blue ring would vanish on the dark bar. */
.site-footer__bar :focus-visible {
  outline-color: var(--color-subfooter-text);
}

.site-footer__copy {
  margin: 0;
}

.site-footer__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.25rem 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-footer__links a {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap-size);
  padding-inline: 0.75rem;
}

/* Separators as borders, not "|" characters that screen readers read out. */
.site-footer__links li + li {
  border-left: 1px solid currentColor;
}

.lang-switch {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem 1rem;
}

.lang-switch__label {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-weight: 600;
}

.lang-switch__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lang-switch__btn {
  min-width: var(--tap-size);
  min-height: var(--tap-size);
  padding: 0.4rem 1rem;
  border: 1px solid currentColor;
  border-radius: 999px;
  background: transparent;
  color: var(--color-subfooter-text);
  font: inherit;
  cursor: pointer;
}

.lang-switch__btn:hover {
  background: var(--color-subfooter-hover);
}

.lang-switch__btn[aria-pressed="true"] {
  background: var(--color-subfooter-text);
  color: var(--color-subfooter-bg);
  font-weight: 700;
}