/*
  Spokojna animacja sekcyjna:
  - wejście panelu uruchamia całą sekwencję jego elementów,
  - tekst, karty i obrazy zachowują własny rytm,
  - właściwości translate/scale nie nadpisują transform używanego przez layout.
*/
/* Elementy oczekujące na animację są przesunięte poza swój docelowy obrys.
   Przycinamy wyłącznie nadmiar poziomy, aby na telefonie nie powstawał
   chwilowy pasek przewijania przed zakończeniem sekwencji. */
html.a4b-reveal-prepared,
html.a4b-reveal-prepared body{overflow-x:clip;}
@supports not (overflow:clip){
  html.a4b-reveal-prepared,
  html.a4b-reveal-prepared body{overflow-x:hidden;}
}

html.a4b-reveal-prepared [data-a4b-reveal]:not(.is-revealed){
  opacity:.001;
  will-change:opacity,translate,scale;
}

html.a4b-reveal-prepared [data-a4b-reveal="heading"]:not(.is-revealed){
  translate:52px 14px;
}

html.a4b-reveal-prepared [data-a4b-reveal="copy"]:not(.is-revealed){
  translate:38px 10px;
}

html.a4b-reveal-prepared [data-a4b-reveal="card"]:not(.is-revealed){
  translate:0 78px;
  scale:.982;
}

html.a4b-reveal-prepared [data-a4b-reveal="media"]:not(.is-revealed){
  translate:0 64px;
  scale:.958;
}

html.a4b-reveal-ready [data-a4b-reveal]{
  transition-property:opacity,translate,scale;
  transition-delay:var(--a4b-reveal-delay,0ms);
  transition-timing-function:cubic-bezier(.22,.61,.36,1);
}

html.a4b-reveal-ready [data-a4b-reveal="heading"]{transition-duration:2350ms;}
html.a4b-reveal-ready [data-a4b-reveal="copy"]{transition-duration:2250ms;}
html.a4b-reveal-ready [data-a4b-reveal="card"]{transition-duration:2550ms;}
html.a4b-reveal-ready [data-a4b-reveal="media"]{transition-duration:2700ms;}

/* Zwarta sekwencja stopki: ostatni element kończy ruch po ok. 2,6 s. */
html.a4b-reveal-ready .a4b-site-footer [data-a4b-reveal]{transition-duration:1550ms;}

html.a4b-reveal-prepared [data-a4b-reveal].is-revealed{
  opacity:1;
  translate:0 0;
  scale:1;
  will-change:auto;
}


/* Strona główna, panel Usługi: każda plansza niesie od początku własny
   fragment złotej ramy. Animujemy całe karty, więc obramowanie nie doskakuje
   po zakończeniu sekwencji. */
html.a4b-reveal-prepared [data-a4b-service-card]:not(.is-revealed){
  translate:-72px 0;
  scale:1;
}
html.a4b-reveal-ready [data-a4b-service-card]{
  transition-duration:2200ms;
  transition-timing-function:cubic-bezier(.22,.61,.36,1);
}

@media (max-width:700px){
  html.a4b-reveal-prepared [data-a4b-reveal="heading"]:not(.is-revealed){translate:30px 10px;}
  html.a4b-reveal-prepared [data-a4b-reveal="copy"]:not(.is-revealed){translate:22px 8px;}
  html.a4b-reveal-prepared [data-a4b-reveal="card"]:not(.is-revealed){translate:0 52px;scale:.988;}
  html.a4b-reveal-prepared [data-a4b-reveal="media"]:not(.is-revealed){translate:0 42px;scale:.972;}

  html.a4b-reveal-ready [data-a4b-reveal="heading"]{transition-duration:2100ms;}
  html.a4b-reveal-ready [data-a4b-reveal="copy"]{transition-duration:2000ms;}
  html.a4b-reveal-ready [data-a4b-reveal="card"]{transition-duration:2250ms;}
  html.a4b-reveal-ready [data-a4b-reveal="media"]{transition-duration:2400ms;}
  html.a4b-reveal-ready .a4b-site-footer [data-a4b-reveal]{transition-duration:1450ms;}
  html.a4b-reveal-prepared [data-a4b-service-card]:not(.is-revealed){translate:-38px 0;scale:1;}
  html.a4b-reveal-ready [data-a4b-service-card]{transition-duration:1950ms;}
}

@media (prefers-reduced-motion:reduce){
  html.a4b-reveal-prepared [data-a4b-reveal],
  html.a4b-reveal-ready [data-a4b-reveal]{
    opacity:1!important;
    translate:none!important;
    scale:none!important;
    transition:none!important;
    will-change:auto!important;
  }
}
