/* ===== Post card (used on front-page Berita + archive grids) ===== */
.post-card { display: flex; flex-direction: column; border: 1px solid var(--rule); background: var(--paper); }
.post-card__figure { aspect-ratio: 3 / 2; overflow: hidden; background: var(--paper-2); }
.post-card__figure img { width: 100%; height: 100%; object-fit: cover; transition: transform 500ms var(--ease-out-expo); }
.post-card:hover .post-card__figure img { transform: scale(1.03); }
.post-card__body { padding: 1.5rem; display: flex; flex-direction: column; flex: 1; }
.post-card__meta { display: flex; align-items: center; gap: 0.5rem; font-family: var(--font-mono); font-size: 0.6875rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--galas); }
.post-card__title { font-family: var(--font-display); margin-top: 0.75rem; font-size: 1.25rem; font-weight: 600; line-height: 1.25; letter-spacing: -0.01em; color: var(--ink); }
.post-card__title a:hover { color: var(--galas); }
.post-card__excerpt { margin-top: 0.75rem; font-size: 0.875rem; line-height: 1.6; color: var(--muted-foreground); flex: 1; }
.post-card__more { margin-top: 1rem; display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.8125rem; font-weight: 600; color: var(--galas); }

/* ===== Single article ===== */
.article-header { position: relative; overflow: hidden; background: var(--ink); color: var(--paper); padding: 8rem 0 4rem; }
.article-header .container { position: relative; max-width: 48rem; }
.article-header__meta { display: flex; flex-wrap: wrap; gap: 0.75rem; font-family: var(--font-mono); font-size: 0.6875rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--galas-bright); }
.article-header__meta a:hover { color: var(--paper); }
.article-header h1 { font-family: var(--font-display); margin-top: 1rem; font-size: clamp(2rem, 5vw, 3rem); font-weight: 600; line-height: 1.1; letter-spacing: -0.02em; }
.article-header__excerpt { margin-top: 1rem; font-size: 1.125rem; line-height: 1.6; color: var(--navy-100); }

.article-featured { max-width: 56rem; margin: -3rem auto 0; padding-inline: var(--pad-x); position: relative; }
.article-featured img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }

.article-body { max-width: 44rem; margin-inline: auto; padding: 4rem var(--pad-x) 0; font-size: 1.0625rem; }
.article-body p, .article-body ul, .article-body ol, .article-body blockquote { margin-bottom: 1.5rem; line-height: 1.75; color: var(--navy-700); }
.article-body ul, .article-body ol { padding-left: 1.5rem; list-style: revert; }
.article-body h2 { font-family: var(--font-display); margin-top: 2.5rem; margin-bottom: 1rem; font-size: 1.75rem; font-weight: 600; color: var(--ink); }
.article-body h3 { font-family: var(--font-display); margin-top: 2rem; margin-bottom: 0.75rem; font-size: 1.375rem; font-weight: 600; color: var(--ink); }
.article-body img { margin-block: 1.5rem; }
.article-body blockquote { border-left: 2px solid var(--galas); padding-left: 1.25rem; font-style: italic; color: var(--ink); }
.article-body a { color: var(--galas); text-decoration: underline; text-underline-offset: 3px; }

.article-footer { max-width: 44rem; margin-inline: auto; padding: 2rem var(--pad-x) 4rem; border-top: 1px solid var(--rule); margin-top: 2rem; }
.article-back { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; font-weight: 600; color: var(--galas); }
.article-back:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ===== Archive / listing (home.php, archive.php, category.php, search.php) ===== */
.archive-header { background: var(--ink); color: var(--paper); padding: 8rem 0 3rem; }
.archive-header .eyebrow { color: var(--galas-bright); }
.archive-header h1 { font-family: var(--font-display); margin-top: 0.75rem; font-size: clamp(2rem, 5vw, 3rem); font-weight: 600; letter-spacing: -0.02em; }
.archive-list { padding: 4rem 0; }
.archive-grid { display: grid; gap: 2rem; }
@media (min-width: 48rem) { .archive-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64rem) { .archive-grid { grid-template-columns: repeat(3, 1fr); } }

.pagination { margin-top: 3rem; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem; }
.pagination a, .pagination span { display: inline-flex; align-items: center; justify-content: center; min-width: 2.5rem; height: 2.5rem; padding-inline: 0.75rem; border: 1px solid var(--rule); font-size: 0.875rem; }
.pagination .current { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.pagination a:hover { border-color: var(--galas); color: var(--galas); }

.not-found { padding: 10rem 0 6rem; text-align: center; }
.not-found__code { font-family: var(--font-display); font-size: clamp(4rem, 12vw, 8rem); font-weight: 600; color: var(--galas); line-height: 1; }
.not-found p { margin-top: 1rem; color: var(--muted-foreground); }