/* Styles des pages lieux et des articles (src/layouts/Contenu.astro, src/components/EnBref.astro),
   chargés seulement par ces pages (pas dans la feuille commune du site). Couleurs et mesures : jetons de src/styles/tokens.css. */

  .contenu .tete {
    display: grid;
    gap: var(--espace-4);
    max-width: 48rem;
    padding-top: var(--espace-4);
  }

  .contenu .tete h1,
  .contenu .tete p {
    margin: 0 auto;
  }

  .contenu .tete .surtitre {
    margin-inline: auto;
  }

  .contenu .bluf {
    font-size: var(--taille-lg);
    line-height: 1.5;
  }

  .contenu .tete .signature {
    font-size: var(--taille-sm);
    color: var(--texte-secondaire);
    text-align: center;
    text-align-last: center;
  }

  .contenu .photo {
    max-width: 48rem;
    margin-block: var(--espace-6);
  }

  .contenu .photo img {
    width: 100%;
    border-radius: var(--rayon-media);
  }

  /* Corps du contenu : titres centrés et paragraphes justifiés comme le reste du site ; dernière ligne à gauche, plus lisible sur un long texte */
  .prose {
    max-width: 48rem;
    padding-bottom: var(--espace-6);
  }

  .prose h2 {
    margin: var(--espace-7) auto var(--espace-4);
  }

  .prose h3 {
    margin: var(--espace-5) 0 var(--espace-2);
  }

  .prose p {
    text-align-last: left;
  }

  .prose ul {
    display: grid;
    gap: var(--espace-2);
    margin: 0 0 var(--espace-4);
    padding-left: var(--espace-5);
    max-width: var(--mesure);
  }

  /* Encadré « Notre conseil » : encre sur vert très clair (13,5:1), filet vert marque */
  .prose blockquote {
    margin: var(--espace-5) 0;
    padding: var(--espace-4) var(--espace-5);
    border-left: 4px solid var(--vert-500);
    border-radius: var(--rayon-champ);
    background: var(--vert-50);
  }

  .prose blockquote p {
    margin: 0;
  }

  .prose .action-contenu {
    margin-block: var(--espace-5);
  }

  .contenu .officiels {
    max-width: 48rem;
    padding-bottom: var(--espace-7);
  }

  .contenu .officiels h2,
  .contenu .voisins h2 {
    font-size: var(--taille-xl);
    margin-bottom: var(--espace-4);
  }

  .contenu .officiels ul,
  .contenu .voisins ul {
    display: grid;
    gap: var(--espace-2);
    width: fit-content;
    margin: 0 auto var(--espace-4);
    padding-left: var(--espace-5);
  }

  .contenu .officiels .note {
    font-size: var(--taille-sm);
    color: var(--texte-secondaire);
  }

  .contenu .voisins {
    max-width: 48rem;
  }

  .en-bref {
    display: grid;
    gap: var(--espace-2);
    margin: 0;
    padding: var(--espace-4) var(--espace-5);
    border-radius: var(--rayon-champ);
    background: var(--sable);
  }

  .en-bref div {
    display: grid;
    grid-template-columns: minmax(0, 7.5rem) minmax(0, 1fr);
    gap: var(--espace-3);
  }

  /* Encre douce sur sable : 5,2:1 ; encre sur sable : 12,3:1 */
  .en-bref dt {
    color: var(--texte-secondaire);
    font-size: var(--taille-sm);
  }

  .en-bref dd {
    margin: 0;
    font-weight: var(--graisse-forte);
  }
