/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 01 2026 | 06:21:55 */
/* ========================================= LATEST NEWS ========================================= */
.latest-news-section {
	background: var(--gray-light-3-dyn-1);
	transition: all 0.4s;
	--news-gap: 4rem;

	.latest-news-heading {
		text-align: center;
		margin-bottom: 3rem;
		color: var(--green-dark-1-dyn-1);
		transition: all 0.4s;
	}

	.timeline-dot {
		position: absolute;
		left: 50%;
		width: 1.5rem;
		aspect-ratio: 1 / 1;
		background: var(--green-light-1);
		border-radius: 50%;
		transform: translateX(-50%);
		z-index: 2;
		
		&.timeline-dot-top {
			top: 0;
		}
		
		&.timeline-dot-bottom {
			bottom: 0;
		}
	}
	
	.news-wrapper {
		position: relative;
		display: flex;
		flex-wrap: wrap;
		row-gap: var(--news-gap);
		padding: var(--news-gap) 0;
		
		@media screen and (min-width: 991px) {
			column-gap: calc(2 * var(--news-gap));
		}

		&::before {
			content: "";
			position: absolute;
			top: 0;
			bottom: 0;
			left: 50%;
			width: 1px;
			background: var(--green-light-1);
			transform: translateX(-50%);
			z-index: 1;
		}
		
		.news-item {
			position: relative;
			z-index: 2;
			width: 100%;
			display: flex;
			justify-content: center;
			
			@media screen and (min-width: 991px) {
				width: calc(50% - var(--news-gap));
				
				&:nth-child(5) {
					margin-bottom: 15%;
				}

				&::before {
					content: "";
					position: absolute;
					top: 50%;
					width: var(--news-gap);
					height: 1px;
					background: var(--green-light-1);
					transform: translateY(-50%);
					z-index: -1;
				}

				&:nth-of-type(odd) {
					align-self: flex-start;

					&::before {
						right: calc(var(--news-gap) * -1);
					}
				}

				&:nth-of-type(even) {
					align-self: flex-end;
					transform: translateY(50%);

					&::before {
						left: calc(var(--news-gap) * -1);
					}
				}
			}
		}
		
		.news-card {
			position: relative;
			display: flex;
			align-items: end;
			aspect-ratio: 3 / 2;
			min-height: 200px;
			max-width: 550px;
			color: var(--white);
			text-decoration: none;
			background-position: center;
			background-size: cover;
			background-repeat: no-repeat;
			
			@media screen and (min-width: 991px) {
				max-width: unset;
			}
		}
		
		.news-card-content {
			background-color: var(--green-dark-transparent-1);
			padding: 1rem;
			
			.news-card-title {
				font-size: 1.25rem;
				font-weight: 600;
				line-height: 1.25;
				margin-bottom: 0.5rem;
				color: var(--white);
				
				@media screen and (min-width: 576px) {
					font-size: 1.5rem;
				}
			}

			.news-card-text {
				margin: 0;
				color: var(--white);
				line-height: 1.2;
				font-size: 0.9rem;
				
				@media screen and (min-width: 576px) {
					font-size: 1rem;
				}
			}
		}
	}
}