.db-animatedtext{display:block;width:100%;max-width:100%;box-sizing:border-box;}
.db-animatedtext__line{
  display:block;width:100%;
  font-size:var(--db-at-font-size, clamp(2rem, 6vw, 4rem));
  line-height:1.15;font-weight:700;letter-spacing:.02em;
  white-space:normal;word-break:break-word;
}

.db-animatedtext__line {
  display: block;        /* nicht auf Inhaltsbreite schrumpfen */
  font-size: var(--db-at-font-size, clamp(2rem, 6vw, 4rem));
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: .02em;
}

/* Token wie gehabt (.token/.letter, Badge-Varianten, Farben) – deine aktuelle Version plus unsere letzten Patches */


.db-animatedtext {
  --db-at-font-size: clamp(2rem, 6vw, 4rem);
  --db-at-text-color: #fff;
  --db-at-bg: var(--bs-primary, #0d6efd);
  --db-at-bg-secondary: var(--bs-secondary, #6c757d);
}

.db-animatedtext__line {
  font-size: var(--db-at-font-size, clamp(2rem, 6vw, 4rem)); /* Fallback */
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: .02em;
  display: inline-block;
}

/* Token-Basis: akzeptiert .token und .letter */
.db-animatedtext__line .token,
.db-animatedtext__line .letter {
  display: inline-block;
  padding: .06em .08em;
  margin: 0; /* nahtloser Hintergrund (keine Lücken) */
  background: transparent;
  transition: background-color .18s linear, color .18s linear, box-shadow .18s linear;
}

/* Badge-Enums */
.db-animatedtext--badge-none .token,
.db-animatedtext--badge-none .letter { border-radius: 0; padding: .04em .06em; }
.db-animatedtext--badge-soft .token,
.db-animatedtext--badge-soft .letter { border-radius: .35em; padding: .08em .12em; }
.db-animatedtext--badge-strong .token,
.db-animatedtext--badge-strong .letter { border-radius: 999px; padding: .12em .18em; box-shadow: 0 0 0 .08em rgba(0,0,0,.06) inset; }

/* Kompatibilität für boolean .is-badge (falls gesetzt) */
.db-animatedtext.is-badge .token,
.db-animatedtext.is-badge .letter { border-radius: .35em; padding: .08em .12em; }

/* Aktivfarben */
.db-animatedtext[data-colormode="primary"].is-inview .token.is-lit,
.db-animatedtext[data-colormode="primary"].is-inview .letter.is-lit {
  background: var(--db-at-bg, var(--bs-primary, #0d6efd));
  color: var(--db-at-text-color, #fff);
}
.db-animatedtext[data-colormode="secondary"].is-inview .token.is-lit,
.db-animatedtext[data-colormode="secondary"].is-inview .letter.is-lit {
  background: var(--db-at-bg-secondary, var(--bs-secondary, #6c757d));
  color: var(--db-at-text-color, #fff);
}
.db-animatedtext[data-colormode="custom"].is-inview .token.is-lit,
.db-animatedtext[data-colormode="custom"].is-inview .letter.is-lit {
  background: var(--db-at-custom, #f8ae20);
  color: var(--db-at-text-color, #fff);
}

/* Token sollen die gleiche „Buchstabenhöhe“ haben */
.db-animatedtext__line .token,
.db-animatedtext__line .letter {
  line-height: 1em;           /* gleiche Höhe wie der Text */
}

/* Spaces: nicht kollabieren, im Zweifel minimale Breite */
.db-animatedtext__line .space {
  white-space: pre;           /* NBSP respektieren */
  min-width: 0.25em;          /* Reserve, falls Fonts schmal rechnen */
}

/* (optional) falls du harte Kanten willst, ohne „Rundungen-Lücke“: */
.db-animatedtext--badge-none .token,
.db-animatedtext--badge-none .letter {
  padding: .04em .06em;       /* bündiger Balken */
  border-radius: 0;
}


@media (prefers-reduced-motion: reduce) {
  .db-animatedtext[data-reduced-motion="1"] .token,
  .db-animatedtext[data-reduced-motion="1"] .letter { transition: none; }
}



.db-animatedtext{display:block;width:100%;max-width:100%;box-sizing:border-box;}
.db-animatedtext__line{
  display:block;width:100%;
  font-size:var(--db-at-font-size, clamp(2rem, 6vw, 4rem));
  line-height:1.15;font-weight:700;letter-spacing:.02em;
  white-space:normal;word-break:break-word;
}
.db-animatedtext__line .token, .db-animatedtext__line .letter{ line-height:1em; }
.db-animatedtext__line .space{ white-space:pre; min-width:.25em; }

/* Heading-Tag-Reset: h1–h6 werden visuell identisch mit dem Inhalt */
.db-animatedtext__heading-tag {
  display: block;
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}