/* Gemeinsame Parameter wie auf der Startseite; der Ton stammt aus dem Titelband. */
.titelband .schleier {
  --fw-farbe: var(--fw-dunkel);
  background: linear-gradient(to top, var(--fw-farbe) 0%, var(--fw-farbe) var(--fw-plateau), var(--v1) var(--fw-unten)),
    linear-gradient(to bottom, var(--fw-farbe) 0%, var(--v1) var(--fw-oben));
}
.titelband[data-ton="hell"] .schleier { --fw-farbe: var(--fw-hell); }
html[data-farbwechsel="weich"] .titelband .schleier { background: none; transition: none; }
html[data-farbwechsel="weich"] .titelband .schleier::before,
html[data-farbwechsel="weich"] .titelband .schleier::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, var(--fw-farbe) 0%, var(--fw-farbe) var(--fw-plateau), transparent var(--fw-unten)),
    linear-gradient(to bottom, var(--fw-farbe) 0%, transparent var(--fw-oben));
  transition: opacity var(--fw-dauer) var(--fw-kurve);
}
html[data-farbwechsel="weich"] .titelband .schleier::before { --fw-farbe: var(--fw-dunkel); opacity: 1; }
html[data-farbwechsel="weich"] .titelband .schleier::after { --fw-farbe: var(--fw-hell); opacity: 0; }
html[data-farbwechsel="weich"] .titelband[data-ton="hell"] .schleier::before { opacity: 0; }
html[data-farbwechsel="weich"] .titelband[data-ton="hell"] .schleier::after { opacity: 1; }
html[data-farbwechsel="weich"] .titelband { transition: color var(--fw-dauer) var(--fw-kurve); }
@media (prefers-reduced-motion: reduce) {
  .titelband, .titelband .schleier, .titelband .schleier::before, .titelband .schleier::after { transition: none !important; }
}
