/* Kaki halaman versi situs.

   landing.css memasang `.footer-meta` sebagai grid satu lajur. Di dalam
   ekstensi isinya cuma dua anak - satu baris hak cipta dan satu tautan privasi
   - jadi tumpukan dua baris itu terbaca wajar. Situs menambahkan dua tautan
   lagi (/bantuan dan /panduan), dan grid yang sama berubah jadi menara empat
   baris yang menggantung di sisi kanan kaki halaman.

   Perbaikannya ditaruh di berkas terpisah, bukan di landing.css, karena
   landing.css disalin apa adanya dari ekstensi: menyuntingnya di sini akan
   hilang pada `bangun.py` berikutnya, dan menyuntingnya di ekstensi akan
   mengubah kaki halaman di dalam CRX yang isinya memang masih dua anak. */

.site-footer .footer-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px 18px;
  text-align: right;
}

/* Baris hak cipta boleh menyusut dan turun sendiri kalau kaki halaman sempit;
   nama tautan tidak pernah boleh terpotong di tengah kata. */
.site-footer .footer-meta > span { flex: 0 1 auto; }
.site-footer .footer-meta > a { flex: 0 0 auto; white-space: nowrap; }

/* Di bawah 800px landing.css sudah menumpuk `.footer-inner` ke bawah dan
   merapatkannya ke kiri, jadi blok ini ikut ke kiri - kalau tidak, ia satu
   satunya bagian kaki halaman yang rata kanan. */
@media (max-width: 800px) {
  .site-footer .footer-meta {
    justify-content: flex-start;
    text-align: left;
  }
}

/* Tombol melayang "Kembali ke atas" dipaku ke sudut kanan bawah JENDELA, bukan
   ke kaki halaman, jadi begitu halaman digulir sampai habis ia mendarat di atas
   kaki halaman. Selama .footer-meta masih menumpuk vertikal, tautannya cukup
   sempit untuk lolos; sekarang barisnya melebar sampai tepi kanan wadah dan
   "Dukungan" serta "Panduan" tertutup pil itu.

   Ruang yang disediakan untuknya duduk di ELEMEN KAKI HALAMAN, bukan di dalam
   .footer-inner. Alasannya: landing.css memusatkan isi kaki halaman secara
   vertikal lewat `min-height: 90px` + `align-items: center`, tanpa padding
   vertikal sama sekali. Menambahkan `padding-bottom` ke .footer-inner membuat
   kotaknya lebih tinggi dari 90px, sehingga min-height tak lagi mengatur apa
   pun dan pemusatannya berhenti bekerja: isinya menempel 1px di bawah garis
   batas atas sambil menumpuk 78px ruang kosong di bawah. Itu yang membuat baris
   logo dan tautan terlihat mepet ke bagian merah di atasnya.

   Ditaruh di sini, pemusatan 90px milik landing.css tetap utuh (sekitar 29px di
   atas dan di bawah isi), dan 78px-nya menjadi pita tambahan DI BAWAH kaki
   halaman - persis tempat tombolnya berada.

   Angkanya diukur, bukan dikira: tombolnya berhenti 68px di atas dasar jendela
   (24px jarak bawah + 44px tingginya), dan kaki halaman sudah menyumbang 30px
   di desktop serta 23px di ponsel. 56px melewatinya di kedua lebar - sisa 18px
   di desktop, 11px di ponsel - sementara 78px yang dipakai sebelumnya
   menyisakan pita kosong yang terlihat jauh lebih lebar daripada isinya.
   Ponsel yang menentukan angkanya: kaki halamannya menyumbang paling sedikit,
   jadi memakai sisa desktop sebagai patokan membuat baris hak cipta di ponsel
   nyaris menyentuh tombolnya.
   Penyisih horizontal tidak dipakai karena jarak tombol ke tepi kanan jendela
   berubah mengikuti lebar layar (wadahnya berhenti di 1200px, tombolnya tidak),
   jadi angka yang benar di 1280px terlalu besar di 1600px. Di ponsel tombolnya
   justru lebih merepotkan, karena kaki halaman menumpuk ke bawah dan baris hak
   ciptanya melebar penuh - persis di jalur tombol. */
.site-footer { padding-bottom: 56px; }

/* Tombol pemasangan di langkah 01 bagian Pemasangan. Tanpa jarak ini tombolnya
   menempel ke kalimat petunjuk di atasnya. */
.step-item .step-cta { margin-top: 12px; }
