/**
 * Abbreviations:
 * - fd: From Design. (This is an exact value directly measured in the design file provided by the web designer.)
 */
/**
 * Colors
 */
/**
 * Layout
 */
/**
 * Borders and layout spacing.
 */
/**
 * Text and fixed-size perceivable elements.
 */
/**
 * Transitions.
 */
/**
 * Functions.
 */
.glide.-bullets > .glide__bullets {
  --gap: 64px;
}

.std-layout.-sl-rows-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.std-mosaic-list:not(.-twoperrow):not(.-oneperrow):not(.-many) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.std-mosaic-list.-many {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.site-section-beginners > .std-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.site-section-beginners > .std-layout > .std-layout {
  flex: 1 1 0;
  padding-block: var(--gap-xl);
}
.site-section-beginners > .std-layout > .std-layout.-intro {
  padding-right: 30%;
  background: no-repeat url("barney-transparent.svg") right/contain;
}
.site-section-beginners > .std-layout > .std-layout.-links {
  background: no-repeat url("munition-transparent.svg") 90% calc(3 * var(--gap)), no-repeat url("grenade-transparent.svg") right var(--gap);
}