/* Clarity – Parallax-/Claim-Band (draggo_clarity_claim) */
.cl-claim.cl-sec { display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; min-height: 420px; }
.cl-claim--align-center .cl-claim__inner { text-align: center; }
.cl-claim .cl-claim__line { margin: 0; font-family: var(--cl-display); font-size: 80px; line-height: 1.05; font-weight: 600; letter-spacing: 0; text-transform: uppercase; color: var(--cl-head); overflow-wrap: break-word; }
.cl-claim--kontur .cl-claim__line { color: transparent; -webkit-text-stroke: 2px var(--cl-head); }
@supports not (-webkit-text-stroke: 1px #000) { .cl-claim--kontur .cl-claim__line { color: var(--cl-head); } }
.cl-claim .cl-claim__sub { margin: 18px 0 0; font-family: var(--cl-display); font-size: 28px; line-height: 1.3; font-weight: 500; color: #e10419; }
.cl-claim--shade-red .cl-claim__sub, .cl-claim.cl-sec--red .cl-claim__sub { color: #fff; }
.cl-claim .cl-claim__text { margin-top: 20px; }

/* Abdunklung über dem Bild: navy bzw. rot mit 60 % */
.cl-claim.cl-sec--has-bg:is(.cl-sec--image-dark, .cl-sec--navy)::before { background: rgba(1, 3, 23, .6); }
.cl-claim--shade-red.cl-sec--has-bg:is(.cl-sec--image-dark, .cl-sec--navy, .cl-sec--red)::before { background: linear-gradient(135deg, rgba(225, 4, 25, .6), rgba(143, 8, 21, .6)); }
.cl-claim--shade-red.cl-sec--image-dark:not(.cl-sec--has-bg) { background-color: #e10419; background-image: linear-gradient(135deg, #e10419, #8f0815); }

/* Laufband: Hauptzeile läuft endlos quer, jede zweite Kopie als Kontur */
.cl-claim__marquee { width: 100%; overflow: hidden; }
.cl-claim__track { display: flex; width: max-content; animation: clcm-marquee 38s linear infinite; }
.cl-claim__marquee:hover .cl-claim__track { animation-play-state: paused; }
.cl-claim__group { display: flex; flex-shrink: 0; align-items: center; }
.cl-claim__marquee .cl-claim__line { display: flex; align-items: center; white-space: nowrap; }
.cl-claim__marquee .cl-claim__line::after { content: ""; flex: 0 0 auto; width: 16px; height: 16px; margin: 0 48px; border-radius: 50%; background: #e10419; }
.cl-claim--shade-red .cl-claim__marquee .cl-claim__line::after { background: #fff; }
.cl-claim__group > :nth-child(even) { color: transparent; -webkit-text-stroke: 2px var(--cl-head); }
.cl-claim--laufband .cl-claim__sub { margin-top: 24px; }
@keyframes clcm-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.draggo-canvas .cl-claim .cl-claim__line { font-family: var(--cl-display); font-size: 80px; line-height: 1.05; font-weight: 600; text-transform: uppercase; color: var(--cl-head); }
.draggo-canvas .cl-claim--kontur .cl-claim__line, .draggo-canvas .cl-claim__group > :nth-child(even) { color: transparent; }
.draggo-canvas .cl-claim .cl-claim__sub { font-family: var(--cl-display); font-size: 28px; line-height: 1.3; font-weight: 500; color: #e10419; }
.draggo-canvas .cl-claim--shade-red .cl-claim__sub, .draggo-canvas .cl-claim.cl-sec--red .cl-claim__sub { color: #fff; }
.draggo-canvas .cl-claim__track { animation: none; }

@media (max-width: 1199px) {
    .cl-claim .cl-claim__line, .draggo-canvas .cl-claim .cl-claim__line { font-size: 64px; }
}
@media (max-width: 767px) {
    .cl-claim.cl-sec { min-height: 280px; }
    /* lange Einzelwörter („ZUKUNFTSSICHER.“, „RESPONSIBILITY“) müssen in 350 px passen */
    .cl-claim .cl-claim__line, .draggo-canvas .cl-claim .cl-claim__line { font-size: clamp(22px, 7vw, 36px); line-height: 1.1; overflow-wrap: anywhere; -webkit-hyphens: manual; hyphens: manual; }
    .cl-claim__group > * { min-width: 0; }
    .cl-claim--kontur .cl-claim__line { -webkit-text-stroke-width: 1.5px; }
    .cl-claim .cl-claim__sub, .draggo-canvas .cl-claim .cl-claim__sub { font-size: 20px; }
    /* kein Laufband auf Mobil: nur die echte Überschrift, umbrechend */
    .cl-claim__track { width: auto; animation: none; }
    .cl-claim__group { flex: 1 1 auto; padding-inline: 20px; }
    .cl-claim__group[aria-hidden], .cl-claim__marquee .cl-claim__line.cl-claim__copy { display: none; }
    .cl-claim__marquee .cl-claim__line { display: block; white-space: normal; }
    .cl-claim__marquee .cl-claim__line::after { content: none; }
    .cl-claim--align-center .cl-claim__group { justify-content: center; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
    .cl-claim__track { animation: none; }
}
