/* ============================= */
/* FADE CITATION (scroll-driven) */
/* ============================= */

.fade-citation {
	position: relative;
	background: #fff;
	min-height: 620px;

	/* Scroll-driven animation source (named timeline for children) */
	view-timeline-name: --citation;
	view-timeline-axis: block;
}

.fade-citation .inner {
	max-width: 1100px;
	margin: 0 auto;
	padding: 2.5rem 1.5rem;

	display: flex;
	align-items: center;
	justify-content: center;
}

/* Typography: set in the editor (e.g. .title-4xl, Kadence Advanced Text). */

/* Word wrappers (filled by JS) */
.fade-citation .word {
	display: inline-block;
	opacity: 0.3;
	font: inherit;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	font-style: inherit;
	letter-spacing: inherit;
	line-height: inherit;
	text-transform: inherit;
	color: inherit;
	-webkit-text-fill-color: inherit;
	background-image: inherit;
	background-size: inherit;
	background-clip: inherit;
	-webkit-background-clip: inherit;
}

@supports (animation-timeline: --citation) {
	.fade-citation .word {
		animation: gotb-fade-sticky 1ms linear forwards;
		animation-timeline: --citation;
	}
}

/* Browsers without scroll-driven timelines: show full opacity */
@supports not (animation-timeline: --citation) {
	.fade-citation .word {
		opacity: 1;
	}
}

@keyframes gotb-fade-sticky {
	0% {
		opacity: 0.3;
	}
	100% {
		opacity: 1;
	}
}
