.ng-page-loader {
	--ng-loader-green: #174f38;
	--ng-loader-gold: #caa20f;
	--ng-loader-gold-soft: #b89531;

	position: fixed;
	inset: 0;
	z-index: 999999;
	display: grid;
	place-items: center;
	padding: 24px;
	background:
		radial-gradient(circle at 50% 42%, rgba(202, 162, 15, 0.2), transparent 30%),
		linear-gradient(145deg, #fffaf0 0%, #f6edd8 55%, #f3e6c8 100%);
	opacity: 1;
	visibility: visible;
	transition:
		opacity 0.45s ease,
		visibility 0.45s ease;
}

.ng-page-loader.is-hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.ng-page-loader__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: min(88vw, 280px);
	text-align: center;
	animation: ng-loader-bounce-in 0.85s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.ng-page-loader__logo-wrap {
	position: relative;
	width: 148px;
	height: 148px;
	display: grid;
	place-items: center;
	margin: 0 auto;
	animation: ng-loader-bounce-loop 1.55s ease-in-out 0.85s infinite;
}

.ng-page-loader__ring {
	position: absolute;
	inset: -12px;
	border-radius: 50%;
	border: 3px solid rgba(202, 162, 15, 0.18);
	border-top-color: var(--ng-loader-gold);
	border-right-color: var(--ng-loader-gold-soft);
	animation: ng-loader-spin 0.95s linear infinite;
	box-sizing: border-box;
}

.ng-page-loader__badge {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background-color: transparent;
	background-image: url("../images/nuttergood-loader-badge.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	box-shadow: none;
}

.ng-page-loader__text {
	margin: 22px 0 0;
	color: var(--ng-loader-gold-soft);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.16em;
	line-height: 1.5;
	text-transform: uppercase;
}

@keyframes ng-loader-bounce-in {
	0% {
		opacity: 0;
		transform: translateY(28px) scale(0.72);
	}
	55% {
		opacity: 1;
		transform: translateY(-10px) scale(1.08);
	}
	75% {
		transform: translateY(4px) scale(0.96);
	}
	100% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes ng-loader-bounce-loop {
	0%,
	100% {
		transform: translateY(0) scale(1);
	}
	40% {
		transform: translateY(-12px) scale(1.05);
	}
	60% {
		transform: translateY(3px) scale(0.98);
	}
}

@keyframes ng-loader-spin {
	to {
		transform: rotate(360deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.ng-page-loader,
	.ng-page-loader__inner,
	.ng-page-loader__logo-wrap,
	.ng-page-loader__ring {
		animation: none !important;
		transition: none;
	}
}