/**
 * Timeline — the bits theme.json can't express: the circular year badge, the
 * hairline rule and the four space-between cards. Also carries the Our Story
 * band's bottom hairline. Loaded only when .ab-timeline is on the page.
 */
.ab-timeline {
	border-bottom: 1px solid #e9e9e9; /* closes the Our Story band (Figma) */
}

/* Divider rule between the heading and the cards (Figma: 998px, 0.6px #D6E4F0).
   min() caps the width against the container so it can never force horizontal
   overflow on narrow screens — .alignwide's own max-width would otherwise win on
   specificity and leave the fixed 998px uncapped. */
.ab-tl-line {
	width: min(998px, 100%);
	height: 0;
	border-top: 0.6px solid #d6e4f0;
	margin-inline: auto;
}

/* Four cards spread across the wide band. */
.ab-tl-cards {
	align-items: flex-start;
}

.ab-tl-card {
	flex: 0 0 220px;
	max-width: 220px;
	text-align: center;
	padding: 20px 10px;
}

/* Circular light-blue year badge. */
.ab-tl-badge {
	width: 56px;
	height: 56px;
	border-radius: 999px;
	background: #e8f2fa;
	color: #0d72ba;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto !important;
}

@media (max-width: 781px) {
	.ab-tl-card {
		flex-basis: 45%;
		max-width: 45%;
	}
}