/* Token warna template (ungu elegan).
   Semua komponen di /css-assets/components/ memakai variabel ini,
   jadi ganti palet cukup di satu tempat. */
:root {
  /* Aksen ungu */
  --c-accent: #9d4edd;          /* aksen utama: border, glow, ikon aktif */
  --c-accent-light: #c77dff;    /* aksen terang: tautan, highlight */
  --c-accent-pale: #e0aaff;     /* lavender: ujung gradien teks */
  --c-accent-mid: #7b2cbf;      /* hover tombol, garis gradien */
  --c-accent-deep: #5a189a;     /* ujung bawah gradien tombol */
  --c-accent-dark: #3c096c;     /* border tombol, awal gradien */
  --c-accent-night: #2a0a4a;    /* tepi gradien garis panel */
  --c-accent-rgb: 157, 78, 221; /* untuk rgba(var(--c-accent-rgb), a) */

  /* Latar gelap */
  --c-bg-panel: #0a0612;        /* panel/kartu */
  --c-bg-item: #130b1e;         /* item di dalam panel */
  --c-bg-sunken: #0f0818;       /* area jawaban/terbenam */

  /* Teks di atas latar gelap */
  --c-text-title: #ffffff;
  --c-text-body: #e4d9f2;       /* paragraf, jawaban, teks tombol FAQ */
  --c-text-muted: #b9a6d1;      /* sub-judul, keterangan */
  --c-text-faint: #8f6bb5;      /* footer kecil, label */
  --c-link: var(--c-accent-light);
  --c-link-hover: var(--c-accent-pale);

  /* Tombol utama */
  --c-btn-text: #ffffff;
  --c-btn-gradient: linear-gradient(to bottom, var(--c-accent) 0, var(--c-accent-deep) 100%);
  --c-btn-gradient-hover: linear-gradient(to bottom, var(--c-accent-light) 0, var(--c-accent-mid) 100%);
  --c-btn-border: var(--c-accent-dark);
}