/**
 * Widget: Decorative Separator
 */
.vac-sep {
	display: flex;
	align-items: center;
	width: 100%;
	line-height: 0;
}

.vac-sep__svg {
	display: inline-block;
	width: 140px;
	max-width: 100%;
	color: var(--vac-secondary-1);
}

.vac-sep__svg svg {
	display: block;
	width: 100%;
	height: auto;
	max-height: inherit;
	overflow: visible;
}

/* Draw-in: paths get pathLength=1 via JS so dash values are normalized */
.vac-js .vac-sep--draw svg [stroke]:not([stroke="none"]) {
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	transition: stroke-dashoffset 1.4s cubic-bezier(.22, 1, .36, 1);
	transition-delay: .15s;
}

.vac-js .vac-sep--draw.is-in svg [stroke]:not([stroke="none"]) {
	stroke-dashoffset: 0;
}

/* Filled graphics simply fade/scale in via the reveal system */
.vac-js .vac-sep--draw svg [fill]:not([fill="none"]):not([stroke]) {
	transform-box: fill-box;
	transform-origin: center;
	transform: scale(.85);
	opacity: 0;
	transition: transform .9s cubic-bezier(.34, 1.56, .64, 1), opacity .6s ease;
}

.vac-js .vac-sep--draw.is-in svg [fill]:not([fill="none"]):not([stroke]) {
	transform: scale(1);
	opacity: 1;
}

.vac-sep--draw svg g[fill]:not([fill="none"]) path,
.vac-sep--draw svg g[fill]:not([fill="none"]) circle {
	transform: none;
	opacity: 1;
}