/* ==========================================================================
   Parcours : fond sable, titre FreightBig, dates en grille (année / intitulé,
   Gotham Book 20/46), illustration à droite.
   ========================================================================== */

.parcours {
	padding-top: var(--univers-pad-top);
	padding-bottom: var(--parcours-pad-bas);
}

.parcours__titre {
	grid-column: 1 / -1;
}

.parcours__liste {
	grid-column: 1 / 9;
	grid-row: 2;
	margin-top: var(--parcours-liste-haut);
	line-height: var(--lh-timeline);
}

.parcours__etape {
	display: grid;
	grid-template-columns: var(--parcours-col-annee) 1fr;
}

.parcours__illustration {
	grid-column: 9 / -1;
	grid-row: 2;
	justify-self: end;
	width: var(--parcours-illu-w);
	margin-top: var(--parcours-illu-haut);
}

.parcours__illustration-img {
	width: 100%;
	height: auto;
}

/* Tablette et mobile : illustration sous la liste ; mobile : année au-dessus de l'intitulé. */
@media (max-width: 1023.98px) {
	.parcours {
		padding-bottom: var(--space-xl);
	}

	.parcours__liste,
	.parcours__illustration {
		grid-column: 1 / -1;
	}

	.parcours__illustration {
		grid-row: 3;
		justify-self: center;
		width: var(--parcours-illu-mobile);
		margin-top: var(--space-l);
	}
}

@media (max-width: 767.98px) {
	.parcours__liste {
		margin-top: var(--space-l);
		line-height: var(--lh-body);
	}

	.parcours__etape {
		grid-template-columns: 1fr;

		& + & {
			margin-top: var(--space-s);
		}
	}

	.parcours__annee {
		font-weight: var(--fw-medium);
		font-size: var(--fs-cta);
		color: var(--c-grey);
	}
}