/* =============================================================================
   Quiénes somos — Historia (imagen vertical + texto)
   ========================================================================== */

.qs-historia {
  padding-block: var(--section-pad-y);
}

.qs-historia__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-7);
  align-items: start;
}

@media (min-width: 768px) {
  .qs-historia__grid {
    grid-template-columns: 1.2fr 1fr;   /* texto (izq, más ancho) | imagen (der) */
    gap: var(--space-8);
    align-items: stretch;       /* las dos columnas igualan altura */
  }
  /* Texto a la izquierda, foto a la derecha (el markup pinta la foto primero). */
  .qs-historia__texto { order: 1; }
  .qs-historia__imagen { order: 2; }
}

.qs-historia__imagen {
  border-radius: var(--radius-md);
  overflow: hidden;
  aspect-ratio: 4 / 5;          /* mobile: ratio fijo */
  margin: 0;
}

@media (min-width: 768px) {
  .qs-historia__imagen {
    aspect-ratio: auto;          /* desktop: la altura la marca el texto */
    height: 100%;
    min-height: 320px;           /* fallback si el texto es muy corto */
  }
}

.qs-historia__imagen img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.qs-historia__titulo {
  margin-bottom: var(--space-4);
}

.qs-historia__cuerpo p + p { margin-top: 1em; }