.cessto-scroll-initial {
	opacity: 0;
	transform: translate3d(0, 24px, 0);
	will-change: transform, opacity, filter, clip-path;
}

.cessto-scroll-initial[data-cessto-animation="fade-in"] {
	transform: none;
}

.cessto-scroll-initial[data-cessto-animation="fade-down"] {
	transform: translate3d(0, -24px, 0);
}

.cessto-scroll-initial[data-cessto-animation="fade-left"] {
	transform: translate3d(-24px, 0, 0);
}

.cessto-scroll-initial[data-cessto-animation="fade-right"] {
	transform: translate3d(24px, 0, 0);
}

.cessto-scroll-initial[data-cessto-animation="zoom-in"] {
	transform: scale(0.92);
}

.cessto-scroll-initial[data-cessto-animation="zoom-out"] {
	transform: scale(1.08);
}

.cessto-scroll-initial[data-cessto-animation="rotate-in"] {
	transform: translate3d(0, 24px, 0) rotate(-4deg);
}

.cessto-scroll-initial[data-cessto-animation="blur-reveal"] {
	filter: blur(8px);
}

.cessto-scroll-initial[data-cessto-animation="text-reveal"] {
	clip-path: inset(0 100% 0 0);
}

.cessto-scroll-initial[data-cessto-animation="image-reveal"] {
	clip-path: inset(0 0 100% 0);
}

.cessto-scroll-initial[data-cessto-animation="flip-up"] {
	transform: perspective(900px) rotateX(18deg) translate3d(0, 28px, 0);
}

.cessto-scroll-initial[data-cessto-animation="flip-down"] {
	transform: perspective(900px) rotateX(-18deg) translate3d(0, -28px, 0);
}

.cessto-scroll-initial[data-cessto-animation="flip-left"] {
	transform: perspective(900px) rotateY(-18deg) translate3d(-28px, 0, 0);
}

.cessto-scroll-initial[data-cessto-animation="flip-right"] {
	transform: perspective(900px) rotateY(18deg) translate3d(28px, 0, 0);
}

.cessto-scroll-initial[data-cessto-animation="slide-up"] {
	transform: translate3d(0, 56px, 0);
}

.cessto-scroll-initial[data-cessto-animation="slide-down"] {
	transform: translate3d(0, -56px, 0);
}

.cessto-scroll-initial[data-cessto-animation="slide-left"] {
	transform: translate3d(-56px, 0, 0);
}

.cessto-scroll-initial[data-cessto-animation="slide-right"] {
	transform: translate3d(56px, 0, 0);
}

.cessto-scroll-initial.is-cessto-visible {
	opacity: 1;
	transform: none;
	filter: none;
	clip-path: inset(0 0 0 0);
	transition-duration: var(--cessto-scroll-duration, 800ms);
	transition-delay: var(--cessto-scroll-delay, 0ms);
	transition-property: transform, opacity, filter, clip-path;
	transition-timing-function: var(--cessto-scroll-easing, ease-out);
}

[data-cessto-scroll-section].cessto-scroll-sticky,
[data-cessto-scroll-section][data-cessto-pin="1"][data-cessto-animation-engine="native"] {
	position: sticky;
	top: var(--cessto-sticky-top, var(--cessto-header-offset, 0px));
	z-index: var(--cessto-scroll-z-index, 20);
}

[data-cessto-scroll-section].cessto-scroll-stuck,
[data-cessto-scroll-section].cessto-scroll-pinned,
[data-cessto-scroll-section].cessto-scroll-stacked {
	position: relative;
	z-index: var(--cessto-scroll-z-index, 20);
	will-change: transform;
}

[data-cessto-scroll-section].cessto-scroll-mobile-simplified {
	min-height: auto !important;
}

[data-cessto-scroll-section][data-cessto-animation="section-overlay"] {
	isolation: isolate;
}

[data-cessto-scroll-section] > .cessto-twic-overlay-layer {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.28);
	pointer-events: none;
	z-index: 1;
}

[data-cessto-scroll-section][data-cessto-animation="section-overlay"] > :not(.cessto-twic-overlay-layer) {
	position: relative;
	z-index: 2;
}

[data-cessto-scroll-section][data-cessto-horizontal="1"] {
	overflow: hidden;
}

[data-cessto-scroll-section][data-cessto-horizontal="1"] .cessto-horizontal-track {
	display: flex;
	gap: var(--cessto-horizontal-spacing, 24px);
	will-change: transform;
}

[data-cessto-scroll-section][data-cessto-horizontal="1"] .cessto-horizontal-track > * {
	flex: 0 0 auto;
}

[data-cessto-scroll-section][data-cessto-snap="1"] {
	scroll-snap-align: var(--cessto-snap-align, start);
}

[data-cessto-scroll-section][data-cessto-snap="1"][data-cessto-snap-fullscreen="1"] {
	min-height: 100vh;
}

[data-cessto-scroll-section][data-cessto-story="1"] {
	position: relative;
}

[data-cessto-scroll-section] > .cessto-twic-timeline-progress {
	position: sticky;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background: rgba(148, 163, 184, 0.28);
	z-index: calc(var(--cessto-scroll-z-index, 20) + 2);
	transform-origin: left center;
	overflow: hidden;
}

[data-cessto-scroll-section] > .cessto-twic-timeline-progress .cessto-twic-timeline-progress-bar {
	display: block;
	width: 100%;
	height: 100%;
	transform: scaleX(0);
	transform-origin: left center;
	background: linear-gradient(90deg, rgba(59, 130, 246, 0.9), rgba(99, 102, 241, 0.95));
}

@media (prefers-reduced-motion: reduce) {
	.cessto-scroll-initial,
	.cessto-scroll-initial.is-cessto-visible {
		filter: none !important;
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}

	[data-cessto-scroll-section],
	[data-cessto-scroll-section] * {
		scroll-behavior: auto !important;
	}
}

@media (max-width: 767px) {
	[data-cessto-scroll-section][data-cessto-horizontal-mobile-stack="1"] .cessto-horizontal-track {
		display: grid;
		gap: var(--cessto-horizontal-spacing, 24px);
		transform: none !important;
	}

	[data-cessto-scroll-section][data-cessto-pin-disable-mobile="1"],
	[data-cessto-scroll-section][data-cessto-horizontal-disable-mobile="1"],
	[data-cessto-scroll-section][data-cessto-parallax-disable-mobile="1"] {
		position: relative !important;
		top: auto !important;
		transform: none !important;
	}
}

@keyframes cessto-section-shimmer {
	0% { background-position: -200% 0; }
	100% { background-position: 200% 0; }
}

.cessto-section-skeleton-wrap {
	position: relative;
}

.cessto-section-skeleton {
	animation: cessto-section-shimmer 1.4s ease infinite;
	background: linear-gradient(90deg, #1c1f23 25%, #2a2d31 50%, #1c1f23 75%);
	background-size: 200% 100%;
	inset: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	transition: opacity 0.35s ease;
	z-index: 0;
}

/* Native/AOS engine: show skeleton while section has cessto-scroll-initial but not yet visible */
[data-cessto-scroll-section].cessto-scroll-initial:not(.is-cessto-visible) ~ .cessto-section-skeleton {
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.cessto-section-skeleton {
		animation: none;
		display: none;
	}
}
