/* site ajesusparmarie.com : mise en page commune (scripts/mission_web.py) */
.formulaire-carnet label.case { display: flex; align-items: center; gap: .7rem; font-weight: 400; }
main .section > .formulaire-carnet + h2, main .section > .actions + h2, main .section > .note + h2 { margin-top: 2.2rem; }

@media (min-width: 60rem) {
  /* une colonne de lecture unique (48rem) pour tous les textes courants ; les grilles et cartes gardent toute la largeur */
  main .section > .lead, main .section > .alinea, main .section > p:not([class]), main .section > .note,
  main .section > .encadre, main .section > .acces-rappels { max-width: 48rem; }
  main .section > .alinea { max-width: 48rem; }
  main .section > h2 { margin-top: 2.6rem; }
  main .section > h2:first-child { margin-top: 0; }
  main .section > .chapeau + h1 + .lead { margin-top: .4rem; }
  /* formulaires : une largeur lisible, jamais 1 152 px */
  main .formulaire-carnet, main .rappel { max-width: 48rem; }
  main .formulaire-carnet .bouton { justify-self: start; min-width: 16rem; }
  /* boutons : à leur taille, côte à côte, jamais étirés sur toute la page */
  main .actions { justify-content: flex-start; }
  main .actions > .bouton { flex: 0 1 auto; min-width: 15rem; padding-inline: 2rem; }
  /* listes de rubriques : en grille de cartes */
  main .liste-appli { grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr)); gap: 1.1rem; }
  main .liste-appli a { height: 100%; box-sizing: border-box; }
  main .personnes { grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr)); }
  main .temps-du-jour { margin-left: 0; max-width: 48rem; }
  /* l'accueil : le Christ et Marie à gauche, l'accueil et la prière du jour à droite ; puis trois cartes ; puis les rubriques */
  .accueil-mission { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); column-gap: 2.4rem; align-items: start; text-align: left; }
  .accueil-mission > * { grid-column: 1 / -1; max-width: none; margin-inline: 0; }
  .accueil-mission > .accueil-visuel { grid-column: 1 / span 3; grid-row: 1 / span 6; margin: 0; }
  .accueil-mission > .lead { grid-column: 4 / -1; grid-row: 1; margin-top: 1.2rem; font-size: 1.6rem; }
  .accueil-mission > .alinea { grid-column: 4 / -1; grid-row: 2; max-width: none; text-align: left; }
  .accueil-mission > .temps-du-jour { grid-column: 4 / -1; grid-row: 3; margin: 1rem 0 0; max-width: none; }
  .accueil-mission > .saint-du-jour { grid-column: 4 / -1; grid-row: 4; margin: 1rem 0 0; max-width: none; text-align: left; }
  .accueil-mission > .saint-du-jour * { text-align: left !important; }
  .accueil-mission > .actions { grid-column: 4 / -1; grid-row: 5; justify-content: flex-start; }
  .accueil-mission > .actions > .bouton { flex: 1 1 0; min-width: 0; }
  .accueil-mission > .visage { grid-row: 7; margin-top: 2.6rem; }
  /* deux cartes l'une sur l'autre à gauche (Sainte Famille, Parole du jour), les fêtes à droite, sur la même hauteur */
  .accueil-mission > .sainte-famille, .accueil-mission > .accueil-fetes { margin: 0; padding: 1.3rem 1.4rem 1.4rem; border-radius: var(--rayon);
      background: var(--blanc); border: 1px solid var(--filet); box-shadow: var(--ombre); }
  .accueil-mission > .sainte-famille { grid-column: 1 / span 3; grid-row: 8; margin-top: 2.4rem; }
  .accueil-mission > .sainte-famille + .accueil-fetes { grid-column: 1 / span 3; grid-row: 9; margin-top: 1.4rem; border-top: 3px solid var(--or); }
  .accueil-mission > .accueil-fetes + .accueil-fetes { grid-column: 4 / -1; grid-row: 8 / span 2; margin-top: 2.4rem; align-self: stretch; border-top: 3px solid var(--or); }
  .accueil-mission > .sainte-famille h2, .accueil-mission > .accueil-fetes h2 { font-size: 1.6rem; margin-top: 0; text-align: left; }
  .accueil-mission > .sainte-famille p, .accueil-mission > .accueil-fetes p { text-align: left !important; text-align-last: auto !important; }
  .accueil-mission > .sainte-famille .actions, .accueil-mission > .accueil-fetes .actions { justify-content: flex-start; margin-top: 1rem; }
  .accueil-mission > .sainte-famille .actions > .bouton, .accueil-mission > .accueil-fetes .actions > .bouton { min-width: 0; flex: 0 1 auto; padding-inline: 1.4rem; }
  .accueil-mission > .liste-appli { grid-row: 10; }
  .accueil-mission > .liste-appli { margin-top: 2.6rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 72rem) { .accueil-mission > .liste-appli { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
