/* Kids' pocket money apps comparison (BM /perbandingan/aplikasi-duit-belanja-anak/, EN /en/compare/kids-pocket-money-apps-malaysia/).
   Builds on vs.css, compare.css and best-apps.css; only the two-kinds tiles and the combine steps live here. */
.pm-kinds { list-style: none; margin: 0; padding: 0; max-width: none; display: grid; gap: var(--s4); grid-template-columns: 1fr; }
@media (min-width: 52rem) { .pm-kinds { grid-template-columns: repeat(2, 1fr); gap: var(--s5); } }
.pm-kinds > li { margin: 0; display: flex; flex-direction: column; gap: var(--s3); padding: var(--s8) var(--pad-card); background: var(--bg); border-radius: var(--radius-card); box-shadow: inset 0 0 0 1px var(--border); }
.pm-kinds h3 { margin: 0; font-size: var(--t-lead); line-height: 1.3; }
.pm-kinds p { margin: 0; color: var(--muted); font-size: var(--t-small); max-width: 52ch; }
.pm-kinds ul { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--s2); }
.pm-kinds ul li { position: relative; margin: 0; padding-left: var(--s5); font-size: var(--t-small); }
.pm-kinds ul li::before { content: ""; position: absolute; left: var(--s1); top: .62em; width: 6px; height: 6px; border-radius: var(--radius-pill); background: var(--border); }
.pm-kinds .pm-eg { margin-top: auto; padding-top: var(--s3); border-top: 1px solid var(--hairline); color: var(--text); font-weight: var(--wt-medium); }
.pm-steps { margin: 0; padding: 0 0 0 var(--s6); display: grid; gap: var(--s3); max-width: 75ch; }
.pm-steps li { margin: 0; padding-left: var(--s2); }
.pm-steps li::marker { color: var(--muted); font-weight: var(--wt-medium); }
.pm-steps + .ba-disclose { margin-top: var(--s8); }