/* ==========================================================================
   REFONTE ORIENTATION — déploiement par famille (phase 5B)
   Feuille additive. Un seul scope, partagé par les 2 pages de la famille :
     body.qds-orientation
       - quel-parcours-choisir.html
       - methode-formations-management.html
   Ces deux pages partagent une structure quasi identique (.hero, cartes
   .hero-local-card, accordéons standards + variantes --orange/--dark,
   FAQ). Aucun sélecteur nu : tout est préfixé par le scope de body.
   Aucun contenu, lien, accordéon, formulaire ou attribut modifié : habillage
   visuel uniquement. Dépend de refonte-tokens.css.
   ========================================================================== */

body.qds-orientation {
  background-color: var(--qds-ivoire);
}

body.qds-orientation #navbar {
  border-top: 3px solid var(--qds-brique);
}

/* --- Hero d'introduction : trame cartographique discrète --- */
body.qds-orientation .hero.section-local-tone,
body.qds-orientation .hero {
  background:
    linear-gradient(90deg, rgba(28, 42, 64, 0.035) 1px, transparent 1px),
    linear-gradient(rgba(28, 42, 64, 0.035) 1px, transparent 1px),
    linear-gradient(to bottom, var(--qds-chaux), var(--qds-ivoire));
  background-size: 2.5rem 2.5rem, 2.5rem 2.5rem, 100% 100%;
}

/* --- Titres de section --- */
body.qds-orientation .section-title-local::after {
  background: var(--qds-brique);
  height: 3px;
  box-shadow: 84px 0 0 0 var(--qds-ambre);
}
body.qds-orientation .section-local-tone {
  background-color: var(--qds-pierre) !important;
}

/* --- Cartes d'intention / de choix de parcours --- */
body.qds-orientation .hero-local-card {
  background-color: var(--qds-blanc);
  border: 1px solid var(--qds-ardoise-100);
  border-top: 3px solid var(--qds-brique);
  box-shadow: var(--qds-ombre-1);
}

/* --- Repères Qualiopi / statistiques ---
   Les cartes du bloc .stats (accordéon --dark, texte clair sur ardoise)
   ne doivent pas être blanchies : sinon .stat-value (#fff) devient illisible. */
body.qds-orientation .stat-card {
  background-color: var(--qds-blanc);
  border: 1px solid var(--qds-ardoise-100);
  border-radius: var(--qds-r-moyen);
  box-shadow: var(--qds-ombre-1);
}
body.qds-orientation .stats .stat-card {
  background-color: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
}
body.qds-orientation .stats .stat-value {
  color: #fff;
}
body.qds-orientation .stats .stat-label {
  color: var(--gray-300, #d1d5db);
}

/* --- Accordéons : variantes --orange et --dark exclues (elles gèrent déjà
   leur propre contraste, cf. correction déjà appliquée sur la famille
   Formations — journal-refonte.md). --- */
body.qds-orientation details.rh-page-accordion:not(.rh-page-accordion--orange):not(.rh-page-accordion--dark) {
  border: 1px solid var(--qds-ardoise-100);
  border-radius: var(--qds-r-grand);
  background: var(--qds-blanc);
  box-shadow: var(--qds-ombre-1);
}
body.qds-orientation details.rh-page-accordion:not(.rh-page-accordion--orange):not(.rh-page-accordion--dark) > summary.rh-page-accordion-summary {
  color: var(--qds-ardoise-900);
}
body.qds-orientation details.rh-page-accordion:not(.rh-page-accordion--orange):not(.rh-page-accordion--dark)[open] > summary.rh-page-accordion-summary {
  background: var(--qds-pierre);
}
body.qds-orientation details.rh-page-accordion table {
  border-color: var(--qds-ardoise-100);
}
body.qds-orientation details.rh-page-accordion th {
  color: var(--qds-brique-profond);
}

/* --- FAQ --- */
body.qds-orientation details.faq-item {
  background-color: var(--qds-blanc);
  border: 1px solid var(--qds-ardoise-100);
  border-left: 3px solid var(--qds-brique);
  border-radius: var(--qds-r-moyen);
}

/* --- Attributions de témoignages --- */
body.qds-orientation .testimonial-author {
  color: var(--qds-ardoise-900);
}
body.qds-orientation .testimonial-meta {
  color: var(--qds-ardoise-700);
}

/* --- Boutons --- */
body.qds-orientation .btn {
  border-radius: var(--qds-r-moyen);
}

/* --- Pied de page --- */
body.qds-orientation footer.footer-lille-legal-test {
  background-color: var(--qds-ardoise-950) !important;
  border-top: 3px solid var(--qds-brique);
}
body.qds-orientation footer.footer-lille-legal-test h3 {
  color: var(--qds-ambre);
  font-size: 1.05rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* --- Focus visibles --- */
body.qds-orientation a:focus-visible,
body.qds-orientation button:focus-visible,
body.qds-orientation summary:focus-visible,
body.qds-orientation input:focus-visible,
body.qds-orientation label:focus-visible {
  outline: var(--qds-focus);
  outline-offset: var(--qds-focus-decalage);
}
body.qds-orientation footer.footer-lille-legal-test a:focus-visible {
  outline-color: var(--qds-ambre);
}

/* --- Animations réduites --- */
@media (prefers-reduced-motion: reduce) {
  body.qds-orientation * {
    transition-duration: 0.01ms !important;
    animation: none !important;
  }
}
