/* =========================================================
   Title-Segment Styles — kuratierte Palette (Paket 9c)
   ========================================================= */

/* Basis — gilt für alle Segmente */
.tile-title__segment {
  font-size: var(--title-size-default);
}

/* --- Style-Slots (nur Typografie) --- */

/* Slot 1: default — keine Zusatzklasse */

/* Slot 2: large — größer, sonst wie default */
.tile-title__segment--large {
  font-size: var(--title-size-large);
}

/* Slot 3: display — größer, Light */
.tile-title__segment--display {
  font-size: var(--title-size-large);
  font-weight: 300;
}

/* Slot 4: display-emphasis — größer, Light, kursiv */
.tile-title__segment--display-emphasis {
  font-size: var(--title-size-large);
  font-weight: 300;
  font-style: italic;
}

/* Slot 5: script — PinyonScript, eigene Größe */
.tile-title__segment--script {
  font-size: var(--title-size-script);
  font-family: var(--title-font-script);
}

/* --- Farb-Palette (kombinierbar mit jedem Slot) --- */

.tile-title__segment--color-limone     { color: var(--title-color-limone); }
.tile-title__segment--color-jade       { color: var(--title-color-jade); }
.tile-title__segment--color-sand       { color: var(--title-color-sand); }
.tile-title__segment--color-terracotta { color: var(--title-color-terracotta); }
.tile-title__segment--color-olive      { color: var(--title-color-olive); }
.tile-title__segment--color-indigo     { color: var(--title-color-indigo); }
.tile-title__segment--color-lavendel   { color: var(--title-color-lavendel); }
.tile-title__segment--color-kobalt     { color: var(--title-color-kobalt); }

/* --- Umbruch (kombinierbar mit allem) --- */

.tile-title__segment--break-after {
  display: inline;
}
.tile-title__segment--break-after::after {
  content: "";
  display: block;
}