/* ============================================================
   LP2kM STT ARASTAMAR WAMENA
   Palet indigo mengikuti SIAKAD, dilengkapi pita ukiran Papua
   sebagai penanda struktur antarbagian.
   ============================================================ */

:root{
  --indigo:#1a237e;
  --indigo-2:#283593;
  --indigo-3:#5c6bc0;
  --indigo-4:#e8eaf6;
  --indigo-5:#c5cae9;
  --indigo-gelap:#11175a;
  --emas:#C9A227;
  --emas-muda:#f0d074;
  --emas-pucat:#fdf6e3;
  --tanah:#8d6e3f;
  --bg:#f4f6f9;
  --krem:#faf7ef;
  --putih:#fff;
  --ink:#212529;
  --abu:#6c757d;
  --abu-muda:#adb5bd;
  --garis:#dee2e6;
  --hijau:#28a745;
  --merah:#dc3545;
  --kuning:#ffc107;
  --biru:#17a2b8;
  --radius:6px;
  --lebar:1180px;
  --font:'Source Sans 3','Segoe UI',system-ui,-apple-system,sans-serif;
  --judul:'Zilla Slab','Source Sans 3',Georgia,serif;
  --bayang:0 1px 3px rgba(26,35,126,.09);
  --bayang-2:0 6px 22px rgba(26,35,126,.13);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--ink);font-size:15.5px;line-height:1.65}
img{max-width:100%;display:block}
a{color:var(--indigo-2);text-decoration:none;transition:color .15s ease}
a:hover{color:var(--indigo)}
:focus-visible{outline:3px solid var(--emas);outline-offset:2px}

h1,h2,h3,h4,h5{font-family:var(--judul);font-weight:600;line-height:1.25;color:var(--indigo)}

