/**
 * CAFLA — Ligne du temps
 * À ajouter dans le style.css du thème enfant Designium,
 * ou dans un fichier CSS chargé sur la page /a-propos/notre-histoire/.
 *
 * Tokens de marque CAFLA :
 * Bleu principal : #1B4F8C   Accent doré : #F2A93B
 * Fond crème :     #FAF7F2   Texte :       #2A2A2A
 * Ligne :          #C9D6E6
 */

.cafla-ldt {
	--cafla-blue: #1B4F8C;
	--cafla-blue-dark: #123A69;
	--cafla-gold: #F2A93B;
	--cafla-cream: #FAF7F2;
	--cafla-text: #2A2A2A;
	--cafla-text-muted: #6B6B68;
	--cafla-line: #C9D6E6;

	position: relative;
	max-width: 900px;
	margin: 0 auto;
	padding: 2rem 1rem 3rem;
}

.cafla-ldt::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 28px;
	width: 2px;
	background: var(--cafla-line);
}

.cafla-ldt__item {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 1.5rem;
	padding-left: 60px;
	margin-bottom: 3rem;
}

.cafla-ldt__item:last-child {
	margin-bottom: 0;
}

.cafla-ldt__year {
	display: inline-block;
	font-family: 'Rubik', sans-serif;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	color: #FFFFFF;
	background: var(--cafla-blue);
	padding: 3px 10px;
	border-radius: 20px;
	position: absolute;
	top: 8px;
	left: 22px;
	transform: translate(-50%, -50%);
	z-index: 2;
	white-space: nowrap;
}

.cafla-ldt__dot {
	position: absolute;
	left: 22px;
	top: 8px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: var(--cafla-cream);
	border: 3px solid var(--cafla-blue);
	z-index: 1;
}

.cafla-ldt__card {
	display: flex;
	flex-direction: column;
	background: #FFFFFF;
	border: 1px solid #E8E4DA;
	border-radius: 10px;
	overflow: hidden;
	width: 100%;
	transition: box-shadow 0.2s ease;
}

.cafla-ldt__card:hover {
	box-shadow: 0 4px 16px rgba(27, 79, 140, 0.08);
}

.cafla-ldt__image {
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--cafla-cream);
}

.cafla-ldt__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.cafla-ldt__body {
	padding: 1.25rem 1.5rem 1.5rem;
}

.cafla-ldt__date {
	display: inline-block;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--cafla-gold);
	margin-bottom: 0.5rem;
}

.cafla-ldt__titre {
	margin: 0 0 0.6rem;
	font-size: 1.35rem;
	line-height: 1.3;
}

.cafla-ldt__titre a {
	color: var(--cafla-text);
	text-decoration: none;
}

.cafla-ldt__titre a:hover {
	color: var(--cafla-blue);
}

.cafla-ldt__resume {
	margin: 0 0 1rem;
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--cafla-text-muted);
}

.cafla-ldt__lien {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--cafla-blue);
	text-decoration: none;
}

.cafla-ldt__lien:hover {
	color: var(--cafla-blue-dark);
	text-decoration: underline;
}

.cafla-ldt__arrow {
	flex-shrink: 0;
	transition: transform 0.15s ease;
}

.cafla-ldt__lien:hover .cafla-ldt__arrow {
	transform: translateX(3px);
}

.cafla-ldt__item--left .cafla-ldt__lien:hover .cafla-ldt__arrow {
	transform: translateX(-3px);
}

/* Desktop : alternance gauche / droite autour d'une ligne centrale */
@media (min-width: 768px) {
	.cafla-ldt::before {
		left: 50%;
		margin-left: -1px;
	}

	.cafla-ldt__item {
		width: 50%;
		padding-left: 0;
		margin-bottom: 3.5rem;
	}

	.cafla-ldt__item--left {
		padding-right: 3rem;
		margin-left: 0;
		flex-direction: row-reverse;
		text-align: right;
	}

	.cafla-ldt__item--right {
		padding-left: 3rem;
		margin-left: 50%;
	}

	.cafla-ldt__item--left .cafla-ldt__dot {
		left: auto;
		right: -8px;
	}

	.cafla-ldt__item--right .cafla-ldt__dot {
		left: -8px;
	}

	.cafla-ldt__item--left .cafla-ldt__year {
		left: auto;
		right: -8px;
	}

	.cafla-ldt__item--right .cafla-ldt__year {
		left: -8px;
	}

	.cafla-ldt__item--left .cafla-ldt__lien {
		flex-direction: row-reverse;
	}
}

@media (prefers-reduced-motion: reduce) {
	.cafla-ldt__card {
		transition: none;
	}
}
