/* =====================================================================
   BX3 BAHAN - judul rata tengah, 3 foto bahan (4:5) + nama + kalimat, garis tipis, lalu 3 angka besar
   (mis. 0 krimer nabati) tepat di tengah atas namanya. HP: foto digeser ke samping, angka tetap sebaris.
   ===================================================================== */

.bx3.bx3-pledge{--bx3-max:1120px;display:block;background:var(--bx3-white);padding:var(--bx3-sec-y) var(--bx3-pad-x)}
.bx3.bx3-pledge--cream{background:var(--bx3-cream)}
.bx3 .bx3-pledge__in{max-width:var(--bx3-max);margin:0 auto}
.bx3 .bx3-pledge__head{display:flex;flex-direction:column;align-items:center;text-align:center}
.bx3 .bx3-pledge__head .bx3-text{max-width:32em}
.bx3 :is(.bx3-pledge__pure,.bx3-pledge__zero){display:grid;grid-template-columns:repeat(var(--bx3-n,3),minmax(0,1fr));gap:clamp(16px,2vw,32px)}
.bx3 .bx3-pledge__head+.bx3-pledge__pure,.bx3 .bx3-pledge__head+.bx3-pledge__zero{margin-top:clamp(48px,5vw,88px)}
.bx3 .bx3-pledge__item{min-width:0;text-align:center}
.bx3 .bx3-pledge__img{aspect-ratio:4/5;border-radius:var(--bx3-r);isolation:isolate}
.bx3 .bx3-pledge__img>img{transition:transform .9s var(--bx3-ease)}
.bx3 .bx3-pledge__item:hover .bx3-pledge__img>img{transform:scale(1.04)}
.bx3 .bx3-pledge__name{margin-top:18px;font-size:var(--bx3-tt,clamp(1.0625rem,1.2vw,1.25rem));font-weight:700;line-height:1.4;color:var(--bx3-ink)}
.bx3 .bx3-pledge__desc{margin-top:6px;font-size:var(--bx3-ts,var(--bx3-fs-sm));line-height:1.7;color:var(--bx3-ink-soft)}
.bx3 .bx3-pledge__pure+.bx3-pledge__zero{margin-top:clamp(40px,4.4vw,72px);padding-top:clamp(40px,4.4vw,72px);border-top:1px solid var(--bx3-line-btn)}
.bx3 .bx3-pledge__z{display:flex;flex-direction:column;align-items:center;gap:clamp(16px,1.8vw,28px);min-width:0;text-align:center}
.bx3 .bx3-pledge__0{display:block;font-size:clamp(4.5rem,8vw,8rem);font-weight:700;line-height:.85;letter-spacing:-.03em;color:var(--bx3-orange);font-variant-numeric:tabular-nums;white-space:nowrap}
.bx3 .bx3-pledge__z .bx3-pledge__name{margin-top:0}

@media (max-width:767px){
  .bx3 .bx3-pledge__pure{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:72%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;margin-left:calc(var(--bx3-pad-x) * -1);margin-right:calc(var(--bx3-pad-x) * -1);padding:0 var(--bx3-pad-x);scroll-padding:0 var(--bx3-pad-x)}
  .bx3 .bx3-pledge__pure::-webkit-scrollbar{display:none}
  .bx3 .bx3-pledge__item{scroll-snap-align:start}
  .bx3 .bx3-pledge__zero{gap:10px}
  .bx3 .bx3-pledge__z{gap:14px}
  .bx3 .bx3-pledge__0{font-size:3.5rem}
  .bx3 .bx3-pledge__z .bx3-pledge__name{font-size:.8125rem;line-height:1.4}
}
@media (prefers-reduced-motion:reduce){
  .bx3 .bx3-pledge__img>img{transition:none}
}
