/* Section /poemes/ — poemes ferroviaires.
   Le reste de la mise en page reutilise css/style.css : .prose, .cards, .card,
   .tag, .station-list, .sources, .notice, .crumb. Ne sont definis ici que les
   objets propres a la section : le bloc de vers, le bandeau d'origine et les
   deux corpus de l'index. */

/* ---- le poeme ---------------------------------------------------------- */
/* Un vers n'est pas un paragraphe : il ne se justifie pas, ne se coupe pas au
   milieu, et quand la largeur manque il se replie en retrait plutot que de se
   faire passer pour le vers suivant. D'ou text-indent negatif + padding. */
.prose .poeme {
  margin: 4px 0 34px;
  padding: 26px 30px;
  background: var(--surface-1);
  border: 1px solid var(--hairline);
  border-left: 3px solid var(--accent);
  border-radius: var(--radius);
  max-width: 40em;
}
.prose .poeme .strophe {
  margin: 0 0 1.25em;
  font-family: var(--serif);
  font-weight: 440;
  font-variation-settings: "opsz" 14;
  font-size: 17px;
  line-height: 1.72;
  color: var(--ink-1);
  hyphens: none;
}
.prose .poeme .strophe:last-child { margin-bottom: 0 }
/* Chaque vers est son propre bloc : le retrait doit replier le vers trop long
   sous lui-meme, sans decaler les vers suivants. */
.prose .poeme .v {
  display: block;
  padding-left: 1.4em;
  text-indent: -1.4em;
}

@media (max-width: 640px) {
  .prose .poeme { padding: 20px 18px; }
  .prose .poeme .strophe { font-size: 15.5px; line-height: 1.66 }
}

/* ---- signature et bandeau d'origine ------------------------------------ */
.line-hero .poeme-by {
  margin: -6px 0 14px;
  font-family: var(--serif);
  font-size: 17px;
  color: var(--ink-2);
}
.line-hero .poeme-by .muted { font-size: 14px; color: var(--ink-3) }

/* Bandeau d'attribution, sur les seuls textes du domaine public. */
.poeme-origine {
  margin: 0;
  max-width: 62ch;
  padding: 11px 15px;
  border-radius: var(--radius);
  border: 1px solid var(--hairline);
  font-size: 13px;
  line-height: 1.6;
  color: var(--ink-2);
}
.poeme-origine strong { color: var(--ink-1) }
.poeme-origine a { color: var(--accent-ink) }
.poeme-origine.dp {
  background: var(--surface-1);
  border-left: 3px solid var(--ink-3);
}

/* ---- index : les deux corpus ------------------------------------------- */
.pgroup { margin-top: 38px }
.pgroup:first-of-type { margin-top: 8px }
.pgroup > h2 { margin: 0 0 4px; font-size: clamp(20px, 2.4vw, 25px) }
.pgroup > p {
  margin: 0; max-width: 640px;
  font-size: 14px; color: var(--ink-2); line-height: 1.65;
}
/* Les poemes de Yann gardent un filet d'accent jusque dans les cartes. */
.pgroup.site .card { border-left: 3px solid var(--accent) }

.poeme-incipit {
  font-family: var(--serif);
  font-style: italic;
  font-size: 13.5px !important;
  color: var(--ink-2);
}
.poeme-meta {
  display: block; margin-top: 9px;
  font-size: 12px; color: var(--ink-3);
}

/* ---- poemes des visiteurs ---------------------------------------------- */
/* La page /poemes/visiteurs.html reutilise les classes comm-* du widget
   communautaire (barre de compte, formulaire, boutons) et le bloc .poeme
   ci-dessus pour la mise en vers. N'est defini ici que ce qui lui est propre. */
.poemes-visiteurs { margin-top: 30px }
.poemes-visiteurs > h2 {
  font-size: 15px; letter-spacing: .04em; text-transform: uppercase;
  color: var(--ink-3); margin: 0 0 18px;
}
.poeme-visiteur { margin: 0 0 34px; padding-top: 22px; border-top: 1px solid var(--hairline) }
.poeme-visiteur:first-of-type { padding-top: 0; border-top: 0 }
.poeme-visiteur > h3 {
  margin: 0; font-family: var(--serif); font-size: 20px;
  font-variation-settings: "opsz" 30; color: var(--ink-1);
}
.poeme-visiteur .comm-meta { margin: 3px 0 0; font-size: 12.5px; color: var(--ink-3) }
.poeme-visiteur .comm-credit { color: var(--ink-2); font-weight: 600 }
/* Le poeme d'un visiteur n'a pas le filet d'accent des textes de la maison :
   c'est ce filet qui signale l'editorial, il ne doit pas se prendre ici. */
.prose .poeme-visiteur .poeme {
  margin: 14px 0 10px; border-left: 1px solid var(--hairline);
}
.poeme-visiteur .comm-actions { margin-top: 4px }

/* Renvoi vers la page, depuis l'index de section. */
.pgroup.visiteurs { border-top: 1px solid var(--hairline); padding-top: 30px }