[Feature]: Terapkan pola komponen Joko UI pada antarmuka

[wauputr4]

Problem

Setelah PR #19 digabung, iterasi berikutnya perlu merapikan konsistensi visual antarmuka dengan pola komponen aplikasi yang lebih matang. Perubahan ini harus fokus pada UI tanpa mengubah pesan atau isi situs yang sudah ada.

Proposal

Gunakan Joko UI sebagai referensi implementasi:

• Katalog: https://www.jokoui.web.id/components/application
• Source: https://github.com/rayasabari/joko-ui

Terapkan pola yang relevan pada komponen yang sudah tersedia, seperti navigation, cards, buttons, badges, forms atau inputs, dan breadcrumbs. Adaptasikan ke arsitektur Astro dan CSS yang sekarang; tidak perlu menambah framework UI atau Tailwind hanya untuk pekerjaan ini.

Scope

• Rapikan hierarchy, spacing, state interaktif, dan konsistensi komponen.
• Pertahankan responsive behavior untuk desktop dan mobile.
• Pertahankan accessibility dasar: semantic HTML, keyboard focus, label, dan contrast.
• Sertakan screenshot sebelum dan sesudah pada PR.

Di luar scope

• Jangan mengubah copywriting, teks, label navigasi, atau CTA.
• Jangan menambah, menghapus, atau mengubah konten blog maupun data proyek.
• Jangan mengubah struktur informasi, route, atau menambah fitur baru.

Acceptance criteria

• Seluruh copy dan konten sama dengan kondisi main saat task dimulai.
• Route dan fungsi yang sudah ada tetap berjalan.
• Tampilan konsisten dan responsive pada viewport desktop serta mobile.
• npm test dan npm run build lulus.

Lanjutkan dari main terbaru setelah PR #19.

Alternatives

Menggunakan Joko UI sebagai referensi visual dan source pattern lebih ringan daripada memasukkan framework atau dependency UI baru.