/* Esprit Gospel — ajouts PROPOSÉS au système, utilisés par les maquettes.
   Rien ici n'existe dans components/bundle.css. Chaque règle est justifiée dans les notes du canevas.
   Toutes les valeurs viennent des tokens ; aucune couleur ni police nouvelle. */

/* 0. CORRECTIF de bundle.css : `.eg-page img { height: auto }` (0,1,1) l'emporte sur
   `.eg-hero__photo { height: 100% }` (0,1,0). Sur mobile la photo du hero ne couvre alors pas
   les 440px du bloc : bande sombre sous l'image. */
.eg-page .eg-hero__photo { height: 100%; }

/* 1. Gallery, variante compacte : 2 colonnes sur mobile au lieu d'une seule.
   La grille actuelle (minmax 220px) donne 1 colonne sous 488px : 12 photos = ~4 000px de défilement. */
.eg-gallery--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
@media (min-width: 640px) { .eg-gallery--compact { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); } }
@media (min-width: 960px) { .eg-gallery--compact { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* 2. ConcertCard, titre cliquable vers la page de détail (proposition à confirmer). */
.eg-concert__title a { color: inherit; text-decoration: none; }
.eg-concert__title a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }

/* 3. Lien de retour en tête des pages secondaires (archive, détail). */
.eg-back { display: inline-flex; align-items: center; gap: var(--space-1); margin-bottom: var(--space-5); }
.eg-back svg { flex: none; }

/* 4. Mise en page à deux colonnes : texte + encart (détail d'un concert, contact). Empilée sous 960px. */
.eg-split { display: grid; gap: var(--space-7); }
@media (min-width: 960px) {
  .eg-split { grid-template-columns: minmax(0, 1fr) 380px; align-items: start; }
  /* Encart d'abord dans le HTML (lu en premier sur mobile), affiché à droite en desktop. */
  .eg-split--aside-first > :first-child { order: 2; }
}
.eg-aside > * + * { margin-top: var(--space-3); }
.eg-aside h2 + p { margin-top: var(--space-2); }
.eg-aside { padding-top: var(--space-5); border-top: 1px solid var(--line); }

/* 5. Bouton « voir plus » sous une grille de section. */
.eg-section__more { margin-top: var(--space-7); }

/* 7. Partenaires (contenu repris de l'ancien site) : une vignette au-dessus de chaque nom,
   dans le lien. La photo remplit sa vignette ; un logo garde sa taille d'origine (petits
   fichiers, flous s'ils étaient agrandis), centré sur fond nuit : le texte blanc du logo
   Cœur Gospel disparaîtrait sur un fond clair. */
.eg-partners { display: grid; gap: var(--space-6); list-style: none; padding: 0; }
@media (min-width: 640px) { .eg-partners { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.eg-partners a { display: block; color: var(--ink); text-decoration: none; }
.eg-partner__media { position: relative; display: block; aspect-ratio: 2 / 1; margin-bottom: var(--space-4); background: var(--surface-night); border-radius: var(--radius-md); overflow: hidden; }
.eg-page .eg-partner__photo { width: 100%; height: 100%; object-fit: cover; object-position: 60% 30%; }
.eg-page .eg-partner__logo { position: absolute; inset: 0; margin: auto; max-width: 80%; max-height: 80%; width: auto; height: auto; }
.eg-partners a:hover { text-decoration: underline; text-underline-offset: 4px; }
.eg-partners p { margin-top: var(--space-1); color: var(--ink-muted); }

/* 6. Page de texte (mentions légales, confidentialité) : titres de rubrique espacés. */
.eg-prose h2 { margin-top: var(--space-7); }
.eg-prose h2 + p { margin-top: var(--space-3); }

/* 8. Concerts : état vide (aucun concert annoncé) et titres de l'archive cliquables
   vers la page du concert, comme les cartes (point 2). */
.eg-empty { padding: var(--space-6); border: 1px dashed var(--line-strong); border-radius: var(--radius-md); }
.eg-empty > * + * { margin-top: var(--space-3); }
.eg-archive__title a { color: inherit; text-decoration: none; }
.eg-archive__title a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }

/* 9. Mots longs (adresse web, e-mail) dans les textes saisis au back office : ils passent à la
   ligne au lieu d'élargir la page sur mobile. min-width: 0 laisse les colonnes de grille
   rétrécir sous la largeur d'un tel mot. */
.eg-prose, .eg-concert__body, .eg-archive__title, .eg-band__inner > * { overflow-wrap: anywhere; }
.eg-split > *, .eg-band__inner > * { min-width: 0; }

/* 10. Formulaire de contact : les liens du résumé d'erreurs prennent la couleur de l'alerte
   (les maquettes le faisaient par un style="" en ligne, que la Content-Security-Policy
   interdit), et l'erreur du choix du type de demande s'écarte des boutons. */
.eg-notice .eg-link { color: inherit; }
.eg-choice + .eg-field__error { margin-top: var(--space-2); }
