/* ==========================================================================
   Tambahan khusus versi SATU HALAMAN (index.html).
   Dimuat setelah style.css — hanya berisi yang tidak ada di versi
   multi-halaman, yang berkasnya tetap tersimpan sebagai multi-halaman.html.
   ========================================================================== */

/* Sticky header setinggi 78px: beri ruang agar judul section tidak tertutup
   saat dilompati lewat tautan anchor. */
[id^="s-"] { scroll-margin-top: 78px; }

/* Penanda section aktif pada navigasi. Di versi multi-halaman penandanya
   aria-current="page" (menandai halaman); di sini "true" (menandai posisi). */
.nav-links a[aria-current="true"] { color: var(--green); background: var(--green-lt); }

/* Pemisah antar-section: garis tipis hijau-oranye, cukup halus agar tidak
   bertabrakan dengan bentuk organik (blob) yang jadi motif utama GIS. */
.divider { display: flex; height: 3px; width: 100%; }
.divider i:first-child { flex: 4; background: var(--green); }
.divider i:last-child  { flex: 1; background: var(--orange); }

/* Tombol kembali ke atas — hanya berguna di halaman panjang. */
.totop {
  position: fixed; right: clamp(1rem, 3vw, 2rem); bottom: clamp(1rem, 3vw, 2rem);
  z-index: 90; width: 48px; height: 48px; display: grid; place-items: center;
  background: var(--green); color: #fff; border: 0; border-radius: 50%;
  cursor: pointer; box-shadow: var(--shadow-lg);
  opacity: 0; pointer-events: none; transform: translateY(10px);
  transition: opacity var(--t), transform var(--t), background var(--t);
}
.totop.is-on { opacity: 1; pointer-events: auto; transform: none; }
.totop:hover { background: var(--green-dk); }
.totop svg { width: 18px; height: 18px; }

/* Dua section berlatar sama yang berurutan akan menyatu jadi satu blok
   kosong panjang — rapatkan jarak atasnya. */
.section + .section.section--paper { padding-top: clamp(2.5rem, 6vw, 4.5rem); }