/* v6.26 motion layer for the OnePage. Every hidden start state is applied by
 * motion-refinements.js right before it observes an element, so nothing stays
 * hidden when JavaScript is late, blocked or reduced motion is requested. */

/* 1. Headlines rise line by line out of a mask (film-title style). */
.sw-line {
	display: block;
	overflow: hidden;
	/* Room for descenders without visibly changing the line height. */
	padding-bottom: .1em;
	margin-bottom: -.1em;
}
.sw-line__inner { display: block; }
.sw-mask-ready .sw-line__inner { transform: translate3d(0, 108%, 0); }
.sw-mask-ready.is-revealed .sw-line__inner {
	transform: translate3d(0, 0, 0);
	transition: transform 1050ms cubic-bezier(0.23, 1, 0.32, 1);
	transition-delay: calc(var(--sw-line, 0) * 90ms);
}

/* 2. Spotlight that follows the pointer over project cards (desktop only). */
.sw-spot {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	opacity: 0;
	background: radial-gradient(420px circle at var(--sw-x, 50%) var(--sw-y, 50%), rgba(255, 255, 255, .16), rgba(255, 255, 255, 0) 62%);
	transition: opacity 260ms ease;
}
@media (hover: hover) and (pointer: fine) {
	.project:hover > .sw-spot { opacity: 1; }
}

/* 3. Thin reading-progress line, driven by the scroll timeline where supported. */
.sw-progress { display: none; }
@supports (animation-timeline: scroll()) {
	.sw-progress {
		display: block;
		position: fixed;
		z-index: 400;
		top: 0;
		left: 0;
		right: 0;
		height: 2px;
		background: var(--red, #e20816);
		transform-origin: 0 50%;
		transform: scaleX(0);
		pointer-events: none;
		animation: sw-progress linear both;
		animation-timeline: scroll(root block);
	}
	@keyframes sw-progress { to { transform: scaleX(1); } }
}

@media (prefers-reduced-motion: reduce) {
	.sw-mask-ready .sw-line__inner { transform: none !important; transition: none !important; }
	.sw-progress { animation: none !important; }
	.sw-progress { display: none; }
	.sw-spot { display: none; }
}
