/* ============================================================
   DMHouse — Post Archive / Blog  (RTL)
   ============================================================ */
.dm-blog-wrap { direction: rtl; background: #f7f8fa; min-height: 80vh; }
.dm-arc-inner { max-width: 1450px; margin: 0 auto; padding: 0 24px 60px; }

/* Breadcrumb */
.dm-arc-breadcrumb {
    font-size: 12px; color: #aaa;
    display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
    padding: 14px 0;
}
.dm-arc-breadcrumb a { color: #aaa; text-decoration: none; }
.dm-arc-breadcrumb a:hover { color: var(--dm-primary,#ff6600); }
.dm-arc-breadcrumb span { color: #ddd; }
.dm-arc-breadcrumb span:last-child { color: #555; }

/* Category page header */
.dm-arc-page-header { padding: 8px 0 20px; }
.dm-arc-page-header h1 { font-size: 24px; font-weight: 900; margin: 0 0 8px; }
.dm-arc-page-desc { font-size: 13px; color: #777; line-height: 1.8; margin: 0; }


/* ════ Category Circles Row ════ */
.dm-arc-cats-scroll {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding-bottom: 4px;
    margin-bottom: 32px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.dm-arc-cats-scroll::-webkit-scrollbar { display: none; }

.dm-arc-cat-circle {
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    text-decoration: none;
    flex-shrink: 0;
    min-width: 72px;
    transition: transform 0.2s;
}
.dm-arc-cat-circle:hover { transform: translateY(-2px); }
.dm-arc-cat-ico {
    width: 60px; height: 60px;
    background: #fff;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    border: 2px solid #f0f0f0;
    color: #888;
    transition: all 0.2s;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}
.dm-arc-cat-circle:hover .dm-arc-cat-ico,
.dm-arc-cat-circle.is-active .dm-arc-cat-ico {
    background: var(--cat-clr, var(--dm-primary,#ff6600));
    color: #fff;
    border-color: var(--cat-clr, var(--dm-primary,#ff6600));
    box-shadow: 0 4px 14px rgba(0,0,0,0.15);
}
.dm-arc-cat-circle.is-active .dm-arc-cat-ico { background: var(--dm-primary,#ff6600); color: #fff; border-color: var(--dm-primary,#ff6600); }
.dm-arc-cat-circle span { font-size: 11.5px; font-weight: 700; color: #555; white-space: nowrap; }
.dm-arc-cat-circle.is-active span { color: var(--dm-primary,#ff6600); }


/* ════ Section Header ════ */
.dm-arc-section-hd {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 2px solid #f0f0f0;
}
.dm-arc-section-hd h2 { font-size: 18px; font-weight: 900; color: #222; margin: 0; display: flex; align-items: center; gap: 8px; }
.dm-arc-section-hd a  { font-size: 12.5px; color: var(--dm-primary,#ff6600); text-decoration: none; font-weight: 700; }

.dm-arc-cat-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; flex-shrink: 0; }


/* ════ Latest Posts — Featured Grid ════ */
.dm-arc-latest-section { margin-bottom: 40px; }

.dm-arc-latest-grid {
    display: grid;
    grid-template-columns: 1.7fr 1fr;
    gap: 16px;
    margin-bottom: 20px;
}
@media (max-width: 900px) { .dm-arc-latest-grid { grid-template-columns: 1fr; } }

/* Featured large card */
.dm-arc-feat-card { display: block; text-decoration: none; border-radius: 16px; overflow: hidden; height: 508px; }
.dm-arc-feat-bg {
    width: 100%; height: 100%;
    background-size: cover; background-position: top center;
    background-color: #eee;
    position: relative; display: flex; align-items: flex-end;
    transition: transform 0.4s;
}
.dm-arc-feat-card:hover .dm-arc-feat-bg { transform: scale(1.02); }
.dm-arc-feat-overlay {
    width: 100%; padding: 28px;
    background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.3) 60%, transparent 100%);
    display: flex; flex-direction: column; gap: 8px;
}
.dm-arc-feat-ttl { font-size: 18px; font-weight: 800; color: #fff; margin: 0; line-height: 1.5; }
.dm-arc-feat-meta { font-size: 12px; color: rgba(255,255,255,0.8); display: flex; gap: 6px; }
.dm-arc-badge { display: inline-block; font-size: 11px; font-weight: 700; color: #fff; padding: 3px 10px; border-radius: 6px; align-self: flex-start; }

/* Side posts column */
.dm-arc-side-col { display: flex; flex-direction: column; gap: 12px; }
.dm-arc-side-card { display: flex; gap: 10px; text-decoration: none; background: #fff; border-radius: 12px; overflow: hidden; border: 1px solid #f0f0f0; transition: box-shadow 0.2s; }
.dm-arc-side-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.08); }
.dm-arc-side-img {
    width: 100px; flex-shrink: 0; height: 90px;
    background-size: cover; background-position: center; background-color: #f0f0f0;
    position: relative;
}
.dm-arc-side-img .dm-arc-badge { position: absolute; top: 6px; right: 6px; font-size: 10px; padding: 2px 7px; }
.dm-arc-side-info { padding: 10px; flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.dm-arc-side-info h4 { font-size: 12.5px; font-weight: 700; color: #222; margin: 0; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dm-arc-side-info span { font-size: 11px; color: #aaa; }

/* Text list */
.dm-arc-list-posts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
.dm-arc-list-item { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid #f0f0f0; }
.dm-arc-list-item:last-child { border-bottom: none; }
.dm-arc-list-img { flex-shrink: 0; width: 60px; height: 60px; border-radius: 8px; overflow: hidden; display: block; }
.dm-arc-list-img img { width: 100%; height: 100%; object-fit: cover; }
.dm-arc-list-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.dm-arc-list-cat { font-size: 11px; font-weight: 700; }
.dm-arc-list-ttl { font-size: 13px; font-weight: 700; color: #222; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.dm-arc-list-ttl:hover { color: var(--dm-primary,#ff6600); }
.dm-arc-list-date { font-size: 11px; color: #aaa; }


/* ════ Three-Column Section ════ */
.dm-arc-three-section {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 40px;
}
@media (max-width: 900px) { .dm-arc-three-section { grid-template-columns: 1fr; } }

.dm-arc-col-box { background: #fff; border-radius: 16px; padding: 20px; border: 1px solid #f0f0f0; }
.dm-arc-col-hd { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; padding-bottom: 12px; border-bottom: 2px solid #f5f5f5; }
.dm-arc-col-hd h3 { font-size: 14px; font-weight: 800; color: #222; margin: 0; }
.dm-arc-col-hd a  { font-size: 12px; color: var(--dm-primary,#ff6600); text-decoration: none; font-weight: 600; }

.dm-arc-col-item { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid #f5f5f5; }
.dm-arc-col-item:last-child { border-bottom: none; padding-bottom: 0; }
.dm-arc-col-img { flex-shrink: 0; width: 68px; height: 68px; border-radius: 10px; overflow: hidden; display: block; }
.dm-arc-col-img img { width: 100%; height: 100%; object-fit: cover; }
.dm-arc-col-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.dm-arc-col-cat { font-size: 11px; font-weight: 700; }
.dm-arc-col-ttl { font-size: 12.5px; font-weight: 700; color: #222; text-decoration: none; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dm-arc-col-ttl:hover { color: var(--dm-primary,#ff6600); }
.dm-arc-col-date { font-size: 11px; color: #aaa; }


/* ════ Category Section ════ */
.dm-arc-cat-section { margin-bottom: 40px; }
.dm-arc-cat-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
}
@media (max-width: 1100px) { .dm-arc-cat-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 800px)  { .dm-arc-cat-grid { grid-template-columns: repeat(2, 1fr); } }

.dm-arc-cat-card { display: block; text-decoration: none; background: #fff; border-radius: 14px; overflow: hidden; border: 1px solid #f0f0f0; transition: box-shadow 0.2s, transform 0.2s; }
.dm-arc-cat-card:hover { box-shadow: 0 6px 20px rgba(0,0,0,0.08); transform: translateY(-2px); }
.dm-arc-cat-card-img { width: 100%; aspect-ratio: 16/10; overflow: hidden; background: #f5f5f5; }
.dm-arc-cat-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s; }
.dm-arc-cat-card:hover .dm-arc-cat-card-img img { transform: scale(1.05); }
.dm-arc-cat-card-ph { width: 100%; height: 100%; background: linear-gradient(135deg, #f0f0f0, #e0e0e0); }
.dm-arc-cat-card-body { padding: 12px; }
.dm-arc-cat-card-body h4 { font-size: 13px; font-weight: 700; color: #222; margin: 0 0 6px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dm-arc-cat-card-meta { font-size: 11px; color: #aaa; display: flex; gap: 4px; }


/* ════ Pagination ════ */
.dm-arc-pagination { text-align: center; padding: 24px 0; }
.dm-arc-pagination .page-numbers { display: inline-flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.dm-arc-pagination a.page-numbers,
.dm-arc-pagination span.page-numbers {
    display: flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 10px;
    font-size: 14px; font-weight: 700;
    border: 1.5px solid #eee; background: #fff; color: #555;
    text-decoration: none; transition: all 0.2s;
}
.dm-arc-pagination a.page-numbers:hover { border-color: var(--dm-primary,#ff6600); color: var(--dm-primary,#ff6600); }
.dm-arc-pagination span.current { background: var(--dm-primary,#ff6600); color: #fff; border-color: var(--dm-primary,#ff6600); }