@keyframes hero-gradient-animation {
	0% {
		--s-start-0: 9.676681144197742%;
		--s-end-0: 55.50597545560139%;
		--x-0: 85%;
		--y-0: 32%;
		--c-0: hsla(69.44881889763782, 100%, 50%, 1);
		--c-1: hsla(69.44881889763779, 100%, 50%, 1);
		--s-start-1: 18.29028799489389%;
		--s-end-1: 52.42754342300969%;
		--y-1: 46%;
		--x-1: 11%;
	}

	100% {
		--s-start-0: 6.413377255057367%;
		--s-end-0: 45.62243245043394%;
		--x-0: 16%;
		--y-0: 32%;
		--c-0: hsla(69.44881889763782, 100%, 50%, 0.51);
		--c-1: hsla(69.41176470588233, 100%, 50%, 1);
		--s-start-1: 5%;
		--s-end-1: 42.36916944715712%;
		--y-1: 2%;
		--x-1: 42%;
	}
}

@property --s-start-0 {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 9.676681144197742%;
}

@property --s-end-0 {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 55.50597545560139%;
}

@property --x-0 {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 85%;
}

@property --y-0 {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 32%;
}

@property --c-0 {
	syntax: "<color>";
	inherits: false;
	initial-value: hsla(69.44881889763782, 100%, 50%, 1);
}

@property --c-1 {
	syntax: "<color>";
	inherits: false;
	initial-value: hsla(69.44881889763779, 100%, 50%, 1);
}

@property --s-start-1 {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 18.29028799489389%;
}

@property --s-end-1 {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 52.42754342300969%;
}

@property --y-1 {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 46%;
}

@property --x-1 {
	syntax: "<percentage>";
	inherits: false;
	initial-value: 11%;
}

.hero-outdoor {
	--x-0: 85%;
	--y-0: 32%;
	--c-0: hsla(69.44881889763782, 100%, 50%, 1);
	--c-1: hsla(69.44881889763779, 100%, 50%, 1);
	--y-1: 46%;
	--x-1: 11%;
	background-color: hsla(0, 0%, 0%, 0);
	background-image: radial-gradient(
			circle at var(--x-0) var(--y-0),
			var(--c-0) var(--s-start-0),
			transparent var(--s-end-0)
		),
		radial-gradient(
			circle at var(--x-1) var(--y-1),
			var(--c-1) var(--s-start-1),
			transparent var(--s-end-1)
		);
	animation: hero-gradient-animation var(--hero-animation-duration) linear infinite alternate;
	background-blend-mode: normal, normal;
}
