/* ==========================================================================
   IBS Pages 2026 — Tentang, Kantor, Dukungan

   Dunia visualnya sama dengan beranda dan ditetapkan di DESIGN.md: bidang
   polistirena, tinta grafit, satu biru assay yang dipakai sebagai status dan
   bukan sebagai latar, bingkai rambut 2px, Archivo untuk teks dan Spline Sans
   Mono untuk angka dan alamat.

   Berkas ini tidak mewarisi style.css beranda dengan sengaja. Yang dipakai
   bersama adalah token, dan token tinggal di ibs-design-system — satu sumber
   untuk seluruh situs. Yang tidak dipakai bersama adalah komponen: slider,
   pelat 96-sumur dan rak principal hanya ada di beranda, dan menarik 41 KB ke
   tiga halaman ini berarti mereka membayar untuk sesuatu yang tidak dirender.

   Semua aturan dilingkupi .ibs-p26 (body) atau #ibs-pg (main), jadi 40-an rute
   lain tidak terpengaruh urutan muat maupun kekhususan selektor.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Token. Hex sesudah var() adalah nilai mode terang, supaya halaman tetap
   benar kalau ibs-design-system suatu saat dihapus.
   -------------------------------------------------------------------------- */
.ibs-p26 {
	--ground:      var(--ds-ground,     #f1f4f7);
	--frame:       var(--ds-frame,      #ffffff);
	--hairline:    var(--ds-hairline,   #d5dce4);
	--ink:         var(--ds-ink,        #10192a);
	--ink-2:       var(--ds-ink-2,      #46536a);
	--ink-3:       var(--ds-ink-3,      #5c6980);
	--assay:       var(--ds-assay,      #0b4fd1);
	--assay-deep:  var(--ds-assay-deep, #072f7d);
	--assay-wash:  var(--ds-assay-wash, #e4ecfb);

	--r:           2px;
	--rule:        1px solid var(--hairline);
	--ease:        cubic-bezier(0.16, 1, 0.3, 1);

	--measure:     68ch;
	--gutter:      clamp(20px, 4vw, 64px);
	--maxw:        1280px;
	--header-h:    125px;

	--sans: 'Archivo', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
	--mono: 'Spline Sans Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* --------------------------------------------------------------------------
   Reset pembungkus tema.

   header.php membuka .page_content_wrap > .content_wrap > .content dan
   footer.php menutupnya, jadi template ini dirender DI DALAM ukuran tema.
   Tiga selektor, hanya pada tiga halaman ini.
   -------------------------------------------------------------------------- */
.ibs-p26 .page_content_wrap {
	background: var(--ground);
	padding: 0;
	margin: 0;
}
/* Dibatasi ke dalam .page_content_wrap dengan sengaja: panel menu ponsel juga
   memakai kelas .content_wrap, dan ia hidup di luar pembungkus isi halaman.
   Tanpa batasan ini, reset yang dimaksudkan untuk badan halaman ikut menghapus
   inset kiri-kanan menu ponsel, dan seluruh menunya menempel ke tepi layar. */
.ibs-p26 .page_content_wrap .content_wrap,
.ibs-p26 .page_content_wrap .content_wrap_fullscreen,
.ibs-p26 .page_content_wrap .content {
	max-width: none;
	width: 100%;
	margin: 0;
	padding: 0;
}
/* Sidebar, header artikel dan spanduk judul tema tidak dipakai: halaman ini
   membawa mastheadnya sendiri, lengkap dengan remah roti.

   Spanduknya perlu dua alamat. Sebagaimana dicetak tema, ia berada di dalam
   .top_panel sebagai satu section Elementor; ibs-mobile-optimization.php lalu
   mengangkatnya keluar dengan JavaScript ke .ibs-banner-host di dalam
   .page_content_wrap. Kalau hanya satu yang disebut, spanduk itu berkedip di
   satu sisi perpindahan tersebut. Selektor :has() adalah cara menyebut section
   pembungkusnya tanpa mengandalkan nomor elemen Elementor yang bisa berubah
   begitu header diedit. */
.ibs-p26 .sidebar,
.ibs-p26 .content > article > .post_header,
.ibs-p26 .page_title,
.ibs-p26 .ibs-banner-host,
.ibs-p26 .ibs-page-banner,
.ibs-p26 .sc_layouts_title,
.ibs-p26 .top_panel .elementor-top-section:has(.sc_layouts_title) {
	display: none;
}

/* --------------------------------------------------------------------------
   Rekonsiliasi dengan tema.

   Sama persis dengan yang dilakukan beranda, dengan alasan yang sama: bilah
   atas dibuat fixed, setinggi 125px, transparan, dan memakai logo putih. Di
   atas bidang polistirena itu berarti putih di atas putih.

   ibs-mobile-optimization.php memaksa bilah itu transparan saat belum
   di-scroll. Itu benar untuk beranda Elementor yang lama; salah di sini.
   Dikalahkan lewat kekhususan — tiga kelas body melawan dua — bukan dengan
   !important yang lebih keras, dan shorthand dilawan shorthand.
   -------------------------------------------------------------------------- */
html body.ibs-p26.header_position_over:not(.ibs-scrolled) .top_panel,
html body.ibs-p26.header_position_over:not(.ibs-scrolled) .top_panel.top_panel_custom,
html body.ibs-p26 .top_panel,
html body.ibs-p26 .top_panel.top_panel_custom {
	background: var(--assay-deep) !important;
	border-bottom-color: rgba(255, 255, 255, 0.14);
}

/* Tinggi bilah hanya perlu disediakan ketika bilah itu benar-benar melayang di
   atas konten. Beranda memakai header_position_over, ketiga halaman ini tidak:
   di sini bilahnya ikut alur, dan memberi jarak sekali lagi meninggalkan 125px
   bidang kosong di atas judul. */
.header_position_over #ibs-pg { padding-top: var(--header-h); }

/* Tema mengecat tbody th dengan warna nyaris hitam dan meratakan th ke tengah.
   Keduanya salah untuk tabel spesifikasi. */
#ibs-pg .ibs-table th,
#ibs-pg .ibs-table td {
	background: transparent;
	color: inherit;
}
#ibs-pg .ibs-table thead th { color: var(--ink-3); }
#ibs-pg .ibs-table tbody th { color: var(--ink); }
#ibs-pg .ibs-table th,
#ibs-pg .ibs-table td,
#ibs-pg .ibs-table caption { text-align: left; }

/* --------------------------------------------------------------------------
   Bidang dan huruf
   -------------------------------------------------------------------------- */
#ibs-pg {
	background: var(--ground);
	color: var(--ink-2);
	font-family: var(--sans);
	font-size: 17px;
	line-height: 1.62;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

#ibs-pg *,
#ibs-pg *::before,
#ibs-pg *::after { box-sizing: border-box; }

/* Tema menetapkan font-family langsung pada h1-h6, p, a, td dan th lewat muka
   hurufnya sendiri. Pewarisan dari #ibs-pg selalu kalah dari aturan elemen yang
   cocok, jadi elemennya harus disebut satu per satu. */
#ibs-pg,
#ibs-pg h1, #ibs-pg h2, #ibs-pg h3, #ibs-pg h4, #ibs-pg h5, #ibs-pg h6,
#ibs-pg p, #ibs-pg a, #ibs-pg li, #ibs-pg span, #ibs-pg div,
#ibs-pg th, #ibs-pg td, #ibs-pg caption, #ibs-pg dt, #ibs-pg dd,
#ibs-pg figcaption, #ibs-pg address, #ibs-pg time, #ibs-pg ol, #ibs-pg ul,
#ibs-pg button {
	font-family: var(--sans);
}

/* Muka huruf data ditegakkan kembali di atas selimut itu. */
#ibs-pg .ibs-addr,
#ibs-pg .ibs-num,
#ibs-pg .ibs-stats__n,
#ibs-pg .ibs-log__year,
#ibs-pg .ibs-table thead th,
#ibs-pg .ibs-close__tel a {
	font-family: var(--mono);
	font-variant-numeric: tabular-nums;
	font-feature-settings: 'tnum' 1;
}

#ibs-pg p { margin: 0 0 1em; max-width: var(--measure); }
#ibs-pg p:last-child { margin-bottom: 0; }

/* Kolom isi kanonis situs, diukur dari tema — baris header dan footer
   sama-sama jatuh ke kotak 1290px, jadi selokan baru menggigit ketika
   viewport tidak lagi memuat kolom penuh. */
.ibs-wrap {
	width: min(var(--maxw), 100% - (var(--gutter) * 2));
	margin-inline: auto;
}

/* Satu irama. Ruang di atas judul selalu lebih besar daripada di bawahnya. */
#ibs-pg > section { padding-block: clamp(56px, 7.5vw, 104px); }
#ibs-pg > section + section { border-top: var(--rule); }

/* --------------------------------------------------------------------------
   Primitif tipografi
   -------------------------------------------------------------------------- */
#ibs-pg .ibs-h1 {
	font-size: clamp(2.125rem, 3.1vw, 3rem);
	line-height: 1.08;
	letter-spacing: -0.03em;
	font-weight: 600;
	color: var(--ink);
	margin: 0 0 24px;
	text-wrap: balance;
}

#ibs-pg .ibs-h2 {
	font-size: clamp(1.75rem, 2.6vw, 2.375rem);
	line-height: 1.14;
	letter-spacing: -0.026em;
	font-weight: 600;
	color: var(--ink);
	margin: 0 0 32px;
	text-wrap: balance;
}
#ibs-pg .ibs-h2--invert { color: #fff; }

.ibs-lede {
	font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);
	line-height: 1.55;
	color: var(--ink-2);
	max-width: 46ch;
	margin: 0 0 36px;
}

.ibs-sub {
	color: var(--ink-2);
	max-width: 56ch;
	margin: -18px 0 40px;
}

.ibs-addr {
	font-size: 0.6875rem;
	color: var(--ink-3);
	letter-spacing: 0.02em;
	text-transform: uppercase;
}
.ibs-addr--invert { color: rgba(255, 255, 255, 0.62); }

.ibs-sr {
	position: absolute; width: 1px; height: 1px;
	padding: 0; margin: -1px; overflow: hidden;
	clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}

/* Tautan di dalam kalimat. Garis bawah tetap ada — di tengah paragraf, warna
   saja bukan penanda yang cukup. */
#ibs-pg .ibs-inline {
	color: var(--assay);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}
#ibs-pg .ibs-inline:hover { text-decoration-thickness: 2px; }

/* Satu cincin fokus, di seluruh halaman, memakai warna assay. */
#ibs-pg :focus-visible {
	outline: 2px solid var(--assay);
	outline-offset: 3px;
	border-radius: var(--r);
}

/* --------------------------------------------------------------------------
   Tindakan
   -------------------------------------------------------------------------- */
.ibs-actions { display: flex; flex-wrap: wrap; gap: 12px; }

#ibs-pg .ibs-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 24px;
	border-radius: var(--r);
	border: 1px solid transparent;
	font-size: 0.9375rem;
	font-weight: 500;
	letter-spacing: -0.006em;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 160ms var(--ease),
	            border-color 160ms var(--ease),
	            color 160ms var(--ease),
	            transform 120ms var(--ease);
}
#ibs-pg .ibs-btn:active { transform: scale(0.985); }

#ibs-pg .ibs-btn--primary { background: var(--assay); color: #fff; }
#ibs-pg .ibs-btn--primary:hover { background: var(--assay-deep); color: #fff; }

#ibs-pg .ibs-btn--ghost { background: transparent; color: var(--ink); border-color: var(--hairline); }
#ibs-pg .ibs-btn--ghost:hover { border-color: var(--ink); color: var(--ink); }

#ibs-pg .ibs-btn--invert { background: #fff; color: var(--assay-deep); }
#ibs-pg .ibs-btn--invert:hover { background: var(--assay-wash); color: var(--assay-deep); }

#ibs-pg .ibs-btn--ghost-invert { background: transparent; color: #fff; border-color: rgba(255, 255, 255, 0.42); }
#ibs-pg .ibs-btn--ghost-invert:hover { border-color: #fff; color: #fff; }

#ibs-pg .ibs-link {
	color: var(--assay);
	text-decoration: none;
	font-weight: 500;
	font-size: 0.9375rem;
	white-space: nowrap;
	border-bottom: 1px solid transparent;
	transition: border-color 160ms var(--ease);
	display: inline-flex;
	align-items: center;
	/* Panahnya menempel ke tulisan tanpa ini: item flex membuang spasi di
	   antara anak-anaknya, jadi "Minta brosur →" dirender "Minta brosur→". */
	gap: 6px;
	min-height: 24px;
}
#ibs-pg .ibs-link:hover { border-bottom-color: currentColor; }

