/* قالبِ صفحه‌های محتواییِ سئو (۱۴۰۵/۰۶/۲۰) — مکملِ landing.min.css، نه جایگزینش.
   همان متغیرهای رنگ و فونتِ لندینگ استفاده می‌شود تا صفحه‌های مقاله با لندینگ یک‌دست باشند.
   فقط چیزهایی اینجاست که لندینگ ندارد: نثرِ بلند (فاصله‌ی سطر، سرتیترها، فهرست‌ها)، مسیرِ صفحه
   (breadcrumb)، فهرستِ مطالب، و جعبه‌ی «به‌زودی». هیچ جاوااسکریپتی ندارد. */

.article-main { padding-block: 56px 72px; }
.article-wrap { max-width: 860px; margin-inline: auto; padding-inline: 20px; }

/* مسیرِ صفحه — هم برای کاربر هم برای BreadcrumbList ی گوگل */
.breadcrumb { font-size: 13px; color: var(--navy-400); margin-bottom: 20px; }
.breadcrumb a { color: var(--navy-500); text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }
.breadcrumb span { margin-inline: 8px; color: var(--navy-300); }

.article-title { font-size: clamp(28px, 4vw, 42px); font-weight: 800; line-height: 1.35; color: var(--navy-900); margin: 0 0 14px; }
.article-lede { font-size: 18px; line-height: 1.9; color: var(--navy-600); margin: 0 0 28px; }
.article-meta { font-size: 13px; color: var(--navy-400); margin-bottom: 36px; }

/* فهرستِ مطالب — لینک‌های درون‌صفحه‌ای؛ برای گوگل هم سیگنالِ ساختار است */
.toc { background: var(--paper-soft); border: 1px solid var(--border); border-radius: 14px; padding: 18px 22px; margin-bottom: 36px; }
.toc-title { font-weight: 800; color: var(--navy-800); margin-bottom: 8px; font-size: 14px; }
.toc ol { margin: 0; padding-inline-start: 20px; line-height: 2.1; }
.toc a { color: var(--navy-600); text-decoration: none; }
.toc a:hover { color: var(--accent-600); }

.prose { font-size: 17px; line-height: 2; color: var(--navy-700); }
.prose h2 { font-size: 26px; font-weight: 800; color: var(--navy-900); margin: 44px 0 14px; line-height: 1.4; scroll-margin-top: 90px; }
.prose h3 { font-size: 20px; font-weight: 700; color: var(--navy-800); margin: 30px 0 10px; scroll-margin-top: 90px; }
.prose p { margin: 0 0 16px; }
.prose ul, .prose ol { margin: 0 0 18px; padding-inline-start: 24px; }
.prose li { margin-bottom: 6px; }
.prose strong { color: var(--navy-900); }
.prose a { color: var(--accent-600); }

/* جدولِ مقایسه‌ی قابلیت‌ها — ستونِ «در ملل CRM» با سه حالت */
.ftable { width: 100%; border-collapse: collapse; margin: 18px 0 28px; font-size: 15px; }
.ftable th, .ftable td { border: 1px solid var(--border); padding: 10px 12px; text-align: start; vertical-align: top; }
.ftable th { background: var(--paper-soft); color: var(--navy-800); font-weight: 700; }
.ftable .yes { color: var(--accent-600); font-weight: 700; white-space: nowrap; }
.ftable .soon { color: var(--gold-600); font-weight: 700; white-space: nowrap; }

/* جعبه‌ی صداقت: هرجا قابلیتی نداریم، همان‌جا می‌گوییم — نه در فوتر */
.callout { border-inline-start: 4px solid var(--accent-500); background: var(--accent-50); border-radius: 10px; padding: 14px 18px; margin: 20px 0; font-size: 15.5px; line-height: 1.9; }
.callout--soon { border-color: var(--gold-500); background: #fdf6e3; }

/* دعوتِ پایانِ مقاله */
.article-cta { margin-top: 48px; padding: 28px; border-radius: 16px; background: var(--navy-900); color: #fff; text-align: center; }
.article-cta h2 { color: #fff; font-size: 22px; margin: 0 0 8px; }
.article-cta p { color: #cfd6ea; margin: 0 0 18px; }

/* مقاله‌های مرتبط — لینک‌سازیِ داخلی */
.related { margin-top: 40px; }
.related h2 { font-size: 20px; margin-bottom: 12px; }
.related ul { list-style: none; padding: 0; margin: 0; }
.related li { padding: 8px 0; border-bottom: 1px solid var(--border); }
.related a { color: var(--navy-700); text-decoration: none; font-weight: 600; }
.related a:hover { color: var(--accent-600); }

@media (max-width: 640px) {
  .prose { font-size: 16px; }
  .ftable { font-size: 13.5px; }
  .ftable th, .ftable td { padding: 8px; }
}