.give-page { background:var(--cream); }
.give-page .topbar { border-bottom:1px solid rgba(23,61,34,.14); }

.give-hero { position:relative; overflow:hidden; padding:110px 0 130px; background:#edf4e7; }
.give-hero::before { position:absolute; top:-180px; right:-90px; width:560px; height:560px; border:100px solid rgba(67,185,236,.23); border-radius:50%; content:''; }
.give-hero::after { position:absolute; right:-30px; bottom:-230px; width:670px; height:380px; border-radius:50%; background:rgba(105,184,31,.23); content:''; transform:rotate(-7deg); }
.give-hero-inner { position:relative; z-index:1; }
.give-hero h1 { max-width:920px; margin:0; color:var(--deep); font-family:var(--serif); font-size:clamp(3.5rem,7vw,6.8rem); letter-spacing:-.04em; line-height:1.08; }
.give-hero h1 span { color:var(--green); }
.give-hero-inner > p:not(.kicker) { max-width:700px; margin:30px 0; color:#465648; font-size:1.05rem; line-height:1.85; }
.give-primary,.giving-option a,.giving-help a { display:inline-flex; min-height:52px; align-items:center; padding:12px 28px; border-radius:999px; color:#fff; background:var(--green); font-size:.76rem; font-weight:700; letter-spacing:.08em; text-decoration:none; text-transform:uppercase; }
.give-primary:hover,.give-primary:focus-visible,.giving-option a:hover,.giving-help a:hover { color:#fff; background:var(--sky); }

.give-intro { padding:clamp(85px,9vw,125px) 0; background:#fff; }
.give-intro-grid { display:block; width:min(880px,calc(100% - 40px)); text-align:center; }
.give-intro-grid > .kicker { margin-bottom:18px; }
.give-intro h2,.ways-heading h2,.principles-grid h2,.giving-help h2 { margin:0; color:var(--deep); font-family:var(--serif); font-size:clamp(2.5rem,4.6vw,4.2rem); line-height:1.25; }
.give-intro-grid > div > p { max-width:720px; margin:24px auto 0; color:#526154; line-height:1.9; }

.building-project { position:relative; overflow:hidden; padding:clamp(90px,10vw,140px) 0; color:#fff; background:var(--forest); }
.building-project::before { position:absolute; top:-210px; left:-170px; width:470px; height:470px; border:80px solid rgba(105,184,31,.14); border-radius:50%; content:''; }
.building-project-inner { position:relative; display:grid; grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr); gap:clamp(36px,5vw,70px); align-items:center; }
.building-project .kicker { color:var(--gold); }
.building-project h2 { margin:0; color:#fff; font-family:var(--serif); font-size:clamp(2.45rem,4.4vw,4rem); line-height:1.18; }
.building-project-copy { padding-left:28px; border-left:4px solid var(--green); }
.building-project-copy > p:not(.kicker) { max-width:570px; margin:26px 0 0; color:rgba(255,255,255,.82); font-size:1.02rem; line-height:1.9; }
.building-project-image { min-width:0; margin:0; }
.building-project-image img { display:block; width:100%; height:auto; border:8px solid rgba(255,255,255,.96); box-shadow:18px 18px 0 rgba(8,43,22,.32); }
.building-project-image figcaption { margin:18px 0 0 8px; color:rgba(255,255,255,.72); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; }
.building-project-progress { grid-column:1/-1; padding:clamp(30px,5vw,48px); color:var(--deep); border-top:6px solid var(--green); background:#fff; box-shadow:0 22px 55px rgba(8,43,22,.22); }
.building-project-totals { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.building-project-totals > div + div { padding-left:28px; border-left:1px solid rgba(23,61,34,.16); }
.building-project-totals span { display:block; margin-bottom:8px; color:var(--green); font-size:.68rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.building-project-totals strong { display:block; color:var(--deep); font-family:var(--serif); font-size:clamp(1.35rem,2.6vw,2.15rem); line-height:1.25; overflow-wrap:anywhere; }
.building-progress-track { height:18px; overflow:hidden; margin-top:36px; border-radius:999px; background:#e5eadf; }
.building-progress-track span { position:relative; display:block; height:100%; overflow:hidden; border-radius:inherit; background:var(--green); transform:scaleX(0); transform-origin:left center; animation:building-progress-fill 1.4s cubic-bezier(.22,1,.36,1) .25s forwards; }
.building-progress-track span::after { position:absolute; inset:0; background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.55) 50%,transparent 80%); content:''; transform:translateX(-120%); animation:building-progress-shine 2.2s ease-in-out 1.15s infinite; }
@keyframes building-progress-fill { to { transform:scaleX(1); } }
@keyframes building-progress-shine { to { transform:translateX(120%); } }
.building-project-progress > p { margin:16px 0 0; color:#526154; font-size:.82rem; letter-spacing:.04em; }
.building-project-progress > p strong { margin-right:5px; color:var(--deep); font-size:1.15rem; }

.ways-to-give { padding:clamp(90px,10vw,145px) 0; background:var(--cream); }
.ways-heading { margin-bottom:48px; }
.giving-options { display:grid; grid-template-columns:1fr 1fr; gap:22px; align-items:start; }
.giving-option { display:grid; min-height:0; grid-template-rows:auto auto; align-self:start; gap:48px; padding:clamp(32px,5vw,52px); border:1px solid rgba(23,61,34,.14); background:#fff; }
.giving-option:last-child { grid-column:auto; min-height:0; }
.giving-option:last-child { color:#fff; border-color:var(--forest); background:var(--forest); }
.giving-option:last-child .option-number { color:rgba(255,255,255,.42); }
.giving-option:last-child .option-label { color:var(--gold); }
.giving-option:last-child h3 { color:#fff; }
.giving-option:last-child div > p:not(.option-label) { color:rgba(255,255,255,.9); }
.featured-option { color:#fff; border-color:var(--deep); background:var(--deep); }
.gcash-option.featured-option { border-color:var(--forest); background:var(--forest); }
.gcash-option.featured-option .option-number { color:rgba(255,255,255,.42); }
.gcash-option.featured-option .option-label { color:var(--gold); }
.gcash-option.featured-option div > p:not(.option-label) { color:rgba(255,255,255,.9); }
.option-number { color:rgba(105,184,31,.35); font-family:var(--cond); font-size:4.2rem; font-weight:800; line-height:.8; }
.giving-option > div { align-self:start; }
.option-label { margin:0 0 9px; color:var(--green); font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.giving-option h3 { margin:0 0 17px; color:var(--deep); font-family:var(--serif); font-size:clamp(1.7rem,3vw,2.4rem); }
.featured-option h3 { color:#fff; }
.giving-option div > p:not(.option-label) { margin:0 0 25px; color:#526154; font-size:.92rem; line-height:1.8; }
.featured-option div > p:not(.option-label) { color:rgba(255,255,255,.72); }
.bank-details { display:grid; gap:12px; margin:24px 0 0; }
.bank-details > div { padding:15px 18px; border-left:4px solid var(--green); background:#edf4e7; }
.bank-details dt { margin:0 0 3px; color:#526154; font-size:.66rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.bank-details dd { margin:0; color:var(--deep); font-family:var(--serif); font-size:clamp(1.05rem,2vw,1.35rem); font-weight:700; overflow-wrap:anywhere; }
.gathering-schedule { display:grid; gap:0; margin:26px 0 0; border-top:1px solid rgba(23,61,34,.14); }
.gathering-schedule > div { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px 0; border-bottom:1px solid rgba(23,61,34,.14); }
.gathering-schedule dt { color:var(--deep); font-size:.78rem; font-weight:700; }
.gathering-schedule dd { margin:0; color:var(--green); font-family:var(--cond); font-size:1.05rem; font-weight:800; letter-spacing:.04em; white-space:nowrap; }
.office-option a { margin-top:4px; color:var(--forest); background:#fff; }
.office-option a:hover { color:var(--deep); background:var(--gold); }
.bank-option { height:100%; align-self:stretch; }
.gcash-option-content { display:grid; grid-template-columns:minmax(0,1fr); gap:28px; }
.gcash-qr { width:min(100%,300px); margin:0; padding:14px; border:1px solid rgba(23,61,34,.14); border-radius:18px; background:#fff; box-shadow:0 18px 40px rgba(8,43,22,.12); }
.gcash-qr img { width:100%; aspect-ratio:1; object-fit:contain; }

.giving-principles { padding:clamp(90px,10vw,140px) 0; color:#fff; background:var(--forest); }
.principles-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(60px,9vw,130px); }
.principles-grid h2 { color:#fff; }
.principles-list article { display:grid; grid-template-columns:60px 1fr; gap:22px; padding:24px 0; border-top:1px solid rgba(255,255,255,.17); }
.principles-list b { color:var(--gold); font-family:var(--cond); font-size:1.5rem; }
.principles-list h3 { margin:0 0 8px; color:#fff; font-family:var(--serif); font-size:1.45rem; }
.principles-list p { margin:0; color:rgba(255,255,255,.68); line-height:1.75; }

.mission-points { padding:clamp(90px,10vw,140px) 0; background:#fff; }
.mission-points-layout { display:grid; grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); gap:clamp(48px,7vw,96px); align-items:center; }
.mission-points-heading { max-width:760px; }
.mission-points-heading h2 { margin:0; color:var(--deep); font-family:var(--serif); font-size:clamp(2.2rem,3.8vw,3.5rem); line-height:1.25; }
.mission-points-heading > p:not(.kicker) { max-width:680px; margin:22px 0 0; color:#526154; line-height:1.85; }
.mission-points-list { margin:38px 0 0; padding:0; border-top:1px solid rgba(23,61,34,.16); list-style:none; }
.mission-points-list li { display:grid; grid-template-columns:48px 1fr; gap:16px; align-items:center; padding:17px 0; border-bottom:1px solid rgba(23,61,34,.16); }
.mission-points-list span { color:var(--green); font-family:var(--cond); font-size:1.05rem; font-weight:800; }
.mission-points-list strong { color:var(--deep); font-family:var(--serif); font-size:clamp(1rem,1.7vw,1.25rem); }
.mission-points-feature { min-width:0; margin:0; }
.mission-points-feature img { display:block; width:100%; aspect-ratio:1; object-fit:cover; object-position:center; box-shadow:18px 18px 0 #edf4e7; }

.giving-help { padding:90px 0; background:#edf4e7; }
.giving-help-inner { display:grid; grid-template-columns:1fr auto; gap:60px; align-items:center; }
.giving-help p:not(.kicker) { max-width:650px; margin:18px 0 0; color:rgba(8,43,22,.8); line-height:1.8; }
.giving-help a { background:var(--deep); white-space:nowrap; }

@media(max-width:800px){
  .give-hero { padding:85px 0 100px; }
  .give-intro-grid,.building-project-inner,.giving-options,.principles-grid,.mission-points-layout,.giving-help-inner { grid-template-columns:1fr; }
  .giving-option { min-height:0; }
  .giving-option:last-child { grid-column:auto; min-height:0; }
  .bank-option { height:auto; align-self:start; }
  .gcash-qr { width:min(100%,320px); }
}

@media(max-width:520px){
  .give-hero h1 { font-size:3rem; }
  .building-project-totals { grid-template-columns:1fr; gap:20px; }
  .building-project-copy { padding-left:20px; }
  .building-project-totals > div + div { padding-top:20px; padding-left:0; border-top:1px solid rgba(23,61,34,.16); border-left:0; }
  .mission-points-feature img { aspect-ratio:1; }
  .giving-help a { justify-content:center; white-space:normal; text-align:center; }
}

@media(prefers-reduced-motion:reduce){
  .building-progress-track span { transform:none; animation:none; }
  .building-progress-track span::after { display:none; animation:none; }
}
