/* Link-Hover als Welle (25.10.2026). Jonah: „coolere Link hoveranimationen in der nav und im footer … vielleicht so eine meereswelle“. Aus drei
   Fassungen gewählt: Kopfleiste A (Welle unter dem Wort, verfeinert: „zu statisch … kommt so aus dem Nichts und ist links und rechts abgeschnitten“),
   im Fuß eine Fläche in Sonne in Pixelstufen (aus „orange hinterlegt“; Wellengang der Buchstaben und glatter Balken fielen durch); C raus.
   Die Welle der Kopfleiste zeichnet quelle/links.js als SVG-Pfad.
   Ohne feinen Zeiger nichts davon; bei reduzierter Bewegung nur Linie und Farbe ohne Lauf. */
.lw { position: relative; display: inline-block; }

/* ---------- Kopfleiste: Welle unter dem Wort ---------- */
.lw-welle { position: absolute; left: -4px; bottom: -10px; width: calc(100% + 8px); height: 12px; overflow: visible; pointer-events: none; }
.lw-welle path { fill: none; stroke: var(--sonne); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
html.hell .lw-welle path { stroke: var(--sonne-700); }

/* ---------- Fuß: hinter dem Wort füllt sich eine Fläche in Sonne in Pixelstufen von links und läuft nach rechts wieder hinaus, die Schrift wird Nacht
   (Jonah 25.10.: „Ladebalken als Pixel … sehr, sehr gut … minimal abgerundet“). Die Zellen zeichnet quelle/pixel.js auf .lw-pixel. */
.fuss .fuss-link { isolation: isolate; transition: color .25s var(--aus); }
.fuss .fuss-link::after { display: none; }   /* die Linie unter den Links weicht der Fläche */
.lw-pixel { position: absolute; left: -5px; top: 0; z-index: -1; width: calc(100% + 10px); height: 100%; border-radius: 2px; pointer-events: none; }
@media (hover: hover) and (pointer: fine) {
  .fuss .fuss-link:hover { color: #0c0908; transition: color .2s var(--aus) .08s; }
}
