/* ============================================================
   cd_artikeltext — ruhige Lesespalte fuer Blogbeitraege
   ============================================================ */

.cd-bahn.cd-artikeltext {
  padding-block: 0;
  background: var(--cd-weiss);
}

.cd-artikeltext__spalte {
  max-inline-size: 780px;
  margin-inline: auto;
  padding-block: clamp(2.4rem, 5vw, 4.5rem);
  border-block-start: 1px solid var(--cd-linie-2);
}

.cd-hero + .cd-artikeltext .cd-artikeltext__spalte {
  border-block-start: 0;
}

.cd-artikeltext__titel {
  max-inline-size: 24ch;
  margin-block-end: var(--cd-a5);
  font-size: var(--cd-gr-h3);
}

.cd-artikeltext__text {
  font-size: clamp(1rem, .96rem + .18vw, 1.125rem);
  line-height: 1.75;
  color: var(--cd-text-2);
}

.cd-artikeltext__text > * + * {
  margin-block-start: var(--cd-a4);
}

.cd-artikeltext__text ul,
.cd-artikeltext__text ol {
  display: grid;
  gap: var(--cd-a3);
  max-inline-size: 68ch;
  padding-inline-start: 1.25em;
}

.cd-artikeltext__text ul { list-style: disc; }
.cd-artikeltext__text ol { list-style: decimal; }

.cd-artikeltext__text li::marker {
  color: var(--cd-rot);
  font-weight: 700;
}

.cd-artikeltext__text a {
  color: var(--cd-rot);
  text-decoration-thickness: .08em;
  text-underline-offset: .18em;
}

.cd-artikeltext__text a:hover {
  color: var(--cd-tinte);
}

.cd-artikeltext__bild {
  margin-block: var(--cd-a7) 0;
}

.cd-artikeltext__bildDatei {
  display: block;
  inline-size: 100%;
  block-size: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--cd-r-karte);
}

.cd-artikeltext__bildhinweis {
  margin-block-start: var(--cd-a2);
  font-family: var(--cd-schrift-mono);
  font-size: var(--cd-gr-mikro);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--cd-text-3);
}


/* ------------------------------------------------------------
   Lange Woerter in Ueberschriften
   ------------------------------------------------------------
   "Verbraucherstreitbeilegung/Universalschlichtungsstelle" ist ein
   Wort und passt in keine Lesespalte. Ohne Regel laeuft es aus der
   Spalte heraus und schiebt am Handy die ganze Seite in die Breite.

   hyphens zuerst — es trennt an sinnvollen Stellen und braucht dafuer
   die Sprachangabe am Dokument. overflow-wrap ist das Netz fuer den
   Fall, dass der Browser kein Trennmuster kennt: es bricht dann hart,
   aber es bricht.
   ------------------------------------------------------------ */
.cd-artikeltext__text :is(h2, h3, h4) {
  hyphens: auto;
  overflow-wrap: break-word;
}

/* ------------------------------------------------------------
   Schalter fuer die Matomo-Statistik in der Cookie-Richtlinie
   ------------------------------------------------------------
   Erzeugt von cookie.js (matomoSchalter) aus einem Absatz mit der
   Klasse cd-matomo-optout. Ohne Skript bleibt der Absatz als
   gewoehnlicher Text stehen - deshalb gilt die Gestaltung erst mit
   --bereit. Seit 10.09.2026.
   ------------------------------------------------------------ */
.cd-matomo-optout--bereit {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--cd-a3) var(--cd-a5);
  padding: var(--cd-a4) var(--cd-a5);
  border-inline-start: 3px solid var(--cd-rot);
  background: var(--cd-flaeche-2);
}
.cd-matomo-optout__stand { margin: 0; }