/**
 * Nexa Tijdsbesparing-calculator widget
 */

.nbc-wrap *,
.nbc-wrap *::before,
.nbc-wrap *::after { box-sizing: border-box; }

.nbc-wrap button { cursor: pointer; font-family: 'Satoshi', sans-serif; }

.nbc-content::-webkit-scrollbar { width: 0; display: none; }
.nbc-content { scrollbar-width: none; -ms-overflow-style: none; }

.nbc-wrap {
	--nbc-pulse-color: 0, 116, 255;
	--nbc-pulse-opacity: 0.45;
	--nbc-pulse-size: 8px;
	--nbc-pulse-duration: 2s;
}

@keyframes nbcPulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(var(--nbc-pulse-color), var(--nbc-pulse-opacity)); }
	50%      { box-shadow: 0 0 0 var(--nbc-pulse-size) rgba(var(--nbc-pulse-color), 0); }
}

.nbc-cta-form { animation: nbcPulse var(--nbc-pulse-duration) ease-in-out infinite; }
.nbc-cta-form:hover { animation: none; }
.nbc-wrap--no-pulse .nbc-cta-form { animation: none; }

.nbc-arrow { transition: transform 0.25s ease; }
.nbc-cta-form:hover .nbc-arrow,
.nbc-submit:hover .nbc-arrow { transform: translateX(4px); }

@keyframes nbcSpin { to { transform: rotate(360deg); } }
.nbc-spinner {
	display: inline-block;
	width: 14px;
	height: 14px;
	border: 2px solid rgba(255, 255, 255, 0.3);
	border-top-color: #fff;
	border-radius: 50%;
	animation: nbcSpin 0.8s linear infinite;
}

.nbc-wrap [data-nbc-step] { animation: nbcFade 0.3s ease; }

@keyframes nbcFade {
	from { opacity: 0; transform: translateY(4px); }
	to   { opacity: 1; transform: translateY(0); }
}