/* Mise en forme du contenu des articles : utilisée sur le site ET dans l'éditeur,
   pour que l'aperçu pendant la rédaction corresponde au rendu final. */
.article-body {
    color: #334155;
    font-size: 1.125rem;
    line-height: 1.8;
    overflow-wrap: break-word;
}
.article-body > :first-child { margin-top: 0; }
.article-body p { margin: 0 0 1.25em; }
.article-body h2 {
    margin: 2em 0 .6em; color: #031827;
    font-size: clamp(1.6rem, 3vw, 2.1rem); font-weight: 900; line-height: 1.2;
}
.article-body h3 {
    margin: 1.7em 0 .5em; color: #031827;
    font-size: clamp(1.25rem, 2.4vw, 1.5rem); font-weight: 800; line-height: 1.3;
}
.article-body strong { color: #031827; font-weight: 800; }
.article-body a { color: #0e7490; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.article-body a:hover { color: #0891b2; }
.article-body ul, .article-body ol { margin: 0 0 1.25em; padding-left: 1.5em; }
.article-body ul { list-style: disc; }
.article-body ol { list-style: decimal; }
.article-body li { margin: .35em 0; padding-left: .25em; }
.article-body li::marker { color: #0891b2; font-weight: 700; }
.article-body blockquote {
    margin: 2em 0; padding: 1.25em 1.5em;
    border-left: 4px solid #06b6d4; border-radius: 0 1.25rem 1.25rem 0;
    background: #ecfeff; color: #164e63;
    font-size: 1.2rem; font-weight: 600; font-style: italic;
}
.article-body blockquote p:last-child { margin-bottom: 0; }
.article-body hr { margin: 2.5em auto; width: 30%; border: 0; border-top: 3px solid #cffafe; border-radius: 3px; }

.article-body table { width: 100%; margin: 2em 0; border-collapse: collapse; font-size: 1rem; display: block; overflow-x: auto; }
.article-body th, .article-body td { min-width: 90px; padding: .7em .9em; border: 1px solid #e2e8f0; text-align: left; vertical-align: top; }
.article-body th { color: white; background: #0e7490; font-weight: 700; }
.article-body tbody tr:nth-child(even) { background: #f8fafc; }

.article-body figure.article-image { display: block; max-width: 100%; margin: 2em 0; }
.article-body figure.article-image.image-align-left { margin-left: 0; margin-right: auto; }
.article-body figure.article-image.image-align-center { margin-left: auto; margin-right: auto; }
.article-body figure.article-image.image-align-right { margin-left: auto; margin-right: 0; }
.article-body figure.article-image img { display: block; width: 100%; height: auto; margin: 0; border-radius: 1.25rem; }
.article-body figcaption { margin-top: .6em; color: #64748b; font-size: .9rem; text-align: center; }
.article-body .article-image-row { display: flex; flex-wrap: wrap; gap: 0; width: 100%; margin: 2em 0; }
.article-body .article-image-row > figure.article-image { margin: 0 !important; padding: 0 .4rem; }
.article-body .article-image-row > figure.article-image:first-child { padding-left: 0; }
.article-body .article-image-row > figure.article-image:last-child { padding-right: 0; }

.article-body .video-embed {
    position: relative; margin: 2em 0; aspect-ratio: 16 / 9;
    overflow: hidden; border-radius: 1.25rem; background: #031827;
}
.article-body .video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

@media (max-width: 640px) {
    .article-body { font-size: 1.05rem; }
    .article-body figure.article-image { width: 100% !important; }
    .article-body .article-image-row > figure.article-image { padding: 0; margin-bottom: 1em !important; }
}
