/* ==========================================================================
   components/perfil.css — Perfil (dirección ejecutiva)
   Sin marcador (bloque único en nosotros.html #direccion).
   ========================================================================== */
.perfil {
  display: grid;
  grid-template-columns: minmax(var(--medida-xs), var(--medida-md)) 1fr;
  gap: var(--gap-columnas);
  align-items: start;
}
.perfil__foto {
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: var(--radio);
  background: linear-gradient(160deg, var(--c-laguna), var(--c-abismo));
  color: var(--c-agua);
  font-family: var(--f-display);
  font-weight: 800;
  font-size: var(--text-monograma);
}
.perfil__foto img { width: 100%; height: 100%; object-fit: cover; }
.perfil__cargo { margin-top: calc(var(--space-2) * -1); font-weight: 600; color: var(--c-laguna); }
@media (max-width: 640px) {
  .perfil { grid-template-columns: 1fr; }
  .perfil__foto { max-width: var(--medida-sm); }
}