/* ==========================================================================
   Egittosì — Motion
   Reveal start states exist ONLY under html.reveal-armed (set by the head script when
   motion is allowed). Without JS, with reduced motion, or if scripts fail, content is
   fully visible. Reveals play once (.is-revealed).
   ========================================================================== */

/* ---------------------------------------------------------------------------
   Shared transition
   ------------------------------------------------------------------------ */
.reveal-armed [data-reveal],
.reveal-armed [data-reveal="stagger"] > [data-reveal-item] {
	transition-duration: var(--dur-reveal);
	transition-timing-function: var(--ease-out);
	transition-delay: var(--rv-delay, 0s);
}

.reveal-armed [data-reveal]:not(.is-reveal-done) {
	will-change: opacity, transform;
}

/* fade-up (default) */
.reveal-armed [data-reveal="fade-up"] {
	opacity: 0;
	transform: translate3d(0, 28px, 0);
	transition-property: opacity, transform;
}

/* fade */
.reveal-armed [data-reveal="fade"] {
	opacity: 0;
	transition-property: opacity;
}

/* scale settle */
.reveal-armed [data-reveal="scale"] {
	opacity: 0;
	transform: scale(1.05);
	transition-property: opacity, transform;
	transition-duration: var(--dur-cinematic);
}

/* clip reveals */
.reveal-armed [data-reveal="clip-up"] {
	clip-path: inset(100% 0 0 0);
	transition-property: clip-path;
	transition-duration: var(--dur-cinematic);
}

.reveal-armed [data-reveal="clip-left"] {
	clip-path: inset(0 100% 0 0);
	transition-property: clip-path;
	transition-duration: var(--dur-cinematic);
}

/* image: masked wipe + 1.08 → 1 settle of the picture inside */
.reveal-armed [data-reveal="image"] {
	clip-path: inset(0 0 100% 0);
	transition-property: clip-path;
	transition-duration: var(--dur-cinematic);
}

.reveal-armed [data-reveal="image"] :is(img, .img-fallback) {
	transform: scale(1.08);
	transition: transform calc(var(--dur-cinematic) * 1.3) var(--ease-out) var(--rv-delay, 0s);
}

/* words (lines / text) */
.rv-word {
	display: inline-block;
	overflow: hidden;
	vertical-align: top;
	padding-block-end: 0.08em;
	margin-block-end: -0.08em;
}

.rv-word__inner {
	display: inline-block;
}

.reveal-armed [data-reveal="lines"],
.reveal-armed [data-reveal="text"] {
	transition: none;
}

.reveal-armed [data-reveal="lines"] .rv-word__inner,
.reveal-armed [data-reveal="text"] .rv-word__inner {
	transform: translate3d(0, 105%, 0);
	transition: transform var(--dur-reveal) var(--ease-out);
	transition-delay: calc(var(--rv-delay, 0s) + var(--rv-i, 0) * 0.035s);
}

/* stagger children */
.reveal-armed [data-reveal="stagger"] {
	transition: none;
}

.reveal-armed [data-reveal="stagger"] > [data-reveal-item] {
	opacity: 0;
	transform: translate3d(0, 24px, 0);
	transition-property: opacity, transform;
}

/* Revealed */
.reveal-armed [data-reveal].is-revealed {
	opacity: 1;
	transform: none;
	clip-path: inset(0 0 0 0);
}

.reveal-armed [data-reveal].is-revealed :is(img, .img-fallback),
.reveal-armed [data-reveal].is-revealed .rv-word__inner,
.reveal-armed [data-reveal="stagger"].is-revealed > [data-reveal-item] {
	opacity: 1;
	transform: none;
}

/* Parallax targets never animate their own transform with CSS. */
[data-parallax] {
	will-change: transform;
}

/* ---------------------------------------------------------------------------
   Custom cursor (desktop, motion allowed)
   ------------------------------------------------------------------------ */
.cursor {
	position: fixed;
	inset: 0 auto auto 0;
	z-index: var(--z-cursor);
	pointer-events: none;
	opacity: 0;
	transition: opacity var(--dur-ui) var(--ease-out);
}

.cursor.is-visible {
	opacity: 1;
}

.cursor.is-hidden {
	opacity: 0;
}

.cursor__dot,
.cursor__ring {
	position: fixed;
	inset: 0 auto auto 0;
	border-radius: 50%;
	pointer-events: none;
}

.cursor__dot {
	inline-size: 6px;
	block-size: 6px;
	margin: -3px 0 0 -3px;
	background: var(--c-nile-900);
	transition: opacity var(--dur-micro) var(--ease-out);
}

.cursor__ring {
	display: flex;
	align-items: center;
	justify-content: center;
	inline-size: 36px;
	block-size: 36px;
	margin: -18px 0 0 -18px;
	border: 1px solid rgba(11, 31, 58, 0.45);
	transition:
		width var(--dur-ui) var(--ease-out),
		height var(--dur-ui) var(--ease-out),
		margin var(--dur-ui) var(--ease-out),
		background-color var(--dur-ui) var(--ease-out),
		border-color var(--dur-ui) var(--ease-out);
}

.cursor.is-hover .cursor__ring {
	inline-size: 56px;
	block-size: 56px;
	margin: -28px 0 0 -28px;
	border-color: var(--c-gold-500);
	background: rgba(201, 161, 90, 0.08);
}

.cursor.is-hover .cursor__dot {
	opacity: 0;
}

.cursor.is-down .cursor__ring {
	inline-size: 30px;
	block-size: 30px;
	margin: -15px 0 0 -15px;
}

.cursor__label {
	font-size: 0.625rem;
	font-weight: var(--fw-medium);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--c-white);
	opacity: 0;
	transition: opacity var(--dur-micro) var(--ease-out);
}

.cursor.has-label .cursor__ring {
	inline-size: 84px;
	block-size: 84px;
	margin: -42px 0 0 -42px;
	border-color: transparent;
	background: rgba(11, 31, 58, 0.88);
}

.cursor.has-label .cursor__label {
	opacity: 1;
}

.cursor.has-label .cursor__dot {
	opacity: 0;
}

/* Light cursor over dark areas */
.cursor-on-dark .cursor__dot {
	background: var(--c-white);
}

.cursor-on-dark .cursor__ring {
	border-color: rgba(255, 255, 255, 0.6);
}

@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
	.cursor {
		display: none;
	}
}