/**
 * Impulsa – Custom cursor premium
 * Dot + ring con trailing suave, interacciones en hover.
 * Solo desktop (viewport > 1024px). pointer-events: none.
 */

/* Ocultar cursor nativo cuando el cursor personalizado está activo */
body.impulsa-cursor-active {
	cursor: none;
}
body.impulsa-cursor-active a,
body.impulsa-cursor-active button,
body.impulsa-cursor-active [role="button"],
body.impulsa-cursor-active input[type="submit"],
body.impulsa-cursor-active .btn,
body.impulsa-cursor-active .fp-btn {
	cursor: none;
}

/* Contenedor del cursor: fijo, no intercepta eventos */
.impulsa-cursor {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 2147483647;
	visibility: hidden;
	transition: visibility 0s linear 0.15s;
}

.impulsa-cursor.is-visible {
	visibility: visible;
	transition: visibility 0s linear 0s;
}

/* Oculto al usar teclado (focus en input/textarea) */
.impulsa-cursor.is-hidden-by-focus {
	opacity: 0;
	transition: opacity 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.impulsa-cursor.is-visible.is-hidden-by-focus {
	visibility: visible;
}

/* Dot: sigue exactamente el puntero */
.impulsa-cursor__dot {
	position: fixed;
	left: 0;
	top: 0;
	width: var(--cursor-dot-size, 6px);
	height: var(--cursor-dot-size, 6px);
	margin-left: calc(var(--cursor-dot-size, 6px) / -2);
	margin-top: calc(var(--cursor-dot-size, 6px) / -2);
	background: var(--cursor-dot-color, var(--impulsa-white));
	border-radius: 50%;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
	transform: translate3d(0, 0, 0);
	will-change: transform;
	transition: width 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94),
	            height 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94),
	            margin 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94),
	            background 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94),
	            box-shadow 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Ring: círculo con trailing (posición vía JS) */
.impulsa-cursor__ring {
	position: fixed;
	left: 0;
	top: 0;
	width: var(--cursor-ring-size, 36px);
	height: var(--cursor-ring-size, 36px);
	margin-left: calc(var(--cursor-ring-size, 36px) / -2);
	margin-top: calc(var(--cursor-ring-size, 36px) / -2);
	border: 1.5px solid rgba(0, 102, 255, 0.35);
	border-radius: 50%;
	transform: translate3d(0, 0, 0);
	will-change: transform;
	transition: width 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
	            height 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
	            margin 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94),
	            border-color 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94),
	            box-shadow 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94),
	            opacity 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	box-shadow: 0 0 0 0 rgba(0, 102, 255, 0);
}

/* —— Estados hover —— */

/* Botones y CTAs: ring más grande + glow sutil */
.impulsa-cursor.is-hover-btn .impulsa-cursor__dot {
	--cursor-dot-size: 4px;
	background: var(--impulsa-white);
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
}

.impulsa-cursor.is-hover-btn .impulsa-cursor__ring {
	--cursor-ring-size: 52px;
	border-color: rgba(0, 102, 255, 0.4);
	box-shadow: 0 0 20px rgba(0, 102, 255, 0.12);
}

/* Links: ring intermedio, borde más visible */
.impulsa-cursor.is-hover-link .impulsa-cursor__ring {
	--cursor-ring-size: 44px;
	border-color: rgba(0, 0, 0, 0.2);
}

.impulsa-cursor.is-hover-link .impulsa-cursor__dot {
	--cursor-dot-size: 5px;
}

/* Clickeable genérico (scale al click) */
.impulsa-cursor.is-hover-clickable .impulsa-cursor__ring {
	--cursor-ring-size: 46px;
	border-color: rgba(0, 102, 255, 0.3);
}

/* Imagen: ligero “magnético” (solo tamaño un poco mayor) */
.impulsa-cursor.is-hover-image .impulsa-cursor__ring {
	--cursor-ring-size: 48px;
	border-color: rgba(0, 0, 0, 0.12);
}

/* Efecto scale al pulsar */
.impulsa-cursor.is-pressed .impulsa-cursor__ring {
	--cursor-ring-size: 32px;
	opacity: 0.85;
}

.impulsa-cursor.is-pressed .impulsa-cursor__dot {
	--cursor-dot-size: 8px;
	opacity: 0.9;
}