/* ── Filas de la portada (newspress-portada, Fase D) ──────────────
 * Usa las variables del tema vigia-pro (tokens.css) con respaldo.
 * Cada columna es un contenedor: el tamaño del título depende del ancho
 * de la columna, no de la ventana.
 */
.npf-fila { margin: var(--sp-6, 32px) 0; }
.npf-fila--linea { padding-bottom: var(--sp-6, 32px); border-bottom: 1px solid var(--np-border, #e2e4e7); }
.npf-titulo { font-family: var(--f-head, var(--f-serif, serif)); font-size: var(--t-xl, 24px); margin: 0 0 var(--sp-4, 16px); }
.npf-cols { display: grid; gap: var(--sp-5, 24px); align-items: start; }
.npf-col { container-type: inline-size; min-width: 0; display: flex; flex-direction: column; gap: var(--sp-4, 16px); }

.npf-nota { display: flex; flex-direction: column; gap: var(--sp-2, 8px); min-width: 0; }
.npf-nota__img { display: block; overflow: hidden; border-radius: var(--r-sm, 4px); background: var(--np-surface-dim, #f0f0f1); aspect-ratio: 3 / 2; }
.npf-nota__img img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: var(--focal-x, 50%) var(--focal-y, 50%); }
.npf-nota__txt { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.npf-nota__sec { align-self: flex-start; }
.npf-nota__tit { margin: 0; font-family: var(--f-head, var(--f-serif, serif)); font-size: var(--t-md, 17px); line-height: 1.25; }
.npf-nota__tit a { color: var(--np-text, #1d2327); text-decoration: none; }
.npf-nota__tit a:hover { color: var(--np-link-hover, var(--np-accent, #2271b1)); }
.npf-nota__bajada { margin: 0; font-size: var(--t-sm, 14px); line-height: 1.45; color: var(--np-text-sec, #50575e); }
.npf-nota__meta { font-size: var(--t-xs, 12px); color: var(--np-text-muted, #787c82); }
.npf-nota__meta a { color: inherit; }

/* Títulos más grandes en columnas anchas */
@container (min-width: 420px) { .npf-nota--grande .npf-nota__tit, .npf-nota--overlay .npf-nota__tit { font-size: var(--t-xl, 24px); } }
@container (min-width: 700px) { .npf-nota--grande .npf-nota__tit, .npf-nota--overlay .npf-nota__tit { font-size: var(--t-2xl, 30px); } }

/* Columnas angostas: título sobre la foto más chico para que la foto se vea */
@container (max-width: 260px) {
  .npf-nota--overlay .npf-nota__tit { font-size: var(--t-sm, 14px); }
  .npf-nota--overlay:not(.npf-nota--sinfoto) .npf-nota__txt { padding: var(--sp-4, 16px) var(--sp-2, 8px) var(--sp-2, 8px); }
  .npf-nota--overlay .npf-nota__meta { display: none; }
}

/* Foto a la izquierda */
.npf-nota--izquierda { flex-direction: row; align-items: flex-start; }
.npf-nota--izquierda .npf-nota__img { flex: 0 0 38%; max-width: 180px; }
.npf-nota--izquierda .npf-nota__tit { font-size: var(--t-base, 15px); }

/* Solo título */
.npf-nota--titulo { padding-bottom: var(--sp-3, 12px); border-bottom: 1px solid var(--np-border, #e2e4e7); }

/* Título sobre la foto */
.npf-nota--overlay { position: relative; }
.npf-nota--overlay:not(.npf-nota--sinfoto) .npf-nota__img { aspect-ratio: 4 / 3; }
.npf-nota--overlay:not(.npf-nota--sinfoto) .npf-nota__txt { position: absolute; inset: auto 0 0 0; padding: var(--sp-6, 32px) var(--sp-4, 16px) var(--sp-4, 16px); border-radius: 0 0 var(--r-sm, 4px) var(--r-sm, 4px); background: linear-gradient(transparent, rgba(0, 0, 0, .78)); pointer-events: none; }
.npf-nota--overlay:not(.npf-nota--sinfoto) .npf-nota__txt a { pointer-events: auto; }
.npf-nota--overlay:not(.npf-nota--sinfoto) .npf-nota__tit a,
.npf-nota--overlay:not(.npf-nota--sinfoto) .npf-nota__bajada,
.npf-nota--overlay:not(.npf-nota--sinfoto) .npf-nota__meta { color: #fff; }
.npf-nota--overlay:not(.npf-nota--sinfoto) .npf-nota__sec { color: #fff; }

.npf-sep { width: 100%; margin: 0; border: 0; border-top: 1px solid var(--np-border-str, #c3c4c7); }
.npf-banner { text-align: center; }
.npf-banner img { max-width: 100%; height: auto; }

/* Fondo de color por fila (D2); texto claro si el color es oscuro */
.npf-fila--fondo { padding: var(--sp-5, 24px); border-radius: var(--r-md, 6px); background: var(--npf-fondo); }
.npf-fila--fondo.npf-fila--linea { border-bottom: 0; }
.npf-fila--oscura .npf-nota__tit a, .npf-fila--oscura .npf-nota__bajada, .npf-fila--oscura .npf-nota__meta,
.npf-fila--oscura .npf-nota__sec, .npf-fila--oscura .npf-titulo, .npf-fila--oscura .np-section-sep__title,
.npf-fila--oscura .npf-modulo, .npf-fila--oscura .npf-modulo a, .npf-fila--oscura .npf-modulo__tit { color: #fff; }
.npf-fila--oscura .np-section-sep__line, .npf-fila--oscura .npf-sep { border-color: rgba(255, 255, 255, .35); background-color: rgba(255, 255, 255, .35); }

/* Módulos (D2) */
.npf-modulo__tit { margin: 0 0 var(--sp-3, 12px); padding-bottom: 6px; border-bottom: 2px solid var(--np-accent, #c8102e); font: 700 var(--t-sm, 13px)/1.2 var(--f-sans, system-ui, sans-serif); letter-spacing: .06em; text-transform: uppercase; }
.npf-leidas { margin: 0; padding: 0; list-style: none; counter-reset: npf-l; display: flex; flex-direction: column; gap: var(--sp-3, 12px); }
.npf-leidas li { counter-increment: npf-l; display: grid; grid-template-columns: 28px 1fr; gap: 8px; align-items: start; }
.npf-leidas li::before { content: counter(npf-l); font: 700 22px/1 var(--f-head, var(--f-serif, serif)); color: var(--np-accent, #c8102e); }
.npf-leidas a, .npf-columnas a { color: var(--np-text, #1d2327); text-decoration: none; font-family: var(--f-head, var(--f-serif, serif)); font-size: var(--t-base, 15px); line-height: 1.3; }
.npf-leidas a:hover, .npf-columnas a:hover { color: var(--np-link-hover, #2271b1); }
.npf-columnas { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--sp-3, 12px); }
.npf-columnas li { display: flex; flex-direction: column; gap: 2px; padding-bottom: var(--sp-3, 12px); border-bottom: 1px solid var(--np-border, #e2e4e7); }
.npf-columnas__autor { font-size: var(--t-xs, 12px); font-weight: 700; color: var(--np-accent, #c8102e); text-transform: uppercase; letter-spacing: .03em; }
.npf-impreso iframe { width: 100%; max-width: 100%; }
.npf-impreso__ver { display: inline-block; margin-top: 6px; font-weight: 600; font-size: var(--t-sm, 14px); }

/* Teléfono: una columna */
@media (max-width: 782px) {
  .npf-cols { grid-template-columns: minmax(0, 1fr) !important; }
}