/**
 * @file
 * Grid system definition for the footer top and footer bottom layouts.
 */

/*
 * Media query breakpoints.
 * Processed by postcss/postcss-custom-media.
 */

/* Navigation related breakpoints */

/* Grid related breakpoints */

/* Grid shifts from 6 to 14 columns. */

/* Width of the entire grid maxes out. */

/**
 * Creates stacking context ensuring that child elements can never appear in
 * front of mobile navigation.
 */

.site-footer {
  position: relative;
  z-index: 1;
}

.site-footer__inner {
  margin-inline: auto;
  padding-block: var(--sp2);
}

@media (min-width: 1200px) {

.site-footer__inner {
    padding-block: var(--sp4) var(--sp4);
}
  }

.site-footer__columns {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp3);
  padding-block-end: var(--sp3);
}

@media (min-width: 768px) {

.site-footer__columns {
    grid-template-columns: 2fr 1fr 1fr 1fr;
}
  }

.site-footer__col .block h2,
    .site-footer__col .block h3 {
      font-size: var(--font-size-base);
      font-weight: 700;
      margin-block-end: var(--sp);
      color: var(--color--white);
    }

.site-footer__col .block .menu,
    .site-footer__col .block ul {
      margin: 0;
      padding: 0;
      list-style: none;
    }

:is(.site-footer__col .block .menu,.site-footer__col .block ul) li {
        margin-block-end: var(--sp0-5);
      }

.site-footer__bottom-bar {
  border-block-start: 1px solid var(--color--gray-25);
  padding-block-start: var(--sp2);
  margin-block-start: var(--sp);
}

@media (min-width: 768px) {

.site-footer__bottom-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
  }