/* ===== About page ===== */
.about-hero .hero-inner{padding:70px 16px}
.mission{padding-top:18px;padding-bottom:18px}
.mission-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:40px;
  align-items:start;
}
.section-title.left{text-align:left}
.mission-text p{margin:0 0 14px;color:var(--muted)}
.mission-cards{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
}
.card.value{min-height:140px}

/* Journey / timeline */
.journey{background:#f6f9fd;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.timeline{
  list-style:none; margin:22px 0 0; padding:0; max-width:920px;
}
.t-item{display:grid; grid-template-columns:120px 1fr; gap:18px; padding:16px 0; align-items:center}
.t-year{
  width:96px;height:96px;border-radius:999px;background:linear-gradient(180deg,#f59e0b,#e28f06);
  color:#fff; display:grid; place-items:center; font-weight:800; box-shadow:var(--shadow)
}
.t-body h3{margin:0 0 6px}
.t-body p{margin:0; color:var(--muted)}

/* Team */
.team .team-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:start; margin-top:18px
}
.member{text-align:center; background:#fff; border:1px solid var(--border); border-radius:18px; padding:22px; box-shadow:var(--shadow)}
.avatar{
  width:96px;height:96px;margin:0 auto 10px;border-radius:999px;
  background:linear-gradient(180deg,#f59e0b,#e28f06); color:#fff; display:grid; place-items:center; font-weight:800; font-size:28px
}
.member .role{color:#a16207;font-weight:700;margin:4px 0 8px}
.member .bio{color:var(--muted);margin:0}

/* Dark CTA */
.cta-dark{background:var(--dark); color:var(--dark-text); padding:48px 0; margin-top:18px}
.cta-dark .cta-title{text-align:center; margin:0 0 8px; font-size:clamp(26px,3.2vw,38px)}
.cta-dark .cta-sub{text-align:center; margin:0 0 18px; color:#b9c4d3}
.cta-dark .btn{display:block; width:max(220px, 240px); margin:0 auto}

/* Responsive for About */
@media (max-width: 960px){
  .mission-grid{grid-template-columns:1fr; gap:28px}
  .mission-cards{grid-template-columns:1fr 1fr}
  .t-item{grid-template-columns:100px 1fr}
}
@media (max-width: 640px){
  .mission-cards{grid-template-columns:1fr}
  .team .team-grid{grid-template-columns:1fr}
  .t-item{grid-template-columns:88px 1fr}
  .t-year{width:84px;height:84px}
}