/* ════════════════════════════════════════════════════════════
   Kerbone V2 — base de questions-réponses /questions/ (08/10/2026).
   Complète expertise.css (chargée avant). Tokens de main.css uniquement.
════════════════════════════════════════════════════════════ */

.kv2-q .kb-expertise__hero { margin-bottom: 40px; }

/* Sommaire : cartes de thèmes */
.kv2-q__themes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 56px; }
.kv2-q__theme {
  display: flex; flex-direction: column; gap: 12px; padding: 24px;
  border: 1px solid var(--c-bg-border); border-radius: var(--r-card); background: var(--c-bg-white);
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.kv2-q__theme:hover { border-color: rgba(0, 61, 213, 0.35); box-shadow: 0 18px 40px -28px rgba(11, 29, 82, 0.45); }
.kv2-q__theme h2 { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -0.01em; }
.kv2-q__theme h2 a { color: var(--c-text-title); }
.kv2-q__theme ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; flex: 1; }
.kv2-q__theme li a { font-size: 15px; line-height: 1.45; color: var(--c-text-default); }
.kv2-q__theme li a:hover { color: var(--c-sage); }
.kv2-q__more { font-size: 14px; font-weight: 600; color: var(--c-sage); }
.kv2-q__more:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Page thème : sommaire + réponses courtes */
.kv2-q__toc { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 40px; }
.kv2-q__toc a {
  font-size: 13.5px; padding: 7px 12px; border-radius: var(--r-full);
  border: 1px solid var(--c-bg-border); color: var(--c-text-default); background: var(--c-bg-white);
}
.kv2-q__toc a:hover { border-color: var(--c-sage); color: var(--c-sage); }
.kv2-q__list { display: grid; gap: 0; margin-bottom: 40px; }
.kv2-q__item { padding: 28px 0; border-top: 1px solid var(--c-bg-border); scroll-margin-top: 120px; }
.kv2-q__item h2 { margin: 0 0 10px; font-size: 21px; line-height: 1.3; font-weight: 700; letter-spacing: -0.01em; text-wrap: balance; }
.kv2-q__item h2 a { color: var(--c-text-title); }
.kv2-q__item h2 a:hover { color: var(--c-sage); }
.kv2-q__item p { margin: 0 0 10px; font-size: 16px; line-height: 1.65; color: var(--c-text-default); max-width: 70ch; }
.kv2-q__exp { font-size: 15.5px; color: var(--c-text-default); margin: 0 0 32px; }
.kv2-q__exp a { color: var(--c-sage); font-weight: 600; }

/* Page question */
.kv2-q--article { max-width: 820px; }
.kv2-q__head { margin-bottom: 28px; }
.kv2-q__date { font-size: 13.5px; color: var(--c-text-muted); margin: 0; }
.kv2-q__bref, .kv2-q__kerbone {
  border-radius: var(--r-card); padding: 22px 24px; margin: 0 0 36px;
}
.kv2-q__bref { background: var(--c-mist); border: 1px solid rgba(0, 61, 213, 0.18); }
.kv2-q__bref p { margin: 0; font-size: 17.5px; line-height: 1.6; color: var(--c-text-title); font-weight: 500; }
.kv2-q__bref-label {
  display: block; margin-bottom: 8px; font-size: 11.5px; font-weight: 700; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--c-sage);
}
.kv2-q__corps { margin-bottom: 36px; }
.kv2-q__corps h2 { font-size: 23px; line-height: 1.3; font-weight: 700; letter-spacing: -0.01em; color: var(--c-text-title); margin: 36px 0 12px; text-wrap: balance; }
.kv2-q__corps p { font-size: 16.5px; line-height: 1.7; color: var(--c-text-default); margin: 0 0 14px; max-width: 70ch; }
.kv2-q__corps ul { margin: 0 0 16px; padding-left: 22px; display: grid; gap: 8px; }
.kv2-q__corps li { font-size: 16.5px; line-height: 1.6; color: var(--c-text-default); }
.kv2-q__kerbone { background: var(--c-bg-dark); color: var(--c-text-dark-default); }
.kv2-q__kerbone .kv2-q__bref-label { color: var(--c-sage-light); }
.kv2-q__kerbone p { margin: 0 0 10px; font-size: 16px; line-height: 1.6; color: var(--c-text-dark-default); }
.kv2-q__kerbone .kv2-q__more { color: #fff; }
.kv2-q__liees { margin: 0 0 40px; }
.kv2-q__liees ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.kv2-q__liees a {
  display: block; padding: 14px 18px; border-radius: 12px; border: 1px solid var(--c-bg-border);
  color: var(--c-text-title); font-weight: 600; font-size: 15.5px; background: var(--c-bg-white);
}
.kv2-q__liees a:hover { border-color: var(--c-sage); color: var(--c-sage); }

@media (max-width: 720px) {
  .kv2-q__themes { grid-template-columns: 1fr; }
  .kv2-q__item h2 { font-size: 19px; }
  .kv2-q__bref p { font-size: 16.5px; }
}