/* ══════════════════════════════════════════════════════════════════════════
   KODELAHIR — tema halaman jualan KODE KARIER.

   jual.css menyusun tata letaknya; berkas ini cuma mengganti warnanya, dan
   hanya di dalam <body class="karier">. Dua halaman jualan lain tidak ikut
   berubah sedikit pun.

   Kenapa cokelat-bara, bukan malam-emas: pembacanya orang yang sudah bekerja,
   dan laporannya berbunyi seperti catatan evaluasi kinerja. Palet mistis
   membuat pembeli merasa salah beli. Warnanya sama dengan laporan PDF Kode
   Karier dan video iklannya — jadi yang dilihat sebelum bayar dan yang
   dibuka sesudah bayar terasa satu barang.

   ⛔ TANPA BINTANG. Halaman ini tidak memuat gerak.js, dan <canvas id=
   "bintang"> sengaja tidak ada. Bintang itu tanda mistis; di halaman yang
   membicarakan pekerjaan ia menarik ke arah yang salah.

   Kontras sudah dihitung terhadap latarnya:
     tinta  #24160E di #FFF9F4 .... 15.6:1
     abu2   #6B4A33 di #FFF9F4 ..... 6.9:1
     putih  di tombol #9A4413 ...... 6.6:1
     bara   #E0954A di #3A2317 ..... 6.4:1
     terang #F5E7DA di #3A2317 .... 10.9:1
   ══════════════════════════════════════════════════════════════════════════ */

body.karier{
  --malam:#3A2317;         /* pita atas & penutup: cokelat hangat */
  --terang:#F5E7DA;
  --emas:#E0954A;          /* aksen di atas gelap: bara */
  --kertas:#FFF9F4;
  --tinta:#24160E;
  --abu2:#6B4A33;
  --garis:#EFE0D2;
  --aksi:#9A4413;          /* warna tindakan: bata bakar */
  --aksi-tua:#7A330C;
  --hijau:#2E6B4F;
}

/* Pita atas berangsur ke cokelat terang — kesan cahaya sore di ruang kerja,
   bukan langit malam. */
body.karier .pita{
  background:linear-gradient(168deg,#24160E 0%,#3A2317 56%,#5A3A22 100%);
}

/* Judul besar: sans tebal, bukan serif seperti Kode Pasangan. Halaman ini
   menjual ketepatan, bukan kehangatan — dan huruf berkait membuat kalimat
   pertamanya terbaca seperti puisi, padahal isinya bantahan. */
body.karier .kait h1{
  font-weight:600;font-size:clamp(31px,7.4vw,46px);
  line-height:1.14;letter-spacing:-.012em;
}
body.karier .kait h1 em{color:var(--emas);font-style:normal}
body.karier .kait .sub{color:rgba(245,231,218,.84)}
body.karier .bag h2{font-weight:600;font-size:clamp(25px,6vw,33px);
                    line-height:1.2;letter-spacing:-.01em}

body.karier .kotak-harga{
  background:linear-gradient(165deg,#24160E 0%,#3A2317 100%);
  box-shadow:0 6px 30px rgba(36,22,14,.30);
}
body.karier .kh-angka{color:var(--emas)}
body.karier .kh-hemat{color:#F7DCC3}

/* Daftar keluhan: guratan bara di sisi kiri. */
body.karier .sakit li{border-left:3px solid #E8B583}
body.karier .jawab-sakit{color:var(--aksi-tua)}

/* Daftar bab: judul dan catatannya DITUMPUK, tidak berdampingan.
   `.bab li` di jual.css berbentuk flex satu baris, dan itu pas untuk Kode
   Pasangan yang catatannya pendek. Judul bab di sini jauh lebih panjang
   ("Kondisi kerja yang menaikkan dan menurunkan hasilmu") — di satu baris,
   catatan yang panjang memeras judulnya sampai tinggal 87px dan judul itu
   pecah jadi dua baris sempit di sebelah kiri. Judulnya yang dijual, jadi
   judulnya yang harus utuh dan dibaca duluan. */
body.karier .bab li{flex-wrap:wrap;align-items:baseline;row-gap:5px;
                    padding:16px 0}
body.karier .bab .jd{flex:1 1 auto;min-width:0;font-size:17px;line-height:1.35}
body.karier .bab .kcl{flex:1 0 100%;margin-left:38px;font-size:14px;
                      line-height:1.65;color:var(--abu2)}

/* Kalimat penutup daftar bab. Dibedakan dari .pengantar karena letaknya
   SESUDAH daftar, bukan sebelum — kalau warnanya sama, ia terbaca seperti
   butir ketujuh yang lupa dinomori. */
body.karier .tutup-bab{
  margin-top:22px;padding-top:18px;border-top:1px solid var(--garis);
  color:var(--abu2);font-size:15px;line-height:1.75;
}
body.karier .tutup-bab b{color:var(--tinta);font-weight:600}