/* ---- Dumb Pay It Forward Widget.html line 34 ---- */
#dpf{--o:#F75E1C;--wood:linear-gradient(100deg,rgba(0,0,0,.30),rgba(0,0,0,.50) 60%),linear-gradient(rgba(6,5,4,.74),rgba(6,5,4,.74)),url(https://images.squarespace-cdn.com/content/5f257383d68fbe07dae9c644/fc1eaf2a-045d-4028-a23d-7314989c6ac2/Wood+Panel+3.jpg) center/cover no-repeat,#120e0b;
  width:100%;max-width:1180px;margin:0 auto;padding:14px 0 44px;box-sizing:border-box;color:#fff;font-family:'Poppins',sans-serif;text-align:center}
#dpf *,#dpf *::before,#dpf *::after{box-sizing:border-box}
#dpf [hidden]{display:none!important}
#dpf button{font-family:inherit;-webkit-appearance:none;appearance:none}
#dpf a{color:inherit}
.dpf-eyebrow{font-family:'Barlow Condensed','Poppins',sans-serif;font-size:14px;font-weight:600;letter-spacing:2.4px;text-transform:uppercase;color:var(--o);margin:0 0 12px}
.dpf-title{font-family:'Barlow Condensed','Poppins',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.5px;line-height:.95;font-size:clamp(40px,6.2vw,78px);margin:0;color:#fff}
.dpf-sub{max-width:620px;margin:16px auto 0;font-size:16px;line-height:1.55;color:rgba(255,255,255,.72)}
.dpf-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;margin:38px 0 0}
.dpf-card{flex:0 1 256px;max-width:100%;display:flex;flex-direction:column;align-items:center;padding:26px 22px 22px;border-radius:16px;
  border:1px solid rgba(247,94,28,.2);background:var(--wood);transition:transform .2s,border-color .2s,box-shadow .2s}
.dpf-card:hover{transform:translateY(-3px);border-color:rgba(247,94,28,.55);box-shadow:0 16px 40px rgba(0,0,0,.5)}
.dpf-name{font-family:'Barlow Condensed','Poppins',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.5px;line-height:1;font-size:38px;color:#fff;max-width:100%;overflow-wrap:break-word}
/* Long names step down instead of snapping mid-word. */
.dpf-name.is-long{font-size:30px}
.dpf-name.is-xlong{font-size:23px}
.dpf-wants{margin:10px 0 0;font-size:13px;color:rgba(255,255,255,.6)}
.dpf-tier{margin:4px 0 0;font-family:'Barlow Condensed','Poppins',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:1px;line-height:1.1;font-size:21px;color:var(--o)}
.dpf-price{margin:12px 0 18px;font-family:'Barlow Condensed','Poppins',sans-serif;font-weight:700;font-size:24px;letter-spacing:.02em;color:#fff}
#dpf .dpf-btn{margin:auto 0 0;width:100%;padding:11px 18px;border-radius:12px;border:1px solid var(--o);background:var(--o);color:#fff;cursor:pointer;
  font-family:'Barlow Condensed','Poppins',sans-serif !important;font-weight:700;font-size:18px;letter-spacing:1px;text-transform:uppercase;line-height:1.2;
  transition:transform .15s,box-shadow .15s}
.dpf-btn:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(247,94,28,.45)}
.dpf-btn[disabled]{opacity:.6;cursor:default;transform:none;box-shadow:none}
.dpf-msg{margin:10px 0 0;font-size:12.5px;line-height:1.45;color:rgba(255,255,255,.7)}
.dpf-empty{margin:34px auto 0;max-width:520px;font-size:16px;line-height:1.55;color:rgba(255,255,255,.72)}
#dpf .dpf-more{margin:26px 0 0;padding:9px 20px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.35);color:#fff;cursor:pointer;
  font-family:'Barlow Condensed','Poppins',sans-serif !important;font-weight:700;font-size:17px;letter-spacing:1px;text-transform:uppercase}
.dpf-more:hover{border-color:rgba(247,94,28,.55)}
.dpf-foot{margin:34px auto 0;max-width:560px;font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.55)}
#dpf .dpf-foot a{color:var(--o);text-decoration:none;font-weight:600}
#dpf .dpf-foot a:hover{text-decoration:underline}
/* Loading: three quiet card shapes, so the block has its height before data. */
.dpf-skel{flex:0 1 256px;height:236px;border-radius:16px;background:var(--wood);border:1px solid rgba(247,94,28,.14);opacity:.55}
@media (max-width:600px){
  #dpf{padding:6px 0 34px}
  .dpf-sub{font-size:15px}
  .dpf-grid{gap:12px;margin-top:28px}
  .dpf-card,.dpf-skel{flex:1 1 calc(50% - 6px);max-width:calc(50% - 6px);padding:20px 14px 16px}
  .dpf-name{font-size:28px}
  .dpf-name.is-long{font-size:23px}
  .dpf-name.is-xlong{font-size:19px}
  .dpf-tier{font-size:17px}
  .dpf-price{font-size:21px}
  #dpf .dpf-btn{font-size:16px;padding:10px 10px}
}
@media (max-width:360px){
  .dpf-card,.dpf-skel{flex:1 1 100%;max-width:320px}
}