/* ============================================================
   RANDORI-PRO · Grappling (High End) · Motion-Layer (CSS)
   Additive Politur. Teilt [data-rv]/js-motion mit bold-v3.css.
   Grundzustand IMMER vollständig sichtbar (kein JS / reduced):
   das Schach-Brett ist gezeichnet, Knoten gefüllt.
   Aktiv ausschließlich unter body.bv3.grap. Respektiert
   prefers-reduced-motion.
   ============================================================ */

:root { --grap-ease-calm: cubic-bezier(0.22, 0.61, 0.36, 1); }

@media (prefers-reduced-motion: no-preference) {

  /* Reveals (Muster wie bold-v3) */
  .bv3.grap [data-rv] { opacity: 0; transform: translateY(24px); transition: opacity 450ms var(--grap-ease-calm), transform 450ms var(--grap-ease-calm); }
  .bv3.grap [data-rv].is-in { opacity: 1; transform: translateY(0); }

  /* Kicker-Linie zeichnet sich beim Reveal */
  .bv3.grap [data-rv] .b-kicker::before, .bv3.grap [data-rv].b-kicker::before { width: 0; transition: width 450ms var(--grap-ease-calm) 150ms; }
  .bv3.grap [data-rv].is-in .b-kicker::before, .bv3.grap [data-rv].is-in.b-kicker::before { width: 40px; }

  /* Hero-Entrance */
  .bv3.grap .grap-hero .b-kicker { animation: grap-rise 900ms var(--grap-ease-calm) 150ms backwards; }
  .bv3.grap .grap-hero__h1 { animation: grap-rise 1000ms var(--grap-ease-calm) 280ms backwards; }
  .bv3.grap .grap-hero__sub, .bv3.grap .grap-hero__cta { animation: grap-rise 1000ms var(--grap-ease-calm) 440ms backwards; }
  .bv3.grap .grap-hero__trust { animation: grap-fade 1000ms var(--ease-standard) 700ms backwards; }
  .bv3.grap .grap-hero__bg { animation: grap-fade 1400ms var(--ease-standard) backwards; }
  @keyframes grap-rise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes grap-fade { from { opacity: 0; } to { opacity: 1; } }

  /* ── SIGNATUR · BODENKAMPF ALS SCHACH ────────────────────────
     JS setzt body.js-motion + .is-lit auf .grap-chess, sobald das
     Brett sichtbar ist. Verbindungen zeichnen sich entlang ihres
     Pfads nach (stroke-dashoffset, JS-gesteuert), Knoten setzen
     sich danach. Ruhig, cerebral getaktet. */

  /* Verbindungslinien · Startzustand verdeckt, JS zeichnet nach */
  .bv3.grap.js-motion .grap-board__line { transition: stroke-dashoffset 1100ms var(--grap-ease-calm); }

  /* Knoten setzen sich nacheinander (klein → voll); Reihenfolge via --nd */
  .bv3.grap.js-motion .grap-node { opacity: 0; transform: translate(-50%,-50%) scale(0.6); transition: opacity 520ms var(--grap-ease-calm), transform 560ms cubic-bezier(0.34,1.56,0.64,1); }
  .bv3.grap.js-motion .grap-chess.is-lit .grap-node { opacity: 1; transform: translate(-50%,-50%) scale(1); transition-delay: var(--nd, 0ms); }

  /* Übergangs-Labels folgen den Linien */
  .bv3.grap.js-motion .grap-edge-label { opacity: 0; transition: opacity 700ms var(--ease-standard); }
  .bv3.grap.js-motion .grap-chess.is-lit .grap-edge-label { opacity: 1; transition-delay: 1300ms; }

  /* Count-up · „über/rund"-Präfix folgt der Zahl */
  .bv3.grap [data-rv] .grap-stat__n .pre { opacity: 0; transition: opacity 700ms var(--ease-standard) 900ms; }
  .bv3.grap [data-rv].is-in .grap-stat__n .pre { opacity: 1; }
}
