/* ── ABOUT PAGE ── */
.section-sub { color: var(--text-muted); font-size: 1rem; max-width: 560px; margin-top: 0.75rem; }
.section-header { margin-bottom: 3.5rem; }

.about-mission { background: var(--cream); padding: 7rem 0; }
.mission-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.mission-text-col { display: flex; flex-direction: column; gap: 1.25rem; }
.mission-text-col p { color: var(--text-muted); font-size: 1rem; line-height: 1.75; }
.mission-text-col strong { color: var(--navy); }
.about-locs { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 0.5rem; }
.loc-chip {
  display: inline-flex; align-items: center; gap: 0.45rem;
  background: var(--blue-light); color: var(--blue);
  font-size: 0.8rem; font-weight: 600; padding: 0.45rem 1rem;
  border-radius: 100px;
}
.mission-img-col { position: relative; height: 460px; }
.mission-img-col > img {
  width: 78%; height: 380px;
  object-fit: cover; border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
}
.mission-img-accent {
  position: absolute; bottom: 0; right: 0;
  width: 52%; height: 230px;
  border-radius: var(--radius);
  overflow: hidden;
  border: 5px solid var(--cream);
  box-shadow: var(--shadow-md);
}
.mission-img-accent img { width: 100%; height: 100%; object-fit: cover; }

.problem-section { background: var(--warm-gray); padding: 7rem 0; }
.problem-tabs { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; }
.prob-panel { background: #fff; border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--border); }
.prob-header { padding: 1.5rem; display: flex; align-items: center; gap: 1rem; }
.prob-header--blue { background: var(--blue-light); }
.prob-header--amber { background: #FEF3C7; }
.prob-header--green { background: #ECFDF5; }
.prob-icon { width: 48px; height: 48px; border-radius: 12px; background: rgba(255,255,255,0.7); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.prob-header--blue .prob-icon { color: var(--blue); }
.prob-header--amber .prob-icon { color: #92400E; }
.prob-header--green .prob-icon { color: #065F46; }
.prob-header h3 { font-family: var(--font-display); font-size: 1.15rem; font-weight: 600; color: var(--navy); }
.prob-body { padding: 1.5rem; display: flex; flex-direction: column; gap: 1.25rem; }
.prob-stat { display: flex; flex-direction: column; gap: 0.4rem; }
.prob-num { font-family: var(--font-display); font-size: 2.8rem; font-weight: 700; color: var(--blue); line-height: 1; }
.prob-num-sm { font-family: var(--font-display); font-size: 1.5rem; font-weight: 600; color: var(--navy); }
.prob-stat p { font-size: 0.82rem; color: var(--text-muted); line-height: 1.6; }

.solution-section { background: var(--cream); padding: 7rem 0; }
.solution-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.sol-img-stack { position: relative; height: 500px; }
.sol-img-main { width: 82%; height: 420px; object-fit: cover; border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
.sol-img-float {
  position: absolute; bottom: 0; right: 0;
  width: 50%; height: 250px; object-fit: cover;
  border-radius: var(--radius); border: 5px solid var(--cream);
  box-shadow: var(--shadow-md);
}
.solution-right { display: flex; flex-direction: column; gap: 1.25rem; }
.solution-right p { color: var(--text-muted); font-size: 1rem; line-height: 1.75; }
.solution-right strong { color: var(--navy); font-weight: 600; }
.solution-flow { display: flex; flex-direction: column; gap: 1rem; margin-top: 0.75rem; }
.flow-step { display: flex; align-items: flex-start; gap: 1rem; }
.flow-n {
  font-family: var(--font-display); font-size: 1.6rem; font-weight: 700;
  color: var(--yellow); line-height: 1; min-width: 36px;
}
.flow-step strong { font-size: 0.9rem; font-weight: 700; color: var(--navy); display: block; margin-bottom: 0.2rem; }
.flow-step p { font-size: 0.83rem; color: var(--text-muted); line-height: 1.5; margin: 0; }

.recipients { background: var(--warm-gray); padding: 6rem 0; }
.recip-grid { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; margin-top: 1rem; }
.recip-chip {
  background: #fff; border: 1px solid var(--border);
  border-radius: 100px; padding: 0.65rem 1.4rem;
  font-size: 0.88rem; font-weight: 500; color: var(--navy);
  transition: background 0.2s, border-color 0.2s, transform 0.2s;
}
.recip-chip:hover { background: var(--yellow-muted); border-color: var(--yellow); transform: translateY(-2px); }

.about-cta { background: var(--navy); padding: 6rem 0; }
.about-cta-inner {
  text-align: center; display: flex; flex-direction: column; align-items: center; gap: 1.5rem;
}
.about-cta-inner p { color: rgba(255,255,255,0.65); font-size: 1rem; max-width: 460px; }
.about-cta-inner .section-title em { color: var(--yellow); }

@media (max-width: 900px) {
  .mission-grid, .solution-inner { grid-template-columns: 1fr; gap: 3rem; }
  .problem-tabs { grid-template-columns: 1fr; }
  .mission-img-col, .sol-img-stack { height: 300px; }
}