/* ═════════════════════════════════════════════════════════════════════
   MEDIA — liste /media/, filtres /media/press-releases/ et /media/posts/,
   articles /articles/<catégorie>/<slug>/.
   Chargée automatiquement sur ces vues (fsa_view_key() = « media »).
   Composants du socle (style.css) : .fsa-news-list, .fsa-news-item (--lead,
   --no-thumb), .fsa-filters, .fsa-pagination, .fsa-prose, .fsa-cta, ouverture
   éditoriale (.fsa-hero-inner--plain + .fsa-stage--ghost). Ici : leurs réglages
   propres à Media, et le gabarit d'article.

   13/11/2026 — refonte 0.9.0, direction C (lot P4, docs/85-refonte-design/lots/
   p4-lieux-editorial.md) : liste à filets de la maquette C § 9 (une à la une, image
   ou vignette composée ; rangs sans vignette quand l'article n'a pas d'image), hero
   « index » (titre et filtres sur une ligne), article à colonne de lecture sur la
   trame 3 / 9 (rail, titre, chapô et texte sur le même axe), « More news » en trois
   colonnes de texte. Couleurs, tailles : variables seulement ; photos en couleurs
   naturelles.
   ═════════════════════════════════════════════════════════════════════ */

/* Écart de la trame 3 / 9 de Media (hero d'article, corps, rail). */
.fsa-media,
.fsa-media__listing { --fsa-media-gap: clamp(2rem, 4vw, 3.5rem); }

/* ── Liste : hero « index » ────────────────────────────────────────── */
/* Le titre et les filtres se partagent la ligne de pied du hero (≥ 761 px) : les
   filtres se calent sur le pied du titre, à droite, sur le papier (lisibles sur le
   treillis fantôme). En dessous : les filtres passent sous le titre. */
.fsa-media__hero-list .fsa-hero-inner__grid {
	padding-bottom: clamp(2.25rem, 4vw, 3.25rem);
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.25rem 3rem;
}
.fsa-media__hero-list .fsa-hero-inner__grid > * + * { margin-top: 0; }
.fsa-media__hero-list .fsa-hero-inner__grid > :is(h1, .fsa-h1) { flex: 0 1 auto; }
.fsa-media__filters { flex: 0 1 auto; padding-bottom: .35rem; }
.fsa-media__filters .fsa-filters a:not([aria-current]) { background: var(--fsa-bg); }
@media (max-width: 760px) {
	.fsa-media__hero-list .fsa-hero-inner__grid { display: block; }
	.fsa-media__hero-list .fsa-hero-inner__grid > * + * { margin-top: 1.25rem; }
	.fsa-media__filters { padding-bottom: 0; }
}

/* ── Liste : rangs ─────────────────────────────────────────────────── */
.fsa-media__listing { padding-top: clamp(2rem, 1.25rem + 2.4vw, 3.5rem); }
/* À la une : visuel 16:9 (16:10 du socle : +44 px à 1440 pour la même lecture). */
.fsa-media__une .fsa-news-item__thumb { aspect-ratio: 16 / 9; }
/* Pied de la liste : la pagination porte déjà sa réserve ; la bande bleue suit. */
.fsa-media__listing { padding-bottom: clamp(3.5rem, 2rem + 4.4vw, 6rem); }
.fsa-media__list { --fsa-media-row: 20px; }
.fsa-media__item { padding-block: var(--fsa-media-row); }
/* Titre de rang au corps d'un titre de liste (18 → 22) : sur une ligne le plus
   souvent, la colonne pleine (sans vignette) ; chapô à la mesure de la colonne. */
/* Passe G (13/11, lot G2 ; hauteur avec Poppins) : la mesure du titre passe de 46 à 60 ch
   (le résumé en a 78) — un titre de 50 à 60 signes tient sur une ligne au bureau. */
.fsa-media__item .fsa-news-item__title { margin: 0; max-width: 60ch; font-size: clamp(1.125rem, 1rem + .45vw, 1.375rem); line-height: 1.28; }
.fsa-media__item .fsa-news-item__excerpt { max-width: 78ch; margin-top: 8px !important; }
.fsa-news-item__meta .fsa-pending { margin-left: 0; }
.fsa-media__cat { color: var(--fsa-fg-strong); }
/* Vignette (article AVEC image seulement) : image entière (bannières à texte,
   design-2 B2), couleurs naturelles, sur la teinte de bande. */
