/* Bar bawah di semua halaman contoh — mengarahkan pengunjung kembali ke WREVIA */
.demo-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 999;
  display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap;
  padding: 10px 16px; background: #0b1b3f; color: #c8d4ef;
  font: 500 13px/1.4 "Plus Jakarta Sans", system-ui, sans-serif; text-align: center;
  box-shadow: 0 -6px 20px rgba(0,0,0,.18);
}
.demo-bar b { color: #fff; }
.demo-bar a {
  display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border-radius: 99px;
  background: #1463ff; color: #fff; font-weight: 700; text-decoration: none; white-space: nowrap;
}
.demo-bar a:hover { background: #0a4fe0; }
.demo-bar a.ghost { background: transparent; border: 1px solid rgba(255,255,255,.3); }
body { padding-bottom: 64px; }
@media (max-width: 640px) {
  .demo-bar { gap: 8px; font-size: 12px; padding: 8px 12px; }
  .demo-bar .demo-text { width: 100%; }
  .demo-bar a { padding: 7px 12px; font-size: 12px; }
  body { padding-bottom: 96px; }
}