/* Business Resilience Update · Verblassende Beitragsbilder auf Teaser-Kacheln
   Das JS (cards.js) verschiebt das vorhandene Beitragsbild der Kachel in eine
   Hintergrundebene (.br-card-bg). Diese Regeln blenden es nach unten aus,
   damit die Typografie im unteren Kachelbereich voll lesbar bleibt.

   Aktivierung: Kachel-Element mit  data-br-fade  oder Klasse  .br-fade
   versehen (oder Selektoren per Filter 'bru_fade_selectors' ergänzen).
   Helle Kacheln zusätzlich mit  .br-fade--light  markieren. */

.br-has-bg{position:relative;overflow:clip}
.br-has-bg > *:not(.br-card-bg){position:relative;z-index:1}
.br-card-bg{position:absolute;inset:0;z-index:0;width:100%;height:100%;
  object-fit:cover;object-position:center top;pointer-events:none;
  opacity:var(--br-fade-opacity,.34);filter:saturate(.85);
  -webkit-mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.5) 42%,transparent 78%);
  mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.5) 42%,transparent 78%);
  transition:transform .7s cubic-bezier(.22,.61,.2,1),opacity .5s cubic-bezier(.22,.61,.2,1)}
.br-has-bg:hover .br-card-bg{transform:scale(1.045);opacity:calc(var(--br-fade-opacity,.34) + .08)}

/* Helle Kacheln: Bild darf präsenter sein, Text ist dunkel */
.br-fade--light{--br-fade-opacity:.5}
.br-fade--light .br-card-bg{filter:saturate(.8)}

/* Das ursprüngliche Bild-Element der Kachel wird ausgeblendet,
   sobald die Hintergrundebene existiert */
.br-src-hidden{display:none!important}

@media (prefers-reduced-motion:reduce){
  .br-card-bg{transition:none}
  .br-has-bg:hover .br-card-bg{transform:none}
}