.fsa-media__item .fsa-news-item__thumb { aspect-ratio: 16 / 10; }
.fsa-news-item__thumb > .fsa-media__img { object-fit: contain; }
@media (min-width: 1024px) {
	/* Colonne de méta assez large pour « September 19, 2018 » sur une ligne. */
	.fsa-media__item .fsa-news-item__meta time { white-space: nowrap; }
}
@media (max-width: 1023px) {
	.fsa-media__item .fsa-news-item__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem .9rem; }
}
/* Tablette : la vignette reste à droite du texte, en petit. */
@media (min-width: 601px) and (max-width: 1023px) {
	.fsa-media__item:not(.fsa-news-item--no-thumb) { grid-template-columns: minmax(0, 1fr) minmax(0, 11rem); column-gap: 1.75rem; }
	.fsa-media__item .fsa-news-item__thumb { order: 0; grid-column: 2; grid-row: 1 / span 2; align-self: start; max-width: none; }
	.fsa-media__item:not(.fsa-news-item--no-thumb) > :not(.fsa-news-item__thumb) { grid-column: 1; }
}
@media (max-width: 600px) {
	/* Liste courte au téléphone : le titre porte le rang (vignette décorative retirée,
	   comme avant). */
	.fsa-media__item .fsa-news-item__thumb { display: none; }
	.fsa-media__list { --fsa-media-row: 18px; }
	.fsa-media__item { row-gap: 8px; }
}

/* ── Liste : à la une (page 1 de « All ») ──────────────────────────── */
/* Visuel 16:10 (7 colonnes) : l'image de l'article, sinon sa vignette composée (le
   champ du lot S-b porte son ton : navy, bleu ou teinte selon la graine) ; texte
   calé au pied (5 colonnes). */
.fsa-media__vis { position: relative; overflow: hidden; isolation: isolate; }
.fsa-media__vis > .fsa-field { background: var(--fsa-lat-bg); }
.fsa-media__une-body { align-self: stretch; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding-bottom: 6px; }
:where(.fsa-media__une-body) > * { margin: 0; }
.fsa-media__une .fsa-news-item__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem 14px; margin-bottom: 16px; }
.fsa-media__une .fsa-news-item__title { max-width: 18ch; }
.fsa-media__read { margin-top: 18px; }
.fsa-media__une:hover .fsa-media__read,
.fsa-media__more-item:hover .fsa-media__read { text-decoration-color: currentColor; text-decoration-thickness: 2px; }
@media (max-width: 1023px) {
	.fsa-media__une { padding-bottom: 32px; }
	.fsa-media__une .fsa-news-item__title { max-width: 26ch; }
}
@media (max-width: 600px) {
	.fsa-media__une { row-gap: 18px; padding-bottom: 26px; }
	.fsa-media__une .fsa-news-item__meta { margin-bottom: 10px; }
}

/* ── Pagination : Newer à gauche, repère au centre, Older à droite ─── */
.fsa-media__pagination { display: grid; grid-template-columns: 1fr auto 1fr; }
.fsa-media__pagination .fsa-media__older { justify-self: end; }
.fsa-media__empty { max-width: 34rem; }
@media (max-width: 600px) {
	.fsa-media__pagination { grid-template-columns: 1fr 1fr; }
	.fsa-media__page { display: none; }
}

/* ── Article : en-tête ─────────────────────────────────────────────── */
/* Ouverture éditoriale « lecture » : le titre et le chapô se posent sur l'axe de la
   colonne de lecture (colonne 4 de la trame, où commence le texte), la marge reste
   au rail ; le fond est le champ cristal de l'article (graine = son ID). */
/* Fil d'Ariane d'un article : « Home › Media » (le titre est le H1 juste dessous). */
.fsa-media__hero .fsa-crumbs li:last-child { display: none; }
.fsa-media__head > * { margin: 0; }
.fsa-media__hero .fsa-media__title {
	max-width: 30ch;
	font-size: clamp(1.75rem, 1rem + 2.4vw, 2.875rem); /* 28 → 46 : un titre de 90 signes tient en trois lignes */
	line-height: 1.08;
	letter-spacing: -.028em;
}
.fsa-media__hero .fsa-hero-inner__grid { padding-bottom: clamp(2.25rem, 4vw, 3.25rem); }
.fsa-media__hero .fsa-media__lead { max-width: 54ch; }
.fsa-media__lead p { margin: 0; }
@media (min-width: 1024px) {
	.fsa-media__hero .fsa-media__head {
		display: grid;
		grid-template-columns: minmax(0, 3fr) minmax(0, 9fr);
		column-gap: var(--fsa-media-gap);
		row-gap: clamp(1.1rem, 2vw, 1.6rem);
	}
	.fsa-media__hero .fsa-media__head > * { grid-column: 2; margin: 0; }
}

