/* =============================================================================
   Pages de corpus EquiQuiz — niveaux, thèmes, sommaire.
   Prefixe : eqz-
   Reprend les tokens du site (--primary, rayons, ombres) : ces pages arrivent
   par une recherche Google, elles sont souvent la PREMIERE page vue du site.
   Elles ne peuvent pas avoir l'air d'un listing technique.
   ============================================================================= */

.eqz-ariane { font-size:.85rem; color:#64748b; margin:1.4rem 0 1rem; display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; }
.eqz-ariane a { color:#64748b; text-decoration:none; }
.eqz-ariane a:hover { color:var(--primary-dark); text-decoration:underline; }
.eqz-ariane span[aria-hidden] { color:#cbd5e1; }
.eqz-ariane [aria-current] { color:#1e293b; font-weight:600; }

.eqz-corpus-tete { margin:0 0 2rem; max-width:46rem; }
.eqz-corpus-tete h1 { font-size:clamp(1.6rem,4vw,2.3rem); line-height:1.15; margin:0 0 .7rem; color:#0f172a; }
.eqz-corpus-sous { color:#475569; font-size:1.02rem; line-height:1.6; margin:0; }

/* ---- Une question ---- */
.eqz-q-liste { display:flex; flex-direction:column; gap:1rem; margin:0 0 2rem; }
.eqz-q {
    background:#fff; border:1px solid #e5e7eb; border-radius:1.1rem;
    padding:1.2rem 1.3rem; box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.eqz-q-txt { display:flex; gap:.7rem; align-items:flex-start; font-size:1.02rem; font-weight:600; color:#0f172a; margin:0 0 .9rem; line-height:1.45; }
.eqz-q-num {
    flex:0 0 auto; width:1.7rem; height:1.7rem; border-radius:.6rem;
    background:rgba(16,185,129,.12); color:var(--primary-dark);
    display:inline-flex; align-items:center; justify-content:center;
    font-size:.8rem; font-weight:700;
}
.eqz-q-props { list-style:none; margin:0 0 .9rem; padding:0; display:flex; flex-direction:column; gap:.4rem; }
.eqz-q-props li { display:flex; gap:.6rem; align-items:flex-start; font-size:.95rem; color:#334155; line-height:1.45; }
.eqz-q-lettre {
    flex:0 0 auto; width:1.45rem; height:1.45rem; border-radius:.45rem;
    background:#f1f5f9; color:#64748b; font-size:.75rem; font-weight:700;
    display:inline-flex; align-items:center; justify-content:center;
}
/* La réponse est repliée : le visiteur cherche d'abord. Elle reste dans le HTML,
   donc lisible par un moteur — c'est tout l'intérêt de <details>. */
.eqz-q-rep > summary {
    cursor:pointer; list-style:none; display:inline-flex; align-items:center; gap:.4rem;
    font-size:.88rem; font-weight:600; color:var(--primary-dark);
    padding:.45rem .8rem; border-radius:.7rem; background:rgba(16,185,129,.09);
    /* Hauteur tactile : ce résumé est le seul contrôle de la page sur mobile. */
    min-height:2.2rem;
}
.eqz-q-rep > summary::-webkit-details-marker { display:none; }
.eqz-q-rep > summary:hover { background:rgba(16,185,129,.16); }
.eqz-q-rep[open] > summary { margin-bottom:.7rem; }
.eqz-q-bonne { margin:0 0 .5rem; font-size:.95rem; color:#065f46; }
.eqz-q-expl { margin:0; font-size:.93rem; color:#475569; line-height:1.6; }

/* ---- Pagination ---- */
.eqz-pagi { display:flex; align-items:center; justify-content:center; gap:1rem; flex-wrap:wrap; margin:0 0 2.5rem; }
.eqz-pagi a {
    padding:.6rem 1.1rem; border-radius:.8rem; border:1px solid #e5e7eb;
    background:#fff; color:#334155; text-decoration:none; font-weight:600; font-size:.92rem;
    min-height:2.6rem; display:inline-flex; align-items:center;
}
.eqz-pagi a:hover { border-color:var(--primary); color:var(--primary-dark); }
.eqz-pagi-etat { font-size:.88rem; color:#64748b; }

/* ---- Maillage interne ---- */
.eqz-liens { margin:0 0 2.5rem; }
.eqz-liens h2 { font-size:1.2rem; margin:2rem 0 .9rem; color:#0f172a; }
.eqz-liens-grille { list-style:none; margin:0; padding:0; display:grid; gap:.6rem; grid-template-columns:repeat(auto-fill,minmax(15rem,1fr)); }
.eqz-liens-grille a {
    display:flex; justify-content:space-between; align-items:center; gap:.6rem;
    padding:.8rem 1rem; border-radius:.9rem; border:1px solid #e5e7eb; background:#fff;
    color:#334155; text-decoration:none; font-size:.95rem; font-weight:500; min-height:2.9rem;
}
.eqz-liens-grille a:hover { border-color:var(--primary); background:rgba(16,185,129,.04); color:var(--primary-dark); }
.eqz-liens-grille span { font-size:.8rem; color:#94a3b8; white-space:nowrap; }
.eqz-liens-cartes a { padding:1.1rem 1.2rem; flex-direction:column; align-items:flex-start; gap:.25rem; font-weight:600; }

.eqz-theme-bloc { margin:0 0 1.4rem; padding:1rem 1.1rem; border:1px solid #eef2f6; border-radius:1rem; background:#fff; }
.eqz-theme-bloc h3 { margin:0 0 .7rem; font-size:1rem; color:#0f172a; display:flex; justify-content:space-between; gap:.6rem; flex-wrap:wrap; }
.eqz-theme-bloc h3 span { font-size:.82rem; color:#94a3b8; font-weight:400; }
.eqz-liens-ligne { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.4rem; }
.eqz-liens-ligne a {
    display:inline-flex; align-items:center; padding:.4rem .75rem; border-radius:.6rem;
    background:#f8fafc; color:#475569; text-decoration:none; font-size:.85rem; min-height:2rem;
}
.eqz-liens-ligne a:hover { background:rgba(16,185,129,.1); color:var(--primary-dark); }

.eqz-suite { color:#64748b; font-size:.92rem; margin:1rem 0 0; }
.eqz-vide { color:#94a3b8; font-style:italic; }

/* ---- Appel à l'action ---- */
.eqz-cta { padding:3rem 0 4rem; }
.eqz-cta > .wrap { text-align:center; max-width:40rem; }
.eqz-cta h2 { font-size:1.5rem; margin:0 0 .7rem; color:#0f172a; }
.eqz-cta p { color:#475569; line-height:1.6; margin:0 0 1.5rem; }

@media (max-width:640px) {
    .eqz-q { padding:1rem; border-radius:.9rem; }
    .eqz-liens-grille { grid-template-columns:1fr; }
}