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

.wf-before-after {
	--wf-before-after-light:var(--wf-accent-light,var(--wf-service-light,#DDF5E9));
	--wf-before-after-text:var(--wf-accent-text,var(--wf-service-text,#173D35));
	--wf-before-after-accent:var(--wf-accent,#43D29B);
	--wf-before-after-white:var(--wf-white,#FFFFFF);
	display:block;
	width:100%;
	min-width:0;
	padding:0;
	background:transparent;
	border:0;
	border-radius:0;
	box-shadow:none;
	color:var(--wf-before-after-text);
	font-family:var(--wf-font-body,"DM Sans",sans-serif) !important;
}

.wf-before-after :where(p,li,span,div) {
	font-family:var(--wf-font-body,"DM Sans",sans-serif) !important;
}

.wf-before-after__comparison {
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	align-items:stretch;
	width:100%;
	min-width:0;
	overflow:hidden;
	background:var(--wf-before-after-white);
	border:0;
	border-radius:var(--wf-radius-section,28px);
	box-shadow:none;
}

.wf-before-after__panel {
	display:flex;
	flex-direction:column;
	min-width:0;
	height:100%;
	padding:clamp(30px,3.2vw,52px);
	border:0;
	border-radius:0;
	box-shadow:none;
	color:var(--wf-before-after-text);
}

.wf-before-after__panel--before {
	background:var(--wf-before-after-light);
}

.wf-before-after__panel--after {
	background:var(--wf-before-after-white);
	box-shadow:inset 1px 0 color-mix(in srgb,var(--wf-before-after-text) 13%,transparent);
}

.wf-before-after.wf-before-after .wf-before-after__panel-title {
	min-height:0;
	margin:0 0 clamp(30px,3.5vw,52px);
	color:color-mix(in srgb,var(--wf-before-after-text) 48%,transparent) !important;
	font-family:var(--wf-font-body,"DM Sans",sans-serif) !important;
	font-size:clamp(.72rem,.68rem + .16vw,.86rem) !important;
	font-weight:700 !important;
	line-height:1.35 !important;
	letter-spacing:.14em;
	text-transform:uppercase;
}

.wf-before-after__rows {
	display:flex;
	flex:1;
	flex-direction:column;
	justify-content:space-between;
	gap:0;
	margin:0;
	padding:0;
	list-style:none;
}

.wf-before-after__row {
	display:grid;
	grid-template-columns:minmax(0,1fr) minmax(84px,.72fr);
	align-items:center;
	gap:18px;
	min-height:clamp(64px,5.1vw,88px);
	padding:16px 0;
	border:0;
	border-bottom:1px solid color-mix(in srgb,var(--wf-before-after-text) 13%,transparent);
}

.wf-before-after__row:last-child {
	border-bottom:0;
}

.wf-before-after__row-label,
.wf-before-after__row-value {
	min-width:0;
	color:var(--wf-before-after-text) !important;
	font-size:var(--wf-text-m,1.125rem);
	line-height:1.45;
}

.wf-before-after__row-label {
	font-weight:500;
}

.wf-before-after__row-value {
	font-weight:700;
	text-align:right;
}

.wf-before-after__panel--after .wf-before-after__row-value {
	color:color-mix(in srgb,var(--wf-before-after-accent) 76%,var(--wf-before-after-text)) !important;
}

@media(max-width:760px) {
	.wf-before-after__comparison {
		grid-template-columns:minmax(0,1fr);
		border-radius:var(--wf-radius-card,16px);
	}

	.wf-before-after__panel {
		padding:30px 24px;
	}

	.wf-before-after__panel--after {
		box-shadow:inset 0 1px color-mix(in srgb,var(--wf-before-after-text) 13%,transparent);
	}

	.wf-before-after.wf-before-after .wf-before-after__panel-title {
		margin-bottom:24px;
	}
}

@media(max-width:480px) {
	.wf-before-after__row {
		grid-template-columns:minmax(0,1fr);
		gap:4px;
		min-height:0;
		padding:16px 0;
	}

	.wf-before-after__row-value {
		text-align:left;
	}
}

@media(prefers-reduced-motion:reduce) {
	.wf-before-after *,
	.wf-before-after *::before,
	.wf-before-after *::after {
		scroll-behavior:auto !important;
		transition:none !important;
	}
}
