/**
 * CHP content module animations – reveal on scroll (vanilla, no CLS).
 * Only opacity/transform/filter. Loaded on single post/projekt/dzialanie/program.
 */

/* -------------------------------------------------------------------------
   Global off – one flag to disable all animations
   ------------------------------------------------------------------------- */
body.chp-anim-off .chp-anim,
body.chp-anim-off .chp-anim.is-inview {
	opacity: 1;
	transform: none;
	filter: none;
	transition: none;
}

/* -------------------------------------------------------------------------
   Base: initial state only when JS ready (avoids flash-hidden before in-viewport pass)
   ------------------------------------------------------------------------- */
html.chp-anim-ready .chp-anim.chp-anim--basic:not(.is-inview) {
	opacity: 0;
}

.chp-anim {
	transition-property: opacity, transform, filter;
	transition-timing-function: ease-out;
}

/* Hero: slightly longer, optional light blur (desktop only via media) */
.chp-anim[data-anim="fade-up"] {
	transform: translateY(14px);
	transition-duration: 0.55s;
}

.chp-anim[data-anim="fade-up"].chp-anim--hero {
	transition-duration: 0.55s;
}

/* Stagger delay from JS (--stagger-index) */
.chp-anim {
	transition-delay: calc(var(--stagger-index, 0) * 45ms);
}

/* -------------------------------------------------------------------------
   Fade-only (e.g. captions)
   ------------------------------------------------------------------------- */
.chp-anim[data-anim="fade"] {
	transform: none;
	transition-duration: 0.4s;
}

/* -------------------------------------------------------------------------
   Scale (image/video cover: 1.02 -> 1)
   ------------------------------------------------------------------------- */
.chp-anim[data-anim="scale"] {
	transform: scale(1.02);
	transition-duration: 0.5s;
}

/* -------------------------------------------------------------------------
   In-view: final state
   ------------------------------------------------------------------------- */
.chp-anim.is-inview {
	opacity: 1;
	transform: none;
	filter: none;
}

/* -------------------------------------------------------------------------
   Module body stagger – children get --stagger-index from JS
   ------------------------------------------------------------------------- */
.chp-module__body .chp-anim {
	transition-duration: 0.4s;
}

/* -------------------------------------------------------------------------
   Caption: extra delay after image (handled in JS via --stagger-index)
   ------------------------------------------------------------------------- */
.chp-module__caption.chp-anim {
	transition-duration: 0.35s;
}

/* -------------------------------------------------------------------------
   prefers-reduced-motion: no animations
   ------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {

	.chp-anim,
	.chp-anim.is-inview {
		opacity: 1;
		transform: none;
		filter: none;
		transition: none;
		transition-delay: 0ms;
	}
}

/* -------------------------------------------------------------------------
   Optional: image hover (desktop only)
   ------------------------------------------------------------------------- */
@media (hover: hover) {
	.chp-module__figure {
		transition: transform 0.25s ease-out, box-shadow 0.25s ease-out;
	}

	.chp-module__figure:hover {
		transform: translateY(-2px);
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
	}
}

/* Optional: link underline animation – enable only if theme does not already underline .chp-module__body a
.chp-module__body a {
	background-image: linear-gradient(currentColor, currentColor);
	background-repeat: no-repeat;
	background-position: 0 100%;
	background-size: 0 1px;
	transition: background-size 0.2s ease-out;
}
.chp-module__body a:hover {
	background-size: 100% 1px;
}
*/