.section-metadata {
  display: none;
}

.section.darkest {
  background-color: rgb(0 0 0);
  color: rgb(255 255 255);
}

.section.dark {
  background-color: rgb(29 29 29);
  color: rgb(255 255 255);
}

.section.light {
  background-color: rgb(255 255 255);
  color: rgb(34 34 34);
}

.section.hide-sticky-section,
.section.close-sticky-section {
  display: none;
}

.section.has-background {
  background-color: unset;
}

.section.xxxl-spacing-static {
  padding: var(--spacing-xxxl-static) 0;
}

.section.xxl-spacing-static {
  padding: var(--spacing-xxl-static) 0;
}

.section.xl-spacing-static {
  padding: var(--spacing-xl-static) 0;
}

.section.xxxl-spacing {
  padding: var(--spacing-xxxl) 0;
}

.section.xxl-spacing {
  padding: var(--spacing-xxl) 0;
}

.section.xl-spacing {
  padding: var(--spacing-xl) 0;
}

.section.l-spacing {
  padding: var(--spacing-l) 0;
}

.section.m-spacing {
  padding: var(--spacing-m) 0;
}

.section.s-spacing {
  padding: var(--spacing-s) 0;
}

.section.xs-spacing {
  padding: var(--spacing-xs) 0;
}

.section.xxs-spacing {
  padding: var(--spacing-xxs) 0;
}

.section picture.section-background {
  display: block;
  position: absolute;
  inset: 0;
  z-index: -1;
}

.section .section-background img {
  object-fit: cover;
  height: 100%;
  width: 100%;
}

.section.center .content > h1,
.section.center .content > h2,
.section.center .content > h3,
.section.center .content > h4,
.section.center .content > h5,
.section.center .content > h6,
.section.center .content > p {
  text-align: center;
}

.section.divider {
  border-bottom: 1px solid #d8d8d8;
}

.section.divider-inherit {
  border-bottom: 1px solid;
}

.section.center[class*='-up'] {
  justify-items: center;
}

.section[class*='-up'].no-gap {
  gap: 0;
}

.section[class*='-up'].xxs-gap {
  gap: var(--spacing-xxs);
}

.section[class*='-up'].xs-gap {
  gap: var(--spacing-xs);
}

.section[class*='-up'].s-gap {
  gap: var(--spacing-s);
}

.section[class*='-up'].l-gap {
  gap: var(--spacing-l);
}

.section[class*='-up'].xl-gap {
  gap: var(--spacing-xl)
}

.section[class*='-up'].xxl-gap {
  gap: var(--spacing-xxl);
}

.section[class*='-up'].xxxl-gap {
  gap: var(--spacing-xxxl);
}

.section.two-up,
.section.three-up,
.section.four-up,
.section.five-up {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(276px, 1fr));
  gap: var(--spacing-m);
  align-items: start;
  padding-left: var(--grid-margins-width);
  padding-right: var(--grid-margins-width);
}

.section.five-up {
  grid-template-columns: repeat(auto-fit, minmax(142px, 1fr));
}

.section.sticky-top {
  position: sticky;
  top: 57px;
  z-index: 1;
  background-color: var(--color-white);
}

.section.sticky-bottom {
  position: sticky;
  bottom: 0;
  z-index: 1;
  background-color: var(--color-white);
}

.section.sticky-bottom.promo-sticky-section {
  background: none;
  z-index: 4;
}

.section[class*='grid-width-'] {
  padding-left: var(--grid-margins-width);
  padding-right: var(--grid-margins-width);
  display: grid;
  gap: var(--spacing-m);
}

.section[class*='grid-width-'] > .content,
main > .section[class*='-up'] > .content {
  max-width: initial;
  margin: 0;
}

@media screen and (min-width: 600px) and (max-width: 1200px) {
  .section.five-up {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }
}

@media screen and (min-width: 720px) {
  .section.grid-width-6 {
    padding-left: calc((100vw - 600px) / 2);
    padding-right: calc((100vw - 600px) / 2);
  }
}

@media screen and (min-width: 920px) {
  .section.grid-width-8 {
    padding-left: calc((100vw - 800px) / 2);
    padding-right: calc((100vw - 800px) / 2);
  }
}

@media (min-width: 900px) {
  .section.sticky-top {
    top: 64px;
  }
}

@media screen and (min-width: 1120px) {
  .section.grid-width-10 {
    padding-left: calc((100vw - 1000px) / 2);
    padding-right: calc((100vw - 1000px) / 2);
  }
}

@media screen and (min-width: 1200px) {
  .section.two-up {
    grid-template-columns: repeat(2, 1fr);
  }

  .section.three-up {
    grid-template-columns: repeat(3, 1fr);
  }

  .section.four-up {
    grid-template-columns: repeat(4, 1fr);
  }

  .section.five-up {
    grid-template-columns: repeat(5, 1fr);
  }

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

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

  .section.grid-template-columns-1-3 {
    grid-template-columns: 1fr 3fr;
  }

  .section.grid-template-columns-3-1 {
    grid-template-columns: 3fr 1fr;
  }
  
  .section.grid-width-6-desktop {
    padding-left: var(--grid-margins-width-6);
    padding-right: var(--grid-margins-width-6);
  }
  
  .section.grid-width-8-desktop {
    padding-left: var(--grid-margins-width-8);
    padding-right: var(--grid-margins-width-8);
  }

  .section.grid-width-10-desktop {
    padding-left: var(--grid-margins-width-10);
    padding-right: var(--grid-margins-width-10);
  }
}