/* ==========================================================================
   Site4 — page « Nos actualités » (maquette Figma node 129:3191) et page d'une actualité
   S'appuie sur projets.css (introduction, en-tête de page, « autres » contenus)
   et appels-offres.css (introduction à grand titre).
   ========================================================================== */

.page-actus {
	margin: 78.85px auto 91.6px;
}

/* Trait sous l'introduction (le trait occupe le dernier pixel de l'espacement prévu) */
.page-actus .pp-intro {
	padding-bottom: calc(45.38px - 0.856px);
	border-bottom: 0.856px solid var(--pp-line);
}

/* ---------- Liste ---------- */

.actus-list {
	padding: 67.64px 0 53.09px;
	scroll-margin-top: 24px;
}

.actus-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 34.25px 25.69px;
}

.acard {
	display: flex;
	flex-direction: column;
	min-height: 486.14px;
	color: var(--pp-ink);
}

.acard__media {
	display: block;
	height: 250.51px;
	overflow: hidden;
	border-radius: 10.275px;
	background: #f3f5f7;
}

.acard__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding-top: 22.26px;
}

.acard__rubrique {
	font-size: 10.275px;
	font-weight: 700;
	line-height: 16.44px;
	letter-spacing: 1.233px;
	color: var(--pp-blue);
	text-transform: uppercase;
}

.acard__title {
	min-height: 65.07px;
	padding-top: 11.99px;
	font-size: 18.837px;
	font-weight: 500;
	line-height: 26.372px;
	letter-spacing: -0.4709px;
}

.acard__text {
	min-height: 65.07px;
	padding-top: 12.84px;
	font-size: 11.987px;
	line-height: 21.577px;
	color: var(--pp-muted);
}

.acard__more {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 33.39px;
	margin-top: 20.55px;
	padding-bottom: 14.56px;
	border-bottom: 0.856px solid var(--pp-line);
	font-size: 11.987px;
	line-height: 17.981px;
	color: var(--pp-muted);
	transition: color 0.25s, border-color 0.25s;
}

.acard__more img {
	width: 15.41px;
	height: 15.41px;
}

.acard:hover .acard__more {
	border-color: var(--pp-blue);
	color: var(--pp-blue);
}

/* ---------- Page d'une actualité (maquette Figma node 129:3416) ---------- */

.page-actu {
	margin: 64.85px auto 196.33px;
}

.actu-back {
	display: flex;
	align-items: center;
	height: 53.94px;
	margin-top: 15.41px;
	border-bottom: 0.856px solid #e3e8ee;
}

.actu-back__link {
	display: inline-flex;
	align-items: center;
	gap: 8.56px;
	font-size: 10.275px;
	line-height: 15.41px;
	color: var(--pp-muted);
	transition: color 0.25s;
}

.actu-back__link:hover {
	color: var(--pp-blue);
}

.actu-back__link img {
	width: 15.41px;
	height: 15.41px;
}

.actu-header {
	max-width: 856.22px;
	padding-top: 44.53px;
}

/* Date | temps de lecture */
.actu-meta {
	display: flex;
	align-items: center;
	gap: 21.41px;
	font-size: 9.418px;
	line-height: 15px;
	color: var(--pp-muted);
}

.actu-meta__reading {
	display: inline-flex;
	align-items: center;
	gap: 5.99px;
	padding-inline-start: 21.41px;
	border-inline-start: 0.856px solid var(--pp-line);
}

.actu-meta__reading img {
	width: 11.13px;
	height: 11.13px;
	padding: 0.93px;
}

.actu-header__title {
	max-width: 839.1px;
	padding-top: 20.55px;
	font-size: 65.073px;
	font-weight: 600;
	line-height: 71.58px;
	letter-spacing: -2.9283px;
}

.actu-header__lead {
	max-width: 590.8px;
	padding-top: 20.55px;
	font-size: 15.412px;
	line-height: 27.742px;
	color: var(--pp-muted);
}

