/*
 * MediaUMKM — penyesuaian tampilan portal berita di atas Blogsy.
 * Murni CSS, tanpa dependensi JavaScript. Memakai custom property
 * bawaan Blogsy (--pt-*) supaya konsisten dengan warna & radius theme.
 */

/* ---------- Gambar utama halaman single artikel (bawaan Blogsy) ----------
   Sebelumnya cuma <img> polos rata sudut — dibulatkan & diberi shadow lembut
   supaya konsisten dengan kartu lain, tanpa override template inti. */

.single-hero-1 > .image-container {
	overflow: hidden;
	border-radius: var(--pt-soft-radius, 12px);
	box-shadow: var(--pt-shadow-soft, 0 4px 25px rgba(37, 37, 46, 0.12));
}

.single-hero-1 > .image-container img {
	display: block;
	width: 100%;
	height: auto;
}

/* ---------- Lead paragraph: paragraf pertama halaman/artikel ---------- */

.single-content-inner > p:first-of-type {
	font-size: 1.8rem;
	line-height: 1.6;
	color: var(--pt-body-color, #282424);
	opacity: 0.85;
}

/* ---------- Jarak seragam untuk block besar di dalam konten ----------
   Margin default block-library WP core berbeda-beda per tipe block —
   disamakan supaya tidak ada section yang tiba-tiba terlalu lapang/padat. */

.single-content-inner > .wp-block-columns,
.single-content-inner > .wp-block-cover,
.single-content-inner > .wp-block-media-text,
.single-content-inner > .wp-block-pullquote {
	margin-top: 2.75rem;
	margin-bottom: 2.75rem;
}

/* Hero halaman Tentang (cover block di konten): selebar container dengan
   sudut membulat, bukan full-bleed selebar layar. */

.single-content-inner > .wp-block-cover.mumkm-page-hero {
	margin-top: 0;
	border-radius: var(--pt-soft-radius, 12px);
	overflow: hidden;
}

/* ---------- Pullquote: rapatkan ----------
   Default WP core memberi padding besar (3em atas-bawah) sehingga terlihat
   seperti kotak kosong besar. Dirapatkan + garis aksen kiri. */

.single-content-inner > .wp-block-pullquote {
	padding: 0;
	text-align: left;
	border-left: 4px solid var(--pt-accent-color, #202f81);
}

.single-content-inner > .wp-block-pullquote blockquote {
	padding: 0.25rem 0 0.25rem 1.5rem;
	margin: 0;
	text-align: left;
}

.single-content-inner > .wp-block-pullquote p {
	font-size: 1.9rem;
	font-style: italic;
	color: var(--pt-headings-color, #29294b);
}

/* ---------- Media-text (core/media-text) ----------
   Blogsy tidak punya styling untuk block ini — baseline radius gambar
   tanpa mengganggu stacking bawaan WP core di layar sempit. */

.wp-block-media-text .wp-block-media-text__media img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--pt-soft-radius, 12px);
}

.wp-block-media-text .wp-block-media-text__content {
	padding: 1.5rem 2rem;
}

/* Kalahkan rule underline theme (.single-content-inner p a) untuk tombol
   core/buttons yang ditulis langsung di konten. */

.single-content-inner .wp-block-buttons .wp-block-button__link {
	text-decoration: none;
}

/* ---------- Tombol: Blogsy tidak punya style dasar .blogsy-btn di
   latar terang (cuma kontekstual di kartu gelap), jadi definisikan di
   sini. Selector kontekstual theme (3 class) tetap menang di kartu gelap. */

a.blogsy-btn,
button.blogsy-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.7rem 1.6rem;
	font-weight: 600;
	font-size: 1.5rem;
	line-height: 1.4;
	color: #fff;
	background-color: var(--pt-accent-color, #216be9);
	border: 1px solid var(--pt-accent-color, #216be9);
	border-radius: var(--pt-btn-radius, 50px);
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}

a.blogsy-btn:hover,
button.blogsy-btn:hover,
a.blogsy-btn:focus,
button.blogsy-btn:focus {
	color: #fff;
	background-color: var(--pt-headings-color, #29294b);
	border-color: var(--pt-headings-color, #29294b);
}

/* ---------- Footer fallback (inc/footer.php, tampil kalau widget area kosong) ---------- */

.mumkm-footer-fallback .mumkm-footer-brand {
	margin: 0 0 0.5rem;
	font-size: 1.8rem;
	font-weight: 700;
}

.mumkm-footer-fallback .mumkm-footer-brand a {
	color: var(--pt-headings-color, #29294b);
	text-decoration: none;
}

.mumkm-footer-fallback .mumkm-footer-brand a:hover {
	color: var(--pt-accent-color, #216be9);
}

.mumkm-footer-fallback .mumkm-footer-text {
	margin: 0;
	font-size: 1em; /* sama dengan teks copyright (mengikuti font body) */
	line-height: var(--pt-body-line-height, 1.6);
	opacity: 0.85;
}

.mumkm-footer-fallback .custom-logo {
	max-width: 180px;
	height: auto;
	margin-bottom: 0.75rem;
}

ul.mumkm-footer-links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
}

ul.mumkm-footer-links a {
	color: var(--pt-body-color, #282424);
	text-decoration: none;
	font-size: 1em;
}

ul.mumkm-footer-links a:hover {
	color: var(--pt-accent-color, #216be9);
	text-decoration: underline;
}

/* ---------- Tombol bagikan (WhatsApp/Facebook/X/Email) ---------- */

.mumkm-share-box {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 2rem;
}

.mumkm-share-label {
	font-size: 1.4rem;
	font-weight: 600;
	color: var(--pt-headings-color, #29294b);
}

.mumkm-share-list {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.mumkm-share-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--pt-body-bg-color, #faf8ff);
	border: 1px solid var(--pt-border-color, #e9e8ff);
	color: var(--pt-headings-color, #29294b);
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.mumkm-share-link:hover,
.mumkm-share-link:focus {
	background: var(--pt-accent-color, #202f81);
	border-color: var(--pt-accent-color, #202f81);
	color: #fff;
}

.mumkm-share-link .dashicons {
	width: 18px;
	height: 18px;
	font-size: 18px;
	line-height: 1;
}

/* ---------- Sidebar sticky ketutup header ----------
   JS bawaan Blogsy menghitung ulang `top` sidebar sticky saat header jadi
   fixed, tapi hasilnya kadang meleset saat scroll cepat. Dipatok dengan
   !important supaya menang dari inline style JS. --mu-sticky-offset =
   perkiraan tinggi header sticky desktop, dihitung dari pengaturan
   Customizer di inc/header.php (termasuk bar kategori kalau ikut sticky).
   Saat admin bar tampil, Blogsy menggeser header sticky 32px (46px di bawah
   782px) lewat margin-top — breakpoint & nilainya disamakan di sini. */

.sidebar-container.sticky .sidebar-container-inner {
	top: calc(var(--mu-sticky-offset, 100px) + 20px) !important;
}

body.admin-bar .sidebar-container.sticky .sidebar-container-inner {
	top: calc(var(--mu-sticky-offset, 100px) + 52px) !important;
}

@media screen and (max-width: 782px) {
	body.admin-bar .sidebar-container.sticky .sidebar-container-inner {
		top: calc(var(--mu-sticky-offset, 100px) + 66px) !important;
	}
}

@media screen and (max-width: 600px) {
	body.admin-bar .sidebar-container.sticky .sidebar-container-inner {
		top: calc(var(--mu-sticky-offset, 100px) + 20px) !important;
	}
}

/* ---------- Kartu artikel "blog-vertical" (Berita, arsip, pencarian) ----------
   Judul (h2) mewarisi ukuran heading artikel penuh — kebesaran untuk kartu.
   Dikecilkan & dirapatkan tanpa menyentuh h2 di tempat lain. */

.blog-vertical .default-post-list-item .content-container .title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	margin: 0 0 0.4rem;
	font-size: 1.7rem;
	line-height: 1.35;
}

/* Waktu baca: info sekunder — kecil, tipis, samar. */
.blog-vertical .default-post-list-item .content-container .meta-details {
	margin: 0 0 0.6rem;
	font-size: 1.25rem;
	font-weight: 400;
	opacity: 0.6;
}

.blog-vertical .default-post-list-item .content-container .meta-details .blogsy-svg-icon svg {
	width: 12px;
	height: 12px;
}

/* Kutipan: ringkasan artikel (Customizer → Excerpt Length = 160 karakter)
   dibatasi 2 baris — mengisi ruang kartu berjudul pendek supaya tinggi
   kartu dalam satu baris grid tidak menyisakan ruang kosong. */
.blog-vertical .default-post-list-item .content-container .excerpt {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	margin: 0;
	font-size: 1.4rem;
	line-height: 1.55;
	opacity: 0.8;
}

/* Kategori + tanggal satu baris di kaki kartu. Ikon kalender dilepas supaya
   muat di kartu ~250px (lebar situs 1200px + sidebar). */
.blog-vertical .default-post-list-item .footer-wrap {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.4rem 0.75rem;
	margin-top: 1.2rem;
}

.blog-vertical .default-post-list-item .footer-wrap .term-item {
	font-size: 1.1rem;
	white-space: nowrap;
}

.blog-vertical .default-post-list-item .footer-meta {
	font-size: 1.25rem;
	white-space: nowrap;
}

.blog-vertical .default-post-list-item .footer-meta .blogsy-svg-icon {
	display: none;
}

/* Grid tanpa masonry: tinggi kartu dalam satu baris otomatis sama (CSS Grid
   `align-items: stretch`); padding & jarak antar-kartu dirapatkan. */

.default-archive-wrap:not(.blog-masonry) {
	row-gap: 1.75rem;
	column-gap: 1.75rem;
}

/* Radius bersarang: radius luar = radius dalam + padding (4px + 8px = 12px),
   supaya lengkung gambar & kartu sejajar (konsentris). */
.default-archive-wrap:not(.blog-masonry) .default-post-list-item.card-layout {
	padding: 8px;
	border-radius: 12px;
}

.default-archive-wrap .default-post-list-item .image-container,
.default-archive-wrap .default-post-list-item .image-container img {
	border-radius: 4px;
}

.default-archive-wrap .default-post-list-item .content-container {
	padding-left: 4px;
	padding-right: 4px;
}

/* ---------- Index Berita: tanpa judul/breadcrumb ----------
   Wadah breadcrumb kosong di index Berita (body.blog = is_home()) tidak diberi
   jarak; jarak ke navbar diatur lewat .page-content-wrapper. */

body.blog .mumkm-archive-crumb {
	margin: 0;
}

body.blog .page-content-wrapper {
	margin-top: 2.5rem;
}

/* ==========================================================================
   Halaman Tentang & Kontak — pola block yang dipakai di konten halaman
   (className diisi langsung di block editor, jadi tetap bisa diedit admin).
   ========================================================================== */

/* Tautan kartu di bawah tidak ikut underline bawaan theme. Selektor theme
   (`.single-content-inner p:not([class*="wp-elements"]) a:not(.button, ...)`)
   bobotnya (0,3,2) karena dua :not() — `body` + `p.class` + `a:not()` di
   sini menaikkan bobot jadi (0,3,3) supaya menang tanpa !important. */
body .single-content-inner p.mumkm-contact-value a:not(.button),
body .single-content-inner p.mumkm-contact-note a:not(.button) {
	text-decoration: none;
}

/* ---------- Tentang: pola umum (kicker, judul section) ----------
   Warna mengikuti logo: navy #202f81, cyan #0ccde0, kuning #f7b40b,
   merah #e93314. Ilustrasi ada di Media Library (sumber SVG: docs/ilustrasi/). */

.single-content-inner p.mumkm-kicker {
	margin: 0 0 0.75rem;
	font-family: Poppins, sans-serif;
	font-size: 1.3rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #e93314;
	opacity: 1;
}

.single-content-inner > h2.mumkm-section-title {
	margin: 0 0 0.5rem;
	font-size: 3.2rem;
	line-height: 1.25;
}

/* Kalahkan style "lead paragraph" (p:first-of-type) untuk deskripsi section. */
.single-content-inner > p.mumkm-section-desc {
	margin: 0;
	font-size: 1.6rem;
	opacity: 0.75;
}

/* ---------- Hero navy + ilustrasi (Tentang & Kontak) ---------- */

.single-content-inner > .mumkm-hero {
	position: relative;
	overflow: hidden;
	margin: 0 0 3rem;
	padding: 3.5rem 3.5rem 2rem;
	background: #202f81;
	border-radius: 12px;
	color: #fff;
}

.single-content-inner > .mumkm-hero::before {
	content: "";
	position: absolute;
	top: -120px;
	left: -120px;
	width: 320px;
	height: 320px;
	border: 40px solid rgba(12, 205, 224, 0.12);
	border-radius: 50%;
	pointer-events: none;
}

.mumkm-hero .wp-block-columns {
	position: relative;
	gap: 2.5rem;
	margin: 0;
}

.mumkm-hero p.mumkm-kicker {
	color: #0ccde0;
}

.mumkm-hero h1 {
	margin: 0 0 1.25rem;
	font-size: 4.6rem;
	line-height: 1.15;
	color: #fff;
}

.mumkm-hero p {
	max-width: 56ch;
	font-size: 1.7rem;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.85);
}

.mumkm-hero .wp-block-buttons {
	gap: 0.75rem;
	margin-top: 1.75rem;
}

.single-content-inner .mumkm-hero .wp-block-button__link {
	padding: 0.9rem 1.8rem;
	font-size: 1.5rem;
	font-weight: 600;
	color: #29294b;
	background: #f7b40b;
	border: 2px solid #f7b40b;
	border-radius: 50px;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.single-content-inner .mumkm-hero .wp-block-button__link:hover {
	background: #fff;
	border-color: #fff;
}

.single-content-inner .mumkm-hero .is-style-outline .wp-block-button__link {
	color: #fff;
	background: transparent;
	border-color: rgba(255, 255, 255, 0.5);
}

.single-content-inner .mumkm-hero .is-style-outline .wp-block-button__link:hover {
	color: #202f81;
	background: #fff;
	border-color: #fff;
}

.mumkm-hero .wp-block-image {
	margin: 0;
}

.mumkm-hero .wp-block-image img {
	display: block;
	width: 100%;
	height: auto;
}

/* ---------- Tentang: siapa kami (ilustrasi + cerita) ---------- */

.single-content-inner > .mumkm-about-story {
	gap: 0;
	margin: 0 0 3rem;
	background: #eef1ff;
	border-radius: 12px;
	overflow: hidden;
}

.mumkm-about-story .wp-block-media-text__media img {
	border-radius: 0;
}

.mumkm-about-story .wp-block-media-text__content {
	padding: 2.5rem 3rem;
}

.mumkm-about-story h2 {
	margin: 0 0 1rem;
	font-size: 3.2rem;
	line-height: 1.25;
}

.mumkm-about-story p:not(.mumkm-kicker) {
	font-size: 1.6rem;
	line-height: 1.75;
}

/* ---------- Tentang: topik liputan (block Daftar Kategori, dinamis) ----------
   core/categories otomatis mengikuti kategori yang ada (kategori kosong
   disembunyikan); ditampilkan sebagai chip yang membungkus ke baris berikutnya. */

.single-content-inner > ul.mumkm-topic-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin: 1.5rem 0 3rem;
	padding: 0;
	list-style: none;
}

.mumkm-topic-chips li {
	margin: 0;
}

.single-content-inner .mumkm-topic-chips li a {
	display: inline-block;
	padding: 0.8rem 1.6rem;
	font-family: Poppins, sans-serif;
	font-size: 1.5rem;
	font-weight: 600;
	color: var(--pt-headings-color, #29294b);
	background: var(--pt-card-bg, #fff);
	border: 1px solid var(--pt-border-color, #e9e8ff);
	border-radius: 8px;
	text-decoration: none;
	transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.single-content-inner .mumkm-topic-chips li a:hover,
.single-content-inner .mumkm-topic-chips li a:focus {
	color: #fff;
	background: #202f81;
	border-color: #202f81;
}

/* ---------- Tentang: komitmen redaksi (band navy) ---------- */

.single-content-inner > .mumkm-principles-band {
	margin: 0 0 3rem;
	padding: 3rem 3rem 2.5rem;
	background: #29294b;
	border-radius: 12px;
	color: #fff;
}

.mumkm-principles-band p.mumkm-kicker {
	color: #f7b40b;
}

.mumkm-principles-band > h2 {
	margin: 0 0 2rem;
	font-size: 3.2rem;
	color: #fff;
}

.mumkm-principles-band .mumkm-principles {
	gap: 2rem;
	margin: 0;
}

.mumkm-principles .wp-block-column {
	padding-top: 1.25rem;
	border-top: 2px solid rgba(255, 255, 255, 0.15);
}

.single-content-inner .mumkm-principles p.mumkm-num {
	margin: 0 0 0.5rem;
	font-family: Poppins, sans-serif;
	font-size: 4rem;
	font-weight: 700;
	line-height: 1;
	color: #0ccde0;
}

.mumkm-principles h3 {
	margin: 0 0 0.5rem;
	font-size: 2rem;
	color: #fff;
}

.mumkm-principles p {
	margin: 0;
	font-size: 1.5rem;
	line-height: 1.65;
	color: rgba(255, 255, 255, 0.78);
}

/* ---------- Bar ajakan ke Kontak (band kuning) ---------- */

.single-content-inner > .mumkm-contact-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1.25rem;
	margin-top: 0;
	padding: 2.25rem 3rem;
	background: #f7b40b;
	border-radius: 12px;
}

.mumkm-contact-bar p {
	margin: 0;
	font-family: Poppins, sans-serif;
	font-size: 2.2rem;
	font-weight: 700;
	line-height: 1.3;
	color: #29294b;
}

.mumkm-contact-bar .wp-block-buttons {
	margin: 0;
}

.single-content-inner .mumkm-contact-bar .wp-block-button__link {
	padding: 0.9rem 1.8rem;
	font-weight: 600;
	color: #fff;
	background: #29294b;
	border-radius: 50px;
}

.single-content-inner .mumkm-contact-bar .wp-block-button__link:hover {
	background: #202f81;
}

@media (max-width: 781px) {
	.single-content-inner > .mumkm-hero {
		padding: 2.5rem 1.75rem 1.5rem;
	}

	.mumkm-hero h1 {
		font-size: 3.2rem;
	}

	.mumkm-hero p {
		font-size: 1.6rem;
	}

	.mumkm-about-story .wp-block-media-text__content {
		padding: 2rem 1.75rem;
	}

	.single-content-inner > h2.mumkm-section-title,
	.mumkm-about-story h2,
	.mumkm-principles-band > h2 {
		font-size: 2.5rem;
	}

	.single-content-inner > .mumkm-principles-band {
		padding: 2.25rem 1.75rem;
	}

	.single-content-inner > .mumkm-contact-bar {
		padding: 2rem 1.75rem;
	}

	.mumkm-contact-bar p {
		font-size: 1.9rem;
	}
}

/* ---------- Kontak: kartu Email / WhatsApp / Alamat ----------
   Pola sama dengan kartu topik di Tentang: kotak ikon berwarna, border 2px. */

.single-content-inner > .mumkm-contact-cards {
	gap: 1.25rem;
	margin: 0 0 1.25rem;
}

.mumkm-contact-cards .wp-block-column {
	--mumkm-card-color: #202f81;
	padding: 1.75rem;
	background: var(--pt-card-bg, #fff);
	border: 2px solid var(--pt-border-color, #e9e8ff);
	border-radius: 8px;
	transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.mumkm-contact-cards .wp-block-column:nth-child(2) { --mumkm-card-color: #0a9fb0; }
.mumkm-contact-cards .wp-block-column:nth-child(3) { --mumkm-card-color: #e93314; }

.mumkm-contact-cards .wp-block-column:hover {
	border-color: var(--mumkm-card-color);
	box-shadow: 0 10px 24px rgba(32, 47, 129, 0.12);
	transform: translateY(-3px);
}

.mumkm-contact-cards h3 {
	margin: 0 0 0.35rem;
	font-size: 1.8rem;
}

.mumkm-contact-cards p {
	margin: 0;
}

.single-content-inner .mumkm-contact-icon {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	margin: 0 0 1rem;
	background: var(--mumkm-card-color, #202f81);
	border-radius: 6px;
	color: #fff;
}

.mumkm-contact-icon .dashicons {
	width: 24px;
	height: 24px;
	font-size: 24px;
}

.mumkm-contact-value {
	font-size: 1.6rem;
	font-weight: 600;
	word-break: break-word;
	color: var(--pt-headings-color, #29294b);
}

.mumkm-contact-value a {
	color: var(--mumkm-card-color, #202f81);
}

.mumkm-contact-note {
	margin-top: 0.25rem;
	font-size: 1.35rem;
	opacity: 0.7;
}

.mumkm-contact-note a {
	color: var(--pt-accent-color, #202f81);
	font-weight: 600;
}

/* ---------- Kontak: panel redaksi (gelap) + rilis (biru muda) + peta ---------- */

.single-content-inner > .mumkm-contact-detail {
	align-items: stretch;
	gap: 1.25rem;
	margin: 0;
}

.mumkm-contact-panel {
	margin-bottom: 1.25rem;
	padding: 2rem;
	background: #eef1ff;
	border-radius: 12px;
}

.mumkm-contact-panel:last-child {
	margin-bottom: 0;
}

.mumkm-contact-panel p {
	margin: 0 0 0.75rem;
}

.mumkm-contact-panel ul {
	margin: 0 0 0.75rem;
	padding-left: 1.25rem;
	font-size: 1.5rem;
	line-height: 1.8;
}

.mumkm-contact-panel.is-dark {
	background: #29294b;
	color: #fff;
}

.mumkm-contact-panel.is-dark p.mumkm-kicker {
	color: #f7b40b;
}

.mumkm-contact-panel.is-dark p:not(.mumkm-kicker) {
	font-family: Poppins, sans-serif;
	font-size: 1.7rem;
	font-weight: 600;
	color: #fff;
}

.mumkm-panel-label {
	display: block;
	font-family: var(--pt-body-font, Inter), sans-serif;
	font-size: 1.2rem;
	font-weight: 400;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	opacity: 0.6;
}

.mumkm-map {
	overflow: hidden;
	border: 2px solid var(--pt-border-color, #e9e8ff);
	border-radius: 12px;
}

.mumkm-map iframe {
	display: block;
	width: 100%;
	height: 440px;
	border: 0;
}

@media (max-width: 781px) {
	.mumkm-contact-panel {
		padding: 1.75rem;
	}

	.mumkm-map iframe {
		height: 300px;
	}
}

/* ---------- "Artikel Lainnya" di bawah artikel ----------
   Override template-parts/post/next-prev-posts.php: grid 3 kartu
   (kategori sama → dilengkapi artikel terbaru), bukan Sebelumnya/Selanjutnya.
   Desktop 3 kolom, tablet 2 kolom, HP daftar (gambar kiri, judul kanan). */

.mumkm-related-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.75rem;
	margin-top: 1.5rem;
}

.mumkm-related-item {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.mumkm-related-thumb {
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 10;
	border-radius: var(--pt-soft-radius, 12px);
	background: var(--pt-border-color, #e9e8ff);
}

.mumkm-related-thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.mumkm-related-item:hover .mumkm-related-thumb img {
	transform: scale(1.04);
}

.mumkm-related-body {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding-top: 1rem;
}

.mumkm-related-cat {
	font-size: 1.2rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--term-color, #e93314);
}

.mumkm-related-title {
	margin: 0;
	font-size: 1.6rem;
	line-height: 1.4;
}

.mumkm-related-title a {
	color: var(--pt-headings-color, #1a1a2e);
}

.mumkm-related-title a:hover {
	color: var(--pt-accent-color, #1e2a78);
}

.mumkm-related-date {
	font-size: 1.3rem;
	opacity: 0.65;
}

@media (max-width: 991px) {
	.mumkm-related-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.mumkm-related-grid .mumkm-related-item:nth-child(3) {
		display: none;
	}
}

@media (max-width: 600px) {
	.mumkm-related-grid {
		grid-template-columns: 1fr;
		gap: 1.25rem;
	}

	.mumkm-related-grid .mumkm-related-item:nth-child(3) {
		display: flex;
	}

	.mumkm-related-item {
		flex-direction: row;
		gap: 1.25rem;
	}

	.mumkm-related-thumb {
		flex: 0 0 110px;
		aspect-ratio: 1 / 1;
	}

	.mumkm-related-body {
		padding-top: 0;
	}

	.mumkm-related-title {
		font-size: 1.5rem;
	}
}

/* ==========================================================================
   Standar gaya seluruh situs — mengikuti bahasa visual halaman Tentang
   (warna logo, sudut 8/12px, aksen merah, band navy). Warna kategori,
   footer gelap & tombol pill diatur di Customizer, bukan di sini.
   ========================================================================== */

:root {
	--pt-soft-radius: 8px;
}

/* Judul bagian/widget (titik + garis Blogsy): aksen merah seperti label
   "kicker" di Tentang/Kontak. */
.blogsy-divider-heading {
	--divider-color: #e93314;
}

/* ---------- Arsip kategori/tag/pencarian: breadcrumb Rank Math ----------
   Menggantikan blok judul besar Blogsy (template-parts/archive/archive-title.php
   di child theme). */

.mumkm-archive-crumb {
	margin: 2.5rem 0 1.5rem;
}

.mumkm-archive-crumb .rank-math-breadcrumb p {
	margin: 0;
	font-size: 1.4rem;
	line-height: 1.5;
	color: var(--pt-body-color, #282424);
}

.mumkm-archive-crumb .rank-math-breadcrumb a {
	color: var(--pt-body-color, #282424);
	opacity: 0.7;
	text-decoration: none;
}

.mumkm-archive-crumb .rank-math-breadcrumb a:hover {
	color: var(--pt-accent-color, #202f81);
	opacity: 1;
}

.mumkm-archive-crumb .rank-math-breadcrumb .separator {
	opacity: 0.4;
}

.mumkm-archive-crumb .rank-math-breadcrumb .last {
	font-weight: 600;
	color: var(--pt-headings-color, #29294b);
}

/* ---------- Kartu artikel: angkat + bayangan saat hover (border tetap) ---------- */

.default-archive-wrap .default-post-list-item.card-layout {
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.default-archive-wrap .default-post-list-item.card-layout:hover {
	box-shadow: 0 10px 24px rgba(32, 47, 129, 0.12);
	transform: translateY(-3px);
}

/* ---------- Footer gelap (warna dasar dari Customizer) ---------- */

.site-default-footer .blogsy-divider-heading {
	--divider-color: #f7b40b;
}

.site-default-footer .blogsy-divider-heading.divider-style-12 .divider-3 {
	--divider-color-2: rgba(255, 255, 255, 0.15);
}

body .site-default-footer .blogsy-divider-heading .title {
	color: #fff;
}

.site-default-footer ul.mumkm-footer-links a {
	color: #fff;
}

.site-default-footer ul.mumkm-footer-links a:hover {
	color: #f7b40b;
	text-decoration: none;
}

/* Logo berwarna navy tidak terbaca di latar gelap → diberi alas putih.
   Logo footer ada di widget Custom HTML (Footer 1) atau custom-logo
   (fallback inc/footer.php). */
.site-default-footer .custom-html-widget > p:first-child a img,
.site-default-footer .custom-logo {
	box-sizing: content-box;
	padding: 10px 14px;
	background: #fff;
	border-radius: 6px;
}

/* ==========================================================================
   Hero Beranda (Blogsy "hero three": Terbaru | Berita Utama | Trending)
   ========================================================================== */

/* Carousel Trending punya tinggi tetap (496px / 4 slide ≈ 108px per item).
   Judul panjang + tanggal + komentar melebihi tinggi itu sehingga item saling
   menimpa. Judul dibatasi 3 baris dan jumlah komentar disembunyikan (sama
   dengan kartu arsip yang juga tanpa info komentar). */
#blogsy-hero .mini-layout .comments-wrapper {
	display: none;
}

#blogsy-hero .mini-layout .title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

/* Tablet & laptop kecil: 3 kolom 25/50/25 terlalu sempit untuk kolom samping.
   Berita Utama dipindah ke atas selebar penuh, Terbaru & Trending berdampingan
   di bawahnya. Di HP (<768px) semua kolom 100%, Berita Utama tetap paling atas. */
@media (max-width: 1199px) {
	#blogsy-hero .pt-hero-type-three > .pt-row > .pt-col-md-6 {
		order: -1;
	}
}

@media (min-width: 768px) and (max-width: 1199px) {
	#blogsy-hero .pt-hero-type-three > .pt-row > .pt-col-md-6 {
		flex-basis: 100%;
		max-width: 100%;
	}

	#blogsy-hero .pt-hero-type-three > .pt-row > .pt-col-md-3 {
		flex-basis: 50%;
		max-width: 50%;
	}
}

/* Top Stories: grid 5 kolom mulai 768px membuat kartu terlalu sempit di
   tablet (kata terpotong di tengah). Pakai pola bawaan Blogsy untuk HP:
   deretan kartu yang bisa digeser ke samping. */
@media (min-width: 768px) and (max-width: 1199px) {
	.blogsy-stories-box.swiper:not(.swiper-initialized) .swiper-wrapper {
		display: flex;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.blogsy-stories-box.swiper:not(.swiper-initialized) .swiper-wrapper::-webkit-scrollbar {
		display: none;
	}

	.blogsy-stories-box.swiper:not(.swiper-initialized) .swiper-wrapper .stories-popup__slide {
		flex: 0 0 auto;
		width: 26rem;
	}
}

/* HP: thumbnail daftar Terbaru/Trending melebar mengikuti layar dan jadi
   lebih tinggi dari slot slide Trending (~108px) → dikunci 80px. */
@media (max-width: 767px) {
	#blogsy-hero .mini-layout .image-outer-wrapper {
		flex: 0 0 80px;
		width: 80px;
		max-width: 80px;
	}

	#blogsy-hero .mini-layout .image-wrapper,
	#blogsy-hero .mini-layout .image-wrapper img {
		width: 80px;
		height: 80px;
		padding: 0;
		object-fit: cover;
	}
}

/* ---------- Badge di atas foto (Top Stories, Berita Utama, Artikel Pilihan) ----------
   Badge jumlah story ("1 STORY") tidak informatif → disembunyikan.
   Badge kategori: Blogsy memakai versi pucat warna kategori sebagai latar
   (--term-80-color) sehingga jadi pill warna-warni yang ramai di atas foto →
   dikembalikan ke gaya netral (transparan putih, teks putih, sudut kecil). */

.blogsy-stories .term-item.story-count {
	display: none;
}

.blogsy-post-nexo-widget .term-item,
.peony-slider .term-item {
	color: #fff;
	background-color: rgba(255, 255, 255, 0.18);
	border-radius: 4px;
}

.blogsy-post-nexo-widget .term-item:hover,
.blogsy-post-nexo-widget .term-item:focus,
.peony-slider .term-item:hover,
.peony-slider .term-item:focus {
	color: #fff;
	background-color: rgba(255, 255, 255, 0.32);
}

/* ---------- Lebar situs 1200px (Customizer → Site Width) ----------
   Blogsy News sengaja melebarkan "Artikel Pilihan" (PYML) hampir selebar
   layar (clamp(1400px, 100vw, 93%)); dikunci ke lebar situs supaya sejajar
   dengan bagian lain. */

.blogsy_news #blogsy-pyml .pt-container,
.blogsy_news #blogsy-pyml .blogsy-posts-container {
	max-width: var(--pt-site-width, 1200px);
	margin-left: auto;
	margin-right: auto;
}

/* ---------- Navbar & bar kategori ----------
   Nilai --mu-* diatur di Customizer (Identitas Situs → Tinggi Logo, Header →
   Tinggi Navbar / Tinggi Navbar Sticky), dikeluarkan inline oleh
   inc/header.php. Tinggi navbar = min-height baris utama header, untuk semua
   Prebuilt Header (1–3: satu baris; 4: baris logo — baris menu di bawahnya
   tetap bawaan). Padding, margin logo & min-height bawaan Blogsy dinolkan
   supaya pengaturan itu yang menentukan. */

#site-header .pt-header .pt-header-inner,
#site-sticky-header .pt-header-inner {
	padding-top: 0;
	padding-bottom: 0;
}

#site-header .pt-header-inner > .pt-header-container,
#site-header .pt-logo-container .pt-header-container {
	min-height: var(--mu-header-h, 84px);
	padding-top: 0;
	padding-bottom: 0;
	align-items: center;
}

/* Header 3 ("pil" berbingkai) punya padding sendiri dengan selector lebih
   spesifik. */
.pt-header-layout-3 #site-header .pt-header-inner > .pt-header-container {
	padding-top: 0;
	padding-bottom: 0;
}

#site-sticky-header .pt-header-inner > .pt-header-container {
	min-height: var(--mu-sticky-h, 60px);
	align-items: center;
}

#site-header .pt-logo .logo-inner,
#site-sticky-header .pt-logo .logo-inner {
	margin: 0;
}

#site-header .pt-logo img {
	max-height: var(--mu-logo-h, 60px);
}

/* Logo sticky mengikuti tinggi navbar sticky (sisakan ruang 7px atas-bawah),
   tapi tidak lebih besar dari logo normal. */
#site-sticky-header .pt-logo img {
	max-height: min(var(--mu-logo-h, 60px), calc(var(--mu-sticky-h, 60px) - 14px));
}

/* Logo di panel menu hamburger (offcanvas). */
#site-header .offcanvas-content .pt-logo img,
#site-sticky-header .offcanvas-content .pt-logo img {
	max-height: var(--mu-logo-offcanvas-h, 56px);
}

/* Header 1 (desktop): Blogsy menampilkan "kartu" putih + bayangan saat
   header di-hover. Dimatikan; warna latar (Customizer → Header →
   Background) dipasang penuh selebar layar supaya menyatu dengan bar
   kategori & header sticky. */
@media screen and (min-width: 1025px) {
	.pt-header-layout-1 #site-header .pt-header-inner .pt-header-container::after {
		display: none;
	}

	.pt-header-layout-1 #site-header .pt-header-inner .pt-header-container:hover {
		box-shadow: none;
	}

	html:not([scheme="dark"]) .pt-header-layout-1 #site-header .pt-header-inner {
		background-color: var(--mu-header-bg, #fff);
	}
}

/* Bar kategori: satu baris, bisa digeser horizontal kalau tidak muat
   (mobile), seperti navigasi rubrik portal berita. */
.mu-catbar {
	background: #fff;
	border-top: 1px solid var(--pt-border-color, #e9e9f0);
	border-bottom: 1px solid var(--pt-border-color, #e9e9f0);
}

.mu-catbar__list {
	display: flex;
	gap: 0 28px;
	margin: 0;
	padding: 0;
	list-style: none;
	overflow-x: auto;
	white-space: nowrap;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.mu-catbar__list::-webkit-scrollbar {
	display: none;
}

.mu-catbar__list > li {
	flex: 0 0 auto;
	margin: 0;
}

.mu-catbar__list a {
	position: relative;
	display: block;
	padding: 12px 0;
	font-family: Poppins, sans-serif;
	font-size: 13px;
	font-weight: 600;
	line-height: 20px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	color: #29294b;
	transition: color 0.2s;
}

.mu-catbar__list a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 3px;
	background: #f7b40b;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.2s;
}

.mu-catbar__list a:hover,
.mu-catbar__list a:focus-visible,
.mu-catbar__list .current-menu-item > a {
	color: var(--pt-accent-color, #202f81);
}

.mu-catbar__list a:hover::after,
.mu-catbar__list a:focus-visible::after,
.mu-catbar__list .current-menu-item > a::after {
	transform: scaleX(1);
}

@media (max-width: 600px) {
	.mu-catbar__list {
		gap: 0 22px;
	}

	.mu-catbar__list a {
		padding: 10px 0;
		font-size: 12px;
	}
}

html[scheme="dark"] .mu-catbar {
	background: var(--pt-body-bg-color);
}

html[scheme="dark"] .mu-catbar__list a {
	color: var(--pt-headings-color);
}

/* ---------- Footer: kolom rapi ----------
   Semua daftar tautan rata kiri sejajar judul, tanpa bullet, jarak sama.
   Blogsy menyisipkan "-" tak terlihat (efek hover) sebelum tautan menu
   yang tetap memakan ±7px, jadi disembunyikan di footer. */
.site-default-footer #blogsy-footer-widgets {
	padding-bottom: 32px;
}

.site-default-footer .blogsy-footer-column ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-default-footer .blogsy-footer-column li {
	margin: 0 0 10px;
	padding: 0;
	border: 0;
}

.site-default-footer .blogsy-footer-column li:last-child {
	margin-bottom: 0;
}

.site-default-footer .blogsy-footer-column li > a::before {
	display: none !important;
}

.site-default-footer .blogsy-footer-column li.current-menu-item > a {
	font-weight: inherit;
	color: #f7b40b;
}

/* Kolom bertumpuk di layar kecil (pt-col-12 → pt-col-md-*) butuh jarak. */
@media (max-width: 767px) {
	.site-default-footer .blogsy-footer-column + .blogsy-footer-column {
		margin-top: 28px;
	}
}

/* Kolom "Kontak Redaksi" (widget Custom HTML Footer 3): ikon + teks. */
.site-default-footer .mumkm-footer-contact li {
	display: flex;
	gap: 10px;
	line-height: 1.6;
}

.site-default-footer .mumkm-footer-contact .dashicons {
	flex: 0 0 auto;
	margin-top: 3px;
	font-size: 18px;
	width: 18px;
	height: 18px;
	color: #f7b40b;
}

/* ---------- Baris tautan redaksi di footer (inc/footer.php) ----------
   Redaksi, Kode Etik, Pedoman Media Siber, dst. dari lokasi menu
   "Menu Footer", di atas copyright. */
.mumkm-footer-menu {
	border-top: 1px solid #54546f;
	padding: 16px 0;
}

.mumkm-footer-menu__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.mumkm-footer-menu__list li {
	margin: 0;
}

.site-default-footer .mumkm-footer-menu__list a {
	font-family: Poppins, sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	text-decoration: none;
}

@media (max-width: 600px) {
	.mumkm-footer-menu__list {
		gap: 6px 18px;
	}

	.site-default-footer .mumkm-footer-menu__list a {
		font-size: 13px;
	}
}

/* ---------- Tampilan kosong: pencarian tanpa hasil, arsip kosong, 404
   (template-parts/nothing-found.php) ---------- */
.mumkm-empty {
	max-width: 480px;
	margin: 24px auto 40px;
	padding: 40px 24px;
	text-align: center;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 2px 5px rgba(14, 14, 19, 0.05);
}

.mumkm-empty__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 80px;
	height: 80px;
	margin-bottom: 16px;
	border-radius: 50%;
	color: var(--pt-accent-color, #202f81);
	background: var(--pt-accent-80-color, #d3d6e6);
}

.mumkm-empty__eyebrow {
	margin: 0 0 4px;
	font-family: Poppins, sans-serif;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: #e93314;
}

.mumkm-empty__title {
	margin: 0 0 8px;
	font-size: 2.2rem;
}

.mumkm-empty__text {
	margin: 0 0 20px;
	color: #6b6b85;
}

.mumkm-empty__search {
	margin-bottom: 16px;
	text-align: left;
}

.mumkm-empty__home {
	display: inline-block;
	padding: 10px 22px;
	border-radius: 999px;
	font-weight: 600;
	font-size: 14px;
	color: #fff;
	background: var(--pt-accent-color, #202f81);
	text-decoration: none;
}

.mumkm-empty__home:hover,
.mumkm-empty__home:focus {
	color: #fff;
	background: #e93314;
}

html[scheme="dark"] .mumkm-empty {
	background: var(--pt-body-bg-color);
}

/* ---------- Sidebar ringkas ----------
   Kategori jadi "chip" berjajar (8 baris → ±3 baris) supaya sidebar
   sticky tetap muat di layar bersama Berita Terpopuler. */
.sidebar-container .widget_categories ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Garis pemisah antar-item dari Blogsy memakai selector sangat spesifik
   (:not() berlapis), jadi dinolkan dengan !important. */
.sidebar-container .widget_categories li {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

.sidebar-container .widget_categories li a {
	display: inline-block;
	padding: 5px 12px;
	border: 1px solid var(--pt-border-color, #e5e5ee);
	border-radius: 999px;
	font-size: 13px;
	line-height: 1.5;
	color: #29294b;
	text-decoration: none;
	transition: color 0.2s, background-color 0.2s, border-color 0.2s;
}

.sidebar-container .widget_categories li a:hover,
.sidebar-container .widget_categories li.current-cat > a {
	color: #fff;
	background: var(--pt-accent-color, #202f81);
	border-color: var(--pt-accent-color, #202f81);
}

.sidebar-container .widget_categories li a::before {
	display: none;
}

/* Sidebar (cari + kategori + terpopuler) ±850px. Sticky bawaan Blogsy
   (position: sticky) membuat bagian bawahnya terpotong kalau lebih tinggi
   dari layar, jadi di layar pendek sidebar ikut scroll biasa. */
@media (max-height: 980px) {
	.sidebar-container.sticky .sidebar-container-inner {
		position: static;
	}
}

/* Berita Terpopuler (inc/widgets.php). */
.mumkm-popular__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.mumkm-popular__item {
	display: flex;
	gap: 12px;
	margin: 0;
	padding: 10px 0;
	border-bottom: 1px dashed var(--pt-border-color, #e5e5ee);
}

.mumkm-popular__item:first-child {
	padding-top: 0;
}

.mumkm-popular__item:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.mumkm-popular__icon {
	flex: 0 0 auto;
	color: #e93314;
	line-height: 0;
	padding-top: 2px;
}

.mumkm-popular__title {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-family: Poppins, sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.45;
	color: #29294b;
	text-decoration: none;
}

.mumkm-popular__title:hover {
	color: var(--pt-accent-color, #202f81);
}

.mumkm-popular__time {
	display: block;
	margin-top: 2px;
	font-size: 12px;
	color: #8a8aa0;
}

/* ---------- Header mobile: widget cari & panel menu hamburger ----------
   Di ponsel, widget cari (Customizer → Header → Header Widgets) terlalu
   lebar sehingga hamburger turun ke baris kedua. Disembunyikan di ≤767px;
   form cari pindah ke panel menu hamburger
   (template-parts/header/mobile-navigation.php). */
@media (max-width: 767px) {
	#site-header .pt-header-widgets .pt-header-widget__search,
	#site-sticky-header .pt-header-widgets .pt-header-widget__search {
		display: none !important;
	}
}

@media (min-width: 768px) {
	.mumkm-offcanvas-search {
		display: none;
	}
}

/* Gaya panel Blogsy hanya berlaku di .pt-header (header utama); panel yang
   dibuka dari header sticky tidak kebagian padding/jarak. Disamakan. */
#site-sticky-header .blogsy-offcanvas .offcanvas-container-inner {
	height: 100%;
}

#site-sticky-header .blogsy-offcanvas .offcanvas-content {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 60px 25px;
}

#site-header .blogsy-offcanvas .offcanvas-content,
#site-sticky-header .blogsy-offcanvas .offcanvas-content {
	gap: 28px;
}

#site-sticky-header .blogsy-offcanvas .offcanvas-content .pt-logo {
	flex: unset;
	margin: 0;
}

#site-sticky-header .blogsy-header-v-nav-wrapper ul > li {
	margin: 6px 0;
}

/* Beranda: daftar berita bergaya list (bukan card) */
.mu-news-list {
	margin: 0 auto 40px;
}

.mu-news-list__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 40px;
	align-items: start;
}

.mu-news-list__aside-sticky {
	position: sticky;
	top: 110px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

@media (max-width: 991px) {
	.mu-news-list__layout {
		grid-template-columns: 1fr;
	}

	.mu-news-list__aside-sticky {
		position: static;
	}
}

.mu-news-list__header {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	border-bottom: 2px solid var(--pt-border-color, #e5e5e5);
	padding-bottom: 10px;
	margin-bottom: 4px;
}

.mu-news-list__title {
	font-size: 22px;
	font-weight: 700;
	margin: 0;
}

.mu-news-list__more {
	font-size: 14px;
	white-space: nowrap;
}

.mu-news-list__item {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	padding: 16px 0;
	border-bottom: 1px solid var(--pt-border-color, #eeeeee);
}

.mu-news-list__thumb {
	flex: 0 0 120px;
}

.mu-news-list__thumb img {
	width: 120px;
	height: 90px;
	object-fit: cover;
	border-radius: 8px;
	display: block;
}

.mu-news-list__cat {
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
}

.mu-news-list__headline {
	margin: 4px 0 6px;
	font-size: 17px;
	line-height: 1.4;
}

.mu-news-list__excerpt {
	margin: 0 0 6px;
	font-size: 14px;
	color: #555;
}

.mu-news-list__date {
	font-size: 12px;
	color: #888;
}

.mu-news-list__ad {
	padding: 12px 0;
	border-bottom: 1px solid var(--pt-border-color, #eeeeee);
	text-align: center;
}

@media (max-width: 767px) {
	.mu-news-list__item {
		flex-direction: column;
	}

	.mu-news-list__thumb,
	.mu-news-list__thumb img {
		width: 100%;
		height: auto;
		flex: 1 1 auto;
	}
}

/* Sidebar: widget iklan langsung tanpa kotak putih */
#ai_widget-1.card-layout-w,
#custom_html-5.card-layout-w {
	background: transparent;
	padding: 0;
	border: 0;
	box-shadow: none;
	border-radius: 0;
}


/* Banner atas (before_header/after_header): pembungkus selebar layar
   (#site-inner itu flex column, jadi tanpa align-self pembungkus menyusut
   selebar gambar), gambar di tengah dengan ukuran asli dan mengecil di
   layar sempit. Pembungkus selebar layar juga perlu supaya latar solid
   banner bawah navbar menutupi banner atas yang "diam" (.mu-ad-pinned). */
.mu-ad-fill {
	align-self: stretch;
	padding: 12px 1.5rem;
}

.mu-ad-fill + #blogsy-ticker .blogsy-ticker {
	padding-top: 0;
}

.mu-ad-fill img {
	display: block;
	max-width: 100%;
	height: auto;
	margin-right: auto;
	margin-left: auto;
}

/* Iklan di bawah kotak konten halaman informasi (page.php, area
   "after_post_content"): diberi jarak dari kartu, rata tengah. */
.mu-page-bottom-ad {
	margin-top: 24px;
	text-align: center;
}

.mu-page-bottom-ad .blogsy-banner img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

/* Banner paling atas (before_header) diam di tempat seperti latar: header
   dan konten di bawahnya naik menutupinya saat di-scroll, lalu banner tidak
   muncul lagi sampai kembali ke atas. Elemen sesudahnya diberi lapisan lebih
   tinggi + latar solid (:where supaya latar bawaan seperti footer tetap menang). */
#site-inner > .mu-ad-pinned {
	position: sticky;
	top: 0;
	z-index: 0;
}

.admin-bar #site-inner > .mu-ad-pinned {
	top: 32px;
}

:where(#site-inner > .mu-ad-pinned ~ :not(#site-header, #site-sticky-header, svg)) {
	position: relative;
	z-index: 1;
	background-color: var(--pt-body-bg-color, #faf8ff);
}

@media (max-width: 782px) {
	.admin-bar #site-inner > .mu-ad-pinned {
		top: 46px;
	}
}

/* Di layar ≤600px admin bar WordPress ikut ter-scroll (tidak fixed). */
@media (max-width: 600px) {
	.admin-bar #site-inner > .mu-ad-pinned {
		top: 0;
	}
}

/* Iklan Advanced Ads lain (lihat inc/mediaumkm.php): sela kartu arsip
   (selebar grid), bawah isi artikel; gambar rata tengah & responsif. */
.mu-archive-ad {
	grid-column: 1 / -1;
	text-align: center;
}

.mu-single-bottom-ad {
	margin: 24px 0;
	text-align: center;
}

.mu-ad img {
	max-width: 100%;
	height: auto;
}

.mu-archive-ad img,
.mu-single-bottom-ad img,
.mu-news-list__ad img {
	display: block;
	margin-right: auto;
	margin-left: auto;
}