/* ── Article page ── */
.article-page {
  max-width: var(--content-max);
  margin-inline: auto;
  padding-bottom: 4rem;
  background: #ffffff;
  /* Light mode : fond blanc, texte noir */
  --text: #000000;
  --text-secondary: #333333;
  --text-muted: #777777;
}

@media (prefers-color-scheme: dark) {
  .article-page {
    background: #0d0d0d;
    --text: #ffffff;
    --text-secondary: #e5e5e5;
    --text-muted: #aaaaaa;
  }
}

.article-cover { width: 100%; text-align: center; background: var(--bg-secondary); }
.article-cover img { display: block; width: 100%; height: auto; object-fit: unset; }
.article-inner { max-width: 720px; margin: 0 auto; padding: 2.5rem 2rem; }
.article-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.8rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  margin-bottom: 0.75rem;
  color: var(--text);
}
.article-date { font-family: 'Cormorant Garamond', serif; font-style: italic; display: block; font-size: 1rem; color: var(--text-muted); margin-bottom: 2rem; }
.article-body { font-family: 'Cormorant Garamond', serif; font-size: 1.35rem; line-height: 1.7; color: var(--text-secondary); }
.article-body h2 { font-family: 'Cormorant Garamond', serif; font-size: 1.9rem; font-weight: 700; margin: 2rem 0 0.75rem; color: var(--text); }
.article-body h3 { font-family: 'Cormorant Garamond', serif; font-size: 1.55rem; font-weight: 600; margin: 1.5rem 0 0.5rem; color: var(--text); }
.article-body p { margin-bottom: 1.25rem; }
.article-body a { color: var(--accent); text-decoration: none; }
.article-body a:hover { text-decoration: underline; }
.article-body img { width: 100%; border-radius: 8px; margin: 1.5rem 0; }
.article-body ul, .article-body ol { padding-left: 1.5rem; margin-bottom: 1.25rem; }
.article-body li { margin-bottom: 0.5rem; }

@media (max-width: 600px) {
  .article-inner { padding: 1.5rem 1rem; }
  .article-title { font-size: 2.1rem; }
}