/* Blog list */
.blogs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.blog-full-card { border-radius: var(--r); overflow: hidden; border: 1px solid var(--border); transition: box-shadow .2s; text-decoration: none; color: inherit; display: flex; flex-direction: column; }
.blog-full-card:hover { box-shadow: var(--sh2); }
.blog-full-img img { width: 100%; height: 180px; object-fit: cover; display: block; }
.blog-full-info { padding: 16px; flex: 1; display: flex; flex-direction: column; gap: 8px; text-align: right; }
.blog-full-info h3 { font-size: 14px; font-weight: 700; color: var(--dark); line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.blog-full-info p { font-size: 12px; color: var(--muted); line-height: 1.6; flex: 1; }
.blog-date { font-size: 11px; color: var(--muted); margin-top: auto; }
@media (max-width: 768px) { .blogs-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .blogs-grid { grid-template-columns: 1fr; } }

/* Article */
.article-layout { max-width: 860px; margin: 0 auto; }
.article-content { background: #fff; border: 1px solid var(--border); border-radius: var(--r); padding: 32px; }
.article-body { text-align: right; direction: rtl; font-size: 14px; line-height: 2; color: var(--dark); }
.article-body h1,.article-body h2,.article-body h3 { font-weight: 700; margin: 20px 0 10px; }
.article-body h2 { font-size: 18px; }
.article-body h3 { font-size: 16px; }
.article-body p { margin-bottom: 14px; }
.article-body img { max-width: 100%; border-radius: 8px; margin: 12px 0; }
.article-body a { color: var(--orange); text-decoration: underline; }
.article-body ul,.article-body ol { padding-right: 24px; margin-bottom: 14px; }
.article-body li { margin-bottom: 6px; }
.article-body blockquote { border-right: 4px solid var(--orange); padding-right: 16px; margin: 16px 0; color: var(--muted); font-style: italic; }
.article-body table { width: 100%; border-collapse: collapse; margin: 16px 0; }
.article-body table th,.article-body table td { border: 1px solid var(--border); padding: 10px; text-align: right; }
.article-body table th { background: #f8f8f8; font-weight: 700; }
@media (max-width: 768px) { .article-content { padding: 20px 16px; } }

/* Blog list page */
.blogs-page-intro {
    margin-bottom: 24px;
    text-align: right;
}

.blogs-page-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--dark);
    margin-bottom: 4px;
}

.blogs-page-desc {
    font-size: 13px;
    color: var(--muted);
}

.blogs-pagination-wrap {
    margin-top: 32px;
    display: flex;
    justify-content: center;
}

.blogs-empty {
    text-align: center;
    padding: 80px 20px;
    color: var(--muted);
}

.blogs-empty-icon {
    margin-bottom: 12px;
    opacity: 0.4;
}

/* Article page */
.article-bc {
    text-align: right;
    margin-bottom: 20px;
    font-size: 12px;
    color: var(--muted);
}

.article-bc a {
    color: var(--muted);
    text-decoration: none;
}

.article-bc-sep {
    margin: 0 6px;
}

.article-header {
    text-align: right;
    margin-bottom: 20px;
}

.article-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--dark);
    line-height: 1.6;
    margin-bottom: 12px;
}

.article-meta {
    font-size: 12px;
    color: var(--muted);
}

.article-featured-img {
    width: 100%;
    max-height: 420px;
    object-fit: cover;
    border-radius: var(--r);
    margin-bottom: 28px;
    display: block;
}

.article-back-wrap {
    margin-top: 32px;
    text-align: right;
}

.article-back-link {
    font-size: 13px;
    color: var(--orange);
    text-decoration: none;
    font-weight: 600;
}
