/* Nur Startseite. Zwei feste Verläufe lassen sich über Deckkraft überblenden. */
.hero--einstieg .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));
}
html[data-ton="hell"] .hero--einstieg .schleier { --fw-farbe: var(--fw-hell); }
html[data-farbwechsel="weich"] .hero--einstieg .schleier { background: none; transition: none; }
html[data-farbwechsel="weich"] .hero--einstieg .schleier::before,
html[data-farbwechsel="weich"] .hero--einstieg .schleier::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(to top, var(--fw-farbe) 0%, var(--fw-farbe) var(--fw-plateau), var(--fw-transparent) var(--fw-unten)),
    linear-gradient(to bottom, var(--fw-farbe) 0%, var(--fw-transparent) var(--fw-oben));
  transition: opacity var(--fw-dauer) var(--fw-kurve);
}
html[data-farbwechsel="weich"] .hero--einstieg .schleier::before {
  --fw-farbe: var(--fw-dunkel); --fw-transparent: rgba(0, 0, 0, 0); opacity: 1;
}
html[data-farbwechsel="weich"] .hero--einstieg .schleier::after {
  --fw-farbe: var(--fw-hell); --fw-transparent: rgba(255, 255, 255, 0); opacity: 0;
}
html[data-farbwechsel="weich"][data-ton="hell"] .hero--einstieg .schleier::before { opacity: 0; }
html[data-farbwechsel="weich"][data-ton="hell"] .hero--einstieg .schleier::after { opacity: 1; }
html[data-farbwechsel="weich"] .hero--einstieg { transition: color var(--fw-dauer) var(--fw-kurve); }
html[data-farbwechsel="weich"] .hero__inhalt--start .t1,
html[data-farbwechsel="weich"] .hero__inhalt--start .sy {
  transition: color var(--fw-dauer) var(--fw-kurve), -webkit-text-stroke-color var(--fw-dauer) var(--fw-kurve);
}