#sparshh-preloader {
	display: flex;
	align-items: center;
	justify-content: center;
	transition:
		opacity 0.45s ease,
		visibility 0.45s ease;
}

#sparshh-preloader.sparshh-preloader--hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.sparshh-preloader__inner {
	position: relative;
	width: 168px;
	height: 168px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.sparshh-preloader__ring {
	position: absolute;
	inset: 0;
	border: 2px solid rgba(216, 160, 168, 0.22);
	border-top-color: #D8A0A8;
	border-right-color: rgba(216, 160, 168, 0.65);
	border-radius: 50%;
	animation: sparshh-preloader-spin 1.6s linear infinite;
	will-change: transform;
}

.sparshh-preloader__logo {
	position: relative;
	z-index: 1;
	display: block;
	width: 120px;
	height: auto;
	max-width: 72%;
	object-fit: contain;
}

.sparshh-preloader__loading {
	position: absolute;
	top: calc(100% + 18px);
	left: 50%;
	transform: translateX(-50%);
	margin: 0;
	font-size: 12px;
	line-height: 1;
	font-weight: 600;
	letter-spacing: 0.12em;
	white-space: nowrap;
	color: rgba(74, 63, 76, 0.85);
}

.sparshh-preloader__dot {
	display: inline-block;
	opacity: 0.2;
	animation: sparshh-preloader-dot 1.4s ease-in-out infinite;
}

.sparshh-preloader__dot:nth-child(2) {
	animation-delay: 0.18s;
}

.sparshh-preloader__dot:nth-child(3) {
	animation-delay: 0.36s;
}

@keyframes sparshh-preloader-dot {
	0%, 55%, 100% {
		opacity: 0.2;
	}
	25% {
		opacity: 1;
	}
}

@keyframes sparshh-preloader-spin {
	to {
		transform: rotate(360deg);
	}
}

@media (max-width: 767px) {
	.sparshh-preloader__inner {
		width: 142px;
		height: 142px;
	}

	.sparshh-preloader__logo {
		width: 100px;
		max-width: 72%;
	}

	.sparshh-preloader__loading {
		top: calc(100% + 16px);
		font-size: 11px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sparshh-preloader__ring {
		animation-duration: 3.2s;
	}

	.sparshh-preloader__dot {
		animation: none;
		opacity: 0.65;
	}
}
