/* Motion: split-line wrappers, will-change hints, reduced-motion safety net. */

/* Split-line wrapper — clip TYLKO osi Y żeby reveal działał,
 * ale długie wyrazy nie były ucinane poziomo (problem "automatyzacja Alleg"). */
.line {
  display: block;
  overflow-y: clip;
  overflow-x: visible;
  position: relative;
  /* Fallback dla starych Safari: padding-bottom by zarezerwować trochę miejsca na italic descender */
  padding-bottom: 0.05em;
  margin-bottom: -0.05em;
}
.line__inner {
  display: inline-block;
  max-width: 100%;
  will-change: transform;
}
[data-cta-heading] .line__inner {
  max-width: none;
}

/* Hero word stagger */
.word {
  display: inline-block;
  margin-right: 0.18em;
  will-change: transform, opacity;
}

/* Bento card initial state — JS poustawia animacje */
[data-bento-card] { will-change: transform, opacity; }
[data-step] { will-change: transform, opacity; }
[data-plan] { will-change: transform, opacity; }
[data-trust] { will-change: transform, opacity; }
[data-faq-item] { will-change: transform, opacity; }
[data-hero-el] { will-change: transform, opacity; }
.hero__stat { will-change: transform, opacity; opacity: 0; }
[data-magnetic] { will-change: transform; }

/* Hero stage ready */
body[data-state="loading"] [data-hero-el] {
  opacity: 0;
  transform: translateY(28px);
}

/* Reduced motion — wszystko statyczne, zero animacji */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .ticker__track { animation: none !important; transform: none !important; }
  [data-hero-el], [data-bento-card], [data-step], [data-plan], [data-trust], [data-faq-item], .line__inner, .word {
    opacity: 1 !important;
    transform: none !important;
  }
  body[data-state="loading"] [data-hero-el] {
    opacity: 1 !important;
    transform: none !important;
  }
  .grain { display: none; }
}
