/* =====================================================================
   FAZA 2 · RUCH
   Animacja ma tu jedno zadanie: prowadzić wzrok w dół strony i nagradzać
   uwagę. Nic nie miga, nic nie skacze, nic nie opóźnia czytania.

   Reguły warsztatowe:
     • animujemy wyłącznie transform i opacity (bez przeliczania układu),
     • wejście trwa 0,7 s, mikrointerakcja 0,25 s,
     • kaskada między elementami to 60 ms, maksymalnie 8 kroków,
     • przy prefers-reduced-motion cały ruch znika, treść zostaje.
   ===================================================================== */

:root{
  --r-wejscie:.72s;
  --r-mikro:.28s;
  --r-krok:60ms;
}

/* ── wejście elementów w kadr ───────────────────────────────────────── */
/* Klasę `c-ruch` nadaje skrypt dopiero wtedy, gdy ma czym animować.
   Bez niej nic nie jest ukrywane — brak JS, stara przeglądarka albo błąd
   w skrypcie nie mogą sprawić, że treść zostanie niewidoczna. */
@media (prefers-reduced-motion:no-preference){

  .c-ruch [data-c-reveal]{
    opacity:0;
    transform:translate3d(0,22px,0);
    transition:
      opacity var(--r-wejscie) var(--c-ex) var(--r-op,0ms),
      transform var(--r-wejscie) var(--c-ex) var(--r-op,0ms);
    will-change:opacity,transform;
  }
  .c-ruch [data-c-reveal="lewo"] {transform:translate3d(-26px,0,0)}
  .c-ruch [data-c-reveal="prawo"]{transform:translate3d(26px,0,0)}
  .c-ruch [data-c-reveal="skala"]{transform:scale(.965);opacity:0}
  .c-ruch [data-c-reveal].c-widoczne{
    opacity:1;transform:none;will-change:auto;
  }

  /* kaskada — indeks ustawia skrypt jako --i */
  .c-ruch [data-c-reveal]{--r-op:calc(var(--i,0) * var(--r-krok))}

  /* odsłona kadru: obraz wychodzi zza krawędzi */
  .c-frame,.wpis_polecane_element_top,.faq-contact__img,
  section.trust:not(.c-opinie) .trust_container_right img{
    clip-path:inset(0 0 0 0);
  }
  .c-ruch .c-odslona{
    clip-path:inset(0 0 100% 0);
    transition:clip-path 1s var(--c-ex) var(--r-op,0ms);
  }
  .c-ruch .c-odslona.c-widoczne{clip-path:inset(0 0 0 0)}
}

/* ── pasek postępu czytania ─────────────────────────────────────────── */
.c-postep{
  position:fixed;inset:0 0 auto 0;height:2px;z-index:120;
  background:linear-gradient(90deg,var(--c-gold-lo),var(--c-gold),var(--c-gold-hi));
  transform:scaleX(var(--c-postep,0));transform-origin:0 50%;
  pointer-events:none;
}

/* ── przycisk: złote wypełnienie przesuwa się spod kursora ──────────── */
.btn,.button,button,input[type=submit],.wpcf7-submit,
[class*="__btn"]:not(.menu-btn__burger):not([class*="__btn-container"]),
.akcja_analiza,.faq_cta{
  position:relative;overflow:hidden;isolation:isolate;
  transition:color var(--r-mikro) var(--c-ex),
             background-color var(--r-mikro) var(--c-ex),
             transform var(--r-mikro) var(--c-qt)!important;
}
.btn::before,.button::before,.wpcf7-submit::before,
[class*="__btn"]:not(.menu-btn__burger):not([class*="__btn-container"])::before,
.akcja_analiza::before,.faq_cta::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:var(--c-ink);
  transform:scaleY(0);transform-origin:50% 100%;
  transition:transform .42s var(--c-ex);
}
.btn:hover::before,.button:hover::before,.wpcf7-submit:hover::before,
[class*="__btn"]:not(.menu-btn__burger):not([class*="__btn-container"]):hover::before,
.akcja_analiza:hover::before{transform:scaleY(1)}
.faq_cta:hover::before{background:var(--c-gold);transform:scaleY(1)}
.btn:active,.button:active,.akcja_analiza:active,
[class*="__btn"]:not(.menu-btn__burger):not([class*="__btn-container"]):active{
  transform:translateY(1px) scale(.995)!important;
}

/* przyciąganie kursora — skrypt podaje przesunięcie w zmiennych */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .c-magnes{transition:transform .35s var(--c-qt)}
  .c-magnes.c-magnes--zlapany{transition:transform .12s linear}
}

/* ── cicha odnośnikowa kreska ───────────────────────────────────────── */
.c-link-quiet,.trust__paragraph a,.faq_edytor a{
  position:relative;border-bottom:0!important;text-decoration:none!important;
}
.c-link-quiet::after,.trust__paragraph a::after,.faq_edytor a::after{
  content:"";position:absolute;inset:auto 0 -.28em 0;height:1px;
  background:currentColor;opacity:.45;
  transform:scaleX(1);transform-origin:100% 50%;
  transition:transform .42s var(--c-ex),opacity .42s var(--c-ex);
}
.c-link-quiet:hover::after,.trust__paragraph a:hover::after,.faq_edytor a:hover::after{
  opacity:1;transform-origin:0 50%;
}
@media (prefers-reduced-motion:no-preference){
  .c-link-quiet:hover::after,.trust__paragraph a:hover::after{
    animation:c-kreska .62s var(--c-ex);
  }
  @keyframes c-kreska{
    0%  {transform:scaleX(1);transform-origin:100% 50%}
    49% {transform:scaleX(0);transform-origin:100% 50%}
    51% {transform:scaleX(0);transform-origin:0 50%}
    100%{transform:scaleX(1);transform-origin:0 50%}
  }
}

/* ── liczniki: podczas zliczania cyfry nie mogą przeskakiwać ────────── */
.c-stat__num,.c-tick b,.c-ledger dd{
  font-variant-numeric:tabular-nums lining-nums;
  display:inline-block;
}

/* ── wiersze repertorium wchodzą kaskadą ────────────────────────────── */
@media (prefers-reduced-motion:no-preference){
  .nowewyroki_lista .filterDiv{
    transition:background .35s var(--c-ex),transform .35s var(--c-ex);
  }
  .nowewyroki_lista .filterDiv:hover{transform:translateX(4px)}
  .c-ledger__i,.c-tick,.c-stat,.c-wsp,.c-gwar__box{
    transition:background .5s var(--c-ex),transform .5s var(--c-ex);
  }
  .c-banki__cell img{transition:filter .5s var(--c-ex),opacity .5s var(--c-ex),transform .5s var(--c-ex)}
  .c-banki__cell:hover img{transform:scale(1.05)}
}

/* ── kadry: powolne zbliżenie przy najechaniu ───────────────────────── */
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .c-frame{overflow:hidden}
  .c-frame img{transition:transform 1.2s var(--c-ex)}
  .c-frame:hover img{transform:scale(1.035)}
}

/* ── hero: warstwa fotografii przesuwa się wolniej niż tekst ────────── */
@media (prefers-reduced-motion:no-preference){
  .c-hero__art{transform:translate3d(0,var(--c-paralaksa,0px),0)}
}

/* ── wyłącznik ──────────────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important;
  }
  [data-c-reveal],.c-odslona{opacity:1!important;transform:none!important;clip-path:none!important}
  .c-postep{display:none}
}
