/* ==== NEU: Shimmer-Variablen (hell/dunkel) ==== */
:root {
  --skel-base: hsl(0 0% 92%);
  --skel-highlight: hsl(0 0% 98%);
  --skel-angle: 100deg;
  /* Diagonalwinkel */
  --skel-speed: 1.1s;
}

@media (prefers-color-scheme: dark) {
  :root {
    --skel-base: rgba(0, 0, 0, .05);
    --skel-highlight: rgba(0, 0, 0, .1);
  }
}
/* ==== NEU: Keyframes + Mixin ==== */
@keyframes skel-shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}
.content_fnr_quality_marks {
  background-color: var(--background-default-primary);
  padding-block: var(--margin-padding-container-margin-updown);
}
.content_fnr_quality_marks[data-background=gray] {
  background-color: var(--background-default-secondary);
}
.content_fnr_quality_marks .quality-marks-list {
  padding-block: var(--margin-padding-container-row-gap);
}
.content_fnr_quality_marks .quality-marks-list > .row {
  gap: var(--margin-padding-row-gutter) 0;
  text-align: start;
}
.content_fnr_quality_marks .quality-marks-list .qualitymark-image {
  overflow: hidden;
}
.content_fnr_quality_marks .quality-marks-list .qualitymark-image img {
  transition: 0.3s;
}
.content_fnr_quality_marks .quality-marks-list .qualitymark-image:hover img {
  transform: scale(1.04);
}
.content_fnr_quality_marks .quality-marks-list .skeleton .qualitymark-image {
  background: linear-gradient(var(--skel-angle), var(--skel-highlight) 8%, var(--skel-base) 18%, var(--skel-highlight) 33%);
  background-size: 200% 100%;
  animation: skel-shimmer var(--skel-speed) ease-in-out infinite;
  aspect-ratio: 343/257;
  overflow: hidden;
}
.content_fnr_quality_marks .quality-marks-list .skeleton .qualitymark-content .qualitymark-title {
  min-height: 22px;
  width: 80%;
  margin-bottom: var(--paragraph-spacing-h4-bottom);
  background: linear-gradient(var(--skel-angle), var(--skel-highlight) 8%, var(--skel-base) 18%, var(--skel-highlight) 33%);
  background-size: 200% 100%;
  animation: skel-shimmer var(--skel-speed) ease-in-out infinite;
}
.content_fnr_quality_marks .quality-marks-list .skeleton .qualitymark-content .qualitymark-description {
  min-height: 44px;
  width: 100%;
  background: linear-gradient(var(--skel-angle), var(--skel-highlight) 8%, var(--skel-base) 18%, var(--skel-highlight) 33%);
  background-size: 200% 100%;
  animation: skel-shimmer var(--skel-speed) ease-in-out infinite;
}
.content_fnr_quality_marks .quality-marks-list .qualitymark-content {
  padding-block: var(--margin-padding-general-2);
}
.content_fnr_quality_marks .quality-marks-list .qualitymark-content h6 {
  margin-bottom: var(--paragraph-spacing-h4-bottom);
  position: relative;
  padding-right: 38px;
  display: block;
}
.content_fnr_quality_marks .quality-marks-list .qualitymark-content p {
  margin: 0;
}