/* ==========================================================================
   1. MASTHEAD — pembagian tak simetris 7/5.

   Kolom kiri berargumen, kolom kanan menjawab pertanyaan yang ditanyakan
   bagian pengadaan: siapa, sejak kapan, di mana, nomor mana yang diangkat.
   Data itu di halaman lama tersebar di dalam paragraf, atau disembunyikan di
   balik tab.
   ========================================================================== */
.ibs-mast {
	padding-block: clamp(48px, 6.5vw, 88px) clamp(48px, 6vw, 80px);
	border-bottom: var(--rule);
}

.ibs-mast__grid {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: clamp(36px, 5vw, 80px);
	align-items: start;
}

.ibs-crumb {
	font-family: var(--mono);
	font-size: 0.6875rem;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--ink-3);
	margin: 0 0 28px;
	display: flex;
	gap: 8px;
	align-items: center;
}
#ibs-pg .ibs-crumb a {
	color: var(--ink-3);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	min-height: 24px;
	display: inline-flex;
	align-items: center;
}
#ibs-pg .ibs-crumb a:hover { color: var(--assay); border-bottom-color: currentColor; }
#ibs-pg .ibs-crumb [aria-current="page"] { color: var(--ink); }

/* Kartu identitas: daftar deskripsi berbingkai rambut, bukan kartu bayangan.
   Setiap baris satu fakta, labelnya mono supaya terbaca sebagai keterangan
   dan bukan sebagai judul. */