/* ── Article : rail + colonne de lecture ───────────────────────────── */
.fsa-media__body { padding-block: clamp(2rem, 1.25rem + 2.4vw, 3.5rem) clamp(3.5rem, 2rem + 4.4vw, 6rem); }
.fsa-media__layout {
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(0, 9fr);
	column-gap: var(--fsa-media-gap);
	align-items: start;
}
:where(.fsa-media__layout) > * { margin: 0; }
.fsa-media__layout > * { min-width: 0; }

/* Rail : rubrique, date, retour à la liste — collant pendant la lecture, sous un
   filet fort (le même que la colonne de lecture). */
.fsa-media__rail {
	position: sticky;
	top: calc(var(--fsa-hdr-h) + 2rem);
	display: grid;
	justify-items: start;
	gap: 1rem;
	padding-top: 1rem;
	border-top: 1px solid var(--fsa-fg-strong);
}
:where(.fsa-media__rail) > * { margin: 0; }
.fsa-media__meta {
	display: grid;
	justify-items: start;
	gap: .5rem;
	font: 500 var(--fsa-fs-sm)/1.3 var(--fsa-font-sans);
	color: var(--fsa-fg-strong);
}
.fsa-media__meta .fsa-pending { margin-left: 0; }
.fsa-media__back .fsa-arr { display: inline-block; }

/* Colonne de lecture : mesure ≈ 68 signes, corps 18 px au bureau, interligne 1,7. */
.fsa-media__main { max-width: 43rem; padding-top: 1rem; border-top: 1px solid var(--fsa-fg-strong); }
.fsa-media__main > .fsa-prose { max-width: none; }
@media (min-width: 1024px) {
	.fsa-media__body .fsa-prose { font-size: 1.125rem; line-height: 1.72; }
}
.fsa-media__body .fsa-prose > * + * { margin-block-start: 1.05em; }
.fsa-media__body .fsa-prose > h2 { margin-block-start: 1.9em; font-size: var(--fsa-fs-h3); line-height: 1.22; letter-spacing: -.015em; }
.fsa-media__body .fsa-prose > h3 { margin-block-start: 1.6em; font-size: var(--fsa-fs-h4); }
.fsa-media__body .fsa-prose > :is(h2, h3) + * { margin-block-start: .55em; }
.fsa-media__body .fsa-prose :is(ul, ol) { padding-left: 1.2em; }
.fsa-media__body .fsa-prose li + li { margin-top: .45em; }
.fsa-media__body .fsa-prose li::marker { color: var(--fsa-accent); }
/* Citation : de la typographie, pas une boîte — Poppins, filet d'accent. */
.fsa-media__body .fsa-prose blockquote {
	margin: 1.6em 0;
	padding: .1rem 0 .1rem 1.25rem;
	border-left: 2px solid var(--fsa-accent);
	font: 500 var(--fsa-fs-h4)/1.45 var(--fsa-font-title);
	letter-spacing: -.01em;
	color: var(--fsa-fg-strong);
}
.fsa-media__body .fsa-prose blockquote p { margin: 0; }
.fsa-media__body .fsa-prose blockquote p + p { margin-top: .6em; }
.fsa-media__body .fsa-prose blockquote cite {
	display: block;
	margin-top: .7rem;
	font: 500 var(--fsa-fs-data)/1.5 var(--fsa-font-mono);
	font-style: normal;
	letter-spacing: .02em;
	color: var(--fsa-fg-soft);
}
/* Images posées dans le texte (blocs Image du client) : pleine colonne, couleurs
   naturelles, légende en donnée mono sous un filet. */
.fsa-media__body .fsa-prose :is(figure, .wp-block-image) { margin-block: 1.8em; }
.fsa-media__body .fsa-prose :is(figure, .wp-block-image) img { display: block; width: 100%; height: auto; border-radius: 0; filter: none; }
.fsa-media__body .fsa-prose :is(figure, .wp-block-image) figcaption,
.fsa-media__figure figcaption {
	margin-top: .7rem;
	padding-top: .6rem;
	border-top: 1px solid var(--fsa-rule);
	font: 500 var(--fsa-fs-data)/1.5 var(--fsa-font-mono);
	letter-spacing: .02em;
	color: var(--fsa-fg-soft);
}

