/* ===== About Page Styles ===== */
.story-section img { border-radius: var(--radius-lg); border: 1px solid var(--border-glass); }
.story-section .lead { color: var(--text-secondary); font-size: 1.05rem; line-height: 1.9; }

.value-card { padding: 40px 30px; text-align: center; height: 100%; }
.value-card .icon-wrap {
  width: 70px; height: 70px; border-radius: 50%;
  background: var(--gradient-card); border: 1px solid var(--border-glass);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 20px; font-size: 1.5rem; color: var(--primary);
}
.value-card h4 { font-size: 1.1rem; margin-bottom: 10px; }
.value-card p { color: var(--text-secondary); font-size: 0.9rem; }

/* Team Cards */
.team-card { overflow: hidden; text-align: center; padding: 0; height: 100%; }
.team-card .team-img { position: relative; overflow: hidden; aspect-ratio: 1; }
.team-card .team-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s; }
.team-card:hover .team-img img { transform: scale(1.05); }
.team-card .team-socials {
  position: absolute; bottom: 0; left: 0; right: 0;
  display: flex; justify-content: center; gap: 10px;
  padding: 16px; background: linear-gradient(to top, rgba(10,10,15,0.9), transparent);
  transform: translateY(100%); transition: var(--transition);
}
.team-card:hover .team-socials { transform: translateY(0); }
.team-card .team-socials a {
  width: 36px; height: 36px; border-radius: 8px;
  background: rgba(0,240,255,0.1); border: 1px solid rgba(0,240,255,0.2);
  display: flex; align-items: center; justify-content: center;
  color: var(--primary); font-size: 0.85rem; transition: var(--transition);
}
.team-card .team-socials a:hover { background: var(--primary); color: var(--bg-dark); }
.team-card .team-info { padding: 24px 20px; }
.team-card .team-info h5 { font-size: 1.05rem; margin-bottom: 4px; }
.team-card .team-info p { color: var(--primary); font-size: 0.82rem; font-weight: 500; }

/* Timeline */
.timeline { position: relative; padding: 20px 0; }
.timeline::before {
  content: ''; position: absolute; left: 50%; top: 0; bottom: 0;
  width: 2px; background: var(--border-glass); transform: translateX(-50%);
}
.timeline-item { position: relative; margin-bottom: 50px; }
.timeline-item .timeline-dot {
  position: absolute; left: 50%; top: 0;
  width: 16px; height: 16px; border-radius: 50%;
  background: var(--primary);
  border: 3px solid var(--bg-dark);
  transform: translateX(-50%);
  box-shadow: 0 0 15px rgba(0,240,255,0.4);
  z-index: 2;
}
.timeline-content {
  width: 45%; padding: 30px;
}
.timeline-item:nth-child(odd) .timeline-content { margin-left: auto; }
.timeline-content .year {
  display: inline-block; padding: 4px 14px; border-radius: 50px;
  background: rgba(0,240,255,0.1); color: var(--primary);
  font-size: 0.8rem; font-weight: 600; margin-bottom: 12px;
}
.timeline-content h4 { font-size: 1.1rem; margin-bottom: 8px; }
.timeline-content p { color: var(--text-secondary); font-size: 0.9rem; }

@media (max-width: 767px) {
  .timeline::before { left: 20px; }
  .timeline-item .timeline-dot { left: 20px; }
  .timeline-content { width: calc(100% - 50px) !important; margin-left: 50px !important; }
}