/*----------------------------------------------*\
    BLOCK - Body Text
	=================

	@package substance

\*----------------------------------------------*/
/*----------------------------------------------*\
    COMPONENTS
	==========

	@package substance

\*----------------------------------------------*/
/*
 *
 * ANCHOR Variables
 * /
------------------------------------------------*/
/* Breakpoints */
/* Responsive type multipliers */
/* Type sizes */
/* See https://type-scale.com */
/* Minor third from here */
/* Major third from here */
/* Max-widths */
/*
 *
 * ANCHOR Mixins
 * /
------------------------------------------------*/
.body-text {
  padding: 0 var(--page-padding);
}
.page .body-text { /* if used on pages (vs article) */
  max-width: var(--max-width-text);
  margin: 0 auto;
  padding-left: var(--size-300);
  /* the following counteracts weird things happening with .article-text-block__wrapper */
}
@media screen and (min-width: 24rem) {
  .page .body-text {
    padding-right: 0;
  }
}
@media screen and (min-width: 34rem) {
  .page .body-text {
    padding-left: 0;
  }
}
.body-text__wrapper {
  /* fix breaks in reallly long words or URLs */
  overflow-wrap: break-word;
  word-wrap: break-word;
  word-break: break-word;
}
.body-text__wrapper > * {
  font-size: calc(var(--size-400) * 1.15); /* multiply because serif renders smaller than sans */
  font-family: var(--font-text);
  line-height: 1.6;
  max-width: 56ch;
  margin-bottom: 0.9em;
}
.body-text__wrapper > *:last-child {
  margin-bottom: 0;
}
.logged-in .body-text__wrapper div { /* Admin messages for <div> tags that shouldn't be used */ }
.logged-in .body-text__wrapper div:before, .logged-in .body-text__wrapper div:after {
  background-color: yellow;
  font-family: var(--font-ui);
  font-weight: bold;
  padding: 0.25em;
}
.logged-in .body-text__wrapper div:before {
  content: "DELETE IMPROPER <div> TAG HERE";
}
.logged-in .body-text__wrapper div:after {
  content: "DELETE IMPROPER </div> TAG HERE";
}
.body-text h2 {
  font-family: var(--font-ui);
  font-weight: bold;
  font-size: var(--size-600);
  margin-top: var(--size-500);
  line-height: 1.2;
}
.body-text h3 {
  font-family: var(--font-ui);
  font-weight: bold;
  font-size: var(--size-500);
  margin-top: var(--size-500);
  line-height: 1.2;
}
.body-text h2 + h3 {
  margin-top: 0;
}
.body-text ul {
  list-style: disc outside;
  padding-left: var(--size-500);
}
.body-text ul li {
  margin-bottom: var(--size-100);
}
.body-text blockquote {
  font-size: calc(var(--size-300) * 1.15);
  padding-left: var(--size-700);
  padding-right: var(--size-700);
  line-height: 1.6;
  max-width: 65ch;
}
.body-text blockquote > * {
  margin-bottom: 0.9em;
}

.footnote__reference {
  font-family: var(--font-ui);
  font-size: 0.6em;
  vertical-align: 0.5em;
  padding: 0.25em 0.25em 0.25em 0.1em;
  font-weight: bold;
  color: var(--color-accent);
}
.footnote__reference:focus {
  outline: 0;
}
.footnote__reference:focus-visible {
  outline: solid 2px var(--color-accent-glare);
}
.footnote__text {
  display: none;
  font-size: 1rem;
  gap: var(--size-600);
  margin-bottom: var(--size-400);
  margin-top: var(--size-200);
  color: var(--color-accent);
  font-family: var(--font-ui);
  line-height: 1.5;
}
@media print {
  .footnote__text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
.footnote--expand .footnote__text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.footnote__text__number {
  font-size: var(--size-200);
}
.footnote__text__text {
  font-size: var(--size-200);
  max-width: 70ch;
}
/*----------------------------------------------*\
    BLOCK - Image
	==============

	@package substance

\*----------------------------------------------*/
/*----------------------------------------------*\
    COMPONENTS
	==========

	@package substance

\*----------------------------------------------*/
/*
 *
 * ANCHOR Variables
 * /
------------------------------------------------*/
/* Breakpoints */
/* Responsive type multipliers */
/* Type sizes */
/* See https://type-scale.com */
/* Minor third from here */
/* Major third from here */
/* Max-widths */
/*
 *
 * ANCHOR Mixins
 * /
------------------------------------------------*/
@media screen and (min-width: 34rem) {
  .image--span-text {
    padding: 0 var(--page-padding);
  }
}
.image--span-content {
  grid-column: 2/4 !important; /* overwrite default in pages */
}
@media screen and (min-width: 34rem) {
  .image--span-content {
    padding: 0 var(--page-padding);
  }
}
.image--span-full {
  grid-column: 1/5 !important; /* overwrite default in pages */
  padding: 0;
}
@media screen and (min-width: 44rem) {
  .image--span-full.image--single {
    display: grid;
    grid-template-columns: subgrid;
  }
  .image--span-full.image--single .image__image {
    display: contents;
  }
  .image--span-full.image--single img {
    grid-column: 1/5;
  }
  .image--span-full.image--single .image__caption {
    grid-column: 2/3;
    margin-top: 0;
  }
}
@media screen and (min-width: 44rem) {
  .image--widths-equal {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--size-300);
  }
}
@media screen and (min-width: 44rem) {
  .image--widths-emphasize-left {
    display: grid;
    grid-template-columns: 5fr 3fr;
    gap: var(--size-300);
  }
}
@media screen and (min-width: 44rem) {
  .image--widths-emphasize-right {
    display: grid;
    grid-template-columns: 3fr 5fr;
    gap: var(--size-300);
  }
}
.image--extra-space-above {
  margin-top: var(--vertical-article-space);
}
.image--extra-space-below {
  margin-bottom: var(--vertical-article-space);
}
.image__image img {
  display: block;
  margin-top: var(--vertical-article-space);
  width: 100%;
}
@media screen and (min-width: 44rem) {
  .block:not(.image) + .image .image__image img {
    margin-top: 0;
  }
}
.block:not(.image) + .image .image__image:first-child img { /* The first image in an image block following any block (expect another image block) */
  margin-top: 0;
}
.image:has(.image__image--has-caption) + .block:not(.image) { /* Every block (expect image block) following an image block with captions */
  margin-top: var(--vertical-article-space);
}
@media screen and (min-width: 44rem) {
  .image--multiple + .block:not(.image) { /* Every block (expect image block) following an image block with more than one image*/
    margin-top: var(--vertical-article-space);
  }
  .image--multiple {
    margin-top: var(--vertical-article-space); /* Every image block that has two images */
  }
  .image--multiple + .image--multiple { /* Image block that immediately follows another Image block */
    margin-top: 0;
  }
}
.image__caption {
  margin-top: var(--size-200);
  padding: 0 var(--page-padding);
}
@media screen and (min-width: 34rem) {
  .image__caption {
    padding: 0;
  }
}
.image--span-full .image__caption {
  padding: 0 var(--page-padding);
}
.image__caption p {
  font-size: var(--size-300);
  margin-top: var(--size-200);
  max-width: 60ch;
  line-height: 1.4;
}
/*----------------------------------------------*\
    BLOCK - Body Text
	=================

	@package substance

\*----------------------------------------------*/
/*----------------------------------------------*\
    COMPONENTS
	==========

	@package substance

\*----------------------------------------------*/
/*
 *
 * ANCHOR Variables
 * /
------------------------------------------------*/
/* Breakpoints */
/* Responsive type multipliers */
/* Type sizes */
/* See https://type-scale.com */
/* Minor third from here */
/* Major third from here */
/* Max-widths */
/*
 *
 * ANCHOR Mixins
 * /
------------------------------------------------*/
.code {
  padding: 0 var(--page-padding);
}