/* Historia narrativa — 2 col head + body, sin imagen. Para bloques tipo
   "Nuestra historia" en sobre-nosotros. Pixel-perfect SOBRE NOSOTROS.html. */

.historia-narrativa__layout {
  display: grid;
  grid-template-columns: 1fr 1.6fr;
  gap: var(--space-2xl);
  align-items: start;
}

.historia-narrativa__head .eyebrow { margin-bottom: var(--space-md); }
.historia-narrativa__head h2 {
  font-size: clamp(1.85rem, 3vw, 2.625rem);
  line-height: 1.15;
  color: var(--color-dark);
}
.historia-narrativa__head h2 em {
  font-style: normal;
  color: var(--color-orange);
}

.historia-narrativa__body p {
  font-size: var(--text-lg);
  line-height: 1.65;
  color: var(--color-gray);
  margin-bottom: var(--space-md);
}
.historia-narrativa__body p:last-child { margin-bottom: 0; }
.historia-narrativa__body strong {
  color: var(--color-dark);
  font-weight: 700;
}

.historia-narrativa__signature {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  color: var(--color-dark);
  font-weight: 500;
  margin-top: var(--space-md);
}
.historia-narrativa__signature strong {
  color: var(--color-orange);
  font-weight: 700;
}

@media (max-width: 968px) {
  .historia-narrativa__layout { grid-template-columns: 1fr; gap: var(--space-lg); }
}