:root{--navy:#102c50;--blue:#1769aa;--gold:#d6a23b;--text:#233247;--muted:#6b7788;--surface:#fff;--page:#f4f7fb}
*{box-sizing:border-box}
body{margin:0;color:var(--text);background:var(--page);font-family:Montserrat,Arial,sans-serif;line-height:1.7}
.berita-container,.artikel-container{width:min(1180px,calc(100% - 36px));margin:0 auto;padding:56px 0 80px}
.berita-heading{margin-bottom:34px;text-align:center}
.berita-eyebrow,.artikel-kategori{color:var(--blue);font-size:.78rem;font-weight:800;letter-spacing:.12em}
.berita-heading h1{margin:8px 0;color:var(--navy);font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.2}
.berita-heading p,.berita-content p{color:var(--muted)}
.berita-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.berita-card{overflow:hidden;background:var(--surface);border:1px solid #e4eaf2;border-radius:16px;box-shadow:0 8px 28px rgb(16 44 80 / 6%);transition:transform .2s,box-shadow .2s}
.berita-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgb(16 44 80 / 12%)}
.berita-image{display:block;aspect-ratio:16/10;overflow:hidden;background:#dce7f2}
.berita-image img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.berita-card:hover .berita-image img{transform:scale(1.04)}
.berita-no-image{display:grid;height:100%;place-items:center;color:var(--navy);font-weight:800}
.berita-content{padding:22px}
.berita-meta{display:flex;flex-wrap:wrap;gap:8px 14px;color:var(--muted);font-size:.78rem}
.berita-meta span:first-child{color:var(--blue);font-weight:700}
.berita-content h2{margin:12px 0;font-size:1.12rem;line-height:1.45}
.berita-content h2 a{color:var(--navy);text-decoration:none}
.berita-content p{display:-webkit-box;overflow:hidden;font-size:.92rem;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.berita-link,.kembali-berita{display:inline-block;color:var(--blue);font-weight:800;text-decoration:none}
.berita-link span{color:var(--gold)}
.berita-notice{padding:24px;background:#fff;border-radius:12px;text-align:center}
.artikel{max-width:850px;margin:24px auto 36px;padding:clamp(22px,5vw,54px);background:#fff;border-radius:18px;box-shadow:0 8px 28px rgb(16 44 80 / 6%)}
.artikel-breadcrumb{color:var(--muted);font-size:.85rem;overflow-wrap:anywhere}
.artikel-breadcrumb a{color:var(--blue);text-decoration:none}
.artikel-header h1{margin:12px 0;color:var(--navy);font-size:clamp(1.8rem,4vw,2.7rem);line-height:1.25}
.artikel-tanggal{color:var(--muted);font-size:.9rem}
.artikel-cover{display:block;width:100%;max-height:520px;margin:24px 0;border-radius:12px;object-fit:cover}
.artikel-ringkasan{padding-left:18px;border-left:3px solid var(--gold);color:var(--muted);font-size:1.05rem}
.artikel-body{overflow-wrap:anywhere;line-height:1.9}
.artikel-body img{max-width:100%;height:auto}
.artikel-body a{color:var(--blue)}
@media(max-width:900px){.berita-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.berita-container,.artikel-container{width:min(100% - 24px,1180px);padding-top:32px}.berita-grid{grid-template-columns:1fr;gap:18px}.berita-content{padding:18px}.artikel{padding:22px 18px}}