/* Image à la une de l'article, en tête de la colonne (couleurs naturelles). Bornée
   entre 21:9 et 4:3, recadrée au centre au-delà (FIX-1, audit A, B6) : les images du
   site (16:9 à 2:1) restent à leur rapport. */
.fsa-media__figure { margin: 0 0 clamp(1.75rem, 3.5vw, 2.5rem); container-type: inline-size; }
.fsa-media__figure-img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 75cqw;
	min-height: 42.85cqw;
	object-fit: cover;
	border-radius: 0;
	background: var(--fsa-band);
}

/* Ligne de source et liens d'origine, en pied d'article */
.fsa-prose > .fsa-media__source {
	margin-block-start: 2.4em;
	padding-top: 1.1rem;
	border-top: 1px solid var(--fsa-rule-strong);
	font-size: var(--fsa-fs-base);
	line-height: 1.55;
	color: var(--fsa-fg-soft);
}
.fsa-media__source > * { margin: 0; }
.fsa-media__source > * + * { margin-top: .6rem; }
.fsa-media__source-line strong {
	margin-right: .6rem;
	font: 500 var(--fsa-fs-data)/1.5 var(--fsa-font-mono);
	letter-spacing: .02em;
	color: var(--fsa-fg-strong);
}
.fsa-media__body .fsa-prose .fsa-media__links { padding-left: 0; list-style: none; }
.fsa-media__links a { display: inline-flex; align-items: center; min-height: 44px; }
.fsa-prose .fsa-media__links li + li { margin-top: 0; }

@media (max-width: 1023px) {
	/* Le rail devient la ligne de méta au-dessus du texte ; titre, chapô et texte
	   reviennent à la marge. */
	.fsa-media__layout { grid-template-columns: minmax(0, 1fr); row-gap: 1.25rem; }
	.fsa-media__rail {
		position: static;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: .5rem 1.5rem;
		max-width: 43rem;
		padding-top: .85rem;
	}
	.fsa-media__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem .9rem; }
	.fsa-media__main { padding-top: 0; border-top: 0; }
}

/* ── More news : trois colonnes de texte sous un filet fort ────────── */
.fsa-media__more { padding-block: clamp(3.5rem, 2rem + 4.4vw, 6rem); }
.fsa-media__more .fsa-sec-head { margin-bottom: clamp(1.75rem, 1.2rem + 1.8vw, 2.75rem); }
.fsa-media__more-list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--fsa-fg-strong);
}
.fsa-media__more-item {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-width: 0;
	margin: 0;
	padding: 24px var(--fsa-col-gap) 4px 0;
}
.fsa-media__more-item + .fsa-media__more-item { padding-left: var(--fsa-col-gap); border-left: 1px solid var(--fsa-rule); }
:where(.fsa-media__more-item) > * { margin: 0; }
.fsa-media__more-item .fsa-news-item__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 12px; }
.fsa-media__more-title {
	margin-top: 14px !important;
	max-width: 26ch;
	font: 500 var(--fsa-fs-h4)/1.3 var(--fsa-font-title);
	letter-spacing: -.01em;
	color: var(--fsa-fg-strong);
	text-wrap: balance;
}
.fsa-media__more-title a { color: inherit; text-decoration: none; }
.fsa-media__more-title a::after { content: ""; position: absolute; inset: 0; }
.fsa-media__more-title a:focus-visible { outline: none; }
.fsa-media__more-item:has(.fsa-media__more-title a:focus-visible) { outline: 2px solid var(--fsa-focus); outline-offset: 4px; }
.fsa-media__more-item:hover .fsa-media__more-title a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
.fsa-media__more-item .fsa-media__read { margin-top: auto; padding-top: 16px; }
@media (max-width: 1023px) {
	.fsa-media__more-list { grid-template-columns: minmax(0, 1fr); }
	.fsa-media__more-item,
	.fsa-media__more-item + .fsa-media__more-item { padding: 18px 0 20px; border-left: 0; }
	.fsa-media__more-item + .fsa-media__more-item { border-top: 1px solid var(--fsa-rule); }
	.fsa-media__more-title { max-width: 40ch; }
}
