/* Tuiles « Explorer par thème » et bloc des comparatifs (LMI, 03/11/2026)
 * Valeurs reprises de la maquette (Homepage.html).
 */

/* --- Tuiles : 8 colonnes sur une ligne, titre centré, sans compteur ---------------------
 * Maquette : h2 Newsreader 40px centré, grille repeat(8, 1fr) gap 12, tuile en colonne
 * (padding 18px 6px, rayon 12, 14px/600) et AUCUN nombre d'articles.
 */
html .eldorado-design .eldorado-bib-tuiles-rubriques > h2 {
    margin: 0 0 32px;
    font-family: var(--eldorado-police-titres);
    font-size: 40px;
    font-weight: 600;
    text-align: center;
}
.eldorado-bib-tuiles-rubriques ul {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 12px;
}
.eldorado-bib-tuiles-rubriques li a {
    gap: 10px;
    padding: 18px 6px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
}
/* Le nombre d'articles n'existe pas dans la maquette : la tuile y est un repère de
   navigation, pas une statistique. Masqué à l'affichage, le texte reste dans le HTML. */
/* La taille du nom est portee par le <span> enfant, pas par le lien : le coeur
   l'ecrit en police de titres 1.125rem, la maquette la laisse en police de texte 14px. */
.eldorado-bib-tuiles-rubriques .eldorado-bib-tuile-nom {
    font-family: var(--eldorado-police-texte);
    font-size: 14px;
    font-weight: 600;
}

.eldorado-bib-tuile-nombre {
    display: none;
}
@media (max-width: 1100px) {
    .eldorado-bib-tuiles-rubriques ul { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .eldorado-bib-tuiles-rubriques ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    html .eldorado-design .eldorado-bib-tuiles-rubriques > h2 { font-size: 30px; }
}

/* --- Bloc des comparatifs --------------------------------------------------------------
 * En-tête : surtitre en capitales espacées, titre Newsreader 40px, et le lien vers
 * l'archive aligné à droite sur la ligne de base du titre.
 */
.lmi-section-entete {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 28px;
}
.lmi-section-surtitre {
    margin: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--eldorado-accent);
}
.lmi-section-entete .eldorado-bib-section-titre {
    margin: 6px 0 0;
    font-family: var(--eldorado-police-titres);
    font-size: 40px;
    font-weight: 600;
}
.lmi-section-lien {
    font-weight: 600;
    color: var(--eldorado-accent);
    text-decoration: none;
}
.lmi-section-lien:hover,
.lmi-section-lien:focus-visible {
    text-decoration: underline;
}

/* Les cartes : grille de 3, habillage de la maquette. Le contenu reste celui du composant
   (les trois premiers classés avec leur note), plus parlant que les pastilles grises de la
   maquette : on habille, on ne remplace pas. */
.eldorado-bib-classements {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}
.eldorado-bib-classements > .lmi-section-entete {
    grid-column: 1 / -1;
}
.eldorado-bib-carte-classement {
    padding: 24px;
    background: #FFFFFF;
    border-radius: 14px;
    box-shadow: var(--eldorado-ombre);
}
html.dark .eldorado-bib-carte-classement {
    background: var(--eldorado-surface);
}
.eldorado-bib-carte-classement h3 {
    margin: 0 0 10px;
    font-family: var(--eldorado-police-titres);
    font-size: 24px;
    font-weight: 600;
    line-height: 1.2;
}
.eldorado-bib-carte-classement h3 a {
    text-decoration: none;
    color: inherit;
}
.eldorado-bib-carte-classement-lien {
    display: block;
    margin-top: 10px;
    font-size: 15px;
    font-weight: 600;
    color: var(--eldorado-accent);
}
@media (max-width: 1000px) {
    .eldorado-bib-classements { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
    .eldorado-bib-classements { grid-template-columns: 1fr; }
    .lmi-section-entete .eldorado-bib-section-titre { font-size: 30px; }
}
