/* =============================================================
   MANIPULACJE.COM.PL — animation.css
   IntersectionObserver-driven animations (animation.js).
   Elementy z [data-animate] dostają klasę .is-visible gdy
   wchodzą w viewport. prefers-reduced-motion: reset w style.css.
   ============================================================= */

/* STANY WEJŚCIOWE — ukryte przed animacją */
[data-animate] {
  opacity: 0;
  transition: opacity .55s ease, transform .55s ease;
}
[data-animate="fade-up"]    { transform: translateY(28px); }
[data-animate="fade-in"]    { transform: none; }
[data-animate="fade-left"]  { transform: translateX(-28px); }
[data-animate="fade-right"] { transform: translateX(28px); }
[data-animate="scale-in"]   { transform: scale(.94); }

/* STAN WIDOCZNY */
[data-animate].is-visible {
  opacity: 1;
  transform: none;
}

/* OPOŹNIENIA (stagger dla kart w gridzie) */
[data-delay="100"] { transition-delay: .1s; }
[data-delay="200"] { transition-delay: .2s; }
[data-delay="300"] { transition-delay: .3s; }
[data-delay="400"] { transition-delay: .4s; }
[data-delay="500"] { transition-delay: .5s; }

/* HEADER – cień po scrollu (klasa dodawana przez script.js) */
.site-header.is-scrolled {
  box-shadow: 0 4px 20px rgba(31,42,51,.08);
  transition: box-shadow .3s ease;
}

/* COOKIE BANNER */
#cookieBanner {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 200;
  background: var(--ink);
  color: var(--paper);
  padding: 1rem 1.5rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  font-size: .88rem;
  box-shadow: 0 -6px 24px rgba(0,0,0,.18);
  transition: transform .35s ease, opacity .35s ease;
}
#cookieBanner p { margin: 0; max-width: 56ch; }
#cookieBanner a { color: var(--amber); text-decoration: underline; }
.cookie-actions { display: flex; gap: .65rem; flex-shrink: 0; flex-wrap: wrap; }
.cookie-actions .btn { padding: .55rem 1.1rem; font-size: .82rem; }
.cookie-actions .btn-outline {
  border-color: var(--sand); color: var(--sand);
}
.cookie-hide { transform: translateY(100%); opacity: 0; }

/* HOVER GLOW na kartach CTA */
.card {
  position: relative; overflow: hidden;
}
.card::after {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(circle at 60% 40%, rgba(110,156,139,.12) 0%, transparent 70%);
  opacity: 0;
  transition: opacity .35s ease;
  pointer-events: none;
}
.card:hover::after { opacity: 1; }

/* TEKST — podkreślenie animowane (text-link) */
.text-link {
  background-image: linear-gradient(var(--sage-text), var(--sage-text));
  background-size: 0 2px;
  background-repeat: no-repeat;
  background-position: left bottom;
  border-bottom: none !important;
  padding-bottom: 1px;
  transition: background-size .25s ease, color .2s;
}
.text-link:hover {
  background-size: 100% 2px;
}

/* PRZYCISK – pulse na głównym CTA hero */
@keyframes pulse-amber {
  0%, 100% { box-shadow: 0 0 0 0 rgba(226,134,79,.4); }
  50%       { box-shadow: 0 0 0 10px rgba(226,134,79,0); }
}
.hero .btn-primary {
  animation: pulse-amber 2.8s ease infinite;
}
.hero .btn-primary:hover {
  animation: none;
}