/* Pojawianie (tk-pojaw) i pisanie (tk-pisz) - pisanie.js. Do startu wszystko zajmuje swoje miejsce,
   więc strona nie skacze. Bez klasy tk-pisz-js na <html> (brak JS, "ogranicz ruch") nic nie jest ukryte. */
.tk-pisz-js:not(.tk-pisz-ok) .tk-pisz { visibility: hidden; }
.tk-pisz-js .tk-z { visibility: hidden; }
.tk-pisz-js .tk-z--on { visibility: visible; }

.tk-pisz-js .tk-pojaw { opacity: 0; transition: opacity 0.9s ease; }
.tk-pisz-js .tk-pojaw > .et_pb_row { transform: translateY(24px); transition: transform 0.9s cubic-bezier(0.2, 0.7, 0.2, 1); }
.tk-pisz-js .tk-pojaw.tk-pojaw--on { opacity: 1; }
.tk-pisz-js .tk-pojaw.tk-pojaw--on > .et_pb_row { transform: none; }

/* migający kursor za ostatnią wpisaną literą, w kolorze tekstu - nie przesuwa liter */
.tk-z--kursor { position: relative; }
.tk-z--kursor::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 0.14em;
  width: 3px;
  height: 0.85em;
  margin-left: 4px;
  background: currentColor;
  animation: tk-kursor 0.8s steps(1) infinite;
}
@keyframes tk-kursor { 50% { opacity: 0; } }

/* pełny tekst dla czytników ekranu */
.tk-pisz-sr {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Pas światła - wspólny dla grafiki (tk-blysk na module Obraz: jedno przejście, gdy sekcja się pojawi)
   i dowolnego elementu z klasą tk-swiatlo (przejście uruchamia klasa tk-swiatlo--teraz, np. produkty.js).
   Grafika tk-blysk dodatkowo odjeżdża ze zbliżenia przy przewijaniu (przeglądarki ze scroll-driven animations). */
.tk-blysk .et_pb_image_wrap,
.tk-swiatlo { position: relative; overflow: hidden; }
.tk-blysk .et_pb_image_wrap::after,
.tk-swiatlo::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, 0.9) 50%, transparent 70%);
  mix-blend-mode: overlay; /* na jasnym zdjęciu zwykła biel ginie - overlay rozjaśnia ciemniejsze partie */
  transform: translateX(-120%);
}
.tk-pojaw--on .tk-blysk .et_pb_image_wrap::after { animation: tk-blysk 1.6s cubic-bezier(0.4, 0, 0.2, 1) 0.7s both; }
.tk-swiatlo--teraz::after { animation: tk-blysk 1.6s cubic-bezier(0.4, 0, 0.2, 1) both; }
@keyframes tk-blysk { to { transform: translateX(120%); } }
@supports (animation-timeline: view()) {
  .tk-blysk img { animation: tk-zblizenie linear both; animation-timeline: view(); animation-range: entry 0% cover 55%; }
  @keyframes tk-zblizenie { from { transform: scale(1.12); } to { transform: scale(1); } }
}
@media (prefers-reduced-motion: reduce) {
  .tk-blysk img,
  .tk-blysk .et_pb_image_wrap::after,
  .tk-swiatlo::after { animation: none !important; }
}