/**
 * TM Odometer — roller mechanics + [tm_milestone] element styling.
 * The [data-odometer-part] rules are required for the digit-roll masking to
 * work; the .tm-milestone rules style the WPBakery element wrapper.
 */

/* --- Roller mechanics (required) ---------------------------------------- */

[data-odometer-element] {
	display: inline-flex;
	align-items: center;
	font-variant-numeric: tabular-nums;
	line-height: 1;
	white-space: nowrap;
}

[data-odometer-part="mask"],
[data-odometer-part="static"] {
	display: inline-block;
	overflow: clip;
	padding: 0.05em;
	margin: -0.05em;
}

[data-odometer-part="roller"] {
	display: block;
	white-space: pre;
	text-align: center;
	will-change: transform;
}

[data-odometer-part="static"] {
	display: inline-block;
}

/* --- [tm_milestone] element --------------------------------------------- */

.tm-milestone {
	display: block;
}

.tm-milestone--center { text-align: center; }
.tm-milestone--right  { text-align: right; }
.tm-milestone--left   { text-align: left; }

.tm-milestone__rule {
	display: block;
	width: 92px;
	height: 2px;
	margin: 0 0 24px;
	background: linear-gradient(90deg, var(--field-first-lavender, #ae80e4), rgba(174, 128, 228, 0.15));
}

.tm-milestone--center .tm-milestone__rule { margin-left: auto; margin-right: auto; }
.tm-milestone--right .tm-milestone__rule  { margin-left: auto; }

.tm-milestone__figure {
	display: inline-flex;
	align-items: baseline;
	gap: 0.05em;
	font-size: 46px;
	font-weight: 300;
	line-height: 1;
	color: var(--field-first-purple, #20106a);
}

.tm-milestone__symbol {
	font-size: 0.55em;
	font-weight: 400;
	line-height: 1;
}

.tm-milestone__symbol--after  { margin-left: 0.06em; }
.tm-milestone__symbol--before { margin-right: 0.06em; }

.tm-milestone__text {
	margin: 10px 0 0;
	font-size: 16px;
	line-height: 1.3;
}