.ibs-id {
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--ink);
}
.ibs-id__row {
	display: grid;
	grid-template-columns: minmax(110px, 0.9fr) minmax(0, 1.6fr);
	gap: 16px;
	padding: 14px 0;
	border-bottom: var(--rule);
}
.ibs-id dt { margin: 0; padding-top: 3px; }
.ibs-id dd {
	margin: 0;
	color: var(--ink);
	font-size: 0.9375rem;
	line-height: 1.45;
}
#ibs-pg .ibs-id a {
	color: var(--ink);
	text-decoration: none;
	border-bottom: 1px solid var(--hairline);
	display: inline-flex;
	align-items: center;
	min-height: 24px;
}
#ibs-pg .ibs-id a:hover { color: var(--assay); border-bottom-color: currentColor; }

/* ==========================================================================
   2. ANGKA — empat angka terbitan di atas satu garis.
   ========================================================================== */
#ibs-pg .ibs-stats { padding-block: clamp(36px, 4.5vw, 56px); }

.ibs-stats__list {
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
}
.ibs-stats__item { padding-right: 24px; }
.ibs-stats__n {
	font-size: clamp(1.75rem, 3vw, 2.75rem);
	line-height: 1;
	font-weight: 500;
	color: var(--ink);
	letter-spacing: -0.03em;
	margin: 0 0 8px;
}
.ibs-stats__label {
	margin: 0;
	font-size: 0.875rem;
	color: var(--ink-3);
}

