.article-page .article-heading,
.article-page .article-body,
.article-page .article-comments,
.article-page .article-share,
.article-page .article-return {
    min-width: 0;
}

.article-page .article-breadcrumb a,
.article-page .article-breadcrumb span,
.article-page .article-body,
.article-page .related-story h3 {
    overflow-wrap: anywhere;
}

.article-page .article-reading-info > span { min-width: 0; }
.article-page .article-reading-info .article-social-share { margin-left: auto; }
.article-page .article-body iframe,
.article-page .article-body video,
.article-page .article-body audio { max-width: 100%; }
.article-page .article-body iframe { display: block; width: 100%; border: 0; }
.article-page .article-body hr { border: 0; border-top: 1px solid #dce4eb; margin: 2em 0; }

@media (max-width: 900px) {
    .article-page .article-main { padding-left: 18px; padding-right: 18px; }
    .article-page .article-layout { gap: 24px; }
    .article-page .article-content { padding: 28px; }
    .article-page .article-aside { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}

@media (max-width: 680px) {
    .article-page .article-main { padding-left: 12px; padding-right: 12px; }
    .article-page .article-content { padding: 22px 16px; }
    .article-page .article-category { margin-bottom: 14px; }
    .article-page .article-content h1 { font-size: clamp(25px, 7.5vw, 34px); line-height: 1.48; margin-bottom: 18px; }
    .article-page .article-author-row { gap: 9px; }
    .article-page .article-whatsapp { width: 36px; height: 36px; font-size: 18px; }
    .article-page .article-dek { font-size: 16px; line-height: 1.8; padding-left: 12px; margin: 18px 0 14px; }
    .article-page .article-reading-info { gap: 12px; padding: 12px 0; }
    .article-page .article-reading-info .article-social-share { margin-left: 0; }
    .article-page .article-cover { margin: 20px 0 24px; }
    .article-page .article-body { font-size: 17px; line-height: 1.9; }
    .article-page .article-body h1 { font-size: 26px; }
    .article-page .article-body h2 { font-size: 23px; }
    .article-page .article-body h3 { font-size: 20px; }
    .article-page .article-body blockquote { margin: 22px 0; padding: 14px 16px; }
    .article-page .article-share { align-items: flex-start; gap: 10px; padding-top: 16px; }
    .article-page .article-share > span:first-child { width: 100%; margin-right: 0; }
    .article-page .article-return { font-size: 13px; line-height: 1.5; }
    .article-page .article-aside { display: block; }
    .article-page .related-panel { padding: 18px; }
    .article-page .related-story { padding: 15px 0; }
    .article-page .archive-note { padding: 20px; }
}

@media (max-width: 420px) {
    .article-page .article-main { padding-left: 8px; padding-right: 8px; }
    .article-page .article-content { padding: 18px 13px; }
    .article-page .article-author-row strong { font-size: 13px; }
    .article-page .article-author-row time { font-size: 11px; }
    .article-page .article-reading-info { grid-template-columns: 1fr; }
    .article-page .article-reading-info > span:first-child,
    .article-page .article-reading-info > .article-social-label,
    .article-page .article-reading-info > .article-social-share { grid-column: 1; grid-row: auto; }
    .article-page .article-social-share { gap: 5px; }
    .article-page .article-social-share a,
    .article-page .article-social-share button { width: 34px; min-width: 34px; height: 34px; }
    .article-page .comment-form-footer { gap: 12px; }
    .article-page .captcha-label { white-space: normal; }
}