/* =============================================================================
   Periferia 2 · cards y loops de Proyectos y Novedades
   -----------------------------------------------------------------------------
   Los tokens son los del wireframe (css/styles.css) y los del kit de Elementor
   (mismos valores): se redeclaran con prefijo --p2- para no depender del orden
   en que Elementor imprime sus variables. Todo va bajo clases .p2-*: nada de
   esta hoja toca un elemento que no haya dibujado el mu-plugin.
   ============================================================================= */

:root{
  --p2-tinta:#141C16;
  --p2-tinta-72:rgba(20,28,22,.72);
  --p2-tinta-62:rgba(20,28,22,.62);
  --p2-tinta-52:rgba(20,28,22,.52);
  --p2-linea:rgba(20,28,22,.18);
  --p2-papel:#FAF6EE;
  --p2-papel-3:#EAE1CF;
  --p2-terracota:#F28236;
  --p2-terracota-hondo:#9C4200;
  --p2-verde-panel:#244125;
  --p2-f:'Public Sans',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --p2-f-display:'Archivo','Public Sans',system-ui,'Segoe UI',Helvetica,Arial,sans-serif;
  --p2-gap-grid:clamp(1.125rem,1.8vw,2.25rem);
  --p2-sombra-baja:0 1px 2px rgba(56,44,26,.06),0 3px 8px -4px rgba(56,44,26,.1);
  --p2-sombra-media:0 2px 4px rgba(56,44,26,.05),0 18px 36px -22px rgba(56,44,26,.45);
  --p2-ease:cubic-bezier(.2,.7,.3,1);
}

.p2-proyectos *,.p2-grilla *,.p2-paginacion *{box-sizing:border-box}

/* "La transición ya empezó." (home, #caf3d03): bloque típico imagen + texto.
   Foto a la izquierda (columna #6258f30, widget Imagen: se cambia desde
   Elementor), a la derecha etiqueta, título, texto y "Conocé quiénes somos"
   (columna #2061bc4). La fila ya se apilaba en tablet (variante atómica). */
.elementor [data-id="caf3d03"]{align-items:center; justify-content:flex-start; gap:clamp(2.5rem,6vw,6rem)}
.elementor [data-id="caf3d03"] > [data-id="6258f30"]{flex:0 1 50%; min-width:0; width:100%}
/* max-width:none: la columna traía 52ch propios y dejaba un hueco al medio;
   el párrafo conserva su medida de lectura (46ch). */
.elementor [data-id="caf3d03"] > [data-id="2061bc4"]{flex:1 1 0; min-width:0; max-width:none}
.elementor .p2-bloque-img__foto,
.elementor .p2-bloque-img__foto .elementor-widget-container{width:100%}
.elementor .p2-bloque-img__foto img{
  display:block; width:100%; height:auto; aspect-ratio:5/4; object-fit:cover;
  border-radius:3px; box-shadow:0 1px 2px rgba(56,44,26,.06),0 3px 8px -4px rgba(56,44,26,.1);
}
/* (0,4,0): Elementor pone margin-block-end:0 a los widgets en contenedores. */
.elementor .e-con[data-id="2061bc4"] > [data-id="56a8ab9"].elementor-widget{margin-block-end:1.5rem}
.elementor .e-con[data-id="2061bc4"] > [data-id="p2trbtn"].elementor-widget{margin-block-start:2rem}
@media (max-width:1024px){
  .elementor .p2-bloque-img__foto img{aspect-ratio:4/3}
  /* apilado: el centrado vertical de la columna se volvía horizontal */
  .elementor [data-id="caf3d03"] > [data-id="2061bc4"]{align-self:flex-start; width:100%}
}

/* "Con el apoyo de" (home): grilla de logos, la .aliados__grid del wireframe.
   Seis celdas partidas por líneas verticales y una línea arriba, no seis
   "cards". Cada celda es un widget Imagen de Elementor (clase p2-logo): los
   logos se cambian desde el editor. En gris y a media tinta; toman su color
   al pasar el mouse. 6 → 3 → 2 columnas. */
