/*
 * Layout: editorial con la columna de opinión.
 * Referencia: design-reference/propuesta4/index.html — «Editorial y Opinion».
 */

.exxi-editorial { padding-block: 44px; }

.exxi-editorial__grid { display: grid; gap: var(--space-8); }

@media (min-width: 900px) {
  .exxi-editorial__grid {
    grid-template-columns: 1.5fr 1fr;
    gap: 0;
  }

  .exxi-editorial__grid--solo { grid-template-columns: 1fr; }

  .exxi-editorial__principal { padding-right: 34px; }

  /* El filete separa las dos voces de la casa sin encerrarlas en cajas. */
  .exxi-editorial__opinion {
    border-left: var(--border-width) solid #ddd8ce;
    padding-left: 30px;
  }
}

.exxi-editorial__principal .exxi-section-heading { margin-bottom: 22px; }
.exxi-editorial__opinion .exxi-section-heading { margin-bottom: 6px; }

/* Editorial ---------------------------------------------------------- */

.exxi-editorial__pieza {
  display: grid;
  gap: var(--space-6);
  align-items: start;
  color: inherit;
  text-decoration: none;
}

@media (min-width: 600px) {
  .exxi-editorial__pieza { grid-template-columns: 1fr 1.2fr; gap: var(--space-6); }
}

.exxi-editorial__img {
  width: 100%;
  height: 230px;
  object-fit: cover;
}

.exxi-editorial__titular {
  display: block;
  font-family: var(--font-serif);
  font-size: 1.75rem;
  font-weight: var(--weight-bold);
  line-height: 1.15;
  text-wrap: pretty;
}

.exxi-editorial__pieza:hover .exxi-editorial__titular { color: var(--color-accent); }

/* El deck del editorial va en serif: es voz de la casa, no un sumario informativo. */
.exxi-editorial__deck {
  display: block;
  font-family: var(--font-serif);
  /* Explícito: la casa escribe el cuerpo a 500 y el serif no tiene ese peso. */
  font-weight: 400;
  font-size: 0.96875rem;
  line-height: 1.55;
  color: var(--color-text-mid);
  margin-top: var(--space-3);
}

.exxi-editorial__cta {
  display: block;
  font-family: var(--font-sans);
  font-size: 0.78125rem;
  font-weight: var(--weight-bold);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--color-accent);
  margin-top: 14px;
}

/* Columnistas -------------------------------------------------------- */

.exxi-columnista {
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 14px 0;
  border-bottom: var(--border-width) solid #e6e2d9;
  color: inherit;
  text-decoration: none;
}

.exxi-columnista:last-child { border-bottom: 0; }

.exxi-columnista__foto {
  width: 46px;
  height: 46px;
  border-radius: var(--radius-full);
  object-fit: cover;
  flex-shrink: 0;
}

.exxi-columnista__autor {
  display: block;
  font-size: var(--size-2xs);
  font-weight: var(--weight-bold);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--color-accent);
}

.exxi-columnista__titulo {
  display: block;
  font-family: var(--font-serif);
  font-size: 1.0625rem;
  font-weight: var(--weight-bold);
  line-height: var(--leading-snug);
  margin-top: 3px;
  text-wrap: pretty;
}

.exxi-columnista:hover .exxi-columnista__titulo { color: var(--color-accent); }