/**
 * agenic Komponenten-CSS – ag-text-sweep (Utility-Klasse, ohne Widget-Bindung).
 *
 * Der agenic-Verlauf gleitet von rechts nach links über den Text und bleibt
 * als Textfarbe stehen (Stil „Einfärben", abgedunkelt). Der Sweep wiederholt
 * sich alle 16 s und startet bei Hover neu (text-sweep.js). Entscheidungen
 * Vincent, 19./20.08.2026 (Prototyp ag-text-sweep-prototyp.html, Vorschlag B).
 *
 * Anwendung in Elementor: Klasse `ag-text-sweep` in „Erweitert → CSS-Klassen"
 * auf ein beliebiges Textelement (z. B. .ag-text-block__title,
 * .ag-footer__claim). Start setzt text-sweep.js über die Zustandsklasse
 * `is-inview` (Auslösepunkt 86 %, wie reveal.js / Figma 0.7).
 *
 * Farbe: Paint Style „Fusion | Gradients/fusion-basic--40" = fusion-basic
 * + Schwarz 40 %. In tokens.css existiert nur --gradient-fusion-basic; die
 * 40-%-Abdunklung wird hier als zweite Hintergrundebene komponiert (tmp;
 * Token-Vorschlag: --gradient-fusion-basic-40 in tokens.css, analog
 * --gradient-fusion-basic-reverse-30 — nur nach Absprache anlegen).
 *
 * Ohne JS oder ohne background-clip-Unterstützung passiert nichts — der Text
 * behält seine normale Farbe und bleibt lesbar.
 */

.ag-text-sweep {
    /* L3 mit L2-Defaults */
    --ag-text-sweep-gradient: var(--gradient-fusion-basic);
    --ag-text-sweep-overlay: rgba(0, 0, 0, .4); /* tmp — Schwarzanteil aus fusion-basic--40 */
    --ag-text-sweep-ease: var(--motion-ease-standard);
    /* Langsamer Zyklus: Wiederholung alle 16 s (Entscheidung Vincent
       20.08.2026, „langsamer Zyklus" — löst die 8 s vom selben Tag ab).
       Die Leiter kennt keine 16000 ms — freier Wert, tmp. Der Sweep selbst
       belegt die ersten 10 % des Zyklus (= 1600 ms, --motion-duration-2xl;
       das Verhältnis steckt in den Keyframes), danach steht der Verlauf
       bis zum nächsten Durchlauf. */
    --ag-text-sweep-zyklus: 16000ms; /* tmp */
}

@supports ( -webkit-background-clip: text ) or ( background-clip: text ) {

    .ag-text-sweep.is-inview {
        background-image:
            linear-gradient( var(--ag-text-sweep-overlay), var(--ag-text-sweep-overlay) ),
            var(--ag-text-sweep-gradient);
        background-size: 200% 100%;
        background-position: 100% 0;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
        animation: ag-text-sweep-run
            var(--ag-text-sweep-zyklus) var(--ag-text-sweep-ease) infinite;
    }

    /* Elementor-Editor: kein Ablauf, Endzustand steht sofort
       (Muster aus dem cta-band-Pilot: keine Einblendungen im Editor). */
    body.elementor-editor-active .ag-text-sweep.is-inview {
        animation: none;
        background-position: 0 0;
    }

    /* Reduzierte Motion: keine Bewegung, Endzustand (Verlauf) steht sofort. */
    @media ( prefers-reduced-motion: reduce ) {
        .ag-text-sweep.is-inview {
            animation: none;
            background-position: 0 0;
        }
    }
}

/* Sweep in den ersten 10 % (1600 ms bei 16-s-Zyklus), danach Halten;
   der Zyklusneustart ist der gewollte Wiederholungs-Sweep. */
@keyframes ag-text-sweep-run {
    0%   { background-position: 100% 0; }
    10%  { background-position: 0 0; }
    100% { background-position: 0 0; }
}

/* ══ WCAG 2.2.2: Sweep anhaltbar ══════════════════════════════════════════
   Auftrag Vincent, 12.09.2026. Quelle wie in animated-gradient.css:
   Entscheidung Vincent 01.08.2026, Regal shelf/ambient-loops auf 0.7
   (1248:239).

   Grenzfall, ausdruecklich anzumerken: Der Sweep wandert eine Farbe ueber
   Text, er verschiebt nichts. Ob 2.2.2 das als „moving" erfasst, ist
   Auslegungssache. Der Zyklus ist mit 16 s klar ueber der 5-s-Grenze, und
   ein angehaltener Sweep steht auf seinem Endzustand (voller Verlauf) —
   der Text bleibt also in jedem Fall lesbar. Deshalb umgesetzt. */

html.ag-anim-ready .ag-text-sweep.is-inview:hover,
html.ag-anim-ready .ag-text-sweep.is-inview:focus-within {
    animation-play-state: paused;
}