.elementor .e-con.p2-logos{
  display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:0;
  border-top:1px solid rgba(20,28,22,.18);
}
.elementor .p2-logos > .p2-logo{
  display:flex; align-items:center; justify-content:center;
  min-height:112px; padding:1.5rem 1.25rem; margin:0; width:auto;
  border-bottom:1px solid rgba(20,28,22,.18);
  border-right:1px solid rgba(20,28,22,.18);
  transition:background-color .25s cubic-bezier(.2,.7,.3,1);
}
.elementor .p2-logos > .p2-logo:nth-child(6n),
.elementor .p2-logos > .p2-logo:last-child{border-right:0}
.elementor .p2-logos .p2-logo img{
  display:block; width:auto; height:auto; max-width:100%; max-height:52px; object-fit:contain;
  filter:grayscale(1); opacity:.62;
  transition:filter .25s cubic-bezier(.2,.7,.3,1),opacity .25s cubic-bezier(.2,.7,.3,1);
}
@media (hover:hover){
  .elementor .p2-logos > .p2-logo:hover{background:#FAF6EE}
  .elementor .p2-logos > .p2-logo:hover img{filter:none; opacity:1}
}
@media (max-width:1024px){
  .elementor .e-con.p2-logos{grid-template-columns:repeat(3,minmax(0,1fr))}
  .elementor .p2-logos > .p2-logo{border-right:1px solid rgba(20,28,22,.18)}
  .elementor .p2-logos > .p2-logo:nth-child(3n){border-right:0}
}
@media (max-width:767px){
  .elementor .e-con.p2-logos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .elementor .p2-logos > .p2-logo{border-right:1px solid rgba(20,28,22,.18); min-height:96px}
  .elementor .p2-logos > .p2-logo:nth-child(2n){border-right:0}
  .elementor .p2-logos .p2-logo img{max-height:44px}
}

/* Logo del header: el link (#24bee31) medía 350px (314 en celular) para un
   logo de ~146: las dos imágenes (clara y oscura, superpuestas) tienen alto
   fijo y max-width:100%, y con eso el ancho del link se calculaba sobre el
   tamaño original del archivo. Sin max-width el ancho sale del alto, y el
   área de clic queda del tamaño del logo. */
#cabecera-rp [data-id="24bee31"]{flex:0 0 auto; width:fit-content}
#cabecera-rp [data-id="24bee31"] img{max-width:none}
/* La fila del header (#79310bd) acomodaba el menú gracias a ese logo inflado.
   Escritorio: el menú pegado al logo (así lo prefiere el usuario, 28/9) y los
   botones a la derecha. Tablet: hamburguesa al centro (logo | ≡ | botones).
   Celular: los botones están ocultos; el widget del menú toma el ancho de la
   hamburguesa y queda contra el borde derecho. */
@media (min-width:1025px){
  #cabecera-rp [data-id="79310bd"]{justify-content:flex-start; gap:clamp(1.5rem,3vw,3rem)}
  #cabecera-rp [data-id="79310bd"] > [data-id="d6bb25c"]{margin-left:auto; flex:0 0 auto; width:auto}
}
@media (min-width:768px) and (max-width:1024px){
  #cabecera-rp [data-id="79310bd"]{display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center}
  #cabecera-rp [data-id="79310bd"] > [data-id="24bee31"]{justify-self:start}
  #cabecera-rp [data-id="79310bd"] > [data-id="d6bb25c"]{justify-self:end; width:auto}
}
@media (max-width:767px){
  #cabecera-rp [data-id="79310bd"] > [data-id="144357c"]{flex:0 0 auto; width:auto}
}

/* Menú del header en tablet/celular (Mega Menú en modo "dropdown").
   Concepto de parabola2 con la estética de Periferia: filas grandes con
   flecha, la página actual marcada en terracota, y al final un bloque
   "Participá" con los llamados a la acción (lo agrega menu.js; en celular el
   header esconde sus botones).
   El header (#cabecera-rp) tiene dos estados: transparente sobre el hero
   oscuro y .esta-fija al scrollear (fondo blanco; su CSS pasa
   --e-global-color-secondary de papel a tinta). El panel sigue al header con
   las variables --p2m-*: tinta arriba, blanco con el header fijo.
   Arreglos previos que se mantienen: Elementor pone background #fff fijo a
   cada ítem (papel sobre blanco, ilegible) y la hamburguesa era #333
   (invisible sobre el hero); en escritorio los ítems son píldoras y ese radio
   curvaba las líneas del desplegable. */
#cabecera-rp{
  --p2m-bg:#141C16; --p2m-txt:#FAF6EE; --p2m-sub:rgba(250,246,238,.62);
  --p2m-linea:rgba(250,246,238,.12); --p2m-hover:#222C24; --p2m-actual:#F28236;
  --p2m-borde-boton:rgba(250,246,238,.5);
}
#cabecera-rp.esta-fija{
  --p2m-bg:#FFFFFF; --p2m-txt:#141C16; --p2m-sub:rgba(20,28,22,.62);
  --p2m-linea:rgba(20,28,22,.1); --p2m-hover:#F2ECDF; --p2m-actual:#9C4200;
  --p2m-borde-boton:rgba(20,28,22,.48);
}
body #cabecera-rp .e-n-menu-toggle,
body #cabecera-rp .e-n-menu-toggle i{
  color:var(--e-global-color-secondary);
}
body #cabecera-rp .e-n-menu-toggle svg{
  fill:var(--e-global-color-secondary);
}
/* Con el menú abierto arriba de todo, el header toma el color del panel:
   header y menú se leen como una sola pieza, no como una lámina flotando
   sobre la foto. */
html.p2-menu-abierto #cabecera-rp:not(.esta-fija){background:var(--p2m-bg)}
html.p2-menu-abierto,
html.p2-menu-abierto body{overflow:hidden}

body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-wrapper{
  background-color:var(--p2m-bg);
  max-height:calc(100dvh - 64px); overflow-y:auto; overscroll-behavior:contain;
  box-shadow:0 28px 40px -28px rgba(9,14,10,.55);
}
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title,
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title-container{
  border-radius:0;
}
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title{
  background-color:var(--p2m-bg);
  border-top:1px solid var(--p2m-linea);
  padding-block:0;           /* Elementor le suma su padding de píldora: filas de 83px */
  padding-inline:1.875rem;   /* 30px: la línea del logo en celular */
  transition:background-color .2s cubic-bezier(.2,.7,.3,1);
}
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title-container{
  display:flex; align-items:center; justify-content:space-between; width:100%;
  min-height:3.625rem; padding-inline:0;
}
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title-text{
  font-size:1.125rem; font-weight:500; letter-spacing:-.005em;
}
/* Flecha a la derecha de cada fila: dice "esto lleva a otra página". */
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title-container::after{
  content:""; width:14px; height:14px; flex:none; margin-left:1rem;
  background:var(--p2m-txt); opacity:.4;   /* no currentColor: el <a> hereda el rojo del reset de Hello */
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M1 8h13M9 3l5 5-5 5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M1 8h13M9 3l5 5-5 5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .2s cubic-bezier(.2,.7,.3,1),opacity .2s;
}
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title:hover,
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title:focus-within{
  background-color:var(--p2m-hover);
}
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title:hover .e-n-menu-title-container::after{
  opacity:.8; transform:translateX(3px);
}
/* Página actual: barra y texto terracota (hondo sobre blanco, por contraste). */
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title.p2-actual{
  box-shadow:inset 3px 0 0 var(--p2m-actual);
}
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title.p2-actual .e-n-menu-title-text,
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title.p2-actual .e-n-menu-title-container::after{
  color:var(--p2m-actual); opacity:1;
}
body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title.p2-actual .e-n-menu-title-container::after{
  background:var(--p2m-actual);
}

/* Bloque "Participá" al pie del desplegable (menu.js). Sólo en modo
   desplegable: en escritorio el menú es horizontal y el header ya tiene sus
   botones (si no, el bloque aparecía arriba y corría "Sumate" y "Donar"). */
