/* Blok "proyek lain dari Nopal Brainwork", sama di semua situs. Isi: ekosistem.json; markup: ekosistem.js dan blok.py.
   Warna bawaan = merek Brainwork; Skalarium memakai warna navy sendiri lewat data-ekosistem="skalarium". */
.eko {
  --eko-panel: #15121F; --eko-garis: #2C2642; --eko-aksen: #7B2FBE; --eko-aksen-t: #9A55DB;
  --eko-emas: #F5C107; --eko-di-emas: #0A0A0F; --eko-teks: #F6F3FB; --eko-redup: #B9AFCC;
  margin: 44px 0 0; padding: 0; text-align: left; color: var(--eko-teks);
  font-family: inherit; /* teks isi ikut font halaman (Poppins di tiga situs, Inter di Skalarium); judul dan tombol tetap Poppins */
}
.eko[data-ekosistem="skalarium"] {
  --eko-panel: #151D36; --eko-garis: #26325A; --eko-aksen: #FFC94D; --eko-aksen-t: #FFE08F;
  --eko-emas: #FFC94D; --eko-di-emas: #0B1222; --eko-teks: #EEF2FF; --eko-redup: #A4AECB;
}
.eko, .eko *, .eko *::before, .eko *::after { box-sizing: border-box; }
.eko { container-type: inline-size; }
.eko .eko-judul {
  margin: 0 0 14px; padding: 0; color: var(--eko-teks); text-wrap: balance;
  font: 700 clamp(20px, 5.4vw, 24px)/1.25 "Poppins", system-ui, sans-serif; letter-spacing: -0.01em;
}
.eko .eko-daftar { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.eko .eko-kartu {
  margin: 0; padding: 18px 18px 18px 20px; background: var(--eko-panel);
  border: 1px solid var(--eko-garis); border-left: 3px solid var(--eko-aksen); border-radius: 12px;
  display: flex; flex-direction: column; align-items: flex-start;
}
.eko .eko-jenis { margin: 0 0 4px; font-size: 13px; line-height: 1.4; font-weight: 500; color: var(--eko-redup); }
.eko .eko-kartu h3 {
  margin: 0 0 6px; padding: 0; color: var(--eko-teks); text-wrap: balance;
  font: 600 18px/1.3 "Poppins", system-ui, sans-serif; letter-spacing: 0;
}
.eko .eko-isi { margin: 0 0 8px; font-size: 15px; line-height: 1.6; color: var(--eko-redup); max-width: 38rem; }
.eko .eko-isi.eko-catatan { color: var(--eko-teks); }
.eko .eko-aksi { display: flex; flex-wrap: wrap; gap: 10px; margin: auto 0 0; padding-top: 14px; width: 100%; }
.eko .eko-tombol {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 20px;
  border-radius: 12px; background: var(--eko-emas); color: var(--eko-di-emas); text-decoration: none;
  font: 600 15px/1.2 "Poppins", system-ui, sans-serif;
}
.eko .eko-tombol:hover { filter: brightness(1.08); }
.eko .eko-tombol.tipis { background: transparent; color: var(--eko-teks); border: 1.5px solid var(--eko-garis); }
.eko .eko-tombol.tipis:hover { filter: none; border-color: var(--eko-aksen-t); }
.eko a:focus-visible { outline: 2px solid var(--eko-emas); outline-offset: 3px; }
@media (max-width: 480px) { .eko .eko-tombol { width: 100%; } }
/* Tempat lega (mis. Brainwork.id): kartu berjajar */
@container (min-width: 760px) {
  .eko .eko-daftar { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 14px; }
  .eko .eko-isi { max-width: none; }
}
