.scroll-to-top {
	position: fixed;
	bottom: 100px;
	right: 1.7rem;
	width: 62px;
	height: 62px;
	background: white;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 16px rgba(107, 63, 160, 0.25);
	transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
	z-index: 99999;
	opacity: 0;
	transform: scale(0) translateY(20px);
	pointer-events: none;
}

.scroll-to-top:hover {
	box-shadow: 0 8px 24px rgba(107, 63, 160, 0.35);
	transform: scale(1.1) translateY(0);
}

.scroll-to-top:active {
	transform: scale(0.95) translateY(0);
}

.scroll-to-top.show {
	opacity: 1;
	transform: scale(1) translateY(0);
	pointer-events: auto;
}

.scroll-to-top svg {
	width: 65px;
	height: 65px;
}

/* SVG Ring and Arrow */
.progress-ring {
	fill: none;
	stroke: #6b3fa0;
	stroke-width: 2;
	stroke-linecap: round;
	transition: stroke-dashoffset 0.35s ease;
	transform: rotate(-90deg);
	transform-origin: 50% 50%;
}

.arrow {
	fill: none;
	stroke: #6b3fa0;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Mobile Responsive */
@media (max-width: 768px) {
	.scroll-to-top {
		bottom: 180px;
		right: 1.5rem;
		width: 56px;
		height: 56px;
	}

	.scroll-to-top svg {
		width: 56px;
		height: 56px;
	}
}

@media (max-width: 480px) {
	.scroll-to-top {
		bottom: 105px;
		right: 1.69rem;
		width: 60px;
		height: 60px;
	}

	.scroll-to-top svg {
		width: 56px;
		height: 56px;
	}
}