#cabecera-rp .p2-mnav{display:none}
#cabecera-rp .e-n-menu[data-layout="dropdown"] .p2-mnav{
  display:grid; gap:.625rem;
  padding:1.5rem 1.875rem 1.75rem;
  border-top:1px solid var(--p2m-linea);
  background:var(--p2m-bg);
  font-family:'Public Sans',system-ui,sans-serif;
}
#cabecera-rp .p2-mnav a.p2-mnav__boton{
  display:flex; align-items:center; justify-content:center; gap:.55rem;
  min-height:3.125rem; padding:0 1.5rem; border-radius:999px;
  border:1px solid var(--p2m-borde-boton); background:transparent;
  color:var(--p2m-txt); font-size:1rem; font-weight:600; text-decoration:none;
}
#cabecera-rp .p2-mnav a.p2-mnav__boton.is-primario{
  background:#F28236; border-color:#F28236; color:#2A140C;
}
#cabecera-rp .p2-mnav__bajada{
  margin:.375rem 0 0; text-align:center;
  font-size:.8125rem; line-height:1.5; color:var(--p2m-sub);
}

@media (min-width:768px){   /* en tablet el logo arranca en 42px */
  body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title{padding-inline:2.625rem}
  #cabecera-rp .p2-mnav{padding-inline:2.625rem; grid-template-columns:1fr 1fr}
  #cabecera-rp .p2-mnav__bajada{grid-column:1 / -1}
}
@media (prefers-reduced-motion:reduce){
  body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title,
  body #cabecera-rp .e-n-menu[data-layout="dropdown"] .e-n-menu-title-container::after{transition:none}
}

/* =============================================================================
   Footer — [p2_pie]
   El .pie del wireframe con sólo los destinos que existen: marca, "La red",
   los últimos proyectos (automáticos) y "Participá"; franja legal abajo.
   ============================================================================= */
.p2-pie{
  background:#141C16; color:#FAF6EE;
  font-family:'Public Sans',system-ui,sans-serif;
}
.p2-pie *{box-sizing:border-box}
.p2-pie p,.p2-pie ul{margin:0}
.p2-pie__inner{
  max-width:1376px; margin-inline:auto;
  padding:clamp(3.5rem,6vw,5.5rem) clamp(1.15rem,3.5vw,3rem) 1.75rem;
}
.p2-pie__top{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);
  gap:clamp(2.5rem,6vw,6rem);
  padding-bottom:clamp(2.5rem,5vw,4rem);
}
.p2-pie__logo{display:inline-block}
.p2-pie__logo img{display:block; width:auto; height:auto; max-width:230px; max-height:52px}
.p2-pie__desc{margin-top:1.25rem !important; max-width:36ch; font-size:.9375rem; line-height:1.65; color:rgba(250,246,238,.62)}