/* ==========================================================================
   3. CERITA — lead editorial di kiri, satu foto milik sendiri di kanan.
   ========================================================================== */
.ibs-story__grid {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: clamp(36px, 5vw, 80px);
	align-items: start;
}

.ibs-story__copy p { max-width: 62ch; }
.ibs-story__lead {
	font-size: 1.125rem;
	line-height: 1.55;
	color: var(--ink);
}

/* Tema membuat setiap <figure> jadi flex column yang rata tengah. Di sana
   bingkai foto berubah jadi item flex yang menyusut ke nol — isinya diposisikan
   absolut, jadi tidak ada apa pun yang menahan lebarnya, dan yang tersisa cuma
   dua piksel garis tepi. Dikembalikan ke blok. */
#ibs-pg .ibs-story__fig {
	display: block;
	margin: 0;
	text-align: left;
}
#ibs-pg .ibs-story__fig figcaption { margin-top: 12px; display: block; }

/* Bingkai foto. Rasio dikunci di sini supaya tata letak tidak bergeser
   sedikit pun sebelum gambar tiba — halaman lama menanam URL berukuran penuh
   tanpa lebar dan tinggi, dan setiap foto menggeser isi di bawahnya. */
.ibs-shot {
	display: block;
	width: 100%;
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--assay-wash);
	border: var(--rule);
	border-radius: var(--r);
}
.ibs-shot img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* ==========================================================================
   4. VISI & MISI — dua pernyataan di atas garis, bukan dua kartu.
   ========================================================================== */
.ibs-aim__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(24px, 4vw, 64px);
}
.ibs-aim__item {
	border-top: 1px solid var(--ink);
	padding-top: 20px;
}
#ibs-pg .ibs-aim__item h3 { margin: 0 0 14px; font-weight: 400; }
.ibs-aim__text {
	font-size: clamp(1.0625rem, 1.5vw, 1.25rem);
	line-height: 1.45;
	color: var(--ink);
	max-width: 34ch;
	margin: 0;
}

/* ==========================================================================
   5. REKAM JEJAK — catatan tegak, terbaru di atas.

   Beranda memakai pita lima kolom untuk data yang sama. Di sini bentuknya
   tegak: halaman ini punya ruang untuk membaca seluruh catatan berurutan,
   dan tahunnya tidak perlu dimampatkan ke dalam satu baris.
   ========================================================================== */
.ibs-log { list-style: none; margin: 0; padding: 0; }

.ibs-log__row {
	display: grid;
	grid-template-columns: minmax(96px, 1fr) minmax(0, 6fr);
	gap: clamp(20px, 4vw, 64px);
	padding: 22px 0;
	border-top: var(--rule);
	position: relative;
}
.ibs-log__row:first-child { border-top: 1px solid var(--ink); }

.ibs-log__year {
	font-size: 1.125rem;
	font-weight: 500;
	color: var(--ink);
	margin: 0;
	letter-spacing: -0.01em;
	display: flex;
	align-items: center;
	gap: 10px;
}
/* Satu sumur terisi per tahun: penanda yang sama dengan yang dipakai pelat di
   beranda, dipakai di sini sebagai penanda baris. */
.ibs-log__year::before {
	content: '';
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--assay);
	flex: 0 0 auto;
}

.ibs-log__items { list-style: none; margin: 0; padding: 0; }
.ibs-log__items li {
	color: var(--ink-2);
	padding: 3px 0;
	max-width: 52ch;
}

/* ==========================================================================
   6. LOKASI — tiga catatan beralamat, semuanya terbaca sekaligus.
   ========================================================================== */
