/* =============================================================================
 * Custom cursor — desktop only
 * ========================================================================== */

.exspa-cursor {
	position: fixed;
	top: 0;
	left: 0;
	pointer-events: none;
	z-index: 9998;
	opacity: 0;
	transition: opacity 250ms ease;
	mix-blend-mode: difference;
}

.exspa-cursor.is-active {
	opacity: 1;
}

/* Inner dot (fast follow) */
.exspa-cursor__dot {
	position: absolute;
	top: 0;
	left: 0;
	width: 6px;
	height: 6px;
	background: #EFE8DA;
	border-radius: 50%;
	transform: translate3d(-50%, -50%, 0);
	margin: -3px;
	will-change: transform;
}

/* Outer ring (slow follow) */
.exspa-cursor__ring {
	position: absolute;
	top: 0;
	left: 0;
	width: 36px;
	height: 36px;
	border: 1px solid rgba(239, 232, 218, 0.7);
	border-radius: 50%;
	transform: translate3d(-50%, -50%, 0);
	margin: -18px;
	transition: width 300ms ease, height 300ms ease, margin 300ms ease, background 300ms ease, border-color 300ms ease;
	will-change: transform;
}

.exspa-cursor.is-hover .exspa-cursor__ring {
	width: 64px;
	height: 64px;
	margin: -32px;
	background: rgba(239, 232, 218, 0.1);
	border-color: rgba(239, 232, 218, 0.95);
}

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

/* Optional label inside the ring */
.exspa-cursor__label {
	position: absolute;
	top: 0;
	left: 0;
	transform: translate3d(-50%, -50%, 0);
	margin: 0;
	font-family: 'Inter', system-ui, sans-serif;
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: #EFE8DA;
	opacity: 0;
	white-space: nowrap;
	will-change: transform;
	pointer-events: none;
	transition: opacity 250ms ease;
}

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

/* Hide on touch */
@media (pointer: coarse) {
	.exspa-cursor { display: none; }
}

/* Hide native cursor on interactive elements while custom is active */
@media (pointer: fine) {
	html { cursor: none; }
	a, button, [data-magnetic], [data-cursor-hover] { cursor: none; }
	/* Allow text caret to show for inputs / textarea / contenteditable */
	input, textarea, [contenteditable] { cursor: text; }
}
