/* Shared photo treatment and dedicated editorial archives. */
[hidden] { display: none !important; }
.story-photo { position: relative; margin: 0; overflow: hidden; background: var(--surface-charcoal); border-radius: 12px; }
.story-photo img { width: 100%; aspect-ratio: 3 / 2; height: auto; object-fit: cover; display: block; transition: transform .3s ease; }
a:hover .story-photo img { transform: scale(1.025); }
.story-photo figcaption { position: absolute; bottom: 8px; left: 10px; color: #fff; background: #090d16cf; padding: 3px 7px; font-size: 10px; border-radius: 4px; }
.news-card > .story-photo { margin-bottom: 20px; }
.hero-slide { height: auto; }
.archive-section { padding-top: 40px; padding-bottom: 40px; }
.archive-eyebrow { font-size: 11px; font-weight: 650; letter-spacing: .12em; color: var(--color-signal-blue); text-transform: uppercase; }
.demo-note { font-size: 12px; color: var(--color-steel); margin-bottom: 20px; line-height: 1.6; }
.category-hero-banner { overflow: hidden; padding: 54px 0; }
.category-hero-banner .container { position: relative; z-index: 1; }
.category-page-title { max-width: 780px; font-size: clamp(36px, 5vw, 68px); }
.category-page-lead { max-width: 650px; }
.category-watermark { position: absolute; right: 4%; bottom: -60px; font-size: 270px; font-family: var(--font-title); font-weight: 900; opacity: .045; pointer-events: none; }
.category-banner-suara-warga { border-bottom: 3px solid var(--color-mint); }
.category-banner-sejarah { border-bottom: 3px solid var(--color-ember); }
.category-banner-politik { border-bottom: 3px solid var(--color-coral); }
.category-banner-wisatawan { border-bottom: 3px solid var(--color-mint); }
.category-featured-card { gap: 0; }
.category-featured-card > a { height: 100%; }
.category-featured-card .story-photo { height: 100%; border-radius: 0; }
.category-featured-card .story-photo img { height: 100%; min-height: 380px; }
.category-featured-content p { color: var(--color-fog); line-height: 1.7; }
.archive-heading { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 24px; }
.archive-heading h2 { font-size: 30px; margin-top: 8px; }
.archive-heading > span, .archive-count { color: var(--color-steel); font-size: 12px; }
.archive-tools { display: flex; gap: 16px; }
.archive-tools label { display: grid; gap: 8px; font-size: 12px; color: var(--color-fog); }
.archive-tools label:first-child { flex: 1; }
.archive-tools input, .archive-tools select { background: var(--surface-graphite); color: var(--color-snow); border: var(--border-hairline); border-radius: 8px; padding: 12px; min-width: 0; font: inherit; }
.archive-count { margin: 20px 0; }
.archive-card { padding: 0; overflow: hidden; min-width: 0; }
.archive-card .story-photo { border-radius: 0; }
.archive-copy { padding: 22px; }
.archive-copy h3 { font-size: 21px; line-height: 1.3; margin: 12px 0; }
.archive-copy h3 a { color: var(--color-snow); }
.archive-copy h3 a:hover { color: var(--color-signal-blue); }
.archive-copy p { color: var(--color-fog); font-size: 13px; line-height: 1.7; margin-bottom: 18px; }
.archive-copy small, .category-featured-content small { color: var(--color-steel); font-size: 11px; }
.popular-stories { list-style: none; padding: 0; }
.popular-stories li + li { border-top: var(--border-hairline); padding-top: 18px; margin-top: 18px; }
.popular-stories a { display: grid; grid-template-columns: 80px 1fr; gap: 12px; color: var(--color-snow); font-size: 13px; line-height: 1.5; }
.popular-stories .story-photo img { height: 80px; }
.popular-stories figcaption { display: none; }
.popular-stories small { display: block; margin-top: 8px; color: var(--color-steel); font-size: 11px; }
.citizen-invite { background: linear-gradient(140deg, var(--surface-graphite), var(--surface-charcoal)); }
.citizen-invite h2 { font-size: 30px; line-height: 1.1; margin: 18px 0; }
.citizen-invite p { color: var(--color-fog); font-size: 14px; margin-bottom: 24px; }
.citizen-invite small { display: block; color: var(--color-steel); margin-top: 14px; font-size: 11px; }
.archive-empty { padding: 40px 24px; border: var(--border-hairline); border-radius: 12px; }
.archive-empty p { margin: 12px 0 24px; }
.story-detail { max-width: 900px; padding-top: 48px; padding-bottom: 70px; }
.story-detail > .story-photo { margin: 28px 0; }
.story-detail > .btn-text-link { display: block; margin-top: 24px; }
.skip-link { position: fixed; top: -100px; left: 16px; z-index: 1000; background: var(--surface-graphite); padding: 12px; }
.skip-link:focus { top: 8px; }
:focus-visible { outline: 2px solid var(--color-signal-blue); outline-offset: 4px; }
.nav-wrapper > nav { min-width: 0; }
@media (max-width: 1200px) {
 .site-header { height: auto; }
 .nav-wrapper { flex-wrap: wrap; padding: 14px 0; }
 .nav-wrapper > nav { order: 3; width: 100%; }
 .nav-links { padding: 8px 0; }
}
@media (max-width: 960px) {
 .category-featured-card .story-photo img { min-height: 0; max-height: 380px; }
 .category-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .category-content-layout { gap: 28px; }
}
@media (max-width: 600px) {
 .category-news-grid { grid-template-columns: 1fr; }
 .archive-heading { align-items: start; flex-direction: column; gap: 10px; }
 .archive-tools { flex-direction: column; }
 .category-featured-content { padding: 24px; }
 .nav-actions .btn-bone { font-size: 10px; padding: 8px; }
 .brand-logo-img { max-width: 140px; height: auto; }
 .category-page-title { font-size: 40px; }
}
@media (prefers-reduced-motion: reduce) { .story-photo img { transition: none; } }
/* Let the tallest slide establish the hero height so headlines never clip. */
.hero-slider-wrapper { display: grid; }
.hero-slide { position: relative; inset: auto; grid-area: 1 / 1; height: auto; min-width: 0; }
.category-content-layout { gap: 32px; }