.p2-pie__nav{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) minmax(0,1.2fr); gap:clamp(2rem,4vw,3.5rem)}
.p2-pie__titulo{
  margin-bottom:1.125rem !important;
  font-family:'Archivo',sans-serif; font-size:.8125rem; font-weight:500; color:#A3D07F;
}
.p2-pie ul{list-style:none; padding:0}
.p2-pie li + li{margin-top:.75rem}
.p2-pie__col a{
  color:rgba(250,246,238,.78); font-size:.9375rem; line-height:1.4; text-decoration:none;
  transition:color .2s cubic-bezier(.2,.7,.3,1);
}
.p2-pie__col a:hover,.p2-pie__col a:focus-visible{color:#FAF6EE}
.p2-pie a:focus-visible{outline:2px solid #A3D07F; outline-offset:3px; border-radius:2px}
.p2-pie__col a.p2-pie__mas{display:inline-flex; align-items:center; gap:.45rem; color:#FF9956; font-weight:500}
.p2-pie__col a.p2-pie__mas:hover{color:#FAF6EE}
.p2-pie__texto{font-size:.9375rem; line-height:1.55; color:rgba(250,246,238,.62); max-width:32ch}
.p2-pie__botones{display:grid; gap:.625rem; margin-top:1.25rem}
.p2-pie__col a.p2-pie__boton{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
  min-height:3rem; padding:0 1.25rem 0 1.5rem; border-radius:999px;
  border:1px solid rgba(250,246,238,.5); color:#FAF6EE; font-weight:600;
  transition:background-color .2s cubic-bezier(.2,.7,.3,1),color .2s,border-color .2s;
}
.p2-pie__col a.p2-pie__boton.is-primario{background:#F28236; border-color:#F28236; color:#2A140C}
@media (hover:hover){
  .p2-pie__col a.p2-pie__boton:hover{background:#FAF6EE; border-color:#FAF6EE; color:#141C16}
  .p2-pie__col a.p2-pie__boton.is-primario:hover{background:#FAF6EE; border-color:#FAF6EE; color:#141C16}
}

.p2-pie__legal{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.75rem 2rem;
  padding-top:1.5rem; border-top:1px solid rgba(250,246,238,.12);
  font-size:.8125rem; color:rgba(250,246,238,.5);
}
.p2-pie__legal a.p2-pie__arriba{color:rgba(250,246,238,.72); text-decoration:none}
.p2-pie__legal a.p2-pie__arriba:hover{color:#FAF6EE}

@media (max-width:980px){
  .p2-pie__top{grid-template-columns:minmax(0,1fr)}
  .p2-pie__nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .p2-pie__col--participa{grid-column:1 / -1}
  .p2-pie__botones{grid-template-columns:repeat(2,minmax(0,1fr)); max-width:560px}
}
@media (max-width:600px){
  .p2-pie__nav{grid-template-columns:minmax(0,1fr)}
  .p2-pie__botones{grid-template-columns:minmax(0,1fr)}
  .p2-pie__legal{flex-direction:column; align-items:flex-start}
}

/* En la home los shortcodes caen dentro de contenedores atómicos que son fila
   (los que antes tenían la card o el widget posts): el widget tiene que ocupar
   todo el ancho, si no la grilla se achica a su contenido mínimo. */
.elementor-widget-shortcode:has(.p2-proyectos,.p2-grilla){flex:1 1 100%; width:100%; min-width:0}
.p2-proyectos p,.p2-grilla p,
.p2-proyectos h2,.p2-proyectos h3,.p2-proyectos h4,
.p2-grilla h2,.p2-grilla h3,.p2-grilla h4{margin:0}

/* Hello subraya y colorea los links del contenido con `.page-content a`
   (0,1,1). Con a.clase dentro del contenedor queda en (0,2,1) y gana siempre. */
.p2-proyectos a.p2-boton,.p2-grilla a.p2-card__link,.p2-grilla a.p2-nota__link{text-decoration:none}
.p2-grilla a.p2-card__link,.p2-grilla a.p2-nota__link{color:var(--p2-tinta)}
.p2-proyectos a.p2-boton{color:var(--p2-tinta)}
@media (hover:hover){.p2-proyectos a.p2-boton:hover{color:var(--p2-papel)}}

.p2-sin-foto{display:block; width:100%; height:100%; background:var(--p2-verde-panel)}

.p2-flecha{flex:none; transition:transform .2s var(--p2-ease)}

/* ---------- Botón: el pill de contorno de la home (ícono → SVG) ---------- */
.p2-boton{
  display:inline-flex; align-items:center; gap:.55rem;
  min-height:2.75rem; padding:.84rem 1.3rem .84rem 1.65rem;
  font-family:var(--p2-f); font-size:.9375rem; font-weight:500; line-height:1.15;
  letter-spacing:.005em; white-space:nowrap; text-decoration:none;
  color:var(--p2-tinta); background:transparent;
  border:1px solid var(--p2-tinta); border-radius:999px;
  transition:background-color .2s var(--p2-ease),color .2s var(--p2-ease),transform .2s var(--p2-ease);
}
.p2-boton:focus-visible{outline:3px solid var(--p2-tinta); outline-offset:3px; box-shadow:0 0 0 3px var(--p2-papel)}
@media (hover:hover){
  .p2-boton:hover{background:var(--p2-tinta); color:var(--p2-papel); transform:translateY(-1px)}
  .p2-boton:hover .p2-flecha{transform:translateX(3px)}
}

.p2-ver-mas{
  display:inline-flex; align-items:center; gap:.45rem;
  margin-top:auto; padding-top:1.125rem;
  font-size:.8125rem; font-weight:500; color:var(--p2-tinta);
}

/* =============================================================================
   1. Card grande de proyecto — calcada del bloque 6 de la home
   Medidas a 1440px: imagen 563×422 (4:3), texto 659, gap 57.6, entre cards 64.8.
   ============================================================================= */
.p2-proyectos{display:grid; gap:4.05rem; width:100%}

.p2-proyecto{
  display:grid; grid-template-columns:minmax(0,46fr) minmax(0,54fr);
  gap:3.6rem; align-items:center;
}
.p2-proyecto--invertido{grid-template-columns:minmax(0,54fr) minmax(0,46fr)}
.p2-proyecto--invertido .p2-proyecto__media{order:2}

.p2-proyecto__media{aspect-ratio:4/3; border-radius:3px; overflow:hidden; box-shadow:var(--p2-sombra-baja)}
.p2-proyecto__media img.p2-proyecto__img{display:block; width:100%; height:100%; object-fit:cover}

.p2-proyecto__cuerpo{font-family:var(--p2-f)}
.p2-proyecto__etiqueta{
  font-family:var(--p2-f-display); font-size:.75rem; font-weight:500; line-height:1.5;
  color:var(--p2-tinta-62); padding-bottom:1.125rem;
}
.p2-proyecto .p2-proyecto__titulo{
  font-family:var(--p2-f); font-weight:600;
  font-size:clamp(1.9rem,1.5rem + 2vw,3.05rem); line-height:1; letter-spacing:normal;
  color:var(--p2-tinta);
}
.p2-proyecto__lugar{
  padding:.6rem 0 1.125rem;
  font-size:1.5rem; font-weight:600; line-height:1; color:var(--p2-tinta-52);
}
.p2-proyecto__bajada{
  font-size:1.0625rem; line-height:1.6; color:var(--p2-tinta-72);
  padding-bottom:2.25rem; border-bottom:1px solid var(--p2-linea);
}
.p2-proyecto__accion{padding-top:1.125rem}

/* =============================================================================
   Grillas (proyectos simples y novedades)
   ============================================================================= */
.p2-grilla{display:grid; gap:var(--p2-gap-grid); width:100%}
.p2-grilla--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.p2-grilla--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.p2-grilla--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.p2-grilla--3{row-gap:clamp(2.25rem,3vw,3rem)}

/* =============================================================================
   2. Card simple de proyecto — .card-region del wireframe
   La card existe por su foto y una línea de base; la elevación aparece al
   pasar el mouse, que es cuando significa algo.
   ============================================================================= */
.p2-card{position:relative}
.p2-card:hover{z-index:2}
.p2-card__link{
  display:flex; flex-direction:column; height:100%;
  text-decoration:none; color:inherit; background:var(--p2-papel);
  border-bottom:1px solid var(--p2-linea);
  transition:transform .35s var(--p2-ease),box-shadow .35s var(--p2-ease),border-color .35s var(--p2-ease);
}
.p2-card__link:hover,.p2-card__link:focus-visible{
  transform:translateY(-4px); border-color:var(--p2-tinta); box-shadow:var(--p2-sombra-media);
}
.p2-card__link:focus-visible{outline:3px solid var(--p2-tinta); outline-offset:3px}
.p2-card__media{position:relative; aspect-ratio:4/3; overflow:hidden}
.p2-card__media img.p2-card__img{display:block; width:100%; height:100%; object-fit:cover; transition:transform .7s var(--p2-ease)}
.p2-card__link:hover .p2-card__img,.p2-card__link:focus-visible .p2-card__media img.p2-card__img{transform:scale(1.04)}
/* Anclada a la esquina, radio 0: la foto va a sangre. */
.p2-card__etiqueta{
  position:absolute; left:0; top:0; z-index:2;
  padding:.34rem .6rem;
  font-family:var(--p2-f); font-size:.6875rem; font-weight:500; line-height:1.2;
  background:var(--p2-tinta); color:var(--p2-papel);
}
.p2-card__cuerpo{display:flex; flex-direction:column; flex:1; padding:1.5rem; font-family:var(--p2-f)}
.p2-card .p2-card__titulo{
  font-family:var(--p2-f); font-size:clamp(1.22rem,1.12rem + .5vw,1.5rem); font-weight:600;
  line-height:1.16; letter-spacing:-.012em; color:var(--p2-tinta);
  margin-bottom:.375rem;
}
.p2-card__bajada{
  font-size:.9375rem; line-height:1.55; color:var(--p2-tinta-72);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.p2-card__meta{margin-top:.75rem; font-size:.75rem; color:var(--p2-tinta-62)}
.p2-card__link:hover .p2-flecha,.p2-card__link:focus-visible .p2-flecha{transform:translateX(4px)}

/* =============================================================================
   3. Card de novedad — .card-nota del wireframe
   ============================================================================= */
.p2-nota__link{display:flex; flex-direction:column; height:100%; text-decoration:none; color:inherit; font-family:var(--p2-f)}
.p2-nota__link:focus-visible{outline:3px solid var(--p2-tinta); outline-offset:4px}
.p2-nota__media{aspect-ratio:16/10; border-radius:3px; overflow:hidden; margin-bottom:1.125rem}
.p2-nota__media img.p2-nota__img{display:block; width:100%; height:100%; object-fit:cover; transition:transform .7s var(--p2-ease)}
.p2-nota__link:hover .p2-nota__media img.p2-nota__img{transform:scale(1.04)}
.p2-nota__meta{font-size:.75rem; color:var(--p2-tinta-62); margin-bottom:.375rem}
.p2-nota .p2-nota__titulo{
  font-family:var(--p2-f-display); font-size:1.1rem; font-weight:550;
  line-height:1.32; letter-spacing:-.008em; color:var(--p2-tinta);
  transition:color .2s var(--p2-ease);
}
.p2-nota__link:hover .p2-nota__titulo{color:var(--p2-terracota-hondo)}
.p2-nota__extracto{
  margin-top:.5rem; font-size:.9375rem; line-height:1.55; color:var(--p2-tinta-72);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.p2-nota__link:hover .p2-flecha{transform:translateX(4px)}

/* ---------- Paginación y vacío ---------- */
.p2-paginacion{margin-top:3rem; font-family:var(--p2-f)}
.p2-paginacion ul{display:flex; flex-wrap:wrap; gap:.5rem; list-style:none; margin:0; padding:0}
.p2-paginacion a,.p2-paginacion span{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:2.75rem; min-height:2.75rem; padding:0 1rem;
  font-size:.9375rem; font-weight:500; text-decoration:none;
  color:var(--p2-tinta); border:1px solid rgba(20,28,22,.48); border-radius:999px;
}
.p2-paginacion .current{background:var(--p2-tinta); border-color:var(--p2-tinta); color:var(--p2-papel)}
.p2-paginacion .dots{border-color:transparent}
@media (hover:hover){.p2-paginacion a:hover{background:var(--p2-tinta); color:var(--p2-papel)}}
.p2-vacio{font-family:var(--p2-f); color:var(--p2-tinta-62)}

/* =============================================================================
   Responsive — breakpoints del wireframe (1080 / 980 / 720)
   ============================================================================= */
@media (max-width:1080px){
  .p2-grilla--4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:980px){
  /* Imagen siempre arriba, también en la invertida. */
  .p2-proyecto,.p2-proyecto--invertido{grid-template-columns:minmax(0,1fr); gap:2rem}
  .p2-proyecto--invertido .p2-proyecto__media{order:0}
  .p2-grilla--3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .p2-grilla--2,.p2-grilla--3,.p2-grilla--4{grid-template-columns:minmax(0,1fr)}
  .p2-proyectos{gap:3.5rem}
  .p2-proyecto__lugar{font-size:1.25rem}
  .p2-card__cuerpo{padding:1.5rem 1.125rem}
  .p2-boton{white-space:normal}
}

@media (prefers-reduced-motion:reduce){
  .p2-boton,.p2-card__link,.p2-card__img,.p2-nota__img,.p2-flecha{transition:none}
  .p2-card__link:hover,.p2-card__link:focus-visible{transform:none}
  .p2-card__link:hover .p2-card__img,.p2-nota__link:hover .p2-nota__media img.p2-nota__img{transform:none}
}

/* =============================================================================
   SINGLES (etapa 4) — secciones de Proyecto y Novedad
   Ancho y aire calcados de las secciones de la home: caja de 1376 con 48 de
   padding (contenido 1280) y 93.6 / 100.8 arriba y abajo a 1440px.
   ============================================================================= */
:root{
  --p2-papel-2:#F2ECDF;
  --p2-papel-72:rgba(250,246,238,.72);
  --p2-papel-62:rgba(250,246,238,.62);
  --p2-linea-clara:rgba(250,246,238,.18);
  --p2-verde-claro:#A3D07F;
  --p2-verde-hondo:#256C2C;
  --p2-ancho:1376px;
  --p2-gutter:clamp(1.15rem,3.5vw,3rem);
  --p2-t-3xl:clamp(2.3rem,1.62rem + 3.4vw,4.1rem);
  --p2-t-2xl:clamp(1.9rem,1.5rem + 2vw,3.05rem);
  --p2-alto-cabecera:84px;   /* el header global va encima del primer bloque */
}

.p2-hero *,.p2-sec *{box-sizing:border-box}
.p2-hero p,.p2-hero h1,.p2-sec h2,.p2-sec p,.p2-sec ul{margin:0}

.p2-sec{padding-block:clamp(4rem,6.5vw,5.85rem) clamp(4.25rem,7vw,6.3rem); font-family:var(--p2-f); color:var(--p2-tinta)}
.p2-sec--papel{background:var(--p2-papel)}
.p2-sec--papel-2{background:var(--p2-papel-2)}
.p2-sec--tinta{background:var(--p2-tinta); color:var(--p2-papel)}
.p2-sec__inner{max-width:var(--p2-ancho); margin-inline:auto; padding-inline:var(--p2-gutter)}

.p2-eyebrow{font-family:var(--p2-f-display); font-size:.75rem; font-weight:500; line-height:1.5; color:var(--p2-tinta-62); padding-bottom:1.125rem}
.p2-sec .p2-sec__titulo{
  font-family:var(--p2-f-display); font-weight:600;
  font-size:var(--p2-t-3xl); line-height:1; letter-spacing:normal; color:var(--p2-tinta);
  text-wrap:balance;
}
.p2-sec .p2-sec__titulo--chico{font-size:var(--p2-t-2xl)}

/* ---------- Hero ---------- */
.p2-hero{
  position:relative; isolation:isolate; overflow:hidden;
  display:flex; align-items:flex-end;
  min-height:clamp(480px,66vh,720px);
  padding:calc(var(--p2-alto-cabecera) + clamp(3rem,7vh,5rem)) 0 clamp(3rem,6vh,4.5rem);
  background:var(--p2-tinta); color:var(--p2-papel); font-family:var(--p2-f);
}
.p2-hero__fondo{position:absolute; inset:0; z-index:-2}
.p2-hero__fondo img.p2-hero__img{display:block; width:100%; height:100%; object-fit:cover}
/* El velo del hero de la home: denso a la izquierda, donde está el texto. */
.p2-hero__velo{
  position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(90deg,rgba(16,26,22,.9) 0%,rgba(16,26,22,.8) 45%,rgba(16,26,22,.34) 74%,rgba(16,26,22,.04) 100%),
    linear-gradient(180deg,rgba(16,26,22,.65) 0%,rgba(16,26,22,.35) 42%,rgba(16,26,22,.82) 100%);
}
.p2-hero__inner{width:100%; max-width:var(--p2-ancho); margin-inline:auto; padding-inline:var(--p2-gutter)}
.p2-hero__etiqueta{font-family:var(--p2-f-display); font-size:.75rem; font-weight:500; line-height:1.5; color:var(--p2-papel-62); padding-bottom:1.125rem}
.p2-hero__etiqueta a{color:inherit; text-decoration:none; border-bottom:1px solid var(--p2-linea-clara)}
.p2-hero__etiqueta a:hover{color:var(--p2-papel); border-color:currentColor}
.p2-hero .p2-hero__titulo{
  font-family:var(--p2-f-display); font-weight:600;
  font-size:var(--p2-t-3xl); line-height:1; letter-spacing:normal;
  color:var(--p2-papel); max-width:22ch; text-wrap:balance;
}
.p2-hero__lugar{
  margin-top:.35rem;
  font-family:var(--p2-f-display); font-weight:600; font-size:var(--p2-t-2xl); line-height:1.05;
  color:var(--p2-verde-claro);
}
.p2-hero__bajada{
  margin-top:1.5rem; max-width:46ch;
  font-family:var(--p2-f-display); font-size:clamp(1.06rem,1rem + .5vw,1.32rem); line-height:1.5;
  color:var(--p2-papel-72);
}

/* Novedad: texto centrado y velo radial (.hero--nota de nota.html). */
.p2-hero--nota{align-items:center; text-align:center; min-height:clamp(420px,58vh,640px)}
.p2-hero--nota .p2-hero__velo{
  background:
    radial-gradient(ellipse 92% 88% at 50% 50%,rgba(16,26,22,.84) 0%,rgba(16,26,22,.8) 58%,rgba(16,26,22,.4) 84%,rgba(16,26,22,.16) 100%),
    linear-gradient(180deg,rgba(16,26,22,.55) 0%,rgba(16,26,22,.25) 40%,rgba(16,26,22,.6) 100%);
}
.p2-hero--nota .p2-hero__inner{max-width:52rem}
.p2-hero--nota .p2-hero__titulo{max-width:26ch; margin-inline:auto}
.p2-hero--nota .p2-hero__bajada{margin-inline:auto; max-width:52ch}
.p2-hero__chip{margin-bottom:1.125rem}
.p2-hero__chip a{
  display:inline-block; padding:.3rem .55rem; border-radius:2px;
  font-size:.6875rem; font-weight:500; line-height:1.2; text-decoration:none;
  background:var(--p2-terracota); color:#2A140C;
}
.p2-hero__meta{
  display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem 2rem;
  margin-top:clamp(1.5rem,3vw,2.25rem); padding-top:1.125rem;
  border-top:1px solid rgba(250,246,238,.5);
  font-size:.75rem; color:var(--p2-papel-72);
}

/* ---------- Cabecera de archivo: el hero sin foto ---------- */
.p2-hero--archivo{min-height:clamp(380px,48vh,520px)}
/* Los anillos del radar de la home, en papel sobre tinta (sin animación). */
.p2-hero--archivo::before{
  content:""; position:absolute; z-index:-1; right:-12%; bottom:-60%;
  width:min(110vh,1000px); aspect-ratio:1; border-radius:50%;
  background:repeating-radial-gradient(circle at center,rgba(250,246,238,.16) 0 1.5px,rgba(250,246,238,0) 1.5px 44px);
}

/* ---------- Proyecto: ficha de dos columnas (problematica.html) ---------- */
.p2-ficha{display:grid; grid-template-columns:minmax(0,1fr) minmax(16rem,22rem); gap:clamp(2.5rem,6vw,6rem); align-items:start}
.p2-ficha--sin-texto{grid-template-columns:minmax(0,22rem)}
.p2-ficha__lateral{position:sticky; top:calc(var(--p2-alto-cabecera) + 1.5rem)}
.p2-panel{padding:1.5rem; background:var(--p2-papel-2); border-radius:4px; border-top:3px solid var(--p2-terracota)}
.p2-sec .p2-panel__titulo{font-family:var(--p2-f-display); font-size:.75rem; font-weight:500; color:var(--p2-tinta-62); margin-bottom:1rem}
.p2-panel__datos{margin:0}
.p2-panel__datos > div{padding:.75rem 0; border-top:1px solid var(--p2-linea)}
.p2-panel__datos dt{font-size:.75rem; color:var(--p2-tinta-62)}
.p2-panel__datos dd{margin:.2rem 0 0; font-size:1.0625rem; font-weight:600; line-height:1.3; color:var(--p2-tinta)}
.p2-panel__acciones{display:grid; gap:.625rem; margin-top:1.25rem}
.p2-boton--bloque{display:flex; width:100%; justify-content:center}
.p2-sec a.p2-boton--relleno{background:var(--p2-terracota); border-color:var(--p2-terracota); color:#2A140C}
@media (hover:hover){.p2-sec a.p2-boton--relleno:hover{background:var(--p2-tinta); border-color:var(--p2-tinta); color:var(--p2-terracota)}}

/* ---------- Filtro de categorías (archivo de novedades) ---------- */
.p2-filtro{display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:clamp(2rem,3.5vw,3rem); font-family:var(--p2-f)}
.p2-sec .p2-filtro a{
  display:inline-flex; align-items:center; min-height:2.5rem; padding:0 1.1rem;
  font-size:.9375rem; font-weight:500; text-decoration:none; color:var(--p2-tinta);
  border:1px solid rgba(20,28,22,.48); border-radius:999px;
}
.p2-sec .p2-filtro a[aria-current="page"]{background:var(--p2-tinta); border-color:var(--p2-tinta); color:var(--p2-papel)}
@media (hover:hover){.p2-sec .p2-filtro a:not([aria-current]):hover{border-color:var(--p2-tinta); background:var(--p2-papel-2)}}

/* ---------- §2 Actividades — carrusel ---------- */
.p2-galeria__cabecera{display:flex; justify-content:space-between; align-items:flex-end; gap:1.5rem; margin-bottom:clamp(2rem,3.5vw,3rem)}
.p2-galeria__flechas{display:flex; gap:.5rem}
.p2-galeria--entra .p2-galeria__flechas{display:none}
.p2-sec .p2-galeria__flecha,.p2-sec .p2-galeria__flecha:focus{
  display:inline-grid; place-items:center; width:2.9rem; height:2.9rem; padding:0;
  border:1px solid var(--p2-tinta); border-radius:50%; background:transparent; color:var(--p2-tinta);
  cursor:pointer; transition:background-color .2s var(--p2-ease),color .2s var(--p2-ease),opacity .2s;
}
.p2-galeria__flecha[data-p2-dir="-1"] .p2-flecha{transform:rotate(180deg)}
.p2-sec .p2-galeria__flecha:disabled{opacity:.3; cursor:default}
.p2-galeria__flecha:focus-visible{outline:3px solid var(--p2-tinta); outline-offset:3px}
@media (hover:hover){.p2-sec .p2-galeria__flecha:not(:disabled):hover{background:var(--p2-tinta); color:var(--p2-papel)}}

.p2-sec .p2-galeria__pista{
  --p2-visibles:4;
  display:grid; grid-auto-flow:column; column-gap:var(--p2-gap-grid);
  grid-auto-columns:calc((100% - (var(--p2-visibles) - 1) * var(--p2-gap-grid)) / var(--p2-visibles));
  overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory;
  scrollbar-width:none; list-style:none; padding:0;
}
.p2-galeria__pista::-webkit-scrollbar{display:none}
.p2-galeria__pista:focus-visible{outline:3px solid var(--p2-tinta); outline-offset:4px}
.p2-galeria__item{scroll-snap-align:start; margin:0}
/* relative: el texto oculto para lectores (absolute) tiene que quedar dentro
   del scroller; si su bloque contenedor está afuera, se escapa del recorte y
   estira la página al ancho de toda la pista (en móvil daba 1443px). */
.p2-galeria__link{position:relative; display:block; aspect-ratio:4/5; overflow:hidden; border-radius:3px; background:var(--p2-papel-3)}
.p2-galeria__link img.p2-galeria__img{display:block; width:100%; height:100%; object-fit:cover; transition:transform .7s var(--p2-ease)}
.p2-galeria__link:hover img.p2-galeria__img{transform:scale(1.04)}
.p2-galeria__link:focus-visible{outline:3px solid var(--p2-tinta); outline-offset:3px}
.p2-galeria__leyenda{margin-top:.6rem; font-size:.8125rem; line-height:1.45; color:var(--p2-tinta-62)}

/* ---------- §3 Indicadores — el bloque de cifras "+30", en tinta ---------- */
.p2-sec .p2-cifras__titulo{
  font-family:var(--p2-f-display); font-weight:600; font-size:var(--p2-t-2xl); line-height:1;
  color:var(--p2-papel); padding-bottom:clamp(1.5rem,2.5vw,2.25rem);
  border-bottom:1px solid var(--p2-linea-clara);
}
.p2-sec .p2-cifras{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); list-style:none; padding:0}
.p2-sec .p2-cifras--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.p2-sec .p2-cifras--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.p2-sec .p2-cifras--1{grid-template-columns:minmax(0,1fr)}
.p2-cifra{margin:0; padding:2.7rem 1.8rem .625rem 0}
.p2-cifra + .p2-cifra{padding-left:clamp(1.25rem,2.5vw,2.5rem); border-left:1px solid var(--p2-linea-clara)}
.p2-sec .p2-cifra__valor{font-family:var(--p2-f-display); font-weight:700; font-size:clamp(2.55rem,1.5rem + 5.2vw,5.15rem); line-height:1; color:var(--p2-papel); overflow-wrap:anywhere}
.p2-sec .p2-cifra__texto{margin-top:.9rem; font-family:var(--p2-f-display); font-size:.9375rem; line-height:1.5; color:var(--p2-papel-72); max-width:24ch}

/* ---------- Publicación: el texto del editor de bloques ----------
   .nota-cuerpo de nota.html + .ficha__texto / .cita de problematica.html,
   extendido a los bloques de Gutenberg (imagen, galería, cita, video,
   botones, separador). Todo bajo .p2-sec .p2-publicacion (0,2,x) para ganarle
   a los estilos de bloque de WordPress y al reset del tema. */
.p2-publicacion{max-width:68ch; font-family:var(--p2-f); color:var(--p2-tinta-72)}
.p2-publicacion--centrada{margin-inline:auto}
.p2-sec .p2-publicacion > *{margin-block:0}
.p2-sec .p2-publicacion > * + *{margin-top:1.5rem}
.p2-sec .p2-publicacion p,.p2-sec .p2-publicacion li{font-size:clamp(1.0625rem,1.01rem + .28vw,1.2rem); line-height:1.7; color:var(--p2-tinta-72)}
/* Entradilla: el primer párrafo, un escalón más grande y en tinta plena. */
.p2-sec .p2-publicacion > p:first-child{font-size:clamp(1.22rem,1.12rem + .5vw,1.5rem); line-height:1.5; letter-spacing:-.012em; color:var(--p2-tinta); font-weight:450}
.p2-sec .p2-publicacion h2{font-family:var(--p2-f-display); font-weight:600; font-size:clamp(1.9rem,1.5rem + 2vw,3.05rem); line-height:1.02; color:var(--p2-tinta); margin-top:3.5rem; text-wrap:balance}
.p2-sec .p2-publicacion h3{font-family:var(--p2-f-display); font-weight:600; font-size:clamp(1.22rem,1.12rem + .5vw,1.5rem); line-height:1.16; color:var(--p2-tinta); margin-top:2.5rem}
.p2-sec .p2-publicacion > h2 + *,.p2-sec .p2-publicacion > h3 + *{margin-top:1rem}
.p2-sec .p2-publicacion strong{color:var(--p2-tinta); font-weight:600}
.p2-sec .p2-publicacion a:not(.wp-block-button__link):not([data-elementor-open-lightbox]){color:var(--p2-verde-hondo); text-decoration:underline; text-underline-offset:.2em}
.p2-sec .p2-publicacion ul{list-style:none; padding:0}
.p2-sec .p2-publicacion ul li{position:relative; padding-left:1.5rem}
.p2-sec .p2-publicacion li + li{margin-top:.75rem}
.p2-sec .p2-publicacion ul li::before{content:""; position:absolute; left:.3rem; top:.72em; width:6px; height:6px; border-radius:50%; background:var(--p2-terracota-hondo)}
.p2-sec .p2-publicacion ol{padding-left:1.4rem}

/* Imágenes */
.p2-sec .p2-publicacion figure{margin-inline:0}
.p2-sec .p2-publicacion > .wp-block-image,.p2-sec .p2-publicacion > .wp-block-gallery,.p2-sec .p2-publicacion > .wp-block-embed{margin-top:2.5rem}
.p2-sec .p2-publicacion > .wp-block-image + *,.p2-sec .p2-publicacion > .wp-block-gallery + *,.p2-sec .p2-publicacion > .wp-block-embed + *{margin-top:2.5rem}
.p2-sec .p2-publicacion .wp-block-image img{display:block; width:100%; height:auto; max-width:100%; border-radius:3px}
.p2-sec .p2-publicacion figcaption{margin-top:.75rem; font-size:.8125rem; line-height:1.5; color:var(--p2-tinta-62); text-align:left}
/* Galería: grilla propia, 3 columnas (2 en móvil), recorte parejo. */
.p2-sec .p2-publicacion .wp-block-gallery{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.625rem}
.p2-sec .p2-publicacion .wp-block-gallery.columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.p2-sec .p2-publicacion .wp-block-gallery > figure.wp-block-image{width:auto !important; margin:0; aspect-ratio:1; overflow:hidden; border-radius:3px}
.p2-sec .p2-publicacion .wp-block-gallery > figure.wp-block-image img{width:100%; height:100%; object-fit:cover; border-radius:0; transition:transform .7s var(--p2-ease)}
.p2-sec .p2-publicacion .wp-block-gallery a:hover img{transform:scale(1.04)}
.p2-sec .p2-publicacion .wp-block-gallery > figcaption{grid-column:1 / -1}
/* Cita: .cita de problematica.html */
.p2-sec .p2-publicacion blockquote{margin:3rem 0; padding:2.25rem 0; border:0; border-block:1px solid var(--p2-linea)}
.p2-sec .p2-publicacion blockquote p{font-family:var(--p2-f); font-size:clamp(1.5rem,1.28rem + 1.1vw,2.1rem); font-weight:500; line-height:1.28; letter-spacing:-.018em; color:var(--p2-tinta); font-style:normal}
.p2-sec .p2-publicacion blockquote cite{display:block; margin-top:1.125rem; font-size:.75rem; font-style:normal; color:var(--p2-tinta-62)}
.p2-sec .p2-publicacion .wp-block-pullquote{padding:0; border:0; text-align:left}
/* Video y otros embebidos */
.p2-sec .p2-publicacion .wp-block-embed iframe{display:block; width:100%; height:auto; aspect-ratio:16/9; border:0; border-radius:3px}
/* Botones del editor = el pill del sitio */
.p2-sec .p2-publicacion .wp-block-button__link{
  display:inline-flex; align-items:center; min-height:2.75rem; padding:.84rem 1.65rem;
  font-size:.9375rem; font-weight:500; text-decoration:none;
  background:var(--p2-terracota); color:#2A140C; border-radius:999px;
}
.p2-sec .p2-publicacion .is-style-outline .wp-block-button__link{background:transparent; color:var(--p2-tinta); border:1px solid var(--p2-tinta)}
.p2-sec .p2-publicacion hr,.p2-sec .p2-publicacion .wp-block-separator{border:0; border-top:1px solid var(--p2-linea); margin-block:3rem; opacity:1}

/* ---------- Novedad: "Seguir leyendo" (encabezado de "Últimas novedades") ---------- */
.p2-seguir__cabecera{display:flex; justify-content:space-between; align-items:flex-end; gap:1.5rem; margin-bottom:clamp(2rem,3.5vw,3rem)}
.p2-sec a.p2-boton{text-decoration:none; color:var(--p2-tinta)}
@media (hover:hover){.p2-sec a.p2-boton:hover{color:var(--p2-papel)}}

@media (max-width:980px){
  .p2-ficha,.p2-ficha--sin-texto{grid-template-columns:minmax(0,1fr)}
  .p2-ficha__lateral{position:static}
  .p2-sec .p2-galeria__pista{--p2-visibles:2.4}
  .p2-sec .p2-cifras,.p2-sec .p2-cifras--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .p2-cifra:nth-child(odd){padding-left:0; border-left:0}
  .p2-cifra:nth-child(n+3){border-top:1px solid var(--p2-linea-clara)}
}
@media (max-width:720px){
  :root{--p2-alto-cabecera:64px}
  .p2-sec .p2-galeria__pista{--p2-visibles:1.25}
  .p2-galeria__flechas{display:none}
  .p2-sec .p2-cifras,.p2-sec .p2-cifras--2,.p2-sec .p2-cifras--3{grid-template-columns:minmax(0,1fr)}
  .p2-cifra,.p2-cifra + .p2-cifra{padding:1.75rem 0 1rem; border-left:0}
  .p2-cifra + .p2-cifra{border-top:1px solid var(--p2-linea-clara)}
  .p2-seguir__cabecera{flex-direction:column; align-items:flex-start}
  .p2-sec .p2-publicacion .wp-block-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){
  .p2-galeria__img,.p2-sec .p2-galeria__flecha,.p2-sec .p2-galeria__flecha:focus{transition:none}
  .p2-galeria__link:hover img.p2-galeria__img{transform:none}
}