/* KP Conseil : composants (tableaux, formulaires, questions fréquentes, colonne latérale, listes d'index, offres, résultats). Chargé en différé. */

/* Tableaux */
.tableau-conteneur { overflow-x: auto; margin: var(--esp-4) 0; -webkit-overflow-scrolling: touch; }
.tableau { width: 100%; border-collapse: collapse; font-size: var(--fs-petit); line-height: 1.45; }
.tableau caption { text-align: left; font-family: var(--serif); font-size: var(--fs-3); color: var(--navy); margin-bottom: var(--esp-3); caption-side: top; }
.tableau th, .tableau td { text-align: left; padding: 0.8rem 1rem 0.8rem 0; border-bottom: 1px solid var(--filet); vertical-align: top; }
.tableau thead th { font-weight: 600; color: var(--navy); border-bottom: 1px solid var(--navy); vertical-align: bottom; }
.tableau tbody th { font-weight: 500; color: var(--encre); }
.tableau th small, .tableau td small { display: block; color: var(--gris); font-weight: 400; font-size: var(--fs-legende); }
.tableau .inclus { color: var(--navy); font-weight: 500; }
.tableau .absent { color: var(--gris); }
.tableau tfoot td { color: var(--gris); font-size: var(--fs-legende); border-bottom: 0; }
.tableau-comparatif th:first-child { width: 34%; }
.tableau-comparatif thead th { font-family: var(--serif); font-weight: 400; font-size: var(--fs-3); }

