/* Comprendre / Understand page only (ressources/, en/resources/). Loaded after theme.css. */
.res-page section.bloc { padding-block: 44px 56px; }
.res-page h1 { font-size: clamp(2rem, 4.6vw, 3.2rem); }
.res-page .res-intro { margin-top: 12px; font-size: 1.02rem; }
.res-page .res-block { margin-top: 30px; }
.res-page .res-block h2,
.res-page .video-card h2 { font-size: clamp(1.25rem, 2.4vw, 1.6rem); margin-bottom: 4px; }
.res-page .res-block .field-note { margin: 2px 0 0; font-size: .86rem; }

/* Jump links */
.res-toc {
  display: flex; flex-wrap: wrap; gap: 6px 8px;
  margin: 20px 0 0; padding: 0; font-size: .8rem;
}
.res-toc a {
  padding: 3px 11px; border: 1px solid var(--line); border-radius: 999px;
  background: var(--paper); color: var(--ink); text-decoration: none;
}
.res-toc a:hover, .res-toc a:focus-visible { border-color: var(--bleu); color: var(--bleu); }

/* Card grid: one column on phones, two from 640px */
.res-page .res-grid { gap: 8px; margin-top: 12px; grid-template-columns: minmax(0, 1fr); }
.res-page .res-grid a { padding: 10px 14px; min-width: 0; overflow-wrap: anywhere; line-height: 1.4; }
.res-page .res-grid a small { font-size: .78rem; line-height: 1.4; }
@media (min-width: 640px) {
  .res-page .res-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .res-page .res-grid > a:only-child { grid-column: 1 / -1; }
}
.res-page .res-grid a.res-feature {
  grid-column: 1 / -1; border-color: var(--bleu); background: var(--bleu-pale);
}
.res-page .res-grid a.res-feature small { color: var(--body); }

/* Video card: tighter */
.res-page .res-video { margin: 30px 0 0; }
.res-page .res-video .video-card-copy { padding: 14px 16px 12px; }
.res-page .ai-summary { padding: 11px 16px 12px; }
.res-page .ai-summary .field-note { margin-top: 10px; }
.res-page .ai-summary > p + p { margin-top: 10px; }

/* Secondary links as chips */
.res-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; font-size: .8rem; }
.res-chips a {
  padding: 3px 11px; border: 1px solid var(--line); border-radius: 999px;
  background: var(--paper); color: var(--ink); text-decoration: none;
}
.res-chips a:hover, .res-chips a:focus-visible { border-color: var(--bleu); color: var(--bleu); }

/* Closing call to action + one-line support */
.res-cta { margin-top: 34px; padding-top: 20px; border-top: 1px solid var(--line); }
.res-help { margin-top: 12px; font-size: .86rem; color: var(--muted); }
.res-help-btn {
  font: inherit; font-weight: 600; color: var(--bleu); background: none;
  border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 2px;
}
.res-help-btn:disabled { color: var(--muted); cursor: default; text-decoration: none; }
.res-cta .support-status:empty { display: none; }
.res-cta .support-status { margin-top: 6px; font-size: .84rem; }