/*
 * Inspiracje: the change of results after a category click
 * (assets/js/inspirations-navigation.js, user's request 2026-10-29). The old
 * results fade out (.is-leaving, 160 ms), the new ones fade in from a
 * little lower (.is-entering), the cards one after another. The list
 * heading only fades in, and only when it changes place (.is-moved: the
 * featured post came or went). With reduced motion the change is
 * immediate (site-base.css).
 */

.hf-inspirations-results.is-leaving :is(.hf-featured-post, .hf-inspirations-list__summary, .hf-inspirations-list__grid, .hf-inspirations-list__empty, .hf-pagination)
{
	opacity: 0;
	transition: opacity 160ms ease-out;
}

.hf-inspirations-results.is-entering :is(.hf-featured-post, .hf-inspirations-list__summary, .hf-inspirations-list__item, .hf-inspirations-list__empty, .hf-pagination)
{
	animation: hf-inspirations-enter 450ms cubic-bezier(0.25, 0.6, 0.3, 1) both;
}

/* One card after another; ENTER_TIME in the script covers the last one. */
.hf-inspirations-results.is-entering .hf-inspirations-list__item:nth-child(2)
{
	animation-delay: 70ms;
}

.hf-inspirations-results.is-entering .hf-inspirations-list__item:nth-child(3)
{
	animation-delay: 140ms;
}

.hf-inspirations-results.is-entering .hf-inspirations-list__item:nth-child(4)
{
	animation-delay: 210ms;
}

.hf-inspirations-results.is-entering .hf-inspirations-list__item:nth-child(n + 5),
.hf-inspirations-results.is-entering .hf-pagination
{
	animation-delay: 280ms;
}

.hf-inspirations-results.is-moved .hf-inspirations-list__header
{
	animation: hf-inspirations-fade 450ms ease-out both;
}

@keyframes hf-inspirations-enter
{
	from
	{
		opacity: 0;
		translate: 0 0.75rem;
	}
}

@keyframes hf-inspirations-fade
{
	from
	{
		opacity: 0;
	}
}
