/* =============================================================================
   Scroll To Top — floating brand button (site-wide)
   ============================================================================= */

.cc-scroll-top {
	--cc-stt-size: 52px;
	--cc-stt-red: #d32323;
	--cc-stt-red-dark: #b21e1e;

	position: fixed;
	right: 28px;
	bottom: 28px;
	z-index: 990;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--cc-stt-size);
	height: var(--cc-stt-size);
	padding: 0;
	margin: 0;

	color: #ffffff;
	background: linear-gradient(145deg, #e23a3a 0%, var(--cc-stt-red) 55%, var(--cc-stt-red-dark) 100%);
	border: none;
	border-radius: 50%;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;

	box-shadow:
		0 8px 22px rgba(211, 35, 35, 0.36),
		0 2px 6px rgba(0, 0, 0, 0.18);

	opacity: 0;
	visibility: hidden;
	transform: translateY(18px) scale(0.85);
	pointer-events: none;

	transition:
		opacity 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		visibility 0.35s linear,
		box-shadow 0.3s ease,
		background 0.3s ease;
}

/* Soft pulsing brand halo */
.cc-scroll-top::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	box-shadow: 0 0 0 0 rgba(211, 35, 35, 0.45);
	opacity: 0;
	transition: opacity 0.3s ease;
}

.cc-scroll-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0) scale(1);
	pointer-events: auto;
}

.cc-scroll-top:hover,
.cc-scroll-top:focus-visible {
	background: linear-gradient(145deg, #d32323 0%, var(--cc-stt-red-dark) 100%);
	transform: translateY(-3px) scale(1.06);
	box-shadow:
		0 14px 28px rgba(211, 35, 35, 0.45),
		0 4px 10px rgba(0, 0, 0, 0.22);
	outline: none;
}

.cc-scroll-top:focus-visible {
	box-shadow:
		0 0 0 3px rgba(255, 255, 255, 0.9),
		0 0 0 6px rgba(211, 35, 35, 0.55);
}

.cc-scroll-top:active {
	transform: translateY(-1px) scale(0.97);
}

.cc-scroll-top__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.3s ease;
}

.cc-scroll-top:hover .cc-scroll-top__icon {
	transform: translateY(-2px);
}

.cc-scroll-top svg {
	display: block;
}

/* -----------------------------------------------------------------------------
   Responsive
   ----------------------------------------------------------------------------- */

@media (max-width: 1024px) {
	.cc-scroll-top {
		right: 22px;
		bottom: 22px;
	}
}

@media (max-width: 600px) {
	.cc-scroll-top {
		--cc-stt-size: 40px;
		right: 14px;
		bottom: 14px;
	}

	.cc-scroll-top svg {
		width: 18px;
		height: 18px;
	}
}

/* -----------------------------------------------------------------------------
   Accessibility — honour reduced motion
   ----------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.cc-scroll-top {
		transition: opacity 0.2s linear, visibility 0.2s linear;
		transform: none;
	}

	.cc-scroll-top.is-visible {
		transform: none;
	}

	.cc-scroll-top:hover,
	.cc-scroll-top:focus-visible,
	.cc-scroll-top:active {
		transform: none;
	}
}
