/* ---------- Hero ---------- */
.programs-hero { padding: 64px 0 48px; }
.programs-hero h1 {
  margin-top: 16px;
  font-size: clamp(40px, 6vw, 64px);
  line-height: 1.05;
}
.programs-hero-photo {
  margin: 0;
  border-radius: 14px;
  overflow: hidden;
  aspect-ratio: 4 / 5;
  box-shadow: 0 12px 32px rgba(46, 42, 53, .18);
  max-width: 480px;
}
.programs-hero-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 767.98px) {
  .programs-hero { padding: 36px 0 28px; }
}

/* ---------- Survivor program cards ---------- */
.program-card {
  background: var(--osp-paper);
  border: 1px solid var(--osp-line);
  border-radius: var(--osp-r-lg);
  padding: 32px;
  transition: all 0.25s;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
}
.program-card:hover {
  border-color: var(--osp-plum-300);
  transform: translateY(-2px);
  box-shadow: var(--osp-sh-md);
  text-decoration: none;
  color: inherit;
}
.program-card-icon {
  width: 52px; height: 52px;
  background: var(--osp-plum-50);
  border-radius: var(--osp-r-md);
  display: flex; align-items: center; justify-content: center;
  color: var(--osp-plum-700);
  margin-bottom: 22px;
  font-size:20px;
}
.program-card h3 {
  font-family: var(--osp-font-serif);
  font-size: 24px;
  color: var(--osp-plum-900);
  font-weight: 500;
  line-height: 1.2;
}
.program-card p {
  margin-top: 12px;
  font-size: 15px;
  color: var(--osp-ink-soft);
  line-height: 1.55;
  flex: 1;
}
.program-card-meta {
  margin-top: 20px;
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 18px;
  border-top: 1px solid var(--osp-line);
}
/* Prototype used JetBrains Mono for these micro-labels; the shared
   head chunk only loads Newsreader + Public Sans, so they are
   restyled on the site's UI sans. */
.program-card-meta .availability {
  font-family: var(--osp-font-sans);
  font-size: 11px;
  color: var(--osp-terra-700);
  letter-spacing: 0.08em;
  font-weight: 700;
  text-transform: uppercase;
}
.program-card-meta .arrow {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--osp-plum-50);
  color: var(--osp-plum-700);
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s;
}
.program-card:hover .arrow {
  background: var(--osp-plum-700);
  color: #fff;
  transform: translateX(2px);
}

/* ---------- Community / fundraising panel ---------- */
.community-section {
  padding: 56px;
  background: linear-gradient(155deg, var(--osp-terra-50), var(--osp-cream));
  border-radius: var(--osp-r-xl);
  border: 1px solid var(--osp-terra-100);
}
.community-sub {
  margin-top: 14px;
  font-size: 17px;
  color: var(--osp-ink-soft);
  line-height: 1.55;
  max-width: 65ch;
}
/* Card grid columns come from Bootstrap (.row.community-grid) */
.community-grid { margin-top: 36px; }
.community-card {
  background: #fff;
  border: 1px solid var(--osp-line);
  border-radius: var(--osp-r-lg);
  padding: 28px;
  text-decoration: none; color: inherit;
  transition: all 0.25s;
  display: flex; flex-direction: column;
}
.community-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--osp-sh-md);
  border-color: var(--osp-terra-300);
  text-decoration: none;
  color: inherit;
}
.community-card.featured {
  background: linear-gradient(135deg, var(--osp-terra-600), var(--osp-terra-700));
  color: #fff;
  border: none;
  position: relative;
  overflow: hidden;
}
.community-card.featured::before {
  content: "";
  position: absolute;
  top: -40px; right: -40px;
  width: 200px; height: 200px;
  background: radial-gradient(circle, rgba(255,255,255,.15), transparent 70%);
  border-radius: 50%;
}
.community-card.featured:hover { border: none; color: #fff; }
.community-card .label {
  font-family: var(--osp-font-sans);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--osp-terra-700);
  font-weight: 700;
  text-transform: uppercase;
}
.community-card.featured .label { color: rgba(255,255,255,.85); }
.community-card h3 {
  font-family: var(--osp-font-serif);
  font-size: 22px;
  margin-top: 8px;
  color: var(--osp-plum-900);
  font-weight: 500;
  line-height: 1.2;
}
.community-card.featured h3 { color: #fff; font-size: 28px; }
.community-card p {
  margin-top: 12px;
  font-size: 14.5px;
  color: var(--osp-ink-soft);
  line-height: 1.55;
  flex: 1;
}
.community-card.featured p { color: rgba(255,255,255,.92); font-size: 15px; }
.community-card .arrow-row {
  margin-top: 20px;
  display: flex; align-items: center; gap: 8px;
  font-size: 13.5px; font-weight: 600;
  color: var(--osp-plum-700);
}
.community-card.featured .arrow-row { color: #fff; }

/* Stats inside the featured card (columns via Bootstrap row-cols-2) */
.featured-stats { margin-top: 22px; position: relative; z-index: 1; }
.featured-stat {
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--osp-r-md);
  padding: 14px;
}
.featured-stat .num {
  font-family: var(--osp-font-serif);
  font-size: 28px;
  color: #fff;
  font-weight: 500;
  line-height: 1;
}
.featured-stat .lbl {
  margin-top: 4px;
  font-size: 11.5px;
  color: rgba(255,255,255,.78);
  line-height: 1.35;
}

/* ---------- Eligibility callout ---------- */
.eligibility {
  background: var(--osp-plum-900);
  color: #fff;
  border-radius: var(--osp-r-xl);
  padding: 56px;
}
.eligibility h2 {
  font-family: var(--osp-font-serif);
  font-size: 36px;
  color: #fff;
  font-weight: 500;
  line-height: 1.15;
}
.eligibility p {
  margin-top: 16px;
  font-size: 16px;
  color: rgba(255,255,255,.78);
  line-height: 1.6;
}
.eligibility-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex; flex-direction: column; gap: 14px;
}
.eligibility-list li {
  display: flex; gap: 14px; align-items: start;
  color: rgba(255,255,255,.92);
  font-size: 15px;
  line-height: 1.5;
}
.eligibility-list li svg { flex-shrink: 0; margin-top: 4px; color:#E8B5A1;}

@media (max-width: 880px) {
  .community-section { padding: 32px 24px; }
  .eligibility { padding: 36px 28px; }
}