/* Formulaires */
.formulaire { max-width: 660px; }
.formulaire-intro { margin-bottom: var(--esp-5); }
.champ { margin-bottom: var(--esp-4); }
.champ label, .champ .etiquette { display: block; font-weight: 500; color: var(--navy); margin-bottom: 0.4rem; }
.champ .aide { color: var(--gris); font-size: var(--fs-legende); margin: -0.1rem 0 0.6rem; }
.champ .facultatif { font-weight: 400; color: var(--gris); }
input[type="text"], input[type="email"], input[type="tel"], input[type="date"], input[type="number"], input[type="password"], select, textarea {
  width: 100%;
  font: inherit;
  font-size: 1rem;
  line-height: 1.4;
  color: var(--encre);
  background: var(--fond);
  border: 1px solid var(--gris);
  border-radius: 0;
  padding: 0.75rem 0.85rem;
  margin: 0;
}
select { appearance: none; -webkit-appearance: none; background-image: none; padding-right: 2.5rem; }
.select-conteneur { position: relative; }
.select-conteneur::after { content: '+'; position: absolute; right: 0.9rem; top: 50%; transform: translateY(-50%); font-family: var(--serif); color: var(--gris); pointer-events: none; font-size: 1.25rem; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--navy); outline-offset: 1px; border-color: var(--navy); }
textarea { min-height: 9.5rem; resize: vertical; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--navy); width: 1.1rem; height: 1.1rem; margin: 0.2rem 0 0; flex: none; }
.champ-erreur input, .champ-erreur select, .champ-erreur textarea { border-color: var(--navy); border-width: 2px; }
.erreur { color: var(--navy); font-size: var(--fs-petit); font-weight: 500; margin: 0.4rem 0 0; }
.erreurs-resume { border: 1px solid var(--navy); border-left-width: 4px; padding: var(--esp-3); margin-bottom: var(--esp-5); max-width: 660px; }
.erreurs-resume h2 { font-family: var(--sans); font-size: var(--fs-4); font-weight: 600; margin-bottom: 0.5rem; }
.erreurs-resume ul { margin: 0; padding-left: 1.2rem; }
.erreurs-resume li { margin-bottom: 0.25rem; }
.choix { list-style: none; margin: 0; padding: 0; max-width: none; }
.choix li { margin-bottom: 0.5rem; }
.choix label { display: flex; gap: 0.7rem; align-items: flex-start; font-weight: 400; color: var(--encre); cursor: pointer; padding: 0.7rem 0.9rem; border: 1px solid var(--filet); margin: 0; }
.choix label:hover { border-color: var(--gris); }
.choix input:checked + span { color: var(--navy); font-weight: 500; }
.consentement label { display: flex; gap: 0.7rem; align-items: flex-start; font-weight: 400; color: var(--encre); margin: 0; }
.consentement .aide { margin-top: 0.5rem; }
.pot-de-miel { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
fieldset { border: 0; padding: 0; margin: 0 0 var(--esp-4); min-width: 0; }
legend { padding: 0; }
.questionnaire fieldset { border-top: 1px solid var(--filet); padding-top: var(--esp-4); margin-bottom: var(--esp-5); }
.questionnaire legend { float: left; width: 100%; margin-bottom: var(--esp-3); font-family: var(--serif); font-size: var(--fs-3); color: var(--navy); line-height: 1.35; }
.questionnaire legend + * { clear: both; }
.question-numero { display: block; font-family: var(--sans); font-size: var(--fs-legende); color: var(--gris); margin-bottom: 0.35rem; }
.formulaire-actions { margin-top: var(--esp-5); display: flex; flex-wrap: wrap; gap: var(--esp-3); align-items: center; }
.formulaire-actions .aide { margin: 0; }
button.bouton { font-size: 1rem; }
.creneaux { display: grid; gap: var(--esp-3); }
@media (min-width: 700px) { .creneaux { grid-template-columns: repeat(3, 1fr); } }
.creneaux .champ { margin-bottom: 0; }

/* Questions fréquentes */
.faq { padding-top: var(--esp-section); }
.faq h2 { margin-bottom: var(--esp-4); }
.faq-liste { border-top: 1px solid var(--filet); max-width: 820px; }
.faq-bloc { border-bottom: 1px solid var(--filet); }
.faq-bloc summary { list-style: none; cursor: pointer; padding: var(--esp-3) 3rem var(--esp-3) 0; font-weight: 500; color: var(--navy); position: relative; font-size: var(--fs-4); line-height: 1.4; }
.faq-bloc summary::-webkit-details-marker { display: none; }
.faq-bloc summary::after { content: '+'; position: absolute; right: 0.25rem; top: 50%; transform: translateY(-50%); font-family: var(--serif); font-size: 1.75rem; line-height: 1; color: var(--gris); font-weight: 400; }
.faq-bloc[open] summary::after { content: '\2212'; }
.faq-bloc summary:hover { color: var(--encre); }
.faq-reponse { padding: 0 0 var(--esp-3); }
.faq-reponse p { max-width: 66ch; margin-bottom: 0; }
.faq-bloc[open] .faq-reponse { animation: faq-ouverture 160ms ease-out; }
@keyframes faq-ouverture { from { opacity: 0; } to { opacity: 1; } }

/* Colonne latérale */
.colonne-aside { font-size: var(--fs-petit); }
.aside-bloc { padding: var(--esp-3) 0; border-top: 1px solid var(--filet); }
.colonne-aside > :first-child { border-top: 0; padding-top: 0; }
.aside-titre { font-family: var(--sans); font-size: var(--fs-legende); font-weight: 600; color: var(--gris); margin-bottom: 0.6rem; }
.aside-bloc p { margin-bottom: 0.5rem; }
.aside-bloc p:last-child { margin-bottom: 0; }
.liste-liens { list-style: none; margin: 0; padding: 0; }
.liste-liens li { margin-bottom: 0.45rem; }
.sommaire { padding-bottom: var(--esp-3); }
.sommaire ol { padding-left: 1.2rem; margin: 0; }
.sommaire li { margin-bottom: 0.45rem; }

/* Poursuivre */
.poursuivre { padding-top: var(--esp-section); }
.poursuivre h2 { margin-bottom: var(--esp-4); }
.poursuivre-liste { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gouttiere); border-top: 1px solid var(--filet); padding-top: var(--esp-4); }
.poursuivre-item h3 { font-family: var(--serif); font-weight: 400; font-size: var(--fs-3); margin-bottom: 0.6rem; line-height: 1.3; }
.poursuivre-item p { font-size: var(--fs-petit); color: var(--gris); margin: 0; }
@media (max-width: 899px) { .poursuivre-liste { grid-template-columns: 1fr; } }

/* Listes d'index (domaines, analyses, zones) */
.liste-index { list-style: none; margin: 0; padding: 0; max-width: none; border-top: 1px solid var(--filet); }
.liste-index > li { margin: 0; padding: var(--esp-4) 0; border-bottom: 1px solid var(--filet); display: grid; grid-template-columns: 5fr 7fr; gap: var(--gouttiere); }
.liste-index h2, .liste-index h3 { font-family: var(--serif); font-size: var(--fs-3); font-weight: 400; margin: 0; line-height: 1.3; }
.liste-index p { margin: 0; }
.liste-index .meta { color: var(--gris); font-size: var(--fs-legende); margin-top: 0.6rem; }
@media (max-width: 899px) { .liste-index > li { grid-template-columns: 1fr; gap: var(--esp-2); } }

