/*
 * Dernières réalisations (bloc acf/latest-works, accueil) : titre et lien vers toutes les
 * réalisations, puis une rangée de cartes « cartouche de plan » de même largeur.
 * La carte elle-même vient de carte-plan.css ; les chiffres comptent jusqu'à leur valeur à
 * l'arrivée à l'écran (realisations.js).
 */

.cp-main > .cp-works-part { margin-block: 0; }

.cp-last {
	--cp-last-navy: var(--wp--preset--color--navy, #000033);
	--cp-last-orange: var(--wp--preset--color--orange, #FF9900);
	--cp-last-mute: var(--wp--preset--color--mute, #555B6B);
	--cp-last-line: var(--wp--preset--color--line, #E3E5EC);
	max-width: 1400px;
	margin: 0 auto !important;
	padding: clamp(72px, 9vw, 120px) clamp(16px, 3vw, 40px);
	background: #fff;
}
.cp-last,
.cp-last * { box-sizing: border-box; }
.cp-last p,
.cp-last h2,
.cp-last ul { margin: 0; }

.cp-last__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 16px 40px; margin-bottom: clamp(32px, 4vw, 52px); }
.cp-last .cp-last__title { color: var(--cp-last-navy); font-size: clamp(32px, 3.2vw, 46px); line-height: 1.1; font-weight: 700; letter-spacing: -.01em; }
.cp-last__all { display: inline-flex; align-items: center; gap: 10px; padding-bottom: 2px; border-bottom: 2px solid var(--cp-last-orange); color: var(--cp-last-navy); font-weight: 700; text-decoration: none; }
.cp-last__all svg { width: 15px; height: 15px; transition: transform .2s; }
.cp-last__all:hover svg { transform: translateX(3px); }
.cp-last__all:focus-visible { outline: 2px solid var(--cp-last-orange); outline-offset: 3px; }
.cp-last__empty { padding: 24px; border: 1px dashed var(--cp-last-line); color: var(--cp-last-mute); }

.cp-last__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
/* Deux réalisations seulement : deux colonnes pleines, pas de case vide. */
@media (min-width: 901px) {
	.cp-last__grid:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.cp-last__grid > .cp-plan { min-width: 0; }

@media (max-width: 900px) {
	.cp-last__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
	.cp-last__all svg { transition: none; }
}
