/* Demo website FK UMB Palopo — tema terang saja. Hijau logo UMB (#16BF68) + hijau tua + aksen emas. */
:root{
  --hijau:#0B6B43; --hijau-t:#06402A; --hijau-c:#16BF68; --hijau-l:#E8F6EE; --emas:#F2B33D; --emas-l:#FFF5DE;
  --tinta:#13221B; --abu:#5A6B63; --garis:#DDE7E1; --latar:#F7FAF8; --putih:#fff;
  --judul:"Plus Jakarta Sans",system-ui,sans-serif; --teks:"Inter",system-ui,-apple-system,sans-serif;
  --r:16px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--putih);color:var(--tinta);font:16px/1.65 var(--teks);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--hijau)}
h1,h2,h3,h4{font-family:var(--judul);line-height:1.2;margin:0;letter-spacing:-.01em}
h2{font-size:clamp(26px,3.2vw,38px);font-weight:800}
h3{font-size:18px;font-weight:700}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
section{padding:88px 0}
.label-kecil{margin:0 0 10px;font:700 12.5px/1 var(--judul);letter-spacing:.12em;text-transform:uppercase;color:var(--hijau)}
.lead{font-size:18px;color:#3d4d45;max-width:640px}
.lead.kecil{font-size:16px;margin:0 0 26px}
.catatan{font-size:13.5px;color:var(--abu);margin:22px 0 0}
.pudar{color:var(--abu)}
.dua{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.kepala-sek{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:32px;flex-wrap:wrap}
.tautan{font-weight:600;text-decoration:none;white-space:nowrap}
.tautan:hover{text-decoration:underline}

/* tombol */
.tbl{display:inline-flex;align-items:center;gap:8px;padding:13px 24px;border-radius:999px;background:var(--hijau);color:#fff;font:700 15px/1 var(--judul);text-decoration:none;border:2px solid var(--hijau);transition:transform .15s,background .2s}
.tbl:hover{transform:translateY(-1px);background:var(--hijau-t);border-color:var(--hijau-t)}
.tbl.garis{background:transparent;color:#fff;border-color:#ffffff88}
.tbl.garis:hover{background:#ffffff1a;border-color:#fff}
.tbl.kecil{padding:9px 18px;font-size:14px}
.tbl.emas{background:var(--emas);border-color:var(--emas);color:var(--hijau-t)}
.tbl.emas:hover{background:#ffc75a;border-color:#ffc75a}
.tombol-baris{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}

/* pita demo + bilah atas + navigasi */
.demo-pita{background:var(--emas);color:#3a2a00;text-align:center;font-size:13px;padding:7px 16px}
.atas{background:var(--hijau-t);color:#d5ebde;font-size:13.5px}
.atas .wrap{display:flex;gap:22px;align-items:center;min-height:38px;flex-wrap:wrap}
.atas a{color:#d5ebde;text-decoration:none}.atas a:hover{color:#fff}
.atas .kanan{margin-left:auto;display:flex;gap:18px}
.nav{position:sticky;top:0;z-index:50;background:#ffffffee;backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--garis)}
.nav .wrap{display:flex;align-items:center;gap:24px;min-height:72px}
.merek img{height:46px;width:auto;border-radius:8px}
.menu{margin-left:auto;display:flex;align-items:center;gap:4px}
.menu a{padding:8px 11px;border-radius:999px;color:var(--tinta);text-decoration:none;font:600 14.5px/1 var(--judul)}
.menu a:not(.tbl):hover{background:var(--hijau-l);color:var(--hijau)}
.menu a.tbl{color:#fff;margin-left:8px}
.menu-b{display:none;margin-left:auto;width:42px;height:42px;border-radius:12px;border:1px solid var(--garis);cursor:pointer;position:relative}
.menu-b span,.menu-b span::before,.menu-b span::after{position:absolute;left:11px;width:18px;height:2px;background:var(--tinta);content:"";transition:.2s}
.menu-b span{top:20px}.menu-b span::before{top:-6px;left:0}.menu-b span::after{top:6px;left:0}

/* hero */
.hero{position:relative;color:#fff;padding:84px 0 96px;overflow:hidden;background:var(--hijau-t)}
.hero-latar{position:absolute;inset:0;background:
  linear-gradient(105deg,#06402Af2 0%,#0B6B43e0 48%,#0B6B4399 100%),
  url("https://www.fk.umegabuana.ac.id/wp-content/uploads/2025/02/Auditorium-lt6-scaled.jpeg") center/cover no-repeat}
.hero-latar::after{content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,#16BF6855,transparent 70%)}
.hero-isi{position:relative;display:grid;grid-template-columns:1.35fr 1fr;gap:48px;align-items:center}
.hero-isi.tunggal{grid-template-columns:minmax(0,760px)}
.hero .label-kecil{color:#9fe3bd}
.hero h1{font-size:clamp(32px,4.6vw,54px);font-weight:800;line-height:1.1}
.hero h1 em{font-style:normal;color:var(--emas)}
.hero .lead{color:#d9efe3;margin:22px 0 0}
.kartu-hari{background:#fff;color:var(--tinta);border-radius:20px;padding:22px;box-shadow:0 24px 60px #00000040}
.kh-kepala{display:flex;align-items:center;gap:8px;font:700 14px/1.2 var(--judul);color:var(--hijau);flex-wrap:wrap}
.kh-tgl{margin-left:auto;color:var(--abu);font-weight:600}
.kh-isi{margin:14px 0 10px;display:flex;flex-direction:column;gap:8px;max-height:300px;overflow:auto}
.kh-sesi{display:grid;grid-template-columns:62px 1fr;gap:10px;padding:10px 12px;border-radius:12px;background:var(--latar);border-left:4px solid var(--c,var(--hijau-c))}
.kh-sesi time{font:700 13px/1.3 var(--judul);color:var(--hijau-t)}
.kh-sesi b{display:block;font-size:14px;line-height:1.35}
.kh-sesi small{color:var(--abu);font-size:12.5px}
.kh-link{font-weight:600;font-size:14px;text-decoration:none}
.titik-live{width:9px;height:9px;border-radius:50%;background:var(--hijau-c);box-shadow:0 0 0 0 #16BF6899;animation:denyut 2s infinite;flex:none}
@keyframes denyut{70%{box-shadow:0 0 0 9px #16BF6800}100%{box-shadow:0 0 0 0 #16BF6800}}

/* angka */
.angka{padding:0;margin-top:-44px;position:relative;z-index:2}
.angka-grid{display:grid;grid-template-columns:repeat(5,1fr);background:#fff;border:1px solid var(--garis);border-radius:20px;box-shadow:0 14px 40px #0b6b431a;overflow:hidden}
.ak{padding:26px 24px;border-right:1px solid var(--garis);display:flex;flex-direction:column;gap:2px}
.ak:last-child{border-right:0}
.ak b{font:800 40px/1.05 var(--judul);color:var(--hijau)}
.ak span{font-weight:600}
.ak small{font-size:12.5px;color:var(--abu)}
.ak small.live{color:#0E8E4C}

/* profil */
.profil blockquote{margin:18px 0 0;font:600 20px/1.55 var(--judul);color:var(--hijau-t);border-left:4px solid var(--emas);padding-left:20px}
.misi{list-style:none;margin:0;padding:0;counter-reset:m;display:flex;flex-direction:column;gap:12px}
.misi li{counter-increment:m;position:relative;padding:16px 18px 16px 62px;background:var(--latar);border-radius:14px;color:#33443c}
.misi li::before{content:counter(m);position:absolute;left:16px;top:14px;width:32px;height:32px;border-radius:10px;background:var(--hijau);color:#fff;display:grid;place-items:center;font:800 15px/1 var(--judul)}
.misi b{color:var(--tinta)}

/* prodi */
.prodi{background:var(--latar)}
.jalur{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.jalur-baris{display:grid;grid-template-columns:1fr 34px 1fr;align-items:stretch;gap:8px}
.panah{display:grid;place-items:center;font-size:22px;color:var(--hijau);font-weight:700}
.pk{display:flex;flex-direction:column;gap:4px;padding:24px;background:#fff;border:1px solid var(--garis);border-radius:var(--r);text-decoration:none;color:var(--tinta);transition:transform .2s,box-shadow .2s,border-color .2s}
.pk:hover{transform:translateY(-3px);box-shadow:0 16px 36px #0b6b431f;border-color:var(--hijau-c)}
.pk .ik{font-size:30px;margin-bottom:6px}
.pk small{font:700 11.5px/1 var(--judul);letter-spacing:.1em;text-transform:uppercase;color:var(--hijau)}
.pk.gigi small{color:#B7791F}
.pk p{margin:4px 0 0;font-size:14.5px;color:var(--abu)}

/* jadwal */
.status-live{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--abu);background:var(--hijau-l);padding:8px 14px;border-radius:999px}
.status-live.gagal{background:#FDECEA;color:#9B2C1F}.status-live.gagal .titik-live{background:#D64532;animation:none}
.hari-tab{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:18px;scrollbar-width:thin}
.hari-tab button{flex:none;border:1px solid var(--garis);background:#fff;border-radius:14px;padding:10px 16px;font:600 14px/1.25 var(--judul);color:var(--tinta);cursor:pointer;text-align:left}
.hari-tab button small{display:block;font:500 12px/1.3 var(--teks);color:var(--abu)}
.hari-tab button[aria-selected=true]{background:var(--hijau);border-color:var(--hijau);color:#fff}
.hari-tab button[aria-selected=true] small{color:#cdeedb}
.hari-tab button.hari-ini:not([aria-selected=true]){border-color:var(--emas);background:var(--emas-l)}
.sesi-daftar{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.sesi{background:#fff;border:1px solid var(--garis);border-left:5px solid var(--c,var(--hijau-c));border-radius:14px;padding:16px 18px;cursor:pointer;text-align:left;font:inherit;color:inherit;transition:box-shadow .2s}
.sesi:hover{box-shadow:0 10px 26px #0b6b431a}
.sesi time{font:700 13px/1 var(--judul);color:var(--hijau)}
.sesi h3{font-size:16px;margin:8px 0 6px;line-height:1.35}
.sesi .meta{font-size:13px;color:var(--abu)}
.sesi .blok{display:inline-block;font:700 11.5px/1 var(--judul);padding:5px 9px;border-radius:999px;background:color-mix(in srgb,var(--c,#16BF68) 13%,#fff);color:var(--c,var(--hijau));margin-bottom:2px}
.sesi.ujian{background:#FFF7F5}
.kosong{grid-column:1/-1;padding:28px;text-align:center;background:var(--latar);border-radius:14px;color:var(--abu)}

/* berita */
.berita{background:var(--latar)}
.berita-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.bk{display:flex;flex-direction:column;background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid var(--garis);text-decoration:none;color:var(--tinta);transition:transform .2s,box-shadow .2s}
.bk:hover{transform:translateY(-3px);box-shadow:0 18px 40px #0b6b431f}
.bk .gb{aspect-ratio:16/10;background:var(--hijau-l) center/cover no-repeat}
.bk .isi{padding:18px 20px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.bk time{font-size:12.5px;font-weight:600;color:var(--hijau)}
.bk h3{font-size:17px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bk p{margin:0;font-size:14px;color:var(--abu);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bk:first-child{grid-column:span 2;flex-direction:row}
.bk:first-child .gb{aspect-ratio:auto;flex:1.2;min-height:300px}
.bk:first-child .isi{flex:1;justify-content:center;padding:28px}
.bk:first-child h3{font-size:22px}
.info-bawah{margin-top:48px;gap:32px}
.sub{font-size:19px;margin-bottom:14px}
.daftar{list-style:none;margin:0;padding:0;background:#fff;border:1px solid var(--garis);border-radius:var(--r);overflow:hidden}
.daftar li+li{border-top:1px solid var(--garis)}
.daftar a{display:grid;grid-template-columns:58px 1fr;gap:14px;align-items:center;padding:14px 18px;text-decoration:none;color:var(--tinta)}
.daftar a:hover{background:var(--hijau-l)}
.daftar .tg{text-align:center;background:var(--hijau-l);border-radius:12px;padding:6px 0;font:800 20px/1 var(--judul);color:var(--hijau)}
.daftar .tg small{display:block;font:700 11px/1.4 var(--judul);text-transform:uppercase}
.daftar b{font-size:14.5px;font-weight:600;line-height:1.4}

/* SSO */
.sso{background:linear-gradient(160deg,var(--hijau-t),#0A5536);color:#fff}
.sso .label-kecil{color:#9fe3bd}.sso .lead{color:#cfe9da}.sso .catatan{color:#a8cdb9}
.sso-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.sk{border:1px dashed #ffffff55;border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:6px;background:#ffffff0d}
.sk span{font-weight:600}.sk b{font:800 38px/1 var(--judul);color:#ffffff66}.sk small{color:#b9dcc8;font-size:13px}

/* dosen */
.dosen-rel{display:grid;grid-auto-flow:column;grid-auto-columns:200px;gap:18px;overflow-x:auto;padding-bottom:14px;scroll-snap-type:x mandatory;scrollbar-width:thin}
.dk{scroll-snap-align:start;text-decoration:none;color:var(--tinta)}
.dk .ft{aspect-ratio:4/5;border-radius:var(--r);background:var(--hijau-l) center top/cover no-repeat;margin-bottom:10px;transition:transform .2s}
.dk:hover .ft{transform:scale(1.02)}
.dk b{display:block;font:700 14.5px/1.35 var(--judul)}

/* fasilitas */
.fas-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.fk{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;background:var(--hijau-l) center/cover no-repeat;display:flex;align-items:end;text-decoration:none}
.fk::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,#06402Ae6,transparent 55%)}
.fk span{position:relative;color:#fff;font:700 18px/1.2 var(--judul);padding:18px}
.fk:hover{outline:3px solid var(--hijau-c)}

/* mutu & layanan */
.mutu{background:var(--latar)}
.mutu-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mutu-grid a{padding:18px;background:#fff;border:1px solid var(--garis);border-radius:14px;text-decoration:none;color:var(--tinta);font-weight:600}
.mutu-grid a:hover{border-color:var(--hijau-c);color:var(--hijau)}
.lay-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.lay-grid a{display:flex;flex-direction:column;gap:4px;padding:20px;border:1px solid var(--garis);border-radius:14px;text-decoration:none;color:var(--tinta);transition:.2s}
.lay-grid a:hover{background:var(--hijau);color:#fff;border-color:var(--hijau)}
.lay-grid a:hover span{color:#d5ebde}
.lay-grid b{font:800 17px/1.2 var(--judul)}.lay-grid span{font-size:13.5px;color:var(--abu)}

/* ajakan + footer */
.ajakan{padding:0 0 88px}
.ajakan-isi{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;background:var(--hijau);color:#fff;border-radius:24px;padding:44px 48px;background-image:radial-gradient(circle at 90% 10%,#16BF6866,transparent 45%)}
.ajakan p{margin:6px 0 0;color:#d5ebde}
footer{background:var(--hijau-t);color:#cfe3d7;padding:60px 0 28px;font-size:14.5px}
.kaki{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.kaki h4{color:#fff;font-size:15px;margin-bottom:10px}
.kaki a{color:#cfe3d7}
.kaki-logo{height:46px;width:auto;border-radius:8px;margin-bottom:14px}
.isi-nanti{color:var(--emas)}
.hak{grid-column:1/-1;border-top:1px solid #ffffff22;padding-top:20px;font-size:13px;color:#9dbcab}

/* dialog sesi */
dialog{border:0;border-radius:20px;padding:0;max-width:520px;width:calc(100% - 32px);box-shadow:0 30px 80px #0005}
dialog::backdrop{background:#06402A88}
.dlg-isi{padding:26px}.dlg-isi h3{font-size:20px;margin:8px 0 14px}
.dlg-isi dl{display:grid;grid-template-columns:110px 1fr;gap:8px 12px;margin:0;font-size:14.5px}.dlg-isi dt{color:var(--abu)}.dlg-isi dd{margin:0}
.dlg-isi button{margin-top:20px}

/* responsif */
@media (max-width:1020px){
  .menu-b{display:block}
  .menu{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;flex-direction:column;align-items:stretch;padding:12px 16px 18px;border-bottom:1px solid var(--garis);box-shadow:0 20px 30px #0001}
  #menu-t:checked~.menu{display:flex}
  .menu a{padding:12px}.menu a.tbl{margin:8px 0 0;justify-content:center}
  .hero-isi,.dua{grid-template-columns:1fr}
  .angka-grid{grid-template-columns:1fr 1fr}.ak:nth-child(2n){border-right:0}.ak:nth-child(-n+4){border-bottom:1px solid var(--garis)}.ak:last-child{grid-column:1/-1}
  .jalur{grid-template-columns:1fr}
  .berita-grid{grid-template-columns:1fr 1fr}
  .sso-grid{grid-template-columns:1fr 1fr}
  .fas-grid{grid-template-columns:1fr 1fr}
  .kaki{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body{font-size:15.5px}
  .wrap{padding:0 16px}
  section{padding:64px 0}
  .atas .kanan{display:none}
  .hero{padding:56px 0 80px}
  .ak b{font-size:32px}.ak{padding:18px 16px}
  .jalur-baris{grid-template-columns:1fr}.panah{transform:rotate(90deg);height:24px}
  .berita-grid,.sso-grid,.fas-grid,.kaki,.mutu-grid{grid-template-columns:1fr}
  .bk:first-child{grid-column:auto;flex-direction:column}.bk:first-child .gb{min-height:200px;flex:none;aspect-ratio:16/10}
  .ajakan-isi{padding:32px 24px}
  .sesi-daftar{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ===== halaman dalam (halaman.html) ===== */
.halaman{padding:48px 0 72px;background:var(--latar);min-height:60vh}
.menu a.aktif{background:var(--hijau-l);color:var(--hijau)}
.h-kepala{margin-bottom:22px}.h-kepala h1{font-size:clamp(28px,4vw,42px);font-weight:800}
.h-sub{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 22px;position:sticky;top:74px;z-index:5;background:var(--latar);padding:8px 0}
.h-sub a{padding:8px 14px;border-radius:999px;border:1px solid var(--garis);background:#fff;text-decoration:none;color:var(--tinta);font:600 14px/1 var(--judul)}
.h-sub a:hover,.h-sub a.on{background:var(--hijau);border-color:var(--hijau);color:#fff}
.h-sub2{font-size:22px;margin:28px 0 14px}
.h-kartu{background:#fff;border:1px solid var(--garis);border-radius:var(--r);padding:28px;margin-bottom:20px;scroll-margin-top:140px}
.h-kartu h2{font-size:24px;margin-bottom:8px}.h-kartu p{color:#33443c}
.h-kartu.dua{display:grid;grid-template-columns:1fr 1.2fr;gap:36px}
.h-kutip{margin:8px 0 0;font:600 19px/1.55 var(--judul);color:var(--hijau-t);border-left:4px solid var(--emas);padding-left:18px}
.sambutan{display:grid;grid-template-columns:260px 1fr;gap:32px;align-items:start}
.sambutan img{width:100%;border-radius:16px;aspect-ratio:3/4;object-fit:cover;object-position:top}
img.struktur{width:100%;border-radius:12px;border:1px solid var(--garis);margin-top:12px}
.kecil{font-size:13.5px}
.sumber{font-size:13px;color:var(--abu);margin-top:14px;word-break:break-word}.sumber a{color:var(--abu)}
.h-grid-dosen{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px}
.h-dosen{background:#fff;border:1px solid var(--garis);border-radius:var(--r);padding:12px;display:flex;flex-direction:column;gap:4px}
.h-dosen .ft{aspect-ratio:4/5;border-radius:12px;background:var(--hijau-l) center top/cover no-repeat;margin-bottom:8px}
.h-dosen b{font:700 14.5px/1.35 var(--judul)}.h-dosen span{font-size:13px;color:var(--hijau);font-weight:600}.h-dosen a{font-size:12.5px;color:var(--abu);word-break:break-all}
.h-fas,.h-detail{display:grid;grid-template-columns:340px 1fr;gap:28px;align-items:start}
.h-fas img,.h-detail img{width:100%;border-radius:14px;object-fit:cover}
.h-dl{display:grid;grid-template-columns:120px 1fr;gap:6px 14px;margin:10px 0 14px}.h-dl dt{color:var(--abu)}.h-dl dd{margin:0;font-weight:600}
.h-dok{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.h-galeri{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}.h-galeri img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:12px}
.h-grid-dok{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:14px}
.h-grid-dok a{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border:1px solid var(--garis);border-radius:14px;text-decoration:none;color:var(--tinta);background:#fff;transition:.15s}
.h-grid-dok a:hover{border-color:var(--hijau-c);box-shadow:0 10px 24px #0b6b4314}.h-grid-dok b{font:700 15.5px/1.3 var(--judul)}.h-grid-dok span{font-size:13.5px;color:var(--abu)}
.h-grid-dok.kontak span{font-size:15px;color:var(--tinta)}
.h-tab{display:flex;gap:6px;flex-wrap:wrap;margin:16px 0 12px}
.h-tab button{border:1px solid var(--garis);background:#fff;border-radius:999px;padding:8px 14px;font:600 14px/1 var(--judul);cursor:pointer;color:var(--tinta)}
.h-tab button small{color:var(--abu);font-weight:600}.h-tab button[aria-selected=true]{background:var(--hijau);border-color:var(--hijau);color:#fff}.h-tab button[aria-selected=true] small{color:#cdeedb}
.h-form{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:8px}
.h-form a{display:block;padding:12px 14px;border-radius:12px;background:var(--latar);text-decoration:none;color:var(--tinta);font-size:14.5px}.h-form a:hover{background:var(--hijau-l);color:var(--hijau)}
.h-tabel{width:100%;border-collapse:collapse;font-size:15px}.h-tabel th,.h-tabel td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--garis)}.h-tabel th{font:700 12.5px/1 var(--judul);letter-spacing:.06em;text-transform:uppercase;color:var(--abu)}
.h-grid-video{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.h-video{position:relative;border:0;padding:0;background:#fff;border-radius:var(--r);overflow:hidden;cursor:pointer;text-align:left;border:1px solid var(--garis);font:inherit;color:inherit}
.h-video img{width:100%;aspect-ratio:16/9;object-fit:cover}.h-video span{position:absolute;left:50%;top:calc(50% - 30px);transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;background:#e00000e6;color:#fff;display:grid;place-items:center;font-size:22px}
.h-video b{display:block;padding:12px 14px;font:700 15px/1.35 var(--judul)}
.dlg-video{padding:12px;display:flex;flex-direction:column;gap:10px;align-items:end}.dlg-video iframe{width:min(860px,calc(100vw - 56px));aspect-ratio:16/9;border:0;border-radius:12px}
dialog:has(.dlg-video){max-width:none;width:auto}
/* beranda: sambutan & video */
.sambutan-ring{display:grid;grid-template-columns:180px 1fr;gap:28px;align-items:center;margin-top:36px;background:var(--latar);border-radius:var(--r);padding:22px}
.sambutan-ring img{width:100%;border-radius:14px;aspect-ratio:1;object-fit:cover;object-position:top}
.sambutan-ring p{margin:6px 0 10px;color:#33443c}
@media (max-width:860px){.h-kartu.dua,.sambutan,.h-fas,.h-detail,.sambutan-ring{grid-template-columns:1fr}.sambutan img{max-width:260px}.h-galeri{grid-template-columns:1fr 1fr}.h-sub{top:70px}}
@media (max-width:640px){.h-kartu{padding:20px}.h-dl{grid-template-columns:1fr}.h-form{grid-template-columns:1fr}}

.dk .jab{display:block;font-size:12.5px;color:var(--hijau);font-weight:600;margin-top:2px}
.video-sek{background:#fff}
a.h-video{text-decoration:none}

/* ===== bilah logo & menu: hijau logo UMB (#16BF68), tulisan putih ===== */
:root{--hijau-logo:#16BF68}
.nav{background:var(--hijau-logo);backdrop-filter:none;border-bottom:1px solid #0fa457;box-shadow:0 2px 10px #0b6b4326}
.merek img{border-radius:0}
.menu a{color:#fff}
.menu a:not(.tbl):hover,.menu a.aktif{background:#ffffff2e;color:#fff}
.menu a.tbl,.menu a.tbl:hover{background:#fff;border-color:#fff;color:var(--hijau-t)}
.menu a.tbl:hover{background:var(--emas);border-color:var(--emas)}
.menu-b{border-color:#ffffff80}
.menu-b span,.menu-b span::before,.menu-b span::after{background:#fff}
@media (max-width:1020px){.menu{background:var(--hijau-logo);border-bottom-color:#0fa457}}