/* Page des offres */
.offre { padding: var(--esp-5) 0; border-top: 1px solid var(--filet); }
.offre:target { scroll-margin-top: var(--esp-4); }
.offre-entete { display: grid; grid-template-columns: 4rem 1fr auto; gap: var(--esp-3); align-items: baseline; margin-bottom: var(--esp-3); }
.offre-entete .offre-numero { color: var(--gris); font-family: var(--serif); font-size: var(--fs-3); }
.offre-entete h2 { margin: 0; }
.offre-entete .offre-prix { font-family: var(--serif); font-size: var(--fs-3); color: var(--navy); text-align: right; }
.offre-grille { display: grid; grid-template-columns: 7fr 5fr; gap: var(--gouttiere); }
.offre-sous-titre { font-family: var(--serif); font-size: var(--fs-chapeau); line-height: 1.4; color: var(--encre); margin-bottom: var(--esp-3); }
.offre-ideal { border-left: 2px solid var(--navy); padding-left: var(--esp-3); }
.offre-ideal h3 { font-size: var(--fs-4); margin-bottom: 0.5rem; }
.offre-ideal p:last-child { margin-bottom: 0; }
@media (max-width: 899px) {
  .offre-entete { grid-template-columns: 4rem 1fr; }
  .offre-entete .offre-prix { grid-column: 2; text-align: left; }
  .offre-grille { grid-template-columns: 1fr; }
}

/* Résultat du diagnostic express */
.resultat-profil { background: var(--navy); color: #FFFFFF; padding: var(--esp-5); margin-bottom: var(--esp-5); }
.resultat-profil h2, .resultat-profil p { color: #FFFFFF; }
.resultat-profil h2 { margin-bottom: var(--esp-2); }
.resultat-profil p:last-child { margin-bottom: 0; }
.resultat-profil .legende { color: var(--filet); margin-bottom: var(--esp-2); }
.observations { list-style: none; padding: 0; margin: 0 0 var(--esp-5); max-width: 760px; counter-reset: observation; }
.observations li { display: grid; grid-template-columns: 3.5rem 1fr; gap: var(--esp-3); padding: var(--esp-4) 0; border-top: 1px solid var(--filet); margin: 0; }
.observations li:last-child { border-bottom: 1px solid var(--filet); }
.observations li::before { counter-increment: observation; content: counter(observation, decimal-leading-zero); font-family: var(--serif); font-size: var(--fs-2); color: var(--navy); line-height: 1; }
.observations h3 { margin-bottom: 0.5rem; }
.observations p { margin-bottom: 0; }

/* Situations et blocs */
.situation { border-top: 1px solid var(--filet); padding-top: var(--esp-3); }
.situation h3 { margin-bottom: var(--esp-2); }
.situation .legende { margin-bottom: var(--esp-2); }
.bloc-navy { background: var(--navy); color: #FFFFFF; padding: var(--esp-5); }
.bloc-navy h2, .bloc-navy h3, .bloc-navy p { color: #FFFFFF; }
.bloc-navy a { color: #FFFFFF; text-decoration-color: var(--filet); }
.bloc-navy a:hover { text-decoration-color: #FFFFFF; color: #FFFFFF; }
.bloc-navy .bouton { background: #FFFFFF; color: var(--navy); border-color: #FFFFFF; text-decoration: none; }
.bloc-navy .bouton:hover { background: var(--fond-alt); border-color: var(--fond-alt); color: var(--navy); }
.bloc-navy p:last-child { margin-bottom: 0; }
.rendez-vous-lien { margin: var(--esp-4) 0; }
.definition-liste dt { font-weight: 600; color: var(--navy); margin-top: var(--esp-3); }
.definition-liste dd { margin: 0.25rem 0 0; }
.compact p { margin-bottom: var(--esp-2); }
.note { font-size: var(--fs-petit); color: var(--gris); border-top: 1px solid var(--filet); padding-top: var(--esp-2); }

/* Espace de consultation */
.admin { padding: var(--esp-4) 0; }
.admin .filtres { display: flex; flex-wrap: wrap; gap: var(--esp-2); align-items: flex-end; margin-bottom: var(--esp-4); }
.admin .filtres .champ { margin: 0; min-width: 12rem; }
.admin .tableau td { font-size: var(--fs-legende); }
.admin pre { white-space: pre-wrap; font-size: var(--fs-legende); background: var(--fond-alt); padding: var(--esp-2); }