/* CENAE F2.1 — Portada pública P1.1 / F2.6.
 * Variables, tipografía y colores: herencia de la portada P1.1 vigente.
 */
body.cenae-f26-public .cenae-f2-hero {
  display:grid;grid-template-columns:minmax(0,3fr) minmax(310px,2fr);
  gap:clamp(24px,3.5vw,48px);align-items:start;
  border-bottom:1px solid var(--cenae-rule,#E2E0D8);
  padding:clamp(18px,2.5vw,32px) 0 38px;margin-bottom:40px;
}
body.cenae-f26-public .cenae-f2-main-column,
body.cenae-f26-public .cenae-f2-side {min-width:0}
body.cenae-f26-public .cenae-f2-main {margin:0 0 22px}
body.cenae-f26-public .cenae-f2-eyebrow,
body.cenae-f26-public .cenae-f2-date,
body.cenae-f26-public .cenae-f2-side-head h2 {
  font:500 11px/1.45 var(--cenae-sans,system-ui,sans-serif);
  text-transform:uppercase;letter-spacing:.075em;color:var(--cenae-muted,#514E48);
}
body.cenae-f26-public .cenae-f2-eyebrow {margin:0 0 12px}
body.cenae-f26-public .cenae-f2-main-meta {margin:11px 0 4px}
body.cenae-f26-public .cenae-f2-hero a {color:inherit;text-decoration:none}
body.cenae-f26-public .cenae-f2-hero a:hover,
body.cenae-f26-public .cenae-f2-hero a:focus-visible {text-decoration:underline;text-underline-offset:3px}
body.cenae-f26-public .cenae-f2-main-image,
body.cenae-f26-public .cenae-f2-middle-image,
body.cenae-f26-public .cenae-f2-side-image {
  display:block;overflow:hidden;background:var(--cenae-card,#FDFBF7);
}
body.cenae-f26-public .cenae-f2-main-image {height:clamp(218px,22vw,262px)}
body.cenae-f26-public .cenae-f2-middle-image {aspect-ratio:16 / 9}
body.cenae-f26-public .cenae-f2-side-image {width:94px;height:74px}
body.cenae-f26-public .cenae-f2-hero .cenae-p11-image,
body.cenae-f26-public .cenae-f2-hero .cenae-p11-image-link {
  display:block;width:100%;height:100%;
}
body.cenae-f26-public .cenae-f2-hero .cenae-p11-image img {
  display:block;width:100%;height:100%;object-fit:cover!important;
}
body.cenae-f26-public .cenae-f2-main h2 {
  color:var(--cenae-ink,#2C2C2C);margin:8px 0 0;
  font:400 clamp(28px,2.65vw,34px)/1.2 var(--p11-title,Georgia,serif);
  letter-spacing:-.015em;
}
body.cenae-f26-public .cenae-f2-summary {
  margin:11px 0 0;max-width:64ch;
  font:400 15px/1.55 var(--cenae-sans,system-ui,sans-serif);
  color:var(--cenae-muted,#514E48);
}
body.cenae-f26-public .cenae-f2-middle-grid {
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;
  padding-top:20px;border-top:1px solid var(--cenae-rule,#E2E0D8);
}
body.cenae-f26-public .cenae-f2-middle .cenae-f2-date {display:block;margin:10px 0 5px}
body.cenae-f26-public .cenae-f2-middle h3 {
  font:400 clamp(18px,1.75vw,21px)/1.26 var(--p11-title,Georgia,serif);
  margin:0;color:var(--cenae-ink,#2C2C2C);
}
body.cenae-f26-public .cenae-f2-side {
  border-left:1px solid var(--cenae-rule,#E2E0D8);
  padding-left:clamp(18px,2.3vw,32px);
  /* Sin flex: evita espacio artificial debajo de la cuarta noticia. */
}
body.cenae-f26-public .cenae-f2-side-head {
  display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  padding:0 0 12px;border-bottom:1px solid var(--cenae-rule,#E2E0D8);
}
body.cenae-f26-public .cenae-f2-side-head h2 {
  margin:0;color:var(--cenae-ink,#2C2C2C);
}
body.cenae-f26-public .cenae-f2-side-range {
  font:400 12px/1.3 var(--cenae-sans,system-ui,sans-serif);
  color:var(--cenae-muted,#514E48);white-space:nowrap;
}
body.cenae-f26-public .cenae-f2-side-page[hidden]{display:none!important}
body.cenae-f26-public .cenae-f2-side-item {
  display:grid;grid-template-columns:94px minmax(0,1fr);
  align-items:start;gap:13px;padding:14px 0;
  border-bottom:1px solid var(--cenae-rule,#E2E0D8);
}
body.cenae-f26-public .cenae-f2-side-copy {min-width:0}
body.cenae-f26-public .cenae-f2-side-item h3 {
  margin:4px 0 0;overflow-wrap:anywhere;
  font:400 clamp(16px,1.45vw,18px)/1.25 var(--p11-title,Georgia,serif);
  color:var(--cenae-ink,#2C2C2C);
}
body.cenae-f26-public .cenae-f2-archive {
  display:flex;align-items:center;gap:12px;
  margin:14px 0 0;padding:15px 12px;
  background:var(--cenae-card,#FDFBF7);
  border:1px solid var(--cenae-rule,#E2E0D8);
}
body.cenae-f26-public .cenae-f2-archive-icon {font-size:21px;line-height:1}
body.cenae-f26-public .cenae-f2-archive strong,
body.cenae-f26-public .cenae-f2-archive small {display:block}
body.cenae-f26-public .cenae-f2-archive strong {
  font:600 14px/1.35 var(--cenae-sans,system-ui,sans-serif);
}
body.cenae-f26-public .cenae-f2-archive small {
  margin-top:3px;font:400 12px/1.4 var(--cenae-sans,system-ui,sans-serif);
  color:var(--cenae-muted,#514E48);
}
body.cenae-f26-public .cenae-f2-nav {
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:11px 0 0;margin-top:12px;
}
body.cenae-f26-public .cenae-f2-arrow {
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border:1px solid var(--cenae-rule,#E2E0D8);
  background:transparent;color:var(--cenae-ink,#2C2C2C);
  font:400 23px/1 var(--cenae-sans,system-ui,sans-serif);
  cursor:pointer;border-radius:2px;
}
body.cenae-f26-public .cenae-f2-arrow:hover:not(:disabled) {background:var(--cenae-card,#FDFBF7)}
body.cenae-f26-public .cenae-f2-arrow:disabled {opacity:.32;cursor:default}
body.cenae-f26-public .cenae-f2-page-label {
  font:400 12px/1.4 var(--cenae-sans,system-ui,sans-serif);
  color:var(--cenae-muted,#514E48);
}
@media(max-width:970px) {
  body.cenae-f26-public .cenae-f2-hero {grid-template-columns:1fr;gap:26px}
  body.cenae-f26-public .cenae-f2-side {border-left:0;border-top:1px solid var(--cenae-rule,#E2E0D8);padding:22px 0 0}
  body.cenae-f26-public .cenae-f2-main-image {height:clamp(230px,36vw,330px)}
  body.cenae-f26-public .cenae-f2-middle-image {aspect-ratio:16 / 9}
}
@media(max-width:560px) {
  body.cenae-f26-public .cenae-f2-hero {padding:20px 0 30px;gap:24px}
  body.cenae-f26-public .cenae-f2-main h2 {font-size:clamp(27px,7.4vw,32px)}
  body.cenae-f26-public .cenae-f2-main-image {height:220px}
  body.cenae-f26-public .cenae-f2-middle-grid {grid-template-columns:1fr;gap:21px}
  body.cenae-f26-public .cenae-f2-middle-image {height:185px}
  body.cenae-f26-public .cenae-f2-middle h3 {font-size:21px}
  body.cenae-f26-public .cenae-f2-side-item {grid-template-columns:86px minmax(0,1fr);gap:11px}
  body.cenae-f26-public .cenae-f2-side-image {width:86px;height:70px}
  body.cenae-f26-public .cenae-f2-side-item h3 {font-size:17px}
}

/* =========================================================
 * F2.2 · Ajuste lateral EXCLUSIVO de vista privada 5311.
 * Las imágenes las sigue sirviendo WordPress / P1.1 (medium_large
 * y srcset adaptativo), sin crear otra función de imágenes.
 * ========================================================= */

/* En escritorio, la imagen acompaña al texto sin competir con la principal. */
body.cenae-f26-public .cenae-f2-side-item {
  grid-template-columns:166px minmax(0,1fr);
  gap:16px;
  padding:18px 0;
  align-items:center;
}
body.cenae-f26-public .cenae-f2-side-image {
  width:166px;
  height:122px;
  aspect-ratio:83 / 61;
}
body.cenae-f26-public .cenae-f2-side-image .cenae-p11-image {
  aspect-ratio:auto;
}
body.cenae-f26-public .cenae-f2-side-image img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  image-rendering:auto;
}

/* En escritorios intermedios, el texto conserva una anchura legible. */
@media (min-width:971px) and (max-width:1250px) {
  body.cenae-f26-public .cenae-f2-side-item {
    grid-template-columns:142px minmax(0,1fr);
    gap:13px;
    padding:16px 0;
  }
  body.cenae-f26-public .cenae-f2-side-image {
    width:142px;
    height:106px;
  }
}

/* En tableta la columna lateral se apila bajo la principal. */
@media (min-width:561px) and (max-width:970px) {
  body.cenae-f26-public .cenae-f2-side-item {
    grid-template-columns:150px minmax(0,1fr);
    gap:16px;
    padding:17px 0;
  }
  body.cenae-f26-public .cenae-f2-side-image {
    width:150px;
    height:112px;
  }
}

/* En móviles estrechos, evita miniaturas invasivas y títulos apretados. */
@media (max-width:560px) {
  body.cenae-f26-public .cenae-f2-side-item {
    grid-template-columns:112px minmax(0,1fr);
    gap:12px;
    padding:15px 0;
  }
  body.cenae-f26-public .cenae-f2-side-image {
    width:112px;
    height:84px;
  }
}

/* =========================================================
 * F2.3 · Refinamiento editorial de imagen principal y medianas.
 * Exclusivo de la vista privada 5311; NO modifica miniaturas laterales.
 * ========================================================= */

/* Titulares extensos: no truncar; equilibrar los saltos de línea. */
body.cenae-f26-public .cenae-f2-main h2 {
  font-size:clamp(28px,2.35vw,33px);
  line-height:1.18;
  text-wrap:balance;
  overflow-wrap:break-word;
}

/* El aumento en principal se compensa reduciendo las dos medianas.
 * Solo escritorio; móvil conserva el tratamiento F2.2 vigente. */
@media (min-width:971px) {
  body.cenae-f26-public .cenae-f2-main-image {
    height:clamp(248px,19vw,282px);
  }
  body.cenae-f26-public .cenae-f2-middle-image {
    height:auto;
    aspect-ratio:2.05 / 1;
  }
}

/* =========================================================
 * F2.4 · Alineación del navegador lateral con el pie de las
 * dos noticias medianas (sólo escritorio).
 *
 * La altura la establece la columna más alta. Cuando el lateral
 * es más corto, un flex distribuido coloca la navegación al final;
 * no usamos top absolutos, alturas fijas ni cálculos en JS.
 * En móvil/tableta se conserva la navegación junto a sus noticias.
 * ========================================================= */
@media (min-width: 971px) {
  body.cenae-f26-public .cenae-f2-hero {
    align-items: stretch;
  }

  body.cenae-f26-public .cenae-f2-side {
    display: flex;
    flex-direction: column;
    align-self: stretch;
  }

  body.cenae-f26-public .cenae-f2-page-area {
    flex: 1 0 auto;
    min-height: 0;
    padding-bottom: 12px;
  }

  body.cenae-f26-public .cenae-f2-nav {
    margin-top: auto;
  }
}

/* =========================================================
 * F2.6 · Navegación editorial B+C (texto + tres segmentos).
 * Exclusivo de la página privada 5311.
 * Conserva la alineación de F2.4 y las dimensiones de F2.5.
 * ========================================================= */
body.cenae-f26-public .cenae-f2-nav {
  gap:10px;
}
body.cenae-f26-public .cenae-f2-arrow {
  width:auto;
  min-width:110px;
  height:44px;
  padding:0 11px;
  gap:7px;
  border:1px solid #bab8af;
  border-radius:2px;
  font:600 12px/1.2 var(--cenae-sans,system-ui,sans-serif);
  letter-spacing:.01em;
  white-space:nowrap;
  transition:background-color .16s ease,border-color .16s ease;
}
body.cenae-f26-public .cenae-f2-arrow:hover:not(:disabled) {
  background:var(--cenae-card,#FDFBF7);
  border-color:var(--cenae-ink,#2C2C2C);
}
body.cenae-f26-public .cenae-f2-arrow:focus-visible {
  outline:2px solid var(--cenae-ink,#2C2C2C);
  outline-offset:3px;
}
body.cenae-f26-public .cenae-f2-arrow:disabled {
  opacity:.38;
  cursor:default;
}
body.cenae-f26-public .cenae-f2-nav-icon {
  font:500 17px/1 var(--cenae-sans,system-ui,sans-serif);
}
body.cenae-f26-public .cenae-f2-nav-short {display:none}
body.cenae-f26-public .cenae-f2-page-status {
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:6px;
  min-width:70px;
  flex:0 0 auto;
}
body.cenae-f26-public .cenae-f2-page-label {
  font:500 12px/1.25 var(--cenae-sans,system-ui,sans-serif);
  white-space:nowrap;
}
body.cenae-f26-public .cenae-f2-progress {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
}
body.cenae-f26-public .cenae-f2-progress-segment {
  display:block;
  width:20px;
  height:3px;
  border-radius:1px;
  background:#d5d2ca;
}
body.cenae-f26-public .cenae-f2-progress-segment.is-active {
  background:var(--cenae-paramo,#38473b);
}
@media (max-width:560px) {
  body.cenae-f26-public .cenae-f2-nav {gap:6px}
  body.cenae-f26-public .cenae-f2-arrow {
    min-width:88px;
    padding:0 8px;
    gap:5px;
  }
  body.cenae-f26-public .cenae-f2-nav-wide {display:none}
  body.cenae-f26-public .cenae-f2-nav-short {display:inline}
  body.cenae-f26-public .cenae-f2-progress-segment {width:17px}
}
@media (prefers-reduced-motion:reduce) {
  body.cenae-f26-public .cenae-f2-arrow {transition:none}
}
