/* ============================================================
   dossiers.css · couverture, catégories, hubs, articles liés, liste /dossiers
   Style v3. Charge APRÈS v3.css (via dossiers_head_blog() de inc/dossiers.php).
   Reprend les noms de classes de l'ancien dossiers.css et le <style> inline
   de dossiers.php (.dossier-list, .dossier-item, .dossier-title, ...).
   La prose, les encadrés (.lp-callout) et le sommaire sont dans v3.css.
   ============================================================ */

/* ── Couverture d'article ──────────────────────────────────── */
.dossier-cover { padding: 0 var(--pad-x); }
.dossier-cover img { width: 100%; max-width: 960px; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 24px; background: var(--tint); }
.dossier-cover + .lp-toc-wrap, .dossier-cover + .lp-section { padding-top: clamp(36px, 4.4vw, 56px); }

/* ── Catégories (pastilles) ────────────────────────────────── */
.dossier-cats { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 28px; }
.dossier-cats a { padding: 8px 16px; border-radius: 999px; background: var(--tint); font-size: 14.5px; color: var(--ink); transition: background .2s, color .2s; }
.dossier-cats a:hover { background: var(--ink); color: var(--paper); }
.dossier-cats a span { margin-left: 4px; font-weight: 500; color: var(--terra-ink); }
.dossier-cats a:hover span { color: var(--terra-lt); }

/* ── Cartes d'article : liste /dossiers, hubs, « à lire aussi » ── */
.dossier-list, .dossier-lies-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--cg); align-items: start; margin-top: 12px; }
.dossier-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dossier-lies-grid.dossier-hub { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dossier-list > *, .dossier-lies-grid > * { min-width: 0; }
.dossier-lies-grid:not(.dossier-hub) > :nth-child(3n + 2), .dossier-list > :nth-child(2n), .dossier-hub > :nth-child(2n) { margin-top: 28px; }
.dossier-item, .dossier-lie { display: flex; flex-direction: column; gap: 10px; padding: 0 0 24px; overflow: hidden; border-radius: 22px; background: #FBF9F3; box-shadow: 0 14px 30px -24px rgba(11, 26, 17, .5); transition: transform .35s cubic-bezier(.2, .7, .2, 1); }
.dossier-item:hover, .dossier-lie:hover { transform: translateY(-4px); }
.dossier-item:not(:has(img)), .dossier-lie:not(:has(img)) { padding-top: 24px; }
.dossier-item img, .dossier-lie img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; margin-bottom: 6px; background: var(--tint); }
.dossier-item > span, .dossier-lie > span { padding-inline: 24px; }
.dossier-tag { font-size: 12px; font-weight: 500; letter-spacing: .09em; text-transform: uppercase; color: var(--terra-ink); }
.dossier-title, .dossier-lie-t { font-size: clamp(19px, 1.7vw, 23px); font-weight: 500; line-height: 1.2; letter-spacing: -.018em; color: var(--ink); }
.dossier-desc, .dossier-lie-d { font-size: 14.5px; line-height: 1.6; color: var(--ink-2); }
.dossier-go { font-size: 14px; font-weight: 500; color: var(--terra-ink); }
.dossier-pilier { margin: 0 0 30px; font-size: 14.5px; color: var(--ink-3); }
.dossier-pilier a { color: var(--ink); border-bottom: 1px solid var(--terra); }
.dossier-lies .lp-sec-eyebrow:not(:first-child) { margin-top: 44px; }

/* Deux cartes seulement : deux colonnes, pas un tiers de vide */
.dossier-lies-grid:not(.dossier-hub):not(:has(> :nth-child(3))) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dossier-lies-grid:not(.dossier-hub):not(:has(> :nth-child(3))) > :nth-child(3n + 2) { margin-top: 0; }
.dossier-lies-grid:not(.dossier-hub):not(:has(> :nth-child(3))) > :nth-child(2n) { margin-top: 28px; }

/* Blocs du contenu des articles posés au milieu d'une prose : de l'air autour */
.lp-prose .lp-offer, .lp-prose .lp-timeline, .lp-prose .lp-grid, .lp-prose .lp-table { margin-block: clamp(28px, 3.4vw, 44px); }

/* Divers ────────────────────────────────────────────────── */
.lp-hero .lp-lead + .lp-lead { margin-top: -14px; }

@media (max-width: 880px) {
  .dossier-list, .dossier-lies-grid, .dossier-lies-grid.dossier-hub { grid-template-columns: minmax(0, 1fr); }
  .dossier-lies-grid:not(.dossier-hub) > :nth-child(n), .dossier-list > :nth-child(n), .dossier-hub > :nth-child(n) { margin-top: 0; }
}

/* Desktop : la couverture et le sommaire tiennent toute la largeur du conteneur, comme les blocs larges
   (offre, grille). Sous le hero calé à gauche, un décalage à 34 % laissait un vide et sortait de l'axe.
   Dans le sommaire, le titre occupe la colonne de gauche et la liste démarre sur l'axe à 34 %, comme les sections. */
@media (min-width: 1000px) {
  .dossier-cover img { max-width: none; aspect-ratio: 16 / 9; }
  .lp-toc-wrap > .lp-toc { display: grid; grid-template-columns: calc((100% + 60px) * .34 - 30px) minmax(0, 1fr); align-items: baseline; margin-left: 0; }
  .lp-toc-wrap > .lp-toc .lp-toc-title { margin-bottom: 0; }
}