:root{
  --hijau-nusantara:#17594a;--on-hijau-nusantara:#ffffff;
  --hijau-daun:#8eac50;--on-hijau-daun:#1f2622;
  --krem-dinding:#f5efe3;--putih:#ffffff;
  --arang:#1f2622;--arang-redup:#5c6660;--garis:#ddd5c5;
  --tanah-liat:#bc6c25;--on-tanah-liat:#0f1311;--tanah-liat-teks:#9a5418;
  --fokus:var(--hijau-nusantara);
  --jarak-1:4px;--jarak-2:8px;--jarak-3:16px;--jarak-4:24px;--jarak-5:40px;--jarak-6:64px;
  --sudut-kecil:2px;--sudut-sedang:6px;--sudut-bulat:999px;
  --judul:"Plus Jakarta Sans",system-ui,sans-serif;
  --teks:"Source Sans 3",system-ui,sans-serif;
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){
  :root{
    --hijau-nusantara:#7fc1ac;--on-hijau-nusantara:#141a17;
    --hijau-daun:#b5cf7a;--on-hijau-daun:#141a17;
    --krem-dinding:#141a17;--putih:#1e2622;
    --arang:#f5efe3;--arang-redup:#a9b3ad;--garis:#33403a;
    --tanah-liat:#e39a5b;--on-tanah-liat:#141a17;--tanah-liat-teks:#e39a5b;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--krem-dinding);color:var(--arang);font-family:var(--teks);font-size:17px;line-height:26px}
img{max-width:100%;display:block}
a{color:var(--hijau-nusantara)}
a:focus-visible,button:focus-visible{outline:2px solid var(--fokus);outline-offset:2px}
.wrap{max-width:960px;margin:0 auto;padding:0 var(--jarak-3)}
@media (min-width:720px){.wrap{padding:0 var(--jarak-5)}}

/* Header: logo lengkap hanya di latar terang, jadi header tetap putih di kedua tema */
.top{background:#ffffff;border-bottom:1px solid #ddd5c5}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--jarak-3);min-height:64px;flex-wrap:wrap;padding-top:var(--jarak-2);padding-bottom:var(--jarak-2)}
.top .beranda{display:flex;align-items:center;gap:10px;text-decoration:none}
.top img{height:40px;width:40px}
.merek{font-family:var(--judul);font-weight:800;font-size:18px;line-height:24px;color:#17594a}
.top nav{display:flex;gap:var(--jarak-3);flex-wrap:wrap}
.top nav a{color:#1f2622;text-decoration:none;font-weight:600;font-size:15px}
.top nav a:hover,.top nav a[aria-current]{color:#17594a;text-decoration:underline}

h1,h2,h3{font-family:var(--judul);margin:0}
.display{font-size:40px;line-height:44px;font-weight:800;letter-spacing:-.02em}
@media (min-width:720px){.display{font-size:56px;line-height:60px}}
.judul-1{font-size:28px;line-height:36px;font-weight:700;letter-spacing:-.01em}
@media (min-width:720px){.judul-1{font-size:36px;line-height:44px}}
.judul-2{font-size:20px;line-height:28px;font-weight:700}
.label{font-family:var(--teks);font-size:13px;line-height:18px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.keterangan{font-size:12px;line-height:16px;color:var(--arang-redup)}
.isi-kecil{font-size:15px;line-height:22px}
.redup{color:var(--arang-redup)}
p{margin:var(--jarak-2) 0 0}

section{padding:var(--jarak-5) 0}
@media (min-width:720px){section{padding:var(--jarak-6) 0}}
section+section{border-top:1px solid var(--garis)}
.intro{max-width:620px;margin-top:var(--jarak-2)}

.hero{background:var(--hijau-nusantara);color:var(--on-hijau-nusantara);border-top:0}
.hero p{max-width:620px;font-size:19px;line-height:28px}
.hero .label{opacity:.9}

.btn{display:inline-block;font-family:var(--teks);font-weight:600;font-size:16px;text-decoration:none;padding:12px var(--jarak-3);border-radius:var(--sudut-sedang);min-height:44px}
.btn-aksen{background:var(--tanah-liat);color:var(--on-tanah-liat)}
.btn-utama{background:var(--hijau-nusantara);color:var(--on-hijau-nusantara)}
.btn-garis{border:2px solid currentColor;color:inherit}
.btn-row{display:flex;gap:var(--jarak-2);flex-wrap:wrap;margin-top:var(--jarak-4)}

.grid{display:grid;gap:var(--jarak-3);margin-top:var(--jarak-4);grid-template-columns:1fr}
@media (min-width:640px){.grid-2{grid-template-columns:1fr 1fr}.grid-3{grid-template-columns:repeat(3,1fr)}}
.kartu{background:var(--putih);border:1px solid var(--garis);border-radius:var(--sudut-sedang);padding:var(--jarak-3)}
.kartu h3{margin-bottom:var(--jarak-1)}

.status{display:inline-block;font-size:12px;line-height:16px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:var(--sudut-kecil);white-space:nowrap}
.s-terbukti{background:var(--hijau-nusantara);color:var(--on-hijau-nusantara)}
.s-potensi{background:var(--tanah-liat);color:var(--on-tanah-liat)}
.s-belum{border:1px dashed var(--arang-redup);color:var(--arang-redup)}

.angka{font-family:var(--judul);font-weight:800;font-size:36px;line-height:40px;color:var(--hijau-nusantara);margin-top:var(--jarak-2)}
.angka small{font-size:17px;font-weight:700}
.sumber{margin-top:var(--jarak-2)}

.langkah{counter-reset:l;list-style:none;padding:0;margin:var(--jarak-4) 0 0;display:grid;gap:var(--jarak-3)}
@media (min-width:640px){.langkah{grid-template-columns:repeat(3,1fr)}}
.langkah li{counter-increment:l;background:var(--putih);border:1px solid var(--garis);border-radius:var(--sudut-sedang);padding:var(--jarak-3)}
.langkah li::before{content:counter(l);display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--sudut-bulat);background:var(--hijau-daun);color:var(--on-hijau-daun);font-family:var(--judul);font-weight:800;margin-bottom:var(--jarak-2)}

.izin{list-style:none;padding:0;margin:var(--jarak-4) 0 0;display:grid;gap:var(--jarak-2)}
.izin li{background:var(--putih);border:1px solid var(--garis);border-radius:var(--sudut-sedang);padding:var(--jarak-3);display:flex;justify-content:space-between;gap:var(--jarak-3);flex-wrap:wrap}
.izin b{font-weight:600}

.kontak{background:var(--putih);border:1px solid var(--garis);border-radius:var(--sudut-sedang);padding:var(--jarak-4);margin-top:var(--jarak-4)}
.kontak dl{margin:0;display:grid;gap:var(--jarak-2)}
.kontak dt{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--arang-redup)}
.kontak dd{margin:0 0 var(--jarak-2)}

footer{background:var(--arang);color:var(--krem-dinding);padding:var(--jarak-5) 0;font-size:15px;line-height:22px}
footer a{color:inherit}

/* Dashboard */
.legenda{display:flex;flex-wrap:wrap;gap:var(--jarak-2) var(--jarak-3);margin-top:var(--jarak-3);font-size:15px;line-height:22px}
.legenda div{display:flex;align-items:center;gap:var(--jarak-2)}
.bars{margin-top:var(--jarak-3);display:grid;gap:var(--jarak-3)}
.bar-row .nm{display:flex;justify-content:space-between;gap:var(--jarak-2);font-size:15px;line-height:22px}
.bar-row .nm b{font-family:var(--judul);font-weight:700}
.track{position:relative;height:22px;background:var(--krem-dinding);border-radius:var(--sudut-kecil);margin-top:var(--jarak-1)}
.fill{height:100%;border-radius:var(--sudut-kecil)}
.f-awal{background:var(--arang-redup)}
.f-akhir{background:var(--hijau-nusantara)}
.target{position:absolute;top:-4px;bottom:-4px;width:0;border-left:2px dashed var(--tanah-liat-teks)}
.chart-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--jarak-2);flex-wrap:wrap}

table.kpi{width:100%;border-collapse:collapse;margin-top:var(--jarak-4);background:var(--putih);border:1px solid var(--garis);border-radius:var(--sudut-sedang);font-size:15px;line-height:22px}
table.kpi th,table.kpi td{text-align:left;vertical-align:top;padding:10px 12px;border-bottom:1px solid var(--garis)}
table.kpi th{font-size:12px;line-height:16px;letter-spacing:.06em;text-transform:uppercase;color:var(--arang-redup);font-weight:600}
table.kpi td.n{font-variant-numeric:tabular-nums;white-space:nowrap}
table.kpi .src{font-size:12px;line-height:16px;color:var(--arang-redup);word-break:break-word}
@media (max-width:860px){
  table.kpi,table.kpi tbody,table.kpi tr,table.kpi td{display:block;width:100%}
  table.kpi{background:none;border:0}
  table.kpi thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  table.kpi tr{background:var(--putih);border:1px solid var(--garis);border-radius:var(--sudut-sedang);padding:var(--jarak-3);margin-bottom:var(--jarak-3)}
  table.kpi td{border:0;padding:4px 0;display:flex;justify-content:space-between;gap:var(--jarak-3)}
  table.kpi td::before{content:attr(data-l);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--arang-redup);font-weight:600;flex:0 0 auto}
  table.kpi td.kpi-nama{display:block;font-family:var(--judul);font-weight:700;font-size:18px;line-height:26px;padding-bottom:var(--jarak-2)}
  table.kpi td.kpi-nama::before{content:none}
  table.kpi td.n{white-space:normal;text-align:right}
  table.kpi td.src{display:block;padding-top:var(--jarak-2)}
  table.kpi td.src::before{display:block;margin-bottom:2px}
}
.lengkapi{background:var(--putih);border:2px solid var(--tanah-liat);border-radius:var(--sudut-sedang);padding:var(--jarak-4);margin-top:var(--jarak-4)}
.lengkapi ul{list-style:none;padding:0;margin:var(--jarak-3) 0 0;display:grid;gap:var(--jarak-3)}
.lengkapi li{border-top:1px solid var(--garis);padding-top:var(--jarak-3)}
.lengkapi li h3{display:flex;justify-content:space-between;gap:var(--jarak-2);flex-wrap:wrap;align-items:center}