/* Campaign landing page + shared look for the donor portal. */
.cpage { display: block; padding: 0; }
.cwrap { max-width: 680px; margin: 0 auto; padding: 30px 20px 60px; }
.chead { text-align: center; margin-bottom: 26px; }
.clogo { height: 42px; }

.chero {
  background: #fff; border: 1px solid var(--line); border-radius: 0 24px 0 24px;
  box-shadow: 0 18px 50px rgba(15, 34, 19, .1); padding: 30px 30px 26px;
}
.chero h1 { margin: 0 0 10px; font-size: 27px; color: var(--deep); line-height: 1.22; }
.cdesc { margin: 0 0 20px; color: var(--ink-55); font-size: 15.5px; line-height: 1.6; }

.cmatch {
  background: rgba(249, 26, 100, .08); border: 1px solid rgba(249, 26, 100, .3);
  color: var(--pink-dark); border-radius: 12px; padding: 12px 15px;
  font-size: 14px; font-weight: 600; margin-bottom: 20px; line-height: 1.5;
}

.cgoal { margin-bottom: 22px; }
.cbar { background: var(--cream); border-radius: 20px; height: 12px; overflow: hidden; }
.cfill { height: 100%; background: var(--green); border-radius: 20px; transition: width .6s ease; }
.cstats { display: flex; gap: 26px; margin-top: 14px; flex-wrap: wrap; }
.cstats.solo { margin-bottom: 22px; }
.cstats div { display: flex; flex-direction: column; }
.cstats strong { font-size: 21px; color: var(--deep); font-weight: 800; }
.cstats span { font-size: 12px; color: var(--ink-55); margin-top: 2px; }

.clabel { font-size: 13px; font-weight: 600; color: var(--ink-55); margin: 0 0 10px; }
.camounts { display: grid; grid-template-columns: repeat(auto-fit, minmax(84px, 1fr)); gap: 8px; }
.camt {
  padding: 13px 6px; font: inherit; font-size: 16px; font-weight: 700;
  border: 1.5px solid var(--line); background: #fff; color: var(--deep);
  border-radius: 10px; cursor: pointer; transition: all .12s ease;
}
.camt:hover { border-color: var(--green); }
.camt.on { border-color: var(--green); background: var(--green); color: #fff; }
.camt.other { font-size: 14px; }

.cbtn {
  display: block; margin-top: 18px; padding: 16px; text-align: center;
  background: var(--pink); color: #fff; font-weight: 700; font-size: 16.5px;
  border-radius: 10px; text-decoration: none;
}
.cbtn:hover { background: var(--pink-dark); }
.cnote { text-align: center; color: var(--ink-55); font-size: 12.5px; margin: 14px 0 0; }
.cfoot { text-align: center; margin-top: 22px; font-size: 13px; }
.cfoot a { color: var(--ink-55); }

/* ---- donor portal ---- */
.dwrap { max-width: 720px; margin: 0 auto; padding: 30px 20px 70px; }
.dcard2 {
  background: #fff; border: 1px solid var(--line); border-radius: 0 20px 0 20px;
  box-shadow: 0 14px 40px rgba(15, 34, 19, .08); padding: 26px; margin-bottom: 18px;
}
.dcard2 h2 { margin: 0 0 6px; font-size: 21px; color: var(--deep); }
.dsub { color: var(--ink-55); font-size: 14px; margin: 0 0 18px; line-height: 1.55; }
.dstats { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 12px; margin-bottom: 6px; }
.dstat { background: var(--cream); border-radius: 12px; padding: 14px; }
.dstat b { display: block; font-size: 19px; color: var(--deep); }
.dstat span { font-size: 12px; color: var(--ink-55); }
.dtable { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.dtable th {
  text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .4px;
  color: var(--ink-55); padding: 10px 8px; border-bottom: 1px solid var(--line);
}
.dtable td { padding: 11px 8px; border-bottom: 1px solid #f1f0ea; }
.dtable tr:last-child td { border-bottom: 0; }
.dl { color: var(--pink); text-decoration: underline; font-size: 12.5px; background: none; border: 0; cursor: pointer; font-family: inherit; }
.plan {
  display: flex; justify-content: space-between; align-items: center; gap: 14px;
  background: rgba(85, 185, 106, .08); border: 1px solid rgba(85, 185, 106, .3);
  border-radius: 12px; padding: 14px 16px; margin-bottom: 10px; flex-wrap: wrap;
}
.plan strong { color: var(--deep); }
.cancel {
  border: 1.5px solid #f3c2ce; background: #fff; color: var(--pink-dark);
  border-radius: 8px; padding: 7px 13px; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
}
.cancel:hover { background: #fdecef; }
@media (max-width: 560px) {
  .chero { padding: 22px 18px; border-radius: 0 18px 0 18px; }
  .chero h1 { font-size: 22px; }
  .dtable { font-size: 12.5px; }
}

/* ---- donor manages their own plan (2026-09-24, MASTER §22 B3) ---- */
.plan { flex-wrap: wrap; }
.plan-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.pbtn { border: 1.5px solid var(--line); background: #fff; color: var(--deep); border-radius: 9px; padding: 7px 11px;
  font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.pbtn:hover { border-color: var(--green); }
.plan-panel { flex: 1 1 100%; margin-top: 12px; padding: 14px; background: var(--cream); border-radius: 12px; }
.plan-panel .row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 10px; }
.plan-panel .input { max-width: 220px; }
.plan-panel p { margin: 0 0 6px; font-size: 14px; line-height: 1.5; }
.plan-warn { color: #a16207; font-weight: 600; }
.stmt { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 0;
  border-bottom: 1px solid var(--line); font-size: 14px; }
.stmt:last-child { border-bottom: 0; }