.ibs-loc {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: clamp(28px, 4vw, 64px);
	padding: clamp(28px, 3.5vw, 44px) 0;
	border-top: var(--rule);
	align-items: start;
}
.ibs-loc:first-of-type { border-top: 1px solid var(--ink); }
.ibs-loc:last-of-type { border-bottom: var(--rule); }

.ibs-loc__n { margin: 0 0 10px; }
#ibs-pg .ibs-loc__name {
	font-size: clamp(1.25rem, 1.9vw, 1.625rem);
	line-height: 1.15;
	letter-spacing: -0.02em;
	font-weight: 600;
	color: var(--ink);
	margin: 0 0 14px;
}
.ibs-loc__addr {
	font-style: normal;
	color: var(--ink-2);
	line-height: 1.6;
	margin: 0 0 18px;
	max-width: 34ch;
}
.ibs-loc__go { margin: 0; }

.ibs-loc__media { display: grid; gap: 12px; }

/* Peta atas permintaan. Kotaknya sudah memesan tempatnya sejak awal, jadi
   memuat peta tidak menggeser apa pun di bawahnya. */
.ibs-map {
	position: relative;
	aspect-ratio: 16 / 9;
	border: var(--rule);
	border-radius: var(--r);
	background: var(--frame);
	display: grid;
	place-content: center;
	gap: 10px;
	justify-items: center;
	padding: 16px;
	text-align: center;
	overflow: hidden;
}
.ibs-map__load {
	appearance: none;
	background: transparent;
	color: var(--ink);
	border: 1px solid var(--hairline);
	border-radius: var(--r);
	min-height: 48px;
	padding: 0 22px;
	font-size: 0.9375rem;
	font-weight: 500;
	cursor: pointer;
	transition: border-color 160ms var(--ease), color 160ms var(--ease), background-color 160ms var(--ease);
}
.ibs-map__load:hover { border-color: var(--assay); color: var(--assay); background: var(--assay-wash); }
.ibs-map__note { max-width: 30ch; line-height: 1.4; }

.ibs-map.is-loaded {
	display: block;
	padding: 0;
	background: var(--assay-wash);
}
.ibs-map iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

/* ==========================================================================
   7. RANTAI — urutan kerja. Empat langkah di atas satu garis, bukan empat
   kartu: yang dibaca adalah urutannya, dan kartu justru memutus urutan itu.
   ========================================================================== */
.ibs-chain__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
	border-top: 1px solid var(--ink);
}
.ibs-chain__step {
	position: relative;
	padding: 22px 24px 0 0;
}
/* Penanda langkah, sama bentuknya dengan penanda tahun di rekam jejak. */
.ibs-chain__step::before {
	content: '';
	position: absolute;
	inset-block-start: -1px;
	inset-inline-start: 0;
	width: 9px;
	height: 9px;
	background: var(--assay);
	border-radius: 50%;
	transform: translateY(-50%);
}
.ibs-chain__step .ibs-addr { display: block; margin-bottom: 12px; }
#ibs-pg .ibs-chain__name {
	font-size: 1.0625rem;
	line-height: 1.3;
	letter-spacing: -0.012em;
	font-weight: 600;
	color: var(--ink);
	margin: 0 0 8px;
}
.ibs-chain__note {
	font-size: 0.875rem;
	color: var(--ink-2);
	max-width: 30ch;
	margin: 0;
}

/* ==========================================================================
   8. TABEL SPESIFIKASI — bentuk yang sama dengan tabel layanan di beranda.
   ========================================================================== */
.ibs-table {
	width: 100%;
	border-collapse: collapse;
	text-align: left;
	font-size: 0.9375rem;
}
.ibs-table thead th {
	font-size: 0.6875rem;
	font-weight: 400;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ink-3);
	padding: 0 20px 12px 0;
	border-bottom: 1px solid var(--ink);
	vertical-align: bottom;
}
.ibs-table tbody th,
.ibs-table tbody td {
	padding: 22px 20px 22px 0;
	border-bottom: var(--rule);
	vertical-align: top;
}
.ibs-table tbody th {
	font-weight: 600;
	color: var(--ink);
	font-size: 1.0625rem;
	letter-spacing: -0.012em;
	width: 26%;
	min-width: 180px;
}
.ibs-table tbody th .ibs-addr { display: block; margin-bottom: 5px; font-weight: 400; }
.ibs-table tbody td { color: var(--ink-2); max-width: 52ch; }
.ibs-table__act {
	width: 1%;
	white-space: nowrap;
	padding-left: 28px !important;
	padding-right: 0 !important;
}

/* ==========================================================================
   9. RUJUKAN — tiga sumber beralamat. Tetap daftar, bukan kartu ikon: yang
   dihapus dari halaman lama justru bentuk itu.
   ========================================================================== */
