/**
 * Southside Justice — load-in animation styles.
 */

html.js.has-load-in .page-banner__scroll,
html.js.has-load-in .page-banner .blog-tag-filter-shortcode,
html.js.has-load-in .page-banner .acf-parent-page-name,
html.js.has-load-in .page-banner .page-banner__title,
html.js.has-load-in .page-banner .wp-block-post-date,
html.js.has-load-in .about-split-section .wp-block-column,
html.js.has-load-in .feature-section .wp-block-column,
html.js.has-load-in .centered-cta-blue > *,
html.js.has-load-in .ssj-table-section > :is(h1, h2, h3, h4, h5, h6),
html.js.has-load-in .ssj-table-section .wp-block-columns,
html.js.has-load-in .values-cards > :is(h1, h2, h3, h4, h5, h6),
html.js.has-load-in .values-cards .wp-block-column,
html.js.has-load-in .person-card-grid > :is(h1, h2, h3, h4, h5, h6),
html.js.has-load-in .person-card-grid .acf-staff-member,
html.js.has-load-in .posts-slider-block__title,
html.js.has-load-in .posts-slider-block__controls,
html.js.has-load-in .posts-slider-block__track .posts-slider-block__card,
html.js.has-load-in .posts-archive-grid-block__grid .posts-archive-grid-block__card,
html.js.has-load-in .posts-archive-grid-block__pagination {
	opacity: 0;
	transform: translateY(24px);
}

html.js.has-load-in .full-img-banner {
	opacity: 0;
	transform: none;
}

html.js.has-load-in footer .load-in-item,
html.js.has-load-in footer .wp-block-columns,
html.js.has-load-in .site-footer .load-in-item,
html.js.has-load-in .site-footer .wp-block-columns {
	opacity: 1 !important;
	transform: none !important;
	transition: none !important;
}

html.js.has-load-in .load-in-item,
html.js.has-load-in .page-banner__scroll {
	opacity: 0;
	transform: translateY(24px);
}

html.js.has-load-in .load-in-item.load-in-fade {
	transform: none;
}

html.js.has-load-in .page-banner :is(h1, h2, h3, h4, h5, h6) {
	opacity: 0;
}

.page-banner :is(h1, h2, h3, h4, h5, h6) .load-in-line {
	display: block;
	overflow: hidden;
}

.page-banner :is(h1, h2, h3, h4, h5, h6) .load-in-word {
	display: inline;
}

html.js.has-load-in .page-banner :is(h1, h2, h3, h4, h5, h6) .load-in-line-inner {
	display: block;
	opacity: 0;
	transform: translateY(1.05em);
}

html.js.has-load-in .page-banner :is(h1, h2, h3, h4, h5, h6).is-in-view {
	opacity: 1;
}

html.js.has-load-in .page-banner :is(h1, h2, h3, h4, h5, h6).is-in-view .load-in-line-inner {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
	transition-delay: var(--load-in-delay, 0ms);
}

html.js.has-load-in .load-in-item.is-in-view,
html.js.has-load-in .page-banner__scroll.is-in-view {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
	transition-delay: var(--load-in-delay, 0ms);
}

html.js.has-load-in .load-in-item.load-in-fade.is-in-view {
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	html.js.has-load-in .load-in-item,
	html.js.has-load-in .page-banner__scroll,
	html.js.has-load-in .load-in-item,
	html.js.has-load-in .page-banner__scroll {
		opacity: 1;
		transform: none;
		transition: none;
	}

	html.js.has-load-in .page-banner :is(h1, h2, h3, h4, h5, h6),
	html.js.has-load-in .page-banner :is(h1, h2, h3, h4, h5, h6) {
		opacity: 1;
	}

	html.js.has-load-in .page-banner :is(h1, h2, h3, h4, h5, h6) .load-in-line-inner,
	html.js.has-load-in .page-banner :is(h1, h2, h3, h4, h5, h6).is-in-view .load-in-line-inner {
		opacity: 1;
		transform: none;
		transition: none;
	}
}