
/* --- About page styles to match mockup --- */
.about-hero{ background:linear-gradient(180deg, rgba(255,255,255,0.02) 0%, rgba(255,255,255,0) 100%); }
.title.center{ text-align:center; color:#fff; margin:0 0 8px }
.subtitle.center{ text-align:center; color:#cbd5e1; margin:0 auto 28px; max-width:820px }
.about-features{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px }
.feat{ background:#0f172a; border:1px solid #1f2937; border-radius:16px; padding:20px; text-align:center; color:#e2e8f0 }
.feat-ic{ width:52px; height:52px; display:grid; place-items:center; margin:0 auto 8px; border-radius:50%; background:#0b1220; border:1px solid #263244; font-size:22px }
.about-values{ margin-top:18px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px }
.value{ display:flex; gap:12px; background:#0f172a; border:1px solid #1f2937; border-radius:16px; padding:16px; align-items:flex-start }
.value-ic{ width:36px; height:36px; display:grid; place-items:center; border-radius:10px; background:#0b1220; border:1px solid #263244 }
.value h4{ color:#fff; margin:0 0 4px }

.team-section h2{ color:#fff; margin-bottom:6px }
.team-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px }
.teacher-card{ background:#0f172a; border:1px solid #1f2937; border-radius:16px; padding:16px; display:grid; grid-template-columns:160px 1fr; gap:14px; align-items:center; color:#e2e8f0 }
.avatar{ width:100%; height:200px; border-radius:12px; overflow:hidden; background:#0b1220; border:1px solid #263244 }
.avatar img{ width:100%; height:100%; object-fit:cover }
.avatar.ph{ background:linear-gradient(135deg,#0b1220,#111827); position:relative }
.avatar.ph::after{ content:'📷'; position:absolute; inset:0; display:grid; place-items:center; font-size:28px; color:#334155 }
.t-name{ margin:0; color:#fff }
.t-role{ margin:2px 0 8px }
.t-tags{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:6px }
.chip{ background:#111827; color:#e5e7eb; border:1px solid #263244; padding:6px 10px; border-radius:999px; font-size:13px }
.t-facts{ margin:0; padding-left:18px; color:#cbd5e1 }

.kpis-section h2{ color:#fff }
.kpis-grid{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px }
.kpi-card{ background:#0f172a; border:1px solid #1f2937; border-radius:16px; padding:18px; text-align:center; color:#e2e8f0 }
.kpi-card .num{ font-size:28px; font-weight:900; color:#fff }

.history-grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px }
.hist-img{ border-radius:16px; border:1px solid #1f2937; background:linear-gradient(135deg,#0b1220,#111827); min-height:120px }

.cta-gradient{ padding:40px 0; background:linear-gradient(90deg,#ff7a18,#af002d 70%); }
.cta-wrap{ display:flex; align-items:center; justify-content:space-between; gap:20px }
.cta-title{ margin:0 0 6px; color:#0b1220 }
.cta-sub{ margin:0; color:#1f2937 }
.cta-actions{ display:flex; gap:10px }

@media (max-width:1080px){
  .about-values{ grid-template-columns:repeat(2,1fr) }
  .kpis-grid{ grid-template-columns:repeat(3,1fr) }
}
@media (max-width:840px){
  .about-features{ grid-template-columns:1fr }
  .team-grid{ grid-template-columns:1fr }
  .teacher-card{ grid-template-columns:1fr }
  .history-grid{ grid-template-columns:1fr }
}
