/* ==========================================================================
   PixelToCode — Nosotros
   ========================================================================== */

.about-lead-text { font-size: 1.1rem; color: var(--text-on-photo-muted); }

.timeline { display: grid; gap: 0; }
.timeline-item { display: grid; grid-template-columns: 90px 1fr; gap: 24px; padding: 24px 0; border-bottom: 1px solid var(--border-on-photo); }
.timeline-item:last-child { border-bottom: none; }
.timeline-item .year { font-family: var(--font-mono); font-weight: 700; color: var(--blue-500); font-size: 1.05rem; }
.timeline-item h4 { font-size: 1rem; color: var(--text-on-photo); margin-bottom: 6px; }
.timeline-item p { margin: 0; font-size: 0.92rem; }

.team-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.team-card { text-align: center; }
.team-card .avatar {
  width: 96px; height: 96px;
  border-radius: 50%;
  margin: 0 auto 16px;
  background: linear-gradient(135deg, var(--blue-500), var(--accent-500));
  display: flex; align-items: center; justify-content: center;
  color: var(--white); font-family: var(--font-mono); font-weight: 700; font-size: 1.4rem;
  overflow: hidden;
}
.team-card .avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.team-card h4 { font-size: 0.98rem; color: var(--text-on-photo); margin-bottom: 2px; }
.team-card span { font-size: 0.85rem; color: var(--text-on-photo-muted); }

@media (max-width: 980px) {
  .team-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .timeline-item { grid-template-columns: 1fr; gap: 6px; }
}