.ibs-res__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0;
	border-top: 1px solid var(--ink);
}
/* Tanpa garis pemisah tegak.
 *
 * Sebelumnya tiap kolom membawa garis di kanannya. Garis itu tidak memisahkan
 * apa pun yang belum terpisah — kolomnya sudah berjarak, dan nomor 01/02/03
 * sudah menamai masing-masing — sementara tingginya mengikuti kolom terpanjang,
 * jadi ia menggantung jauh di bawah tulisan kolom yang lebih pendek. Yang
 * tersisa hanya tiga setrip yang tidak menjelaskan apa-apa.
 *
 * Strukturnya dibawa hal yang sama seperti rantai layanan di halaman ini:
 * satu garis di atas, alamat mono, dan sumur terisi sebagai penanda awal
 * kolom. Dua daftar beralamat di satu halaman jadi terbaca sebagai sepasang,
 * bukan sebagai dua gagasan berbeda. */
.ibs-res__item {
	position: relative;
	padding: 22px 28px 0 0;
}
.ibs-res__item::before {
	content: '';
	position: absolute;
	inset-block-start: -1px;
	inset-inline-start: 0;
	width: 9px;
	height: 9px;
	background: var(--assay);
	border-radius: 50%;
	transform: translateY(-50%);
}
.ibs-res__item .ibs-addr { display: block; margin-bottom: 12px; }
#ibs-pg .ibs-res__name {
	font-size: 1.0625rem;
	line-height: 1.3;
	letter-spacing: -0.012em;
	font-weight: 600;
	color: var(--ink);
	margin: 0 0 8px;
}
.ibs-res__desc {
	font-size: 0.875rem;
	color: var(--ink-2);
	max-width: 34ch;
	margin: 0 0 16px;
}

/* ==========================================================================
   10. TUTUP — satu panel tercelup, sama seperti beranda.
   ========================================================================== */
#ibs-pg .ibs-close {
	background: var(--assay-deep);
	color: rgba(255, 255, 255, 0.82);
	border-top: none;
}
.ibs-close__grid {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: clamp(36px, 5vw, 80px);
	align-items: start;
}
.ibs-close__lede {
	font-size: 1.0625rem;
	color: rgba(255, 255, 255, 0.80);   /* 8.9:1 di atas --assay-deep, terukur */
	max-width: 44ch;
	margin: 0 0 36px;
}
.ibs-close__card {
	font-style: normal;
	border: 1px solid rgba(255, 255, 255, 0.20);
	border-radius: var(--r);
	padding: 24px;
}
.ibs-close__card .ibs-addr { display: block; margin-bottom: 14px; }
.ibs-close__addr { color: rgba(255, 255, 255, 0.80); font-size: 0.9375rem; margin-bottom: 16px; }
#ibs-pg .ibs-close__tel a {
	/* Nomor telepon adalah target sentuh, bukan sekadar teks: tingginya diukur
	   22px sebelum ini, di bawah ambang WCAG 2.2. */
	display: inline-flex;
	align-items: center;
	min-height: 24px;
	color: #fff;
	font-size: 1.0625rem;
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, 0.34);
}
#ibs-pg .ibs-close__tel a:hover { border-bottom-color: #fff; }
#ibs-pg .ibs-close :focus-visible { outline-color: #fff; }

/* ==========================================================================
   Responsif. Setiap tata letak berkolom menyatakan sendiri cara runtuhnya.
   ========================================================================== */
@media (max-width: 1080px) {
	.ibs-p26 { --header-h: 88px; }

	.ibs-mast__grid,
	.ibs-story__grid,
	.ibs-close__grid { grid-template-columns: 1fr; }

	/* Kartu identitas turun ke bawah salinan, tetapi tetap dua kolom di dalam
	   dirinya sendiri supaya tidak berubah jadi daftar panjang. */
	.ibs-id { max-width: 640px; }

	.ibs-loc { grid-template-columns: 1fr; }
	.ibs-chain__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ibs-chain__step { padding-bottom: 24px; }
	.ibs-res__list { grid-template-columns: 1fr; }
	/* Ditumpuk satu kolom: penandanya kembali jadi garis rambut antar butir,
	   karena sumur di tepi atas hanya bermakna ketika butirnya berjajar. */
	.ibs-res__item {
		border-bottom: var(--rule);
		padding: 20px 0;
	}
	.ibs-res__item::before { display: none; }
	.ibs-res__item:last-child { border-bottom: none; }
}

@media (max-width: 860px) {
	/* Tabel spesifikasi jadi catatan bertumpuk. Kepala kolom disembunyikan,
	   bukan diulang: nama layanan dan keterangannya sudah terbaca berurutan. */
	.ibs-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
	.ibs-table tbody th,
	.ibs-table tbody td { display: block; width: auto; max-width: none; padding: 0 0 10px; border: none; }
	.ibs-table tbody tr {
		display: block;
		padding: 22px 0;
		border-bottom: var(--rule);
	}
	.ibs-table tbody tr:first-child { border-top: var(--rule); }
	.ibs-table__act { padding: 6px 0 0 0 !important; }

	.ibs-story__fig { max-width: 520px; }
}

