/* Foto galeri dan pembesaran. */
#gallery-list.gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.gallery-photo { display:block; width:100%; aspect-ratio:4/3; padding:0; overflow:hidden; border:0; border-radius:1rem; background:#e2e8f0; cursor:zoom-in; box-shadow:0 8px 24px rgba(15,48,71,.08); }
.gallery-photo img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .2s ease; }
.gallery-photo:hover img { transform:scale(1.04); }
.gallery-lightbox { position:fixed; inset:0; width:min(94vw,1040px); max-width:1040px; height:min(92dvh,850px); max-height:92dvh; margin:auto; padding:2.5rem 1rem 1rem; border:0; border-radius:1rem; background:#071522; box-shadow:0 25px 75px rgba(2,18,36,.5); }
.gallery-lightbox::backdrop,.choice-dialog::backdrop { background:rgba(4,22,39,.68); }
.gallery-lightbox img { display:block; width:100%; height:100%; object-fit:contain; }
.gallery-lightbox button { position:absolute; top:.5rem; right:.6rem; display:grid; place-items:center; width:2rem; height:2rem; border:0; border-radius:50%; background:#fff; color:#0f172a; cursor:pointer; }

/* Deskripsi panjang benar-benar dipangkas sampai tombol dibuka. */
#detail-description { white-space:pre-line; overflow-wrap:anywhere; }
#detail-description.description-collapsed { max-height:10.5em; overflow:hidden; -webkit-mask-image:linear-gradient(#000 70%,transparent); mask-image:linear-gradient(#000 70%,transparent); }
.detail-read-more { display:inline-flex; margin:.5rem 0 1rem; min-height:2.6rem; align-items:center; }

/* Testimoni menggunakan rasio gambar asli agar pesan tidak terpotong. */
.testimonial-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(210px,300px); align-items:center; gap:clamp(1.5rem,5vw,4rem); }
.testimonial-layout .section-description { max-width:36rem; }
.testimonial-carousel { display:grid; justify-items:center; gap:.6rem; padding:1.1rem; border:1px solid #dceaf5; border-radius:1.3rem; background:linear-gradient(155deg,#f0f9ff,#fff); }
.testimonial-viewport { display:flex; justify-content:center; width:100%; }
.testimonial-viewport img { display:block; width:auto; max-width:100%; height:min(52vw,440px); object-fit:contain; }
.testimonial-controls { display:flex; align-items:center; justify-content:center; gap:1.2rem; width:100%; color:#475569; font-size:.85rem; font-weight:700; }
.testimonial-controls button { display:grid; place-items:center; width:2.5rem; height:2.5rem; border:1px solid #bae6fd; border-radius:50%; background:#fff; color:#0369a1; font-size:1.6rem; cursor:pointer; }
.testimonial-dots { display:flex; justify-content:center; gap:.35rem; }
.testimonial-dots button { width:.55rem; height:.55rem; padding:0; border:0; border-radius:50%; background:#cbd5e1; cursor:pointer; }
.testimonial-dots button[aria-current="true"] { width:1.3rem; border-radius:1rem; background:#0284c7; }

/* Tombol pilihan berbentuk satu kontrol; pilihan tampil pada modal. */
.donation-reference-page .choice-trigger { display:flex; align-items:center; justify-content:space-between; gap:1rem; width:100%; min-height:3rem; padding:.7rem .85rem; border:1px solid #9acfe9; border-radius:.7rem; background:#fff; color:#16435e; font-size:.83rem; font-weight:700; text-align:left; cursor:pointer; }
.choice-trigger span:last-child { color:#0284c7; font-size:1.2rem; }
.donation-reference-page #quantity-wrap .sr-only,.donation-reference-page #package-choice-wrap .sr-only,.donation-reference-page .reference-payment>.sr-only { position:absolute; }
.payment-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6rem; }
.payment-card { display:flex; align-items:center; gap:.65rem; min-width:0; min-height:4.5rem; padding:.7rem; border:1.5px solid #cbd5e1; border-radius:.75rem; background:#fff; color:#334155; text-align:left; cursor:pointer; }
.payment-card[aria-pressed="true"] { border-color:#0284c7; background:#eff8ff; box-shadow:0 0 0 2px rgba(2,132,199,.09); }
.payment-card strong,.payment-card small { display:block; line-height:1.35; }
.payment-card strong { font-size:.78rem; }
.payment-card small { color:#64748b; font-size:.66rem; }
.payment-symbol { display:grid; flex:none; place-items:center; width:2.25rem; height:2.25rem; border-radius:.55rem; background:#e0f2fe; color:#0369a1; font-size:1.3rem; }
.reference-bank-row .bank-modal-trigger { flex:none; min-height:2.25rem; padding:.35rem .5rem; border:1px solid #bae6fd; border-radius:.5rem; background:#fff; color:#0369a1; font-size:.72rem; font-weight:700; cursor:pointer; }
.choice-dialog { position:fixed; inset:auto 0 0; width:min(100%,480px); max-width:480px; max-height:min(78dvh,640px); margin:auto auto 0; padding:0; overflow:hidden; border:0; border-radius:1.15rem 1.15rem 0 0; background:#fff; box-shadow:0 -20px 70px rgba(0,25,49,.25); }
.choice-dialog-head { display:flex; align-items:center; justify-content:space-between; padding:1rem 1.2rem; border-bottom:1px solid #e2e8f0; }
.choice-dialog-head h2 { margin:0; font-size:1rem; }
.choice-dialog-head button { display:grid; place-items:center; width:2rem; height:2rem; border:0; border-radius:50%; background:#f1f5f9; cursor:pointer; }
.choice-dialog-options { display:grid; gap:.5rem; max-height:calc(min(78dvh,640px) - 70px); padding:.85rem 1rem 1.2rem; overflow:auto; }
.choice-option { display:flex; align-items:center; justify-content:space-between; gap:1rem; width:100%; min-height:3.35rem; padding:.7rem .85rem; border:1px solid #e2e8f0; border-radius:.7rem; background:#fff; text-align:left; cursor:pointer; }
.choice-option:hover,.choice-option.is-selected { border-color:#38bdf8; background:#f0f9ff; }
.choice-option strong,.choice-option small { display:block; }
.choice-option strong { color:#0f172a; font-size:.83rem; }
.choice-option small { margin-top:.15rem; color:#64748b; font-size:.73rem; }
.choice-check { color:#0284c7; font-weight:900; }
.donation-prayers { margin-top:1.7rem; padding-top:1.2rem; border-top:1px solid #e2e8f0; }
.donation-prayers h2 { margin:0 0 1rem; color:#0f172a; font-size:1rem; }
.donation-prayers .campaign-donor-list { display:grid; gap:.7rem; }
.donation-prayers .campaign-donor-card { max-width:100%; padding:.9rem; }
.donation-prayers #donation-prayer-more { justify-content:center; margin-top:.8rem; }
@media(max-width:720px) {
  #gallery-list.gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.55rem; }
  .testimonial-layout { grid-template-columns:1fr; }
  .testimonial-viewport img { height:min(76vh,400px); }
}
@media(max-width:390px) {
  .payment-card { gap:.4rem; padding:.55rem; }
  .payment-symbol { width:1.8rem; height:1.8rem; }
  .reference-bank-row { flex-wrap:wrap; }
  .reference-bank-row .bank-modal-trigger { margin-left:auto; }
}
@media(prefers-reduced-motion:reduce) { .gallery-photo img { transition:none; } }
