/* ============================================================
   WAYS TO HELP PAGE
   ============================================================ */
/* Sub-page hero (shared pattern) */
.subhero{ position:relative; min-height:74svh; display:flex; align-items:flex-end; padding:clamp(140px,20vh,220px) 0 clamp(56px,8vh,90px); overflow:hidden; color:#fff; }
.subhero__media{ position:absolute; inset:0; z-index:-1; }
.subhero__media img{ width:100%; height:100%; object-fit:cover; }
.subhero__veil{ position:absolute; inset:0; background:
  linear-gradient(100deg, rgba(26,22,16,.8) 0%, rgba(26,22,16,.5) 30%, rgba(26,22,16,.1) 60%, rgba(26,22,16,0) 78%),
  linear-gradient(180deg, rgba(26,22,16,.55) 0%, rgba(26,22,16,.1) 20%, rgba(26,22,16,0) 45%, rgba(26,22,16,.45) 85%, rgba(26,22,16,.8) 100%); }
.subhero__content{ text-shadow:0 2px 30px rgba(20,16,10,.4); }
.subhero__eyebrow{ font-size:.82rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:1.4rem; }
.subhero__title{ font-family:var(--display); font-weight:380; font-size:clamp(2.4rem,5.6vw,5rem); line-height:1.04; letter-spacing:-.02em; margin-bottom:1.4rem; }
.subhero__title .line{ display:block; }
.subhero__title em{ font-style:italic; color:var(--gold-soft); }
.subhero__lead{ font-size:clamp(1.05rem,1.5vw,1.25rem); max-width:54ch; color:rgba(255,255,255,.9); line-height:1.65; margin-bottom:2rem; font-weight:350; }
.subhero__cta{ display:flex; flex-wrap:wrap; gap:14px; }

/* Ways grid (reuses .help-card from style.css) */
.wh{ padding:var(--section) 0; background:var(--bg); text-align:center; }
.wh__title{ max-width:22ch; margin:0 auto clamp(40px,5vw,64px); }
.wh__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; text-align:left; }

/* Volunteer feature */
.vol{ padding:var(--section) 0; background:var(--cream-2); }
.vol__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,90px); align-items:center; }
.vol__media{ border-radius:var(--radius-lg); overflow:hidden; }
.vol__media img{ width:100%; aspect-ratio:4/3.2; object-fit:cover; }
.vol__body .h2{ margin:.4rem 0 1.3rem; }
.vol__text{ color:var(--text-soft); font-size:1.08rem; max-width:50ch; }
.vol__list{ list-style:none; margin:1.6rem 0 2rem; display:flex; flex-direction:column; gap:10px; }
.vol__list li{ position:relative; padding-left:26px; color:var(--text); font-size:1rem; }
.vol__list li::before{ content:"\2713"; position:absolute; left:0; color:var(--gold-deep); font-weight:700; }

@media (max-width:1024px){
  .wh__grid{ grid-template-columns:1fr 1fr; }
  .vol__grid{ grid-template-columns:1fr; }
}
@media (max-width:680px){
  .wh__grid{ grid-template-columns:1fr; }
  .subhero__cta .btn{ flex:0 1 auto; }
}