/* Clarity – News-Teaser (draggo_clarity_newsteaser) */
.cl-newsteaser { box-sizing: border-box; max-width: 1400px; margin-left: auto; margin-right: auto; padding: 20px; }
.cl-newsteaser__grid { display: grid; grid-template-columns: repeat(var(--clnt-cols, 3), minmax(0, 1fr)); gap: 10px; align-items: stretch; }
.cl-newsteaser__card { display: flex; min-width: 0; margin: 0; padding: 0 10px; background: #fff; }
.cl-newsteaser__box { display: flex; flex-direction: column; box-sizing: border-box; width: 100%; padding: 10px; border-radius: 8px; box-shadow: 0 0 5px 2px rgba(0, 0, 0, .22); }
.cl-newsteaser__image { margin: 0; }
.cl-newsteaser__image a { display: block; }
.cl-newsteaser__image img { display: block; width: 100%; max-width: none; height: auto; aspect-ratio: var(--clnt-ratio, 407 / 271); object-fit: cover; border-radius: 8px 8px 0 0; }
.cl-newsteaser__body { display: flex; flex: 1 1 auto; flex-direction: column; align-items: stretch; padding: 30px 10px 46px; }
.cl-newsteaser__meta { display: flex; flex-wrap: wrap; column-gap: 12px; margin: 0; padding: 0; list-style: none; color: #54595f; font-family: var(--cl-sans); font-size: 16px; line-height: 26px; font-weight: 400; }
.cl-newsteaser__meta li { margin: 0; padding: 0; color: inherit; font: inherit; list-style: none; }
.cl-newsteaser__meta li::before { content: none; }
.cl-newsteaser__meta li + li::before { content: "|"; margin-right: 12px; }
.cl-newsteaser__title { margin: 24px 0 0; color: #000; font-family: var(--cl-display); font-size: 18px; line-height: 18px; font-weight: 500; overflow-wrap: break-word; }
.cl-newsteaser__meta + .cl-newsteaser__title, .cl-newsteaser__body > .cl-newsteaser__title:first-child { margin-top: 24px; }
.cl-newsteaser__title a { color: inherit; font: inherit; text-decoration: none; transition: color .3s; }
.cl-newsteaser__title a:hover, .cl-newsteaser__title a:focus-visible { color: #e10419; }
.cl-newsteaser__teaser { margin-top: 16px; color: #686868; font-family: var(--cl-sans); font-size: 16px; line-height: 26px; }
.cl-newsteaser__teaser p { margin: 0 0 10px; color: inherit; font: inherit; }
.cl-newsteaser__teaser p:last-child { margin-bottom: 0; }
.cl-newsteaser__action { margin-top: auto; padding-top: 24px; }
.cl-newsteaser__btn { display: inline-block; padding: 12px 24px; border-radius: 3px; background: #e10419; color: #fff; font-family: var(--cl-display); font-size: 18px; line-height: 18px; font-weight: 500; text-align: center; text-decoration: none; transition: transform .3s, box-shadow .5s; }
.cl-newsteaser__btn:hover, .cl-newsteaser__btn:focus-visible { transform: scale(1.1); box-shadow: 0 0 10px 0 #f00; color: #fff; }
.cl-newsteaser__empty { margin: 0; color: #686868; font-family: var(--cl-sans); font-size: 18px; line-height: 26px; text-align: center; }

/* Editor-Arbeitsfläche: Draggos Standard-Typografie (h1–h6, p, ul) überstimmen */
.draggo-canvas .cl-newsteaser .cl-newsteaser__meta { margin: 0; padding: 0; list-style: none; color: #54595f; font-family: var(--cl-sans); font-size: 16px; line-height: 26px; font-weight: 400; }
.draggo-canvas .cl-newsteaser .cl-newsteaser__meta li { margin: 0; padding: 0; color: inherit; font: inherit; }
.draggo-canvas .cl-newsteaser .cl-newsteaser__title { margin: 24px 0 0; color: #000; font-family: var(--cl-display); font-size: 18px; line-height: 18px; font-weight: 500; }
.draggo-canvas .cl-newsteaser .cl-newsteaser__title a { color: inherit; text-decoration: none; }
.draggo-canvas .cl-newsteaser .cl-newsteaser__title a:hover { color: #e10419; }
.draggo-canvas .cl-newsteaser .cl-newsteaser__teaser p { margin: 0 0 10px; color: #686868; font-family: var(--cl-sans); font-size: 16px; line-height: 26px; }
.draggo-canvas .cl-newsteaser .cl-newsteaser__btn { color: #fff; font-family: var(--cl-display); font-size: 18px; line-height: 18px; font-weight: 500; text-decoration: none; }
.draggo-canvas .cl-newsteaser .cl-newsteaser__empty { margin: 0; color: #686868; font-family: var(--cl-sans); font-size: 18px; line-height: 26px; }

@media (max-width: 991px) {
    .cl-newsteaser__grid { grid-template-columns: repeat(var(--clnt-cols-t, 1), minmax(0, 1fr)); gap: 20px; }
}
@media (max-width: 767px) {
    .cl-newsteaser { padding: 20px 30px; }
    .cl-newsteaser__grid { grid-template-columns: repeat(var(--clnt-cols-m, 1), minmax(0, 1fr)); }
}