.logo-svg-animated a {
	color: var(--tb--base);
	line-height: 0;
}

.logo-svg-animated .dux-logo-svg {
	display: block;
	width: auto;
	height: 100%;
	max-width: 100%;
	overflow: visible;
}

.logo-svg-animated .dux-logo-svg path {
	fill: currentColor;
	stroke: currentColor;
	stroke-width: 1.15;
	stroke-linecap: butt;
	stroke-linejoin: miter;
	stroke-miterlimit: 2;
	stroke-dasharray: 1;
	stroke-dashoffset: 0;
	stroke-opacity: 0;
}

.logo-svg-animated.is-animating .dux-logo-svg path {
	fill: transparent;
	stroke-dashoffset: 1;
	stroke-opacity: 1;
	animation: duxLogoStroke 1.8s ease forwards, duxLogoFill .5s ease 1.1s forwards;
}

@media (max-width: 1024px) {
	.logo-svg-animated .dux-logo-svg {
		margin: 0 auto;
	}
}

@keyframes duxLogoStroke {
	from {
		stroke-dashoffset: 1;
		stroke-opacity: 1;
	}

	to {
		stroke-dashoffset: 0;
		stroke-opacity: 1;
	}
}

@keyframes duxLogoFill {
	from {
		fill: transparent;
		stroke-opacity: 1;
	}

	to {
		fill: currentColor;
		stroke-opacity: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.logo-svg-animated.is-animating .dux-logo-svg path,
	.logo-svg-animated .dux-logo-svg path {
		animation: none;
		fill: currentColor;
		stroke-dashoffset: 0;
		stroke-opacity: 0;
	}
}