.wp-block-surge-blocks-animated-gradients.sbg {
	position: relative;
	overflow: hidden;
	border-radius: var(--sbg-radius, 0px);
	/* min-height is now handled by native block supports (inline style) */
	isolation: isolate;
}

.wp-block-surge-blocks-animated-gradients.sbg .sbg__background,
.wp-block-surge-blocks-animated-gradients.sbg .sbg__noise {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.wp-block-surge-blocks-animated-gradients.sbg .sbg__background {
	/* Multi-layer gradient for richer motion without JS/WebGL */
	background:
		radial-gradient(1200px 800px at 10% 20%, color-mix(in srgb, var(--sbg-c2, #75c1f0) 65%, transparent), transparent 55%),
		radial-gradient(900px 700px at 80% 30%, color-mix(in srgb, var(--sbg-c3, #ffffff) 60%, transparent), transparent 60%),
		radial-gradient(1000px 900px at 50% 90%, color-mix(in srgb, var(--sbg-c1, #262626) 70%, transparent), transparent 60%),
		linear-gradient(120deg, var(--sbg-c1, #262626), var(--sbg-c2, #75c1f0), var(--sbg-c3, #ffffff));
	background-size: 140% 140%;
	filter: saturate(1.15) contrast(1.05);
	transform: translate3d(0, 0, 0);
	animation: sbgGradientMove var(--sbg-anim-duration, 18s) ease-in-out infinite;
}

@keyframes sbgGradientMove {
	0% {
		background-position: 0% 50%;
		transform: scale(1.05) translate3d(-1%, -1%, 0);
	}
	50% {
		background-position: 100% 50%;
		transform: scale(1.12) translate3d(1%, 1%, 0);
	}
	100% {
		background-position: 0% 50%;
		transform: scale(1.05) translate3d(-1%, -1%, 0);
	}
}

/* Pause when speed is 0 (duration 0s can behave inconsistently across browsers). */
.wp-block-surge-blocks-animated-gradients.sbg[style*="--sbg-anim-duration:0s"] .sbg__background {
	animation: none;
}

.wp-block-surge-blocks-animated-gradients.sbg .sbg__noise {
	background-image: url("/wp-content/uploads/2026/02/g0QcWrxr87K0ufOxIUFBakwYA8.png");
	background-repeat: repeat;
	background-size: calc(var(--sbg-noise-scale, 1) * 200px);
	opacity: calc(var(--sbg-noise-opacity, 0.5) / 2);
	mix-blend-mode: overlay;
	margin: 0;
}

/* Content overlay */
.wp-block-surge-blocks-animated-gradients.sbg .sbg__content {
	position: relative;
	z-index: 1;
	width: 100%;
	min-height: inherit;
	display: flex;
	padding: 0;
	margin: 0;
}

/* Content positioning (Cover-like) */
.wp-block-surge-blocks-animated-gradients.sbg.is-pos-top-left .sbg__content {
	align-items: flex-start;
	justify-content: flex-start;
}
.wp-block-surge-blocks-animated-gradients.sbg.is-pos-top-center .sbg__content {
	align-items: flex-start;
	justify-content: center;
}
.wp-block-surge-blocks-animated-gradients.sbg.is-pos-top-right .sbg__content {
	align-items: flex-start;
	justify-content: flex-end;
}

.wp-block-surge-blocks-animated-gradients.sbg.is-pos-center-left .sbg__content {
	align-items: center;
	justify-content: flex-start;
}
.wp-block-surge-blocks-animated-gradients.sbg.is-pos-center-center .sbg__content {
	align-items: center;
	justify-content: center;
}
.wp-block-surge-blocks-animated-gradients.sbg.is-pos-center-right .sbg__content {
	align-items: center;
	justify-content: flex-end;
}

.wp-block-surge-blocks-animated-gradients.sbg.is-pos-bottom-left .sbg__content {
	align-items: flex-end;
	justify-content: flex-start;
}
.wp-block-surge-blocks-animated-gradients.sbg.is-pos-bottom-center .sbg__content {
	align-items: flex-end;
	justify-content: center;
}
.wp-block-surge-blocks-animated-gradients.sbg.is-pos-bottom-right .sbg__content {
	align-items: flex-end;
	justify-content: flex-end;
}

/* Ensure nested content has a usable default width without forcing layout. */
.wp-block-surge-blocks-animated-gradients.sbg .sbg__content > * {
	width: 100%;
	max-width: 100%;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
	.wp-block-surge-blocks-animated-gradients.sbg .sbg__background {
		animation: none;
	}
}