/* Sobre Nós - Elevate Solutions */

/* Avatar (88px, components.css) + texto lado a lado (row) só a partir de
   700px - em mobile essa largura fixa sozinha já deixava a coluna de texto
   com menos de 100px (viewport - padding do .container/.card - avatar - gap),
   forçando quebras de linha muito apertadas na bio/"decide sobre". Empilhado
   (column) em ecrã estreito lê-se muito melhor. */
.team-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-5);
}
@media (min-width: 700px) {
  .team-card { flex-direction: row; }
}
.team-card .avatar-initials,
.team-card .avatar-photo { margin-top: var(--space-1); }
.team-card h3 { font-size: var(--fs-500); margin-bottom: var(--space-1); }
.team-card .role { color: var(--sky-700); font-weight: 600; font-size: var(--fs-200); margin-bottom: var(--space-3); }
.team-card p.bio { color: var(--text-muted); font-size: var(--fs-300); margin-bottom: var(--space-3); }
.team-card .decides-on {
  font-size: var(--fs-100);
  color: var(--text-muted);
}
.team-card .decides-on strong { color: var(--text); font-weight: 600; }

.values-grid .value h3 { font-size: var(--fs-400); margin-bottom: var(--space-2); }
.values-grid .value p { color: var(--text-muted); font-size: var(--fs-200); }
.values-grid .value .card-icon { margin-bottom: var(--space-3); }

/* Tema escuro (Épico 19) - about.css só carrega em /sobre/, por isso
   estas regras (tal como o resto do tema escuro partilhado em
   theme-dark.css) nunca afetam outra página. .team-card já herda o
   tratamento de .card de theme-dark.css; só o texto próprio desta
   página (função, bio, "decide sobre") e os títulos/texto de .value
   (que não usam a classe .card) precisam de override aqui. */
.team-card .role { color: var(--sky-500); }
.team-card p.bio { color: var(--text-on-dark-muted); }
.team-card .decides-on { color: var(--text-on-dark-muted); }
.team-card .decides-on strong { color: var(--white); }
.values-grid .value h3 { color: var(--white); }
.values-grid .value p { color: var(--text-on-dark-muted); }
