/* ===== Article (page détail) ===== */
.article { padding: 24px 0 64px; }
.article .section-title { margin-bottom: 4px; }

/* Meta + chapo */
.meta { color:#6b7280; font-size:.95rem; margin: 0 0 12px; }
.chapo {
  font-weight: 500; color:#374151;
  margin: 8px 0 18px; line-height: 1.6;
}

/* Cover */
.article-cover {
  margin: 0 0 16px; border-radius: 12px; overflow: hidden;
  background: var(--grey-50, #f5f5f5);
}
.article-cover img { width:100%; height:auto; display:block; }

/* Corps de l’article */
.article-body { color:#1f2937; }
.article-body > * + * { margin-top: 14px; }
.article-body h2 { font-size:1.35rem; margin-top: 22px; }
.article-body h3 { font-size:1.15rem; margin-top: 18px; }

.article-body p { line-height:1.75; }
.article-body ul, .article-body ol { padding-left: 1.25rem; }
.article-body li + li { margin-top: .3rem; }

.article-body figure {
  margin: 16px 0; text-align: center;
}
.article-body figure img {
  max-width: 100%; height: auto; border-radius: 10px;
}
.article-body figure figcaption {
  color:#6b7280; font-size:.9rem; margin-top: 6px;
}

/* Citations / code / tableaux */
.article-body blockquote{
  border-left:4px solid var(--red, #C1272D);
  background:#fafafa; padding:10px 12px; border-radius: 8px; color:#374151;
}
.article-body pre, .article-body code{
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size:.92rem;
}
.article-body pre{
  background:#0b1020; color:#e5e7eb; padding:12px; border-radius:10px; overflow:auto;
}
.article-body table{
  width:100%; border-collapse: collapse; font-size:.97rem;
}
.article-body th, .article-body td{
  border:1px solid #e5e7eb; padding:.55rem .6rem;
}
.article-body th{ background:#fafafa; text-align:left; }

/* Encadré Faits clés */
.facts {
  margin: 20px 0; border:1px solid #eee; border-radius:12px; padding:14px 16px;
  background:#fff;
}
.facts h2 { margin:0 0 6px; }
.facts ul { padding-left:1.1rem; }
.facts li + li { margin-top: .3rem; }

/* Articles liés */
.related { margin-top: 24px; }
.related .h4 { margin-bottom: 10px; }
.related .news-grid {
  display:grid; gap:16px; grid-template-columns: repeat(3, minmax(0,1fr));
}
@media (max-width: 992px){
  .related .news-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px){
  .related .news-grid { grid-template-columns: 1fr; }
}

/* Partage */
.share{
  display:flex; gap:10px; margin-top: 16px; flex-wrap: wrap;
}
.share .btn{ border:1px solid #e5e7eb; }
.share .btn:hover{ filter:brightness(.98); }

/* Accessibilité focus */
.article a:focus, .article button:focus {
  outline:2px solid var(--red, #C1272D); outline-offset:2px;
}
/* =========================
   Carte élégante (article seul)
   — n'affecte que : #post-title, #post-meta, .article-cover, #post-excerpt, #post-body
   ========================= */
:root{
  --article-pad: 28px;
  --article-border: #e5e7eb;
  --article-radius: 14px;
  --article-shadow: 0 8px 22px rgba(0,0,0,.05);
}

/* Début de la carte (titre) */
#post-title.section-title{
  background:#fff;
  border:1px solid var(--article-border);
  border-bottom:none;
  border-radius: var(--article-radius) var(--article-radius) 0 0;
  padding: calc(var(--article-pad) - 6px) var(--article-pad) 10px;
  margin: 0;                /* on supprime les marges pour une carte continue */
  box-shadow: var(--article-shadow);
}

/* Corps de la carte (éléments intermédiaires) */
#post-meta.meta,
.article-cover,
#post-excerpt.chapo{
  background:#fff;
  border-left:1px solid var(--article-border);
  border-right:1px solid var(--article-border);
  margin:0;
  padding: 0 var(--article-pad);
}

/* Meta */
#post-meta.meta{ padding-top: 6px; padding-bottom: 12px; color:#6b7280; }

/* Cover : image complète (aucun crop) */
.article-cover{ padding: 0 var(--article-pad); }
.article-cover img#post-cover{
  width:100%;
  height:auto;          /* conserve le ratio d’origine */
  object-fit: contain;  /* affiche toute l’image */
  display:block;
  border-radius: 10px;  /* léger arrondi interne */
}

/* Chapo */
#post-excerpt.chapo{ padding-top: 16px; padding-bottom: 8px; }

/* Fin de la carte (body) */
#post-body.article-body{
  background:#fff;
  border:1px solid var(--article-border);
  border-top:none;
  border-radius: 0 0 var(--article-radius) var(--article-radius);
  padding: 8px var(--article-pad) var(--article-pad);
  margin:0;
  box-shadow: var(--article-shadow);
}

/* Responsive */
@media (max-width: 640px){
  :root{ --article-pad: 18px; }
  #post-title.section-title{ padding: calc(var(--article-pad) - 6px) var(--article-pad) 8px; }
}