/* L4 · #lampiran-lingkup (milik S3). Semua pemilih diawali #lampiran-lingkup atau .ld__
   Tiga kartu sejajar: komponen (daftar bernomor 01–08), kesiapan 0–3 (tangga naik), risiko (tiga tingkat). */

#lampiran-lingkup .scene__sticky { grid-template-rows: auto auto; align-content: center; }
#lampiran-lingkup .ld__panel { height: auto; flex-direction: column; align-items: stretch; justify-content: flex-start; }
.ld__tiga { width: 100%; display: grid; grid-template-columns: 1.1fr 1fr 1fr; gap: calc(var(--u) * 1.3); align-items: stretch; }
.ld__kartu {
  position: relative; display: flex; flex-direction: column; gap: calc(var(--u) * .8);
  padding: calc(var(--u) * 1.1) calc(var(--u) * 1.3) calc(var(--u) * 1.2);
  background: var(--c-card); border: 1px solid var(--c-line); border-radius: 12px;
}
.ld__kartu h3 { margin: 0; font-size: max(16px, calc(var(--u) * 1.1)); font-weight: 700; color: var(--c-fg); }
.ld__label { position: static; align-self: flex-start; margin-top: auto; }

/* Delapan komponen, bernomor 01–08 seperti Proposal */
.ld__komponen { list-style: none; margin: 0; padding: 0; counter-reset: ld; display: flex; flex-direction: column; }
.ld__komponen li {
  counter-increment: ld; display: flex; gap: .8em; align-items: baseline;
  padding: calc(var(--u) * .42) 0; border-top: 1px solid var(--c-line);
  font-size: max(15px, calc(var(--u) * .98)); line-height: 1.3; color: var(--c-fg);
}
.ld__komponen li:first-child { border-top: 0; }
.ld__komponen li::before { content: counter(ld, decimal-leading-zero); flex: none; min-width: 1.6em; font-family: var(--display); font-weight: 700; color: var(--c-accent); }

/* Kesiapan data 0–3: batang naik, tingkat 3 paling tegas */
.ld__siap { flex: 1; list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; justify-content: space-evenly; gap: calc(var(--u) * .9); }
.ld__siap li { display: grid; grid-template-columns: calc(var(--u) * 5.6) auto 1fr; align-items: center; gap: .7em; font-size: max(15px, calc(var(--u) * .98)); line-height: 1.3; color: var(--c-fg); }
.ld__siap i { display: block; height: calc(var(--u) * 1.5); width: calc(var(--t) * 25%); border-radius: 4px; background: color-mix(in srgb, var(--accent) calc(var(--t) * 22%), var(--c-card-2)); border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); }
.ld__siap b { font-family: var(--display); font-weight: 700; font-size: 1.15em; color: var(--c-accent); min-width: .8em; }

/* Risiko: tiga tingkat, penanda tiga bilah (terisi sesuai tingkat), tanpa merah */
.ld__risiko { flex: 1; list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; justify-content: space-evenly; gap: calc(var(--u) * 1.1); }
.ld__r { display: flex; align-items: flex-start; gap: .85em; }
.ld__r p { margin: 0; font-size: max(15px, calc(var(--u) * 1.05)); line-height: 1.38; color: var(--c-fg-2); }
.ld__r b { display: block; margin-bottom: .1em; }
.ld__r b { color: var(--c-fg); font-weight: 700; }
.ld__tingkat { flex: none; display: inline-flex; align-items: flex-end; gap: 3px; height: 1.3em; margin-top: .1em; }
.ld__tingkat i { width: 5px; border-radius: 1.5px; background: var(--c-line-2); }
.ld__tingkat i:nth-child(1) { height: 45%; }
.ld__tingkat i:nth-child(2) { height: 72%; }
.ld__tingkat i:nth-child(3) { height: 100%; }
.ld__r--tinggi .ld__tingkat i { background: var(--c-accent-fill); }
.ld__r--sedang .ld__tingkat i:nth-child(-n+2) { background: var(--c-accent-fill); }
.ld__r--rendah .ld__tingkat i:nth-child(1) { background: var(--c-accent-fill); }

@media (max-width: 860px) {
  .ld__tiga { grid-template-columns: 1fr; }
}
