/* NOVA News / Article UX refresh — V5 */

/* Keep news pages visually consistent with the main V4 website. */
.halaman-berita .kepala-dalam,
.halaman-artikel .kepala-dalam{max-width:1200px;}

/* News landing: more editorial, less internal-document feel. */
.hero-berita-page{
  padding:calc(var(--tinggi-kepala) + 72px) 0 70px;
  background:
    radial-gradient(circle at 88% 18%,rgba(34,197,94,.10),transparent 27%),
    linear-gradient(180deg,#f9fcfa 0%,#fff 92%);
}
.hero-berita-page::before{opacity:.16;background-size:52px 52px;}
.hero-berita-dalam{grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:64px;}
.hero-berita-dalam h1{max-width:860px;font-size:clamp(48px,4.8vw,68px);line-height:1.04;letter-spacing:-.048em;}
.hero-berita-dalam>div:first-child>p{max-width:760px;margin-top:20px;font-size:15px;line-height:1.75;}
.kartu-editorial{padding:26px;border-radius:20px;background:#fff;border-color:#dfe8e2;}
.kartu-editorial>span{width:46px;height:46px;border-radius:14px;}
.kartu-editorial b{margin-top:17px;font-size:18px;}
.kartu-editorial p{font-size:12px;line-height:1.7;}
.arsip-berita{padding-top:76px;background:linear-gradient(180deg,#fff,#f7faf8);}
.kontrol-berita-page{margin-bottom:18px;padding:12px;border:1px solid #e3ebe6;border-radius:18px;background:#fff;}
.cari-berita-page{min-width:360px;height:50px;box-shadow:none;background:#f8faf9;}
.filter-berita-page button{min-height:42px;font-size:10.5px;}
.kisi-berita-page{gap:20px;}
.kartu-berita-page{border:1px solid #e2e9e4;background:#fff;}
.kartu-berita-page .visual-berita{aspect-ratio:16/9;}
.kartu-berita-page h3{font-size:20px;line-height:1.28;letter-spacing:-.025em;}
.kartu-berita-page p{font-size:12.5px;line-height:1.7;}

/* ARTICLE — intentionally wider on desktop. */
.artikel-main{
  position:relative;
  padding:calc(var(--tinggi-kepala) + 58px) 0 110px;
  background:linear-gradient(180deg,#f8fbf9 0,#fff 32%);
}
.artikel-berita{
  width:min(calc(100% - 56px),1180px);
  max-width:none;
  margin-inline:auto;
}

/* Intro copy gets editorial width; hero media uses the full article canvas. */
.artikel-berita>.kembali-berita,
.artikel-berita>.label-kecil,
.artikel-berita>h1,
.artikel-berita>.meta-artikel{
  width:min(100%,1000px);
  margin-left:auto;
  margin-right:auto;
}
.kembali-berita{margin-bottom:28px;font-size:12.5px;}
.artikel-berita>.label-kecil{display:flex;margin-bottom:14px;}
.artikel-berita h1{
  font-size:clamp(48px,5.15vw,74px);
  line-height:1.035;
  letter-spacing:-.052em;
  max-width:none;
}
.meta-artikel{
  align-items:center;
  gap:9px 18px;
  margin-top:24px!important;
  margin-bottom:36px!important;
  font-size:11.5px;
}
.meta-artikel span,.meta-artikel time{display:inline-flex;align-items:center;gap:7px;}
.meta-artikel span+span::before,
.meta-artikel time+span::before{content:"•";color:#b3beb7;margin-right:9px;}
.meta-artikel .waktu-baca::before{content:"•";color:#b3beb7;margin-right:9px;}

.hero-artikel{
  width:100%;
  aspect-ratio:1.92/1;
  border:1px solid #e1e9e3;
  border-radius:26px;
  background:#eef4f0;
  box-shadow:0 20px 55px rgba(15,67,40,.08);
}
.hero-artikel img{object-fit:cover;}

/* Reading column remains comfortable even though the page itself is larger. */
.lead-artikel,
.artikel-konten{
  width:min(100%,840px);
  margin-left:auto!important;
  margin-right:auto!important;
}
.lead-artikel{
  margin-top:44px!important;
  color:#35463d!important;
  font-size:21px!important;
  line-height:1.72!important;
  font-weight:500;
  letter-spacing:-.012em;
}
.artikel-konten{margin-top:26px;gap:20px;}
.artikel-konten p{font-size:17px;line-height:1.9;color:#526158;}
.artikel-konten ul{margin:4px 0 18px 22px;gap:11px;font-size:16px;color:#526158;}
.artikel-konten li{padding-left:4px;line-height:1.78;}
.artikel-konten h2,
.artikel-berita .artikel-konten h2{
  margin:48px 0 4px;
  font-size:clamp(28px,2.6vw,36px);
  line-height:1.2;
  letter-spacing:-.035em;
}
.artikel-konten blockquote,
.artikel-berita blockquote{
  margin:38px 0;
  padding:26px 30px;
  border-left:4px solid #27a65a;
  border-radius:0 16px 16px 0;
  background:#f1f8f3;
  color:#164d2e;
  font-size:19px;
  line-height:1.72;
}

/* Related stories and conversion CTA expand back to the wide canvas. */
.artikel-terkait{
  width:100%;
  margin-top:76px;
  padding-top:54px;
}
.artikel-terkait>h2{font-size:34px;}
.artikel-terkait .kisi-berita{gap:18px;}
.artikel-terkait .kartu-berita{border:1px solid #e3eae5;background:#fff;}
.ajakan-artikel{
  width:100%;
  margin-top:58px;
  padding:34px 38px;
  border-radius:20px;
  background:linear-gradient(135deg,#f4f9f5,#eef6f0);
}
.ajakan-artikel b{font-size:20px;}
.ajakan-artikel p{font-size:12.5px;}

/* Thin reading-progress indicator: useful without adding visual noise. */
.progress-baca-v5{position:fixed;z-index:1001;left:0;right:0;top:var(--tinggi-kepala);height:3px;pointer-events:none;background:transparent;}
.progress-baca-v5 span{display:block;width:0;height:100%;background:#16934e;transition:width .08s linear;}

@media(max-width:1024px){
  .hero-berita-dalam{grid-template-columns:1fr;gap:30px;}
  .kartu-editorial{max-width:720px;}
  .artikel-berita{width:min(calc(100% - 40px),900px);}
  .artikel-berita h1{font-size:clamp(42px,6.6vw,60px);}
  .hero-artikel{aspect-ratio:16/9;}
  .lead-artikel,.artikel-konten{width:min(100%,760px);}
  .artikel-terkait .kisi-berita{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media(max-width:620px){
  .hero-berita-page{padding:calc(var(--tinggi-kepala) + 42px) 0 52px;}
  .hero-berita-dalam h1{font-size:36px;line-height:1.08;}
  .hero-berita-dalam>div:first-child>p{font-size:13.5px;}
  .kartu-editorial{display:none;}
  .arsip-berita{padding-top:58px;}
  .kontrol-berita-page{padding:10px;border-radius:15px;}
  .cari-berita-page{min-width:0;width:100%;}

  .artikel-main{padding:calc(var(--tinggi-kepala) + 34px) 0 74px;}
  .artikel-berita{width:calc(100% - 28px);}
  .artikel-berita>.kembali-berita,
  .artikel-berita>.label-kecil,
  .artikel-berita>h1,
  .artikel-berita>.meta-artikel{width:100%;}
  .kembali-berita{margin-bottom:22px;font-size:11px;}
  .artikel-berita h1{font-size:clamp(34px,10.5vw,44px);line-height:1.08;}
  .meta-artikel{gap:7px 10px;margin-top:18px!important;margin-bottom:26px!important;font-size:9.5px;}
  .meta-artikel span+span::before,.meta-artikel time+span::before,.meta-artikel .waktu-baca::before{margin-right:3px;}
  .hero-artikel{border-radius:18px;aspect-ratio:16/10;box-shadow:none;}
  .lead-artikel{margin-top:28px!important;font-size:17px!important;line-height:1.7!important;}
  .artikel-konten{margin-top:20px;gap:16px;}
  .artikel-konten p{font-size:15px;line-height:1.8;}
  .artikel-konten ul{font-size:14.5px;line-height:1.7;}
  .artikel-konten h2,.artikel-berita .artikel-konten h2{margin-top:34px;font-size:27px;}
  .artikel-konten blockquote,.artikel-berita blockquote{margin:28px 0;padding:20px 20px;font-size:16px;}
  .artikel-terkait{margin-top:52px;padding-top:38px;}
  .artikel-terkait .kisi-berita{grid-template-columns:1fr;}
  .ajakan-artikel{padding:25px 22px;}
  .progress-baca-v5{top:var(--tinggi-kepala);}
}