/*
 * Text zentriert (sitepackage_textcentered, #109 / vinum/gpvs#111)
 *
 * One column of running text, centred on the page at a comfortable reading width
 * (~65-75 characters per line, like the vinum.eu article body). Only the column is centred;
 * the text inside stays left-aligned. Side padding on small screens comes from .container
 * (calc(100% - 40px) below 992px) — nothing extra needed here.
 *
 * Kept out of the compiled main.css (no SCSS sources in the repo) and loaded by the template
 * through the AssetCollector, so it is only shipped on pages that use the element.
 */

.text-centered {
  max-width: 660px;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}

/* Subline + headline: same look and spacing as in Imagetext (.image-text__text) */
.text-centered .super-title p {
  margin: 0;
}
.text-centered h3 {
  margin-bottom: 28px;
}
@media (max-width: 991.98px) {
  .text-centered h3 {
    margin-bottom: 20px;
  }
}
.text-centered .super-title + .text-centered__body {
  margin-top: 28px;
}
@media (max-width: 991.98px) {
  .text-centered .super-title + .text-centered__body {
    margin-top: 20px;
  }
}

/* Running text: the global reset sets p/ul margins to 0 and a tight line height —
   restore a readable rhythm for long text. */
.text-centered__body {
  line-height: 1.5;
  overflow-wrap: break-word;
}
.text-centered__body > * + * {
  margin-top: 1em;
}
.text-centered__body p,
.text-centered__body ul,
.text-centered__body ol {
  margin-bottom: 0;
}
.text-centered__body h2,
.text-centered__body h3,
.text-centered__body h4,
.text-centered__body h5,
.text-centered__body h6 {
  margin-bottom: 0;
}
.text-centered__body > * + h2,
.text-centered__body > * + h3,
.text-centered__body > * + h4,
.text-centered__body > * + h5,
.text-centered__body > * + h6 {
  margin-top: 1.6em;
}
/* Sub-headings inside running text: the global h2/h3 sizes are section titles (up to 42px+)
   and would dwarf the text — scale them to the .title-h4 / .title-h5 steps instead. */
.text-centered__body h2,
.text-centered__body h3 {
  font-size: 26px;
  line-height: 1.15;
  letter-spacing: 0.26px;
}
.text-centered__body h4,
.text-centered__body h5,
.text-centered__body h6 {
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: 0.2px;
}
@media (max-width: 991.98px) {
  .text-centered__body h2,
  .text-centered__body h3 {
    font-size: 22px;
  }
}
@media (max-width: 766.98px) {
  .text-centered__body h2,
  .text-centered__body h3 {
    font-size: 20px;
  }
  .text-centered__body h4,
  .text-centered__body h5,
  .text-centered__body h6 {
    font-size: 18px;
  }
}
.text-centered__body ul {
  list-style: disc;
  padding-left: 1.25em;
}
.text-centered__body ol {
  padding-left: 1.25em;
}
.text-centered__body li + li {
  margin-top: 0.35em;
}
.text-centered__body a {
  text-decoration: underline;
  text-underline-offset: 0.15em;
}
.text-centered__body a:hover,
.text-centered__body a:focus {
  color: var(--color-red);
}
