/* =====================================================================
   Listings et recherche (fr/catb2b, fr/catb2bnaf, fr/catparticuliers, fr/cat, fr/recherche, fr/recherche-departement,
   fr/classement-departements). Compléments à css/site.css, mêmes jetons ; à fusionner dans site.css si le coordinateur le souhaite.
   ===================================================================== */

/* Listings : phrase-réponse calculée en chapeau, puis description courte du contenu (audit SEO du 19/10/2026) */
.intro-note { margin: -10px 0 24px; max-width: 58ch; }

/* Titres longs venus de la base (catégories) ou contenant la requête (recherche) */
.titre-page--long { max-width: 30ch; font-size: clamp(1.95rem, 1.3rem + 1.7vw, 2.85rem); line-height: 1.08; overflow-wrap: anywhere; }

/* Figure à barres des codes NAF : libellés plus longs que des noms de ville */
@media (min-width: 701px) {
    .fig-naf .barres li { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) auto; }
}
@media (max-width: 700px) {
    .fig-naf .barres .b-l { white-space: normal; }
}

/* Chiffres clés pleine largeur (catégories) : quatre colonnes au-dessus du tableau */
.cat-cles { margin-top: 30px; }
.cat-cles .fig-lecture { margin-top: 14px; }

/* Pages de recherche */
.recherche-tete { padding-top: 36px; padding-bottom: 40px; }
.recherche-tete .titre-page { margin-bottom: 18px; }
.recherche-tete .chapo { margin-bottom: 20px; }
.recherche-vide { margin-top: 22px; max-width: 70ch; padding-top: 16px; border-top: 1px solid var(--filet); }
.recherche-vide p { margin: 0 0 6px; color: var(--encre-2); }
.recherche-vide p b { color: var(--encre); }

/* Liste à chiffres en mobile : le nombre passe sous le titre */
@media (max-width: 560px) {
    .liste-resultats a { grid-template-columns: minmax(0, 1fr); }
    .liste-resultats .ll-n { grid-row: auto; grid-column: 1; text-align: left; white-space: normal; }
    .liste-resultats .ll-n b { display: inline; font-size: 18px; margin-right: 5px; }
}

/* Classement des départements par nombre d'emails (fr/classement-departements.aspx) : phrase-réponse plus large */
.classement-reponse { max-width: 66ch; }