@media (max-width: 720px) {
	#ibs-pg { font-size: 16px; }
	#ibs-pg .ibs-h1 { font-size: clamp(2rem, 8.4vw, 2.625rem); }

	/* Tombol memenuhi lebar: pada 375px dua tombol berdampingan menyisakan
	   label yang terpotong. */
	.ibs-actions .ibs-btn { flex: 1 1 auto; }

	.ibs-stats__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 0; }
	.ibs-aim__grid { grid-template-columns: 1fr; }
	.ibs-chain__list { grid-template-columns: 1fr; }
	.ibs-log__row { grid-template-columns: 1fr; gap: 10px; }
	.ibs-id__row { grid-template-columns: 1fr; gap: 4px; }
	.ibs-id dt { padding-top: 0; }
	.ibs-map { aspect-ratio: 4 / 3; }
}

/* --------------------------------------------------------------------------
   Gerak. Tidak ada animasi masuk di halaman ini sama sekali; yang tersisa
   hanya perpindahan status, dan itu pun dipendekkan bila diminta.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	#ibs-pg .ibs-btn,
	.ibs-map__load { transition-duration: 1ms; }
	#ibs-pg .ibs-btn:active { transform: none; }
}

/* --------------------------------------------------------------------------
   Cetak. Ketiga halaman ini yang paling sering dicetak dan dilampirkan ke
   dokumen pengadaan, jadi bagian yang tidak bisa diklik di atas kertas
   dibuang, dan yang tercelup dikembalikan menjadi tinta hitam.
   -------------------------------------------------------------------------- */
@media print {
	#ibs-pg { background: #fff; font-size: 11pt; padding-top: 0; }
	#ibs-pg .ibs-close { background: #fff; color: #000; }
	#ibs-pg .ibs-h2--invert,
	.ibs-close__lede,
	.ibs-close__addr { color: #000; }
	#ibs-pg .ibs-close__tel a,
	.ibs-close__card { color: #000; border-color: #000; }
	.ibs-actions,
	.ibs-map,
	.ibs-crumb { display: none; }
	.ibs-shot { break-inside: avoid; }
	.ibs-loc, .ibs-log__row, .ibs-chain__step { break-inside: avoid; }
}

/* --------------------------------------------------------------------------
   Mode gelap. Susunannya tidak berubah — hanya token yang dibacanya. Dua hal
   perlu catatan: panel tutup sudah gelap di mode terang sehingga butuh tepi
   agar terpisah dari bidang, dan foto kantor dipotret di ruang terang
   sehingga sedikit diredupkan agar tidak menyilaukan.
   -------------------------------------------------------------------------- */
html[data-theme="dark"] #ibs-pg .ibs-close {
	border-top: 1px solid var(--hairline);
}

/* Tombol utama. Di mode terang assay adalah biru pekat dan labelnya putih;
   di mode gelap assay naik jadi biru muda (#6fa3ff) supaya terbaca di atas
   bidang gelap — dan label putih di atasnya turun ke 2.5:1, terukur. Yang
   berubah tintanya, bukan warnanya: tinta bidang di atas biru muda memberi
   6.5:1. Sorotannya juga tidak boleh memakai assay-deep, karena di mode gelap
   warna itu justru nyaris hitam dan tombolnya lenyap. */
html[data-theme="dark"] #ibs-pg .ibs-btn--primary {
	color: var(--ds-ground);
}
html[data-theme="dark"] #ibs-pg .ibs-btn--primary:hover {
	background: var(--assay);
	color: var(--ds-ground);
	filter: brightness(1.12);
}
@media (prefers-color-scheme: dark) {
	html.ibs-ds:not([data-theme="light"]) #ibs-pg .ibs-close {
		border-top: 1px solid var(--hairline);
	}
	html.ibs-ds:not([data-theme="light"]) .ibs-shot img { filter: brightness(0.92); }

	html.ibs-ds:not([data-theme="light"]) #ibs-pg .ibs-btn--primary {
		color: var(--ds-ground);
	}
	html.ibs-ds:not([data-theme="light"]) #ibs-pg .ibs-btn--primary:hover {
		background: var(--assay);
		color: var(--ds-ground);
		filter: brightness(1.12);
	}
}
html[data-theme="dark"] .ibs-shot img { filter: brightness(0.92); }

/* ==========================================================================
   6. KONTAK — formulir Contact Form 7 (markup/logika field tidak disentuh)
      dan kartu kantor singkat, dua kolom.
   ========================================================================== */
#ibs-pg .ibs-kontak { padding-block: clamp(48px, 6vw, 80px); }
.ibs-kontak__grid {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
	gap: clamp(36px, 5vw, 80px);
	align-items: start;
}

/* Theme's own CF7 "style-7" preset draws a decorative icon via an empty
   <span class="line"> sibling's own ::before (an icon font glyph, positioned
   absolute at the field's left edge) -- confirmed live in the rendered DOM.
   It's sized for the theme's own (narrower, unpadded) field style, so once
   this file's own padding applies below, the icon sits on top of the
   placeholder text instead of beside it. Reserving room for it on the left
   is the fix that works regardless of the exact icon technique, rather than
   trying to disable an icon this stylesheet doesn't control the markup of. */
#ibs-pg .style-line[class*="icon-"] .wpcf7-form-control { padding-left: 42px !important; }
#ibs-pg .wpcf7-form p { margin: 0 0 20px; }
#ibs-pg .wpcf7-form label {
	display: block;
	font-family: var(--mono);
	font-size: 0.75rem;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--ink-3);
	margin-bottom: 8px;
}
#ibs-pg .wpcf7-form-control {
	width: 100%;
	box-sizing: border-box;
	padding: 12px 14px;
	background: var(--frame);
	border: var(--rule);
	border-radius: var(--r);
	color: var(--ink);
	font-family: var(--sans);
	font-size: 0.9375rem;
	transition: border-color 160ms var(--ease);
}
#ibs-pg .wpcf7-form-control:focus { outline: none; border-color: var(--assay); }
#ibs-pg textarea.wpcf7-form-control { min-height: 140px; resize: vertical; }
#ibs-pg .wpcf7-list-item { margin: 0; display: flex; gap: 8px; align-items: flex-start; }
#ibs-pg .wpcf7-list-item input { margin-top: 3px; }
#ibs-pg .wpcf7-acceptance { display: block; font-size: 0.8125rem; color: var(--ink-2); }
#ibs-pg .wpcf7-form a { color: var(--assay); }
/* !important here, deliberately: the theme's own CF7 button styling
   (demo-orange, seen on this exact button before this rule) outweighs a
   plain-specificity override -- confirmed live. */
#ibs-pg input.wpcf7-submit {
	width: auto !important;
	display: inline-flex !important;
	align-items: center !important;
	padding: 13px 28px !important;
	background: var(--assay) !important;
	color: #fff !important;
	border: none !important;
	border-radius: var(--r) !important;
	font-family: var(--sans) !important;
	font-weight: 600 !important;
	font-size: 0.9375rem !important;
	text-transform: none !important;
	cursor: pointer;
	transition: background-color 160ms var(--ease);
}
#ibs-pg input.wpcf7-submit:hover { background: var(--assay-deep) !important; }
#ibs-pg .wpcf7-not-valid-tip { color: #c0392b; font-size: 0.8125rem; margin-top: 6px; }
#ibs-pg .wpcf7-response-output {
	margin: 20px 0 0;
	padding: 12px 16px;
	border: var(--rule);
	border-radius: var(--r);
	font-size: 0.875rem;
}

.ibs-kontak__offices {
	padding: 28px;
	background: var(--frame);
	border: var(--rule);
	border-radius: var(--r);
}
.ibs-kontak__officelist { list-style: none; margin: 16px 0 0; padding: 0; }
.ibs-kontak__officelist li {
	padding: 12px 0;
	border-top: var(--rule);
	font-size: 0.9375rem;
	color: var(--ink-2);
}
.ibs-kontak__officelist li:first-child { border-top: none; }
.ibs-kontak__officelist strong {
	display: block;
	color: var(--ink);
	font-weight: 600;
	margin-bottom: 2px;
}
.ibs-kontak__officelink { margin: 16px 0 0; }

@media (max-width: 860px) {
	.ibs-kontak__grid { grid-template-columns: minmax(0, 1fr); }
}

/* ==========================================================================
   7. BRANDS — grid logo, tiap kartu opsional jadi tautan (ibs_pg26_brand_link()).
   ========================================================================== */
#ibs-pg .ibs-brands { padding-block: clamp(48px, 6vw, 80px); }
.ibs-brands__grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1px;
	background: var(--hairline);
	border: var(--rule);
}
.ibs-brands__item { background: var(--frame); }
.ibs-brands__link {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	padding: clamp(24px, 3vw, 40px) 20px;
	height: 100%;
	box-sizing: border-box;
	text-decoration: none;
	transition: background-color 160ms var(--ease);
}
a.ibs-brands__link:hover { background: var(--assay-wash); }
.ibs-brands__logo { display: flex; align-items: center; justify-content: center; height: 64px; }
.ibs-brands__logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.ibs-brands__name {
	font-family: var(--mono);
	font-size: 0.75rem;
	letter-spacing: 0.02em;
	color: var(--ink-2);
	text-align: center;
}
a.ibs-brands__link:hover .ibs-brands__name { color: var(--assay); }

@media (max-width: 860px) {
	.ibs-brands__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}