.view.view-frontpage.view-id-frontpage {
  margin-block: 3rem;
}

.site-main:has(:not(view.view-frontpage.view-id-frontpage)) {
  .path-frontpage .site-footer {
    box-shadow: 0 -200px 0 var(--neutral-dark);
  }
}

.site-footer {
  padding: 4rem 0;
  color: var(--text-on-neutral-dark);
  background-color: var(--neutral-dark);

  .text-content a,
  a {
    color: var(--text-on-neutral-dark-secondary);

    &:hover,
    &:focus {
      color: var(--text-on-neutral-dark-primary);
    }
  }

  .menu--footer {
    @container style(--md: true) {
      grid-row: 1 / span 4; /*  Ensure that it always takes up entire column. */
      grid-column: 2 / -2;
    }

    @container style(--lg: true) {
      grid-column: 1 / 10;
    }

    @container style(--grid-max: true) {
      grid-column: 2 / 10;
    }
  }

  .block-footer {
    margin-bottom: 0;

    @container style(--md: true) {
      grid-column: 2 / -2;
    }

    @container style(--lg: true) {
      grid-column: 11 / -1;
    }

    @container style(--grid-max: true) {
      grid-column: 11 / -2;
    }
  }

  .menu--sites-from-years-past {
    @container style(--md: true) {
      grid-column: 2 / -2;
    }

    @container style(--lg: true) {
      grid-column: 11 / -1;
    }

    @container style(--grid-max: true) {
      grid-column: 11 / -2;
    }
  }

  @container style(--lg: true) {
    padding: 6rem 0;
  }

  @container style(--grid-max: true) {
    padding: 6rem 0;
  }
}

.block-footer .text-content {
  font-size: 1rem;
}

/*  Social */

.block-footer__social {
  margin: var(--sp2) 0;
}

.block-footer__social-menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 1.25rem;
}

.block-footer__social-menu-link[class] {
  color: var(--text-on-neutral-dark-secondary);

  &[href*='facebook'] svg {
    width: 1.1875rem;
  }

  svg {
    width: 1.875rem;
    max-height: 1.875rem;
  }

  path {
    fill: currentColor;
  }
}