/* Cemacon History Timeline Widget */

.cemacon-history-timeline {
	position: relative;
	width: 100%;
	box-sizing: border-box;
	--cemacon-timeline-slide-width: 479px;
	--cemacon-timeline-image-width: 479px;
	--cemacon-timeline-image-height: 230px;
	--cemacon-timeline-color-gray: #434345;
	--cemacon-timeline-color-title: #2D2C2E;
	--cemacon-timeline-color-description: #2D2D2D;
	--cemacon-timeline-color-highlight-bg: #EEECED;
	--cemacon-timeline-placeholder-border: #ccc;
	--cemacon-timeline-placeholder-color: #666;
	--cemacon-timeline-item-gap: 32px;
}

.cemacon-history-timeline--placeholder {
	padding: 24px;
	border: 1px dashed var(--cemacon-timeline-placeholder-border);
	text-align: center;
	color: var(--cemacon-timeline-placeholder-color);
}

.cemacon-history-timeline__swiper {
	overflow: hidden;
	width: 100%;
}

.cemacon-history-timeline__swiper .swiper-wrapper {
	align-items: stretch;
}

.cemacon-history-timeline__swiper .swiper-slide.cemacon-history-timeline__item {
	width: var(--cemacon-timeline-slide-width);
	height: auto;
	flex-shrink: 0;
}

.cemacon-history-timeline__item {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: var(--cemacon-timeline-item-gap);
	height: 100%;
	box-sizing: border-box;
}

.cemacon-history-timeline__top,
.cemacon-history-timeline__bottom {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--cemacon-timeline-item-gap);
	width: 100%;
	min-height: 0;
	box-sizing: border-box;
	text-align: center;
}

.cemacon-history-timeline__top {
	min-height: var(--cemacon-timeline-top-height, auto);
	justify-content: flex-end;
}

.cemacon-history-timeline__bottom {
	min-height: var(--cemacon-timeline-bottom-height, auto);
	justify-content: flex-start;
}

.cemacon-history-timeline__intro-block {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	width: 100%;
}

.cemacon-history-timeline__intro {
	margin: 0;
	color: var(--cemacon-timeline-color-gray);
	text-align: center;
	font-family: var(--cemacon-font-heading);
	font-size: 32px;
	font-style: normal;
	font-weight: 700;
	line-height: 42.88px;
	letter-spacing: -1.8px;
}

.cemacon-history-timeline__intro-year {
	margin: 10px 0 0;
	color: var(--cemacon-timeline-color-gray);
	text-align: center;
	font-family: var(--cemacon-font-heading);
	font-size: 58px;
	font-style: normal;
	font-weight: 700;
	line-height: 26.9px;
	letter-spacing: -1.8px;
}

.cemacon-history-timeline__meta {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--cemacon-timeline-item-gap);
	width: 100%;
}

.cemacon-history-timeline__year {
	margin: 0;
	color: var(--cemacon-timeline-color-gray);
	text-align: center;
	font-family: var(--cemacon-font-heading);
	font-size: 58px;
	font-style: normal;
	font-weight: 700;
	line-height: 58px;
	letter-spacing: -1px;
}

.cemacon-history-timeline__highlight {
	display: flex;
	padding: 16px;
	justify-content: center;
	align-items: flex-start;
	gap: 8px;
	margin: 0;
	width: 100%;
	height: 88px;
	min-height: 88px;
	box-sizing: border-box;
	background: var(--cemacon-timeline-color-highlight-bg);
	color: var(--cemacon-timeline-color-title);
	text-align: center;
	font-family: var(--cemacon-font-heading);
	font-size: 20px;
	font-style: normal;
	font-weight: 700;
	line-height: 28px;
	letter-spacing: -0.2px;
}

.cemacon-history-timeline__description {
	margin: 0;
	color: var(--cemacon-timeline-color-description);
	text-align: center;
	font-family: var(--cemacon-font-body);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px;
}

.cemacon-history-timeline__description--empty {
	min-height: 1px;
}

.cemacon-history-timeline__image {
	position: relative;
	width: 100%;
	height: var(--cemacon-timeline-image-height);
	flex: 0 0 var(--cemacon-timeline-image-height);
	overflow: hidden;
}

.cemacon-history-timeline__image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cemacon-history-timeline__pagination {
	position: static;
	margin-top: 20px;
}

@media only screen and (max-width: 768px) {
	.cemacon-history-timeline {
		--cemacon-timeline-item-gap: 24px;
	}

	.cemacon-history-timeline__intro {
		font-size: 24px;
		line-height: 1.3;
		letter-spacing: -1.2px;
	}

	.cemacon-history-timeline__intro-year,
	.cemacon-history-timeline__year {
		font-size: 44px;
		line-height: 1;
		letter-spacing: -1px;
	}

	.cemacon-history-timeline__highlight {
		font-size: 16px;
		line-height: 1.35;
		padding: 12px;
		letter-spacing: -0.15px;
	}

	.cemacon-history-timeline__description {
		font-size: 14px;
		line-height: 18px;
	}

	.cemacon-history-timeline__swiper .swiper-slide.cemacon-history-timeline__item {
		width: min(var(--cemacon-timeline-slide-width), 100%);
	}
}