/* Blog : un fil de publications (charge uniquement par blog.php, apres annex.css). Une colonne de lecture, une publication = date, titre, photo, texte.
   Separations discretes, espacement regulier. Pas de vedette, pas de texte sur les photos, pas de cadre vide : une publication sans image est aussi nette
   qu'une publication illustree. Les photos gardent leurs proportions (recadrage seulement au-dela d'une hauteur maximale). */
.fd-feed { display: grid; }
.fd-post { min-width: 0; padding: 24px 0 26px; border-top: 1px solid var(--an-line); }
.fd-post:first-child { border-top: 0; padding-top: 4px; }
.fd-date { display: block; margin: 0 0 6px; font-size: .8125rem; font-weight: 500; color: var(--an-muted); font-variant-numeric: tabular-nums; }
.fd-title { margin: 0; font-size: 1.25rem; font-weight: 650; line-height: 1.25; letter-spacing: -.012em; text-wrap: balance; overflow-wrap: anywhere; }
/* Emoji d'un titre : leger, aligne, il n'agrandit pas la ligne */
.an-emoji { display: inline-block; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; font-size: .9em; line-height: 1; margin-inline-end: .1em; vertical-align: -.04em; font-weight: 400; }
.fd-media { margin: 14px 0 0; overflow: hidden; border-radius: 12px; background: color-mix(in srgb, var(--an-text) 8%, var(--an-bg)); }
.fd-media img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.fd-text { margin: 12px 0 0; max-width: 62ch; color: var(--an-text); }
.fd-text p { margin: 0 0 .85em; }
.fd-text > :last-child, .fd-rest > :last-child { margin-bottom: 0; }
.fd-text.is-collapsed .fd-first { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; line-clamp: 4; overflow: hidden; margin-bottom: 0; }
.fd-text.is-collapsed .fd-rest { display: none; }
.fd-empty { max-width: 34rem; padding: 8px 0 0; }

/* « Lire la suite » : bouton texte, zone tactile de 44 px */
.an-more { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin: 2px 0 0; padding: 0; border: 0; background: none; color: var(--an-accent); font: inherit; font-size: .9375rem; font-weight: 650; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1.5px; cursor: pointer; touch-action: manipulation; }
.an-more[hidden] { display: none; }
.an-more svg { transition: transform 180ms cubic-bezier(.23, 1, .32, 1); }
.an-more[aria-expanded="true"] svg { transform: rotate(180deg); }

@media (min-width: 720px) {
  .fd-post { padding: 34px 0 38px; }
  .fd-title { font-size: 1.5rem; line-height: 1.2; }
  .fd-date { font-size: .875rem; }
  .fd-media { margin-top: 16px; border-radius: 16px; }
  .fd-media img { aspect-ratio: 3 / 2; max-height: 30rem; }
  .fd-text { font-size: 1.0625rem; margin-top: 14px; }
}
@media (prefers-reduced-motion: reduce) { .an-more svg { transition: none; } }
