/* ABOUT PAGE */
.about-hero {
  position: relative; min-height: 85vh;
  display: flex; align-items: flex-end;
  padding-top: var(--nav-height);
  overflow: hidden;
}
.about-hero-bg {
  position: absolute; inset: 0;
  border-radius: 0;
  background: linear-gradient(135deg, #1a2a35 0%, #2a3a48 100%);
}
.about-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(26,31,46,0.9) 0%, rgba(26,31,46,0.4) 60%, transparent 100%);
  z-index: 1;
}
.about-hero-content { position: relative; z-index: 2; padding-bottom: 80px; }

/* MISSION */
.mission-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.mission-pillars { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.pillar-item {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 18px; background: var(--off-white);
  border-radius: var(--radius-md); border: 1px solid var(--gray-200);
}
.pillar-item strong { display: block; font-size: 0.9rem; color: var(--navy); margin-bottom: 4px; }
.pillar-item p { font-size: 0.82rem; color: var(--text-mid); }
.mission-img-wrap { position: relative; }
.mission-stat-badge {
  position: absolute; bottom: 24px; left: -24px;
  background: var(--orange); color: white;
  border-radius: var(--radius-md); padding: 16px 20px;
  box-shadow: var(--shadow-lg);
}
.mission-stat-badge .stat-num { font-size: 1.6rem; font-weight: 800; }
.mission-stat-badge .stat-label { font-size: 0.78rem; opacity: 0.9; line-height: 1.4; }

/* VALUES GRID */
.values-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.values-grid .card h3,
.values-grid .card-orange h3 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; color: var(--navy); }
.values-grid .card p,
.values-grid .card-orange p { font-size: 0.88rem; color: var(--text-mid); line-height: 1.6; }

@media (max-width: 1024px) {
  .mission-grid { grid-template-columns: 1fr; gap: 40px; }
  .values-grid { grid-template-columns: 1fr 1fr; }
  .mission-stat-badge { left: auto; right: 16px; }
}
@media (max-width: 768px) {
  .values-grid { grid-template-columns: 1fr; }
  .mission-pillars { grid-template-columns: 1fr; }
}