/* =====================================================================
   LAYOUT / MOBILE FIXES  (dimuat setelah responsive.css)
   ===================================================================== */

/* 1. Header: kurung float (.logo-box & .nav-outer) di dalam header.
      Tanpa ini float "bocor" keluar header (container dibatasi max-height:100px),
      sehingga section pertama yang punya overflow:hidden (.article-hero,
      .sidebar-page-container) menyusut jadi 15px di mobile → halaman terlihat
      kosong/putih. */
.main-header .header-upper .auto-container{
	display: flow-root;
}

/* 2. Cegah scroll horizontal (sisa putih di kanan layar).
      Penyebab utama: pattern footer lebar tetap 379px. */
html{
	overflow-x: hidden;
}
.main-footer{
	overflow: hidden;
}
.main-footer .pattern-layer-one,
.main-footer .pattern-layer-two{
	max-width: 100%;
}

/* 3. Peta kontak jangan melebihi layar */
.contact-map-section iframe{
	display: block;
	width: 100%;
	max-width: 100%;
}

/* 4. Gambar di konten artikel & preview upload selalu muat */
.article-content img,
.article-content iframe,
.article-content video{
	max-width: 100%;
	height: auto;
}
.article-content table{
	display: block;
	overflow-x: auto;
}

/* 5. Home: .page-wrapper digeser pakai top:-60px sehingga menyisakan ruang
      kosong 60px sebelum footer. Pakai margin agar layout ikut bergeser. */
@media only screen and (max-width: 1140px){
	.page-wrapper{
		top: 0;
		margin-top: -60px;
	}
}

/* 6. Mobile header */
@media only screen and (max-width: 767px){
	/* .nav-outer digeser ke atas (bottom:75px) dan menutupi logo → logo tidak
	   bisa diklik. Biarkan klik "tembus" kecuali pada tombol menu. */
	.main-header .header-upper .nav-outer{
		pointer-events: none;
	}
	.main-header .header-upper .nav-outer .mobile-nav-toggler,
	.main-header .header-upper .nav-outer .outer-box{
		pointer-events: auto;
	}

	/* Section pertama setelah header (page-title disembunyikan di mobile) */
	.sidebar-page-container{
		padding-top: 50px;
	}

	/* Judul besar jangan sampai memaksa lebar layar */
	h1, h2, h3{
		overflow-wrap: anywhere;
	}

	/* Halaman 404 / coming soon */
	.page-404 h1{
		font-size: 80px !important;
	}
}