/* ─────────────────────────────────────────────────────────────────────────────
   posterSplitText — cartel partido a todo el ancho del contenedor.
   Sin panel de color, sin caja, sin borde, sin filete: el único fondo es el de
   la página y el único radio es el de la foto (`--r-photo`, ya en `.k-ph`).
   ───────────────────────────────────────────────────────────────────────────── */

.g-posterSplitText-grid {
  display: grid;
  /* minmax(0, …fr): con `1fr` a secas una palabra alemana larga del titular
     («Handwerk») fija el min-content de la columna y descuadra la rejilla. */
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
  gap: clamp(34px, 5vw, 84px);
  align-items: center;
}

/* la columna de texto manda sobre su propio ancho de lectura */
.g-posterSplitText-text { min-width: 0; }
.g-posterSplitText-grid .lede { max-width: 44ch; }

/* a cuerpo de titular, `hyphens: auto` parte casi todas las líneas: manual + corte
   sólo cuando la palabra no cabe. Y el `xl` del mínimo se acota al medio ancho. */
.g-posterSplitText-grid .display { overflow-wrap: break-word; hyphens: manual; }
.g-posterSplitText-grid .display.xl { font-size: clamp(42px, 5.8vw, 92px); }

.g-posterSplitText-photo { min-width: 0; align-self: center; }

@media (max-width: 900px) {
  .g-posterSplitText-grid { grid-template-columns: 1fr; gap: 30px; }
  /* la foto sube al principio SIN tocar el marcado: el titular sigue siendo el
     primer elemento del documento y nunca vive en una columna derecha. */
  .g-posterSplitText-photo { order: -1; }
  .g-posterSplitText-grid .lede { max-width: none; }
  .g-posterSplitText-grid .display.xl { font-size: clamp(38px, 10vw, 56px); }
}

@media (prefers-reduced-motion: reduce) {
  .g-posterSplitText-grid > *,
  .g-posterSplitText-photo { transition: none; animation: none; }
}