.bungkus{max-width:var(--lebar);margin:0 auto;padding:0 20px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Pita ukiran, penanda struktur ---------- */
.pita{height:26px;background:url('../img/ornamen/ukiran-pita.svg') repeat-x center/96px 26px;opacity:.85}
.pita-terang{height:26px;background:url('../img/ornamen/ukiran-pita-terang.svg') repeat-x center/96px 26px;opacity:.75}
.gigi{height:10px;background:url('../img/ornamen/gigi-ukiran.svg') repeat-x center/28px 10px;opacity:.7}

/* ---------- Bilah atas ---------- */
.bar-atas{background:var(--indigo-gelap);color:var(--indigo-5);font-size:.8rem}
.bar-atas .bungkus{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;min-height:38px}
.bar-atas a{color:var(--indigo-5)}
.bar-atas a:hover{color:var(--emas-muda)}
.bar-atas .kiri,.bar-atas .kanan{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.bar-atas i{color:var(--emas)}

/* ---------- Kepala ---------- */
.kepala{background:var(--indigo);color:#fff;position:relative}
.kepala::after{content:'';position:absolute;inset:0;background:url('../img/ornamen/anyaman.svg') repeat;pointer-events:none}
.kepala .bungkus{display:flex;align-items:center;gap:18px;padding-top:16px;padding-bottom:16px;position:relative;z-index:1}
.kepala img.lambang{width:66px;height:66px;flex-shrink:0;background:#fff;border-radius:50%;padding:4px;object-fit:contain}
.merek b{display:block;font-family:var(--judul);font-size:1.42rem;font-weight:600;letter-spacing:-.01em;color:#fff;line-height:1.15}
.merek span{display:block;font-size:.86rem;color:var(--indigo-5);margin-top:3px}
.merek em{display:block;font-style:normal;font-size:.76rem;color:var(--emas-muda);letter-spacing:.08em;text-transform:uppercase;margin-top:5px}
.kepala .cari{margin-left:auto;display:flex;gap:0}
.kepala .cari input{border:0;padding:9px 14px;border-radius:var(--radius) 0 0 var(--radius);font-family:inherit;font-size:.86rem;width:210px;background:rgba(255,255,255,.94)}
.kepala .cari button{border:0;background:var(--emas);color:#3d2f00;padding:0 15px;border-radius:0 var(--radius) var(--radius) 0;cursor:pointer;font-size:.9rem}
.kepala .cari button:hover{background:var(--emas-muda)}
.tombol-menu{display:none;margin-left:auto;background:rgba(255,255,255,.12);border:0;color:#fff;font-size:1.15rem;padding:9px 13px;border-radius:var(--radius);cursor:pointer}

/* ---------- Navigasi ---------- */
.navigasi{background:var(--indigo-2);position:sticky;top:0;z-index:800;box-shadow:0 2px 10px rgba(0,0,0,.16)}
.navigasi .bungkus{display:flex;padding:0 20px}
.navigasi ul{list-style:none;display:flex;flex-wrap:wrap;width:100%}
.navigasi li{position:relative}
.navigasi > .bungkus > ul > li > a{display:flex;align-items:center;gap:7px;padding:13px 15px;color:#dfe3f5;font-size:.88rem;font-weight:600;border-bottom:3px solid transparent}
.navigasi > .bungkus > ul > li > a:hover{background:rgba(255,255,255,.08);color:#fff}
.navigasi > .bungkus > ul > li > a.aktif{color:#fff;border-bottom-color:var(--emas);background:rgba(255,255,255,.06)}
.navigasi .anak{display:none;position:absolute;top:100%;left:0;background:var(--putih);min-width:262px;box-shadow:var(--bayang-2);border-top:3px solid var(--emas);border-radius:0 0 var(--radius) var(--radius);flex-direction:column;padding:6px 0;z-index:50}
.navigasi li:hover > .anak,.navigasi li:focus-within > .anak{display:flex}
.navigasi .anak a{display:flex;align-items:center;gap:9px;padding:9px 16px;font-size:.86rem;color:var(--ink);font-weight:500}
.navigasi .anak a:hover{background:var(--indigo-4);color:var(--indigo)}
.navigasi .anak a i{width:16px;text-align:center;color:var(--indigo-3);font-size:.85rem}

/* ---------- Sampul ---------- */
.sampul{background:linear-gradient(140deg,var(--indigo-gelap) 0%,var(--indigo) 48%,var(--indigo-2) 100%);color:#fff;position:relative;overflow:hidden}
.sampul::before{content:'';position:absolute;inset:0;background:url('../img/ornamen/anyaman.svg') repeat;opacity:.9}
.sampul .bungkus{position:relative;z-index:2;padding:52px 20px 46px;display:grid;grid-template-columns:1.35fr 1fr;gap:40px;align-items:center}
.sampul .eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:.75rem;letter-spacing:.13em;text-transform:uppercase;color:var(--emas-muda);font-weight:700;margin-bottom:14px}
.sampul .eyebrow::before{content:'';width:30px;height:10px;background:url('../img/ornamen/gigi-ukiran.svg') repeat-x center/28px 10px}
.sampul h1{font-size:2.5rem;color:#fff;letter-spacing:-.015em;margin-bottom:16px}
.sampul h1 span{color:var(--emas-muda)}
.sampul p{color:#d3d8f2;font-size:1.03rem;max-width:56ch}
.sampul .tombol-set{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}

.kartu-jurnal{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:10px;padding:20px;backdrop-filter:blur(3px)}
.kartu-jurnal h2{font-size:.78rem;letter-spacing:.13em;text-transform:uppercase;color:var(--emas-muda);margin-bottom:14px}
.kartu-jurnal a{display:flex;align-items:center;gap:13px;padding:11px;border-radius:var(--radius);color:#fff;transition:background .15s ease}
.kartu-jurnal a:hover{background:rgba(255,255,255,.12)}
.kartu-jurnal img{width:52px;height:52px;object-fit:contain;background:#fff;border-radius:50%;padding:3px;flex-shrink:0}
.kartu-jurnal b{display:block;font-family:var(--judul);font-size:1.02rem}
.kartu-jurnal small{color:#c3c9ea;font-size:.79rem}

/* ---------- Bagian ---------- */
.bagian{padding:52px 0}
.bagian.krem{background:var(--krem)}
.bagian.putih{background:var(--putih)}
.kepala-bagian{margin-bottom:30px}
.kepala-bagian .label{display:inline-flex;align-items:center;gap:9px;font-size:.73rem;letter-spacing:.13em;text-transform:uppercase;color:var(--emas);font-weight:700;margin-bottom:8px}
.kepala-bagian .label::before{content:'';width:30px;height:10px;background:url('../img/ornamen/gigi-ukiran.svg') repeat-x center/28px 10px}
.kepala-bagian h2{font-size:1.72rem;letter-spacing:-.01em}
.kepala-bagian p{color:var(--abu);margin-top:7px;max-width:70ch}
.kepala-bagian.rata{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}

/* ---------- Kisi dan kartu ---------- */
.kisi{display:grid;gap:20px}
.k2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.k3{grid-template-columns:repeat(auto-fit,minmax(268px,1fr))}
.k4{grid-template-columns:repeat(auto-fit,minmax(212px,1fr))}

.kartu{background:var(--putih);border-radius:var(--radius);box-shadow:var(--bayang);overflow:hidden;display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease}
.kartu:hover{transform:translateY(-3px);box-shadow:var(--bayang-2)}
.kartu .isi{padding:17px;flex:1;display:flex;flex-direction:column}
.kartu h3{font-size:1.04rem;margin-bottom:8px}
.kartu h3 a{color:var(--indigo)}
.kartu p{font-size:.89rem;color:var(--abu);flex:1}
.kartu .meta{font-size:.77rem;color:var(--abu-muda);margin-top:12px;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.kartu .meta i{color:var(--indigo-3);margin-right:4px}
.kartu .gambar{aspect-ratio:16/9;background:var(--indigo-4);overflow:hidden}
.kartu .gambar img{width:100%;height:100%;object-fit:cover}
.kartu .kosong-gambar{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--indigo-5);font-size:2rem;background:linear-gradient(135deg,var(--indigo-4),var(--indigo-5))}

/* Kartu tautan bergaris ukiran */
.kartu-tautan{display:flex;gap:14px;align-items:flex-start;background:var(--putih);border-radius:var(--radius);padding:17px;box-shadow:var(--bayang);border-left:4px solid var(--emas);transition:transform .18s ease,box-shadow .18s ease}
.kartu-tautan:hover{transform:translateY(-3px);box-shadow:var(--bayang-2)}
.kartu-tautan .ikon{width:42px;height:42px;flex-shrink:0;border-radius:var(--radius);background:var(--indigo-4);color:var(--indigo);display:flex;align-items:center;justify-content:center;font-size:1.1rem}
.kartu-tautan b{display:block;font-family:var(--judul);font-size:1rem;color:var(--indigo);margin-bottom:4px}
.kartu-tautan span{font-size:.85rem;color:var(--abu)}

/* ---------- Angka capaian ---------- */
.angka-kisi{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;background:rgba(255,255,255,.16);border-radius:var(--radius);overflow:hidden}
.angka{background:var(--indigo);padding:22px 18px;text-align:center;color:#fff}
.angka b{display:block;font-family:var(--judul);font-size:2.3rem;line-height:1;color:var(--emas-muda)}
.angka span{display:block;font-size:.82rem;color:var(--indigo-5);margin-top:7px;letter-spacing:.03em}

/* ---------- Jejak langkah ---------- */
.jejak{background:var(--indigo-4);border-bottom:1px solid var(--indigo-5)}
.jejak .bungkus{padding:11px 20px;font-size:.83rem;color:var(--indigo-2);display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.jejak a{color:var(--indigo-2)}
.jejak .kini{color:var(--abu)}

/* ---------- Tata letak halaman dalam ---------- */
.tata{display:grid;grid-template-columns:1fr 300px;gap:32px;align-items:start;padding:38px 0 52px}
.tata.penuh{grid-template-columns:1fr}
.panel{background:var(--putih);border-radius:var(--radius);box-shadow:var(--bayang);overflow:hidden}
.panel-kepala{padding:15px 20px;background:var(--indigo);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.panel-kepala h2,.panel-kepala h1{font-size:1.12rem;color:#fff;display:flex;align-items:center;gap:9px}
.panel-kepala h2 i,.panel-kepala h1 i{color:var(--emas-muda)}
.panel-isi{padding:22px}

/* ---------- Isi artikel ---------- */
.artikel{font-size:1rem;line-height:1.78;color:#2c3038}
.artikel > *+*{margin-top:1.05em}
.artikel h3{font-size:1.28rem;margin-top:1.7em;padding-left:14px;border-left:4px solid var(--emas)}
.artikel h4{font-size:1.08rem;margin-top:1.5em;color:var(--indigo-2)}
.artikel p{text-align:justify;hyphens:auto}
.artikel ul,.artikel ol{padding-left:1.35em}
.artikel li{margin-bottom:.5em}
.artikel li::marker{color:var(--emas);font-weight:700}
.artikel blockquote{background:var(--emas-pucat);border-left:4px solid var(--emas);padding:16px 20px;border-radius:0 var(--radius) var(--radius) 0;font-family:var(--judul);font-size:1.12rem;color:var(--indigo);font-style:italic}
.artikel strong{color:var(--indigo-2)}
.artikel a{text-decoration:underline;text-underline-offset:2px}
.artikel table{width:100%;border-collapse:collapse;font-size:.9rem}
.artikel th{background:var(--indigo-4);color:var(--indigo);text-align:left;padding:9px 12px}
.artikel td{padding:9px 12px;border-bottom:1px solid var(--garis)}
.artikel img{border-radius:var(--radius);margin:1.2em 0}

/* ---------- Sisi ---------- */
.sisi{display:flex;flex-direction:column;gap:20px;position:sticky;top:74px}
.sisi .panel-kepala{background:var(--indigo-2)}
.daftar-sisi{list-style:none}
.daftar-sisi li+li{border-top:1px solid var(--garis)}
.daftar-sisi a{display:flex;align-items:center;gap:10px;padding:11px 18px;font-size:.88rem;color:var(--ink)}
.daftar-sisi a:hover{background:var(--indigo-4);color:var(--indigo)}
.daftar-sisi a.aktif{background:var(--emas-pucat);color:var(--indigo);font-weight:600;box-shadow:inset 4px 0 0 var(--emas)}
.daftar-sisi i{width:17px;text-align:center;color:var(--indigo-3);font-size:.85rem}

.ringkas-sisi{padding:18px}
.ringkas-sisi li{list-style:none;padding:11px 0;border-bottom:1px dashed var(--garis);font-size:.87rem}
.ringkas-sisi li:last-child{border-bottom:0}
.ringkas-sisi .tgl{display:block;font-size:.75rem;color:var(--abu-muda);margin-top:3px}

/* ---------- Pengurus ---------- */
.kartu-orang{background:var(--putih);border-radius:var(--radius);box-shadow:var(--bayang);text-align:center;padding:24px 18px;position:relative;overflow:hidden}
.kartu-orang::before{content:'';position:absolute;top:0;left:0;right:0;height:10px;background:url('../img/ornamen/gigi-ukiran.svg') repeat-x center/28px 10px;opacity:.6}
.kartu-orang .pas{width:118px;height:118px;border-radius:50%;object-fit:cover;object-position:top center;margin:14px auto 14px;border:4px solid var(--indigo-4);background:var(--indigo-4)}
.kartu-orang .pas-kosong{width:118px;height:118px;border-radius:50%;margin:14px auto;display:flex;align-items:center;justify-content:center;background:var(--indigo-4);color:var(--indigo-3);font-family:var(--judul);font-size:2rem;border:4px solid var(--indigo-5)}
.kartu-orang b{display:block;font-family:var(--judul);font-size:1.02rem;color:var(--indigo);line-height:1.35}
.kartu-orang .jbt{display:inline-block;margin-top:8px;background:var(--indigo-4);color:var(--indigo-2);padding:4px 13px;border-radius:14px;font-size:.78rem;font-weight:600}
.kartu-orang .bdg{font-size:.83rem;color:var(--abu);margin-top:11px;text-align:left}

/* ---------- Bagan struktur ---------- */
.bagan{display:flex;flex-direction:column;align-items:center;gap:0}
.bagan .kotak{background:var(--indigo);color:#fff;padding:13px 22px;border-radius:var(--radius);text-align:center;min-width:250px;box-shadow:var(--bayang)}
.bagan .kotak b{display:block;font-family:var(--judul);font-size:.98rem}
.bagan .kotak span{font-size:.78rem;color:var(--indigo-5)}
.bagan .kotak.emas{background:var(--emas);color:#3d2f00}
.bagan .kotak.emas span{color:#6b5410}
.bagan .garis{width:2px;height:24px;background:var(--indigo-5)}
.bagan .cabang{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;width:100%;margin-top:8px}
.bagan .cabang .kotak{min-width:0;background:var(--putih);color:var(--ink);border:1px solid var(--garis);border-top:3px solid var(--indigo-3)}
.bagan .cabang .kotak b{color:var(--indigo)}
.bagan .cabang .kotak span{color:var(--abu)}

/* ---------- Jurnal ---------- */
.jurnal-baris{display:grid;grid-template-columns:180px 1fr;gap:26px;align-items:start;background:var(--putih);border-radius:var(--radius);box-shadow:var(--bayang);padding:26px;border-top:4px solid var(--emas)}
.jurnal-baris .lambang{width:160px;height:160px;object-fit:contain;margin:0 auto}
.jurnal-baris h3{font-size:1.45rem;margin-bottom:4px}
.jurnal-baris .sub{color:var(--abu);font-size:.9rem;margin-bottom:14px}
.jurnal-fakta{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:12px;margin:16px 0}
.jurnal-fakta div{background:var(--krem);border-radius:var(--radius);padding:11px 13px}
.jurnal-fakta dt{font-size:.72rem;text-transform:uppercase;letter-spacing:.07em;color:var(--abu)}
.jurnal-fakta dd{font-size:.9rem;font-weight:600;color:var(--indigo);margin-top:3px}

/* ---------- Halaman logo ---------- */
.kisi-logo{display:grid;grid-template-columns:repeat(auto-fill,minmax(238px,1fr));gap:26px}
.bidang-logo{background:var(--putih);border-radius:var(--radius);box-shadow:var(--bayang);height:186px;display:flex;align-items:center;justify-content:center;padding:30px;transition:transform .2s ease,box-shadow .2s ease}
.bidang-logo:hover{transform:translateY(-4px);box-shadow:var(--bayang-2)}
.bidang-logo img{max-height:100%;max-width:100%;width:auto;object-fit:contain}

/* ---------- Tabel data ---------- */
.tabel-bungkus{overflow-x:auto}
table.data{width:100%;border-collapse:collapse;font-size:.88rem}
table.data th{background:var(--indigo-4);color:var(--indigo);font-weight:600;text-align:left;padding:11px 12px;border-bottom:2px solid var(--indigo-5);white-space:nowrap}
table.data td{padding:11px 12px;border-bottom:1px solid var(--garis);vertical-align:top}
table.data tbody tr:hover{background:#f8f9fb}
table.data .nomor{width:44px;color:var(--abu);text-align:center}

/* ---------- Lencana ---------- */
.lencana{display:inline-block;padding:3px 10px;border-radius:12px;font-size:.72rem;font-weight:600;white-space:nowrap}
.l-hijau{background:#d4edda;color:#155724}
.l-merah{background:#f8d7da;color:#721c24}
.l-kuning{background:#fff3cd;color:#856404}
.l-biru{background:var(--indigo-4);color:var(--indigo)}
.l-emas{background:var(--emas-pucat);color:#7a6111}
.l-abu{background:#e9ecef;color:#495057}

/* ---------- Tombol ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;padding:9px 18px;border-radius:var(--radius);font-size:.87rem;font-weight:600;border:0;cursor:pointer;font-family:inherit;transition:filter .15s ease,background .15s ease;line-height:1.4}
.btn:hover{filter:brightness(1.08)}
.btn-utama{background:var(--indigo);color:#fff}
.btn-utama:hover{color:#fff}
.btn-emas{background:var(--emas);color:#3d2f00}
.btn-emas:hover{color:#3d2f00}
.btn-biru{background:var(--indigo-3);color:#fff}
.btn-biru:hover{color:#fff}
.btn-hijau{background:var(--hijau);color:#fff}
.btn-hijau:hover{color:#fff}
.btn-merah{background:var(--merah);color:#fff}
.btn-merah:hover{color:#fff}
.btn-garis{background:transparent;border:1.6px solid var(--indigo);color:var(--indigo)}
.btn-garis:hover{background:var(--indigo);color:#fff}
.btn-terang{background:rgba(255,255,255,.14);color:#fff;border:1.6px solid rgba(255,255,255,.4)}
.btn-terang:hover{background:#fff;color:var(--indigo)}
.btn-sm{padding:5px 11px;font-size:.77rem}

/* ---------- Borang ---------- */
label{display:block;font-size:.83rem;font-weight:600;color:var(--ink);margin-bottom:5px}
label .wajib{color:var(--merah)}
input[type=text],input[type=password],input[type=email],input[type=date],input[type=number],
input[type=url],input[type=tel],input[type=search],input[type=file],select,textarea{
  width:100%;padding:9px 12px;border:1px solid var(--garis);border-radius:var(--radius);font-family:inherit;
  font-size:.9rem;background:#fff;color:var(--ink);transition:border-color .15s ease,box-shadow .15s ease}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--indigo-3);box-shadow:0 0 0 3px rgba(92,107,192,.16)}
textarea{min-height:130px;resize:vertical;line-height:1.6}
.grup{margin-bottom:15px}
.form-baris{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:15px}
.bantuan{font-size:.78rem;color:var(--abu);margin-top:4px}

/* ---------- Peringatan ---------- */
.alert{padding:12px 16px;border-radius:var(--radius);margin-bottom:18px;font-size:.89rem;display:flex;align-items:flex-start;gap:10px}
.alert i{margin-top:3px}
.a-hijau{background:#d4edda;color:#155724;border-left:4px solid var(--hijau)}
.a-merah{background:#f8d7da;color:#721c24;border-left:4px solid var(--merah)}
.a-kuning{background:#fff3cd;color:#856404;border-left:4px solid var(--kuning)}
.a-biru{background:var(--indigo-4);color:var(--indigo);border-left:4px solid var(--indigo-3)}

/* ---------- Bilah alat ---------- */
.bar-alat{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:18px}
.bar-alat input,.bar-alat select{width:auto;min-width:170px}
.bar-alat .tumbuh{flex:1;min-width:210px}

/* ---------- Keadaan kosong ---------- */
.kosong{text-align:center;padding:44px 20px;color:var(--abu)}
.kosong i{font-size:2.7rem;color:var(--indigo-5);margin-bottom:14px;display:block}
.kosong b{display:block;font-family:var(--judul);color:var(--indigo);font-size:1.08rem;margin-bottom:6px}
.kosong p{font-size:.9rem;max-width:46ch;margin:0 auto}

/* ---------- Paginasi ---------- */
.paginasi{display:flex;gap:6px;justify-content:center;margin-top:24px;flex-wrap:wrap}
.paginasi a,.paginasi span{padding:7px 13px;border-radius:4px;font-size:.85rem;border:1px solid var(--garis);background:#fff}
.paginasi .kini{background:var(--indigo);color:#fff;border-color:var(--indigo)}

/* ---------- Galeri ---------- */
.kisi-galeri{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.kisi-galeri a{aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;box-shadow:var(--bayang);position:relative;display:block}
.kisi-galeri img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}
.kisi-galeri a:hover img{transform:scale(1.06)}
.kisi-galeri .cap{position:absolute;inset:auto 0 0 0;background:linear-gradient(transparent,rgba(17,23,90,.88));color:#fff;font-size:.79rem;padding:22px 11px 9px}

/* ---------- Kaki ---------- */
.kaki{background:var(--indigo-gelap);color:#b9c0e4;font-size:.88rem;position:relative}
.kaki::before{content:'';position:absolute;inset:0;background:url('../img/ornamen/anyaman.svg') repeat;opacity:.55;pointer-events:none}
.kaki .bungkus{position:relative;z-index:1}
.kaki-atas{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:32px;padding:42px 0 34px}
.kaki h4{font-family:var(--judul);color:#fff;font-size:1rem;margin-bottom:15px;padding-bottom:9px;border-bottom:1px solid rgba(255,255,255,.13);position:relative}
.kaki h4::after{content:'';position:absolute;left:0;bottom:-1px;width:46px;height:2px;background:var(--emas)}
.kaki ul{list-style:none}
.kaki li{margin-bottom:9px}
.kaki a{color:#b9c0e4}
.kaki a:hover{color:var(--emas-muda)}
.kaki .lembaga{display:flex;gap:14px;align-items:flex-start;margin-bottom:15px}
.kaki .lembaga img{width:56px;height:56px;background:#fff;border-radius:50%;padding:3px;object-fit:contain;flex-shrink:0}
.kaki .lembaga b{display:block;font-family:var(--judul);color:#fff;font-size:1.02rem;line-height:1.3}
.kaki .lembaga span{font-size:.8rem}
.kaki .kontak li{display:flex;gap:10px;align-items:flex-start}
.kaki .kontak i{color:var(--emas);margin-top:4px;width:15px;text-align:center;flex-shrink:0}
.kaki-bawah{border-top:1px solid rgba(255,255,255,.11);padding:16px 0;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.81rem}

/* ---------- Masuk pengelola ---------- */
.masuk-latar{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;
  background:linear-gradient(135deg,var(--indigo-gelap) 0%,var(--indigo) 55%,var(--indigo-2) 100%);position:relative}
.masuk-latar::before{content:'';position:absolute;inset:0;background:url('../img/ornamen/anyaman.svg') repeat}
.masuk-kotak{background:var(--putih);border-radius:10px;box-shadow:0 14px 44px rgba(0,0,0,.3);width:100%;max-width:404px;overflow:hidden;position:relative;z-index:2}
.masuk-atas{background:var(--indigo);padding:26px 24px;text-align:center;color:#fff}
.masuk-atas img{width:72px;height:72px;border-radius:50%;background:#fff;padding:4px;object-fit:contain;margin:0 auto 11px}
.masuk-atas h1{font-size:1.24rem;color:#fff}
.masuk-atas p{font-size:.8rem;color:var(--indigo-5);margin-top:3px}
.masuk-isi{padding:24px}
.masuk-kaki{text-align:center;padding:14px;background:#fafbfc;border-top:1px solid var(--garis);font-size:.79rem;color:var(--abu)}

/* ---------- Responsif ---------- */
@media (max-width:960px){
  .sampul .bungkus{grid-template-columns:1fr;padding:38px 20px}
  .sampul h1{font-size:1.95rem}
  .tata{grid-template-columns:1fr}
  .sisi{position:static}
  .kaki-atas{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:26px}
  .jurnal-baris{grid-template-columns:1fr}
  .jurnal-baris .lambang{width:130px;height:130px}
}
@media (max-width:800px){
  .kepala .cari{display:none}
  .tombol-menu{display:block}
  .navigasi{position:static}
  .navigasi .bungkus{padding:0}
  .navigasi > .bungkus > ul{display:none;flex-direction:column;width:100%}
  .navigasi.buka > .bungkus > ul{display:flex}
  .navigasi > .bungkus > ul > li > a{padding:12px 20px;border-bottom:1px solid rgba(255,255,255,.09)}
  .navigasi > .bungkus > ul > li > a.aktif{border-bottom-color:rgba(255,255,255,.09);box-shadow:inset 4px 0 0 var(--emas)}
  .navigasi .anak{position:static;box-shadow:none;border-radius:0;border-top:0;background:rgba(0,0,0,.16);padding:0}
  .navigasi li:hover > .anak{display:none}
  .navigasi li.buka > .anak{display:flex}
  .navigasi .anak a{color:#cfd4ee;padding:10px 20px 10px 38px}
  .navigasi .anak a:hover{background:rgba(255,255,255,.08);color:#fff}
  .navigasi .anak a i{color:var(--emas-muda)}
}
@media (max-width:560px){
  body{font-size:15px}
  .kepala .bungkus{gap:13px}
  .kepala img.lambang{width:52px;height:52px}
  .merek b{font-size:1.1rem}
  .merek span{font-size:.78rem}
  .bagian{padding:38px 0}
  .kepala-bagian h2{font-size:1.38rem}
  .sampul h1{font-size:1.65rem}
  .panel-isi{padding:17px}
  .bar-atas .kiri{display:none}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

@media print{
  .bar-atas,.navigasi,.kaki,.sisi,.tombol-menu,.pita,.gigi{display:none}
  body{background:#fff;font-size:11pt}
  .panel{box-shadow:none;border:1px solid #ccc}
}