.timeline-wrapper-301 {
	width: 100%;
	font-family: inherit;
}

.timeline-row-301 {
	display: flex;
	flex-wrap: nowrap;
	gap: 30px;
	width: 100%;
}

.timeline-step-301 {
	flex: 1;
	display: flex;
	flex-direction: column;
	text-align: left;
}

/* TOP SECTION: Icon box + Number */
.timeline-top {
	display: flex;
	align-items: center;
	gap: 15px;
	margin-bottom: 20px;
}

.timeline-icon-box {
	width: 50px;
	height: 50px;
	background-color: #E9F0EC;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	color: #033838;
}

.timeline-icon-box svg {
	width: 20px;
	height: 20px;
	fill: #033838;
}

.timeline-number {
	font-size: 2.5rem;
	font-weight: 700;
	color: #E2EAE6;
	line-height: 1;
}

/* TITLE SECTION WITH LINE */
.timeline-title-container {
	position: relative;
	margin-bottom: 10px;
	display: flex;
	align-items: center;
}

.timeline-line {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	right: -30px; /* extends line to connect with next item gap */
	height: 1px;
	background-color: #D1DFD7;
	z-index: 0;
}

/* Don't extend the line past the last item */
.timeline-step-301:last-child .timeline-line {
	right: 0;
}

.timeline-title-text {
	position: relative;
	z-index: 1;
	margin: 0;
	padding-right: 15px;
	font-size: 1.25rem;
	font-weight: 700;
	color: #033838;
	background-color: #F8F9FA; /* Default fallback background */
	display: inline-block;
}

/* CONTENT SECTION */
.timeline-subtitle {
	margin: 0 0 15px;
	font-size: 1rem;
	font-weight: 600;
	color: #D4A373;
}

.timeline-desc {
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.6;
	color: #7D8A8A;
}

/* Responsive */
@media (max-width: 992px) {
	.timeline-row-301 {
		flex-wrap: wrap;
	}
	.timeline-step-301 {
		flex: 1 1 45%;
		margin-bottom: 30px;
	}
	.timeline-line {
		right: 0;
	}
}

@media (max-width: 768px) {
	.timeline-step-301 {
		flex: 1 1 100%;
	}
}