/* Ambient background — adapted from marvolous.co.za coming-soon spotlight */

.mv-ambient {
	position: fixed;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
}

.mv-ambient__gradient {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 70% 55% at 18% 18%, rgba(216, 190, 158, 0.35) 0%, transparent 55%),
		radial-gradient(ellipse 65% 50% at 82% 78%, rgba(239, 229, 216, 0.45) 0%, transparent 52%),
		radial-gradient(ellipse 55% 40% at 55% 45%, rgba(250, 247, 242, 0.9) 0%, transparent 70%),
		linear-gradient(165deg, #FAF7F2 0%, #FAF7F2 38%, #EFE5D8 100%);
}

.mv-ambient__blob {
	position: absolute;
	border-radius: 50%;
	filter: blur(70px);
	opacity: 0.35;
	mix-blend-mode: multiply;
	animation: mv-drift 22s ease-in-out infinite;
}

.mv-ambient__blob--one {
	width: min(460px, 62vw);
	height: min(460px, 62vw);
	top: -10%;
	right: -6%;
	background: radial-gradient(circle at 35% 35%, rgba(185, 120, 80, 0.45) 0%, transparent 68%);
}

.mv-ambient__blob--two {
	width: min(360px, 54vw);
	height: min(360px, 54vw);
	bottom: 6%;
	left: -10%;
	background: radial-gradient(circle at 40% 40%, rgba(216, 190, 158, 0.5) 0%, transparent 68%);
	animation-delay: -7s;
}

.mv-ambient__blob--three {
	width: min(300px, 46vw);
	height: min(300px, 46vw);
	top: 40%;
	left: 58%;
	background: radial-gradient(circle at 40% 40%, rgba(86, 98, 63, 0.25) 0%, transparent 70%);
	opacity: 0.25;
	animation-delay: -14s;
}

.mv-ambient__spotlight {
	position: absolute;
	width: 480px;
	height: 480px;
	left: 0;
	top: 0;
	transform: translate(-50%, -50%);
	background: radial-gradient(circle, rgba(255, 248, 232, 0.55) 0%, rgba(228, 207, 154, 0.18) 35%, transparent 70%);
	opacity: 0;
	transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	will-change: transform;
}

.mv-ambient__grain {
	position: absolute;
	inset: 0;
	opacity: 0.04;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

@keyframes mv-drift {
	0%, 100% { transform: translate(0, 0) scale(1); }
	33% { transform: translate(16px, -22px) scale(1.04); }
	66% { transform: translate(-14px, 14px) scale(0.97); }
}

@media (prefers-reduced-motion: reduce) {
	.mv-ambient__blob { animation: none; }
	.mv-ambient__spotlight { display: none; }
}

body.marvolous-ambient .site-header {
	background: rgba(250, 247, 242, 0.94);
}

body.marvolous-ambient:not(.marvolous-brand) .mv-ambient {
	opacity: 1;
}

body.marvolous-ambient.marvolous-no-ambient .mv-ambient {
	display: none;
}
