.exat-strategic-timeline {
	padding: var(--exat-strategic-timeline-padding, 28px 42px);
	border-radius: var(--exat-strategic-timeline-radius, 0);
	/* background: var(--exat-strategic-timeline-bg, linear-gradient(90deg, var(--primary, #0b7ed0) 0%, var(--secondary, #08aeea) 100%)); */
	overflow: hidden;
}

.exat-strategic-timeline__list {
	display: grid;
	grid-template-columns: repeat(var(--exat-strategic-timeline-columns, 3), minmax(0, 1fr));
	gap: var(--exat-strategic-timeline-gap, 0);
	align-items: stretch;
}

.exat-strategic-timeline__item {
	position: relative;
	display: flex;
	min-height: var(--exat-strategic-timeline-item-height, 82px);
	padding: var(--exat-strategic-timeline-item-padding, 0 46px 0 0);
	flex-direction: column;
	justify-content: flex-start;
	text-decoration: none;
	color: inherit;
}

.exat-strategic-timeline__item:not(:last-child)::after {
	content: "";
	position: absolute;
	top: var(--exat-strategic-timeline-divider-top, 0);
	right: var(--exat-strategic-timeline-divider-offset, 24px);
	width: var(--exat-strategic-timeline-divider-width, 1px);
	height: var(--exat-strategic-timeline-divider-height, 82px);
	background: var(--exat-strategic-timeline-divider-color, rgba(255, 255, 255, 0.72));
}

.exat-strategic-timeline--hide-divider .exat-strategic-timeline__item::after {
	display: none;
}

.exat-strategic-timeline__year {
	margin: 0 0 var(--exat-strategic-timeline-title-gap, 6px);
	color: var(--exat-strategic-timeline-year-color, #ffffff);
	font-size: var(--exat-strategic-timeline-year-size, 28px);
	font-weight: var(--exat-strategic-timeline-year-weight, 800);
	line-height: 1.12;
	letter-spacing: var(--exat-strategic-timeline-year-spacing, 0);
}

.exat-strategic-timeline__description {
	margin: 0;
	color: var(--exat-strategic-timeline-description-color, #ffffff);
	font-size: var(--exat-strategic-timeline-description-size, 13px);
	font-weight: var(--exat-strategic-timeline-description-weight, 700);
	line-height: 1.75;
}

.exat-strategic-timeline__item[href]:hover .exat-strategic-timeline__year,
.exat-strategic-timeline__item[href]:hover .exat-strategic-timeline__description {
	opacity: var(--exat-strategic-timeline-hover-opacity, 0.82);
}

@media (max-width: 767px) {
	.exat-strategic-timeline__item:not(:last-child)::after {
		top: auto;
		right: auto;
		bottom: calc(var(--exat-strategic-timeline-gap, 0px) / -2);
		left: 0;
		width: 100%;
		height: var(--exat-strategic-timeline-divider-width, 1px);
	}
}