/* ==========================================================================
   Override CSS milik situs ini (bukan bagian dari theme).
   Dimuat dari layouts/partials/meta.html.

   Kenapa pakai !important: theme memuat /css/main.css SETELAH partial ini,
   jadi tanpa !important seluruh aturan di sini kalah spesifisitas urutan.
   Theme tidak menyediakan hook custom CSS, dan meng-override head.html
   berarti menyalin >100 baris yang akan usang saat theme di-update.
   ========================================================================== */

/* --- Perbaikan marquee "What I Work With" -------------------------------
   Theme memberi jarak antar-item dengan `gap: 1.5rem` pada track flex,
   lalu menganimasikan translateX(0) -> translateX(-50%).

   Trik marquee ini hanya mulus kalau -50% persis sama dengan lebar satu set
   item. Padahal dengan `gap`, lebar total = 2n·w + (2n-1)·g, sehingga
   setengahnya = n·w + (2n-1)·g/2 — meleset setengah gap dari yang dibutuhkan
   (n·w + n·g). Selisih itulah yang terlihat sebagai "lompatan" tiap putaran.

   Perbaikannya: hapus gap, pindahkan jaraknya jadi margin-right tiap item.
   Dengan begitu lebar total = 2n·(w+g) dan -50% jatuh tepat di batas set.  */
.tech-strip-track {
  gap: 0 !important;
  will-change: transform;
}

.tech-strip-item {
  margin-right: 1.5rem !important;
}

/* --- Inline code di layar sempit ------------------------------------------
   Baris tech stack di /resume cukup panjang (mis. 87 karakter). Theme tidak
   memberi nowrap sehingga sudah membungkus normal, tapi latar dan border-nya
   ikut terpotong tidak rapi saat pindah baris. box-decoration-break membuat
   tiap potongan baris mendapat latar & border sendiri.                      */
.markdown-body :not(pre) > code {
  overflow-wrap: anywhere;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

/* Hormati preferensi pengguna yang mengurangi animasi. */
@media (prefers-reduced-motion: reduce) {
  .tech-strip-track {
    animation: none !important;
    transform: none !important;
  }
  .tech-strip {
    overflow-x: auto;
  }
}