.actu-cover {
	height: 479.49px;
	margin: 36.82px 0 42.81px;
	overflow: hidden;
	border-radius: 11.987px;
	background: #f3f5f7;
}

.actu-body__eyebrow {
	font-size: 8.562px;
	line-height: 13.7px;
	letter-spacing: 1.5412px;
}

.actu-content {
	padding-top: 15.89px;
	font-size: 15.412px;
	line-height: 30.053px;
	color: #455164;
}

.actu-content > * {
	margin: 0;
}

.actu-content > * + * {
	margin-top: 23.95px;
}

.actu-content h2,
.actu-content h3 {
	font-weight: 600;
	line-height: 1.3;
	color: var(--pp-ink);
}

.actu-content a {
	color: var(--pp-blue);
	text-decoration: underline;
}

.actu-content img {
	border-radius: 10.275px;
}

.actu-back-button {
	display: inline-flex;
	align-items: center;
	height: 32px;
	margin-top: 49.1px;
	padding: 0 13px;
	border-radius: var(--pill);
	background: var(--pp-blue);
	font-size: 9.75px;
	font-weight: 500;
	line-height: 11.7px;
	letter-spacing: 0.75px;
	color: #fff;
	transition: background-color 0.25s;
}

.actu-back-button:hover {
	background: var(--navy);
}

/* D'autres regards */
.actu-related {
	margin-top: 82.65px;
	padding: 36.82px 0 64.22px;
	border-top: 0.856px solid var(--pp-line);
}

.actu-related__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	padding-top: 14.56px;
}

.actu-related__title {
	font-size: 30.824px;
	font-weight: 500;
	line-height: 36.989px;
	letter-spacing: -0.8562px;
}

.actu-related__title span {
	display: block;
	color: var(--pp-blue);
}

.actu-related .pd-related__link {
	gap: 12px;
}

.actus-grid--two {
	grid-template-columns: repeat(2, 1fr);
	margin-top: 35.1px;
}

.acard--wide {
	min-height: 0;
}

.acard--wide .acard__media {
	height: 288.98px;
}

.acard--wide .acard__more {
	margin-top: 12.84px;
}

/* ==========================================================================
   Tablette / mobile
   ========================================================================== */

@media (max-width: 1023px) {
	.actus-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.actu-cover {
		height: auto;
		aspect-ratio: 1066 / 479.49;
	}

	.actu-header__title {
		font-size: 48px;
		line-height: 54px;
		letter-spacing: -2px;
	}
}

@media (max-width: 767px) {
	.page-actus {
		margin: 24px auto 40px;
	}

	.actus-list {
		padding: 32px 0 40px;
	}

	.actus-grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.acard,
	.acard__title,
	.acard__text {
		min-height: 0;
	}

	.page-actu {
		margin: 24px auto 56px;
	}

	.actu-header {
		padding-top: 28px;
	}

	.actu-header__title {
		font-size: 34px;
		line-height: 40px;
		letter-spacing: -1.3px;
	}

	.actu-cover {
		margin: 24px 0 32px;
	}

	.actu-content {
		font-size: 15px;
		line-height: 27px;
	}

	.actu-related {
		margin-top: 56px;
	}

	.actu-related__head {
		flex-direction: column;
		align-items: flex-start;
	}

	.actus-grid--two {
		grid-template-columns: 1fr;
		margin-top: 24px;
	}

	.acard--wide .acard__media {
		height: 220px;
	}
}

/* ==========================================================================
   Animations
   ========================================================================== */

@media (prefers-reduced-motion: no-preference) {
	.acard__media img {
		transition: transform 0.8s var(--ease-out);
	}

	.acard:hover .acard__media img {
		transform: scale(1.06);
	}

	.acard__more img {
		transition: transform 0.35s var(--ease-out);
	}

	.acard:hover .acard__more img {
		transform: translate(2px, -2px);
	}
}