/*
Theme Name: Alcubilla 2026
Theme URI: https://www.alcubilladeavellaneda.com
Author: El Portal de Alcubilla de Avellaneda
Description: Tema del Portal de Alcubilla de Avellaneda. Una sola pestaña de Actualidad que mezcla noticias, crónicas y multimedia en orden cronológico, con etiqueta de tipo, filtro por año y buscador.
Version: 1.0.0
Requires at least: 5.8
Requires PHP: 7.4
Text Domain: alcubilla2026
*/

/* ---------- Base ---------- */

:root {
  --papel: #fffdfa;
  --papel-2: #f7f4ee;
  --papel-3: #f2ede4;
  --tinta: #23211d;
  --tinta-2: #3b3730;
  --texto: #4c473f;
  --apagado: #7d766c;
  --apagado-2: #8a8377;
  --linea: #e2dcd1;
  --linea-2: #cdc4b4;
  --verde: #3f6b4f;
  --verde-osc: #2d4d39;
  --teja: #a8543a;
  --azul: #3a5f7d;
  --serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --sans: 'Karla', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
  --ancho: 1240px;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--papel);
  color: var(--texto);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.65;
}

img { max-width: 100%; height: auto; }

a { color: var(--verde); text-decoration: none; }
a:hover, a:focus { color: var(--verde-osc); }

h1, h2, h3, h4 { font-family: var(--serif); color: var(--tinta); margin: 0; line-height: 1.2; }

.contenedor { max-width: var(--ancho); margin: 0 auto; padding: 0 32px; }

.mono-etiqueta {
  font: 500 12px/1 var(--mono);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--apagado-2);
}

.solo-lectores {
  position: absolute; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

.saltar-al-contenido {
  position: absolute; left: -9999px; top: 0;
  background: var(--tinta); color: #fff; padding: 12px 18px; z-index: 100;
}
.saltar-al-contenido:focus { left: 8px; top: 8px; color: #fff; }

/* ---------- Barra superior de datos ---------- */

.barra-datos {
  background: var(--tinta);
  color: #cfc8bb;
  font: 500 12px/1 var(--mono);
  letter-spacing: .08em;
  padding: 10px 32px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.barra-datos span { white-space: nowrap; }

/* ---------- Cabecera ---------- */

.cabecera {
  position: relative;
  min-height: 320px;
  display: flex;
  flex-direction: column;
  background-color: #3a3630;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.cabecera--interior { min-height: 0; }
.cabecera::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(35,33,29,.68) 0%, rgba(35,33,29,.15) 45%, rgba(35,33,29,.72) 100%);
}
.cabecera--interior::before {
  background: var(--tinta);
}

.cabecera-barra {
  position: relative;
  padding: 20px 32px;
  display: flex;
  align-items: center;
  gap: 18px;
}
.marca { display: flex; align-items: center; gap: 14px; }
.marca img { height: 46px; width: auto; display: block; }
.marca-nombre { font: 700 20px/1.2 var(--serif); color: #fff; }
.marca:hover .marca-nombre { color: #fff; }

.menu-btn {
  display: none;
  margin-left: auto;
  width: 48px; height: 48px;
  border: 0; border-radius: 999px;
  background: rgba(255,255,255,.16);
  color: #fff; font-size: 20px; line-height: 1;
  cursor: pointer;
}

.menu-cerrar { display: none; }
.menu-fondo { display: none; }
body.menu-abierto { overflow: hidden; }

.menu-principal { margin-left: auto; }
.menu-principal ul { display: flex; gap: 6px; list-style: none; margin: 0; padding: 0; }
.menu-principal a {
  display: block;
  padding: 10px 16px;
  border-radius: 999px;
  color: #f2ede4;
  font-weight: 500;
  font-size: 15.5px;
}
.menu-principal a:hover { background: rgba(255,255,255,.12); color: #fff; }
.menu-principal .current-menu-item > a,
.menu-principal .current_page_item > a,
.menu-principal .current-menu-parent > a {
  background: rgba(255,255,255,.18);
  color: #fff;
  font-weight: 700;
}
.enlace-buscar {
  display: block;
  padding: 10px 16px;
  border-radius: 999px;
  background: #fff;
  color: var(--tinta) !important;
  font-weight: 700;
  font-size: 15.5px;
}
.enlace-buscar:hover { background: var(--papel-3); }

.cabecera-titulo {
  position: relative;
  margin-top: auto;
  padding: 0 32px 26px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cabecera-antetitulo {
  font: 500 12px/1 var(--mono);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #d9d1c2;
}
.cabecera-h1 {
  font: 700 46px/1.05 var(--serif);
  color: #fff;
  letter-spacing: -.015em;
}
.cabecera--interior .cabecera-titulo { padding-bottom: 22px; }
.cabecera--interior .cabecera-h1 { font-size: 34px; }

/* ---------- Filtros ---------- */

.filtros {
  padding: 18px 32px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  border-bottom: 1.5px solid var(--linea);
}
.filtro {
  padding: 8px 14px;
  border-radius: 999px;
  border: 1.5px solid var(--linea-2);
  color: var(--tinta-2);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}
.filtro:hover { background: var(--papel-3); color: var(--tinta); }
.filtro.es-activo {
  background: var(--tinta);
  border-color: var(--tinta);
  color: var(--papel-2);
}
.filtro.es-activo:hover { color: var(--papel-2); }

.filtro-anio { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.filtro-anio label {
  font: 500 11.5px/1 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--apagado-2);
}
.filtro-anio select {
  border: 1.5px solid var(--linea-2);
  border-radius: 999px;
  padding: 8px 15px;
  font-size: 14px;
  font-weight: 600;
  color: var(--tinta-2);
  font-family: var(--sans);
  background: var(--papel);
  cursor: pointer;
}

.buscador-inline { display: flex; gap: 8px; margin: 0 0 0 auto; }
.buscador-inline input[type="search"] {
  border: 1.5px solid var(--linea-2);
  border-radius: 999px;
  padding: 8px 16px;
  font-size: 14px;
  font-family: var(--sans);
  min-width: 220px;
  background: var(--papel);
  color: var(--tinta);
}

/* ---------- Muro ---------- */

.muro {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  padding: 30px 0 44px;
}

.muro-separador {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 14px;
}
.muro-separador::after {
  content: "";
  flex: 1;
  height: 1.5px;
  background: var(--linea);
}

.tarjeta {
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  overflow: hidden;
  background: var(--papel-2);
  border: 1.5px solid var(--linea);
  color: inherit;
  transition: border-color .25s ease;
}
.tarjeta:hover { border-color: #c6bca9; color: inherit; }

.tarjeta-foto {
  min-height: 180px;
  background-color: var(--papel-3);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.tarjeta-cuerpo {
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.tarjeta-titulo { font: 700 21px/1.28 var(--serif); }
.tarjeta-meta { font-size: 14px; color: var(--apagado); }
.tarjeta-resumen { margin: 0; font-size: 16.5px; line-height: 1.6; color: var(--texto); }

.etiqueta-tipo {
  align-self: flex-start;
  font: 600 11.5px/1 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #fff;
  padding: 6px 9px;
  border-radius: 3px;
  background: var(--apagado);
}
.etiqueta-tipo--noticia { background: var(--verde); }
.etiqueta-tipo--cronica { background: var(--teja); }
.etiqueta-tipo--multimedia { background: var(--azul); }

.tarjeta--destacada { grid-column: span 2; grid-row: span 2; }
.tarjeta--destacada .tarjeta-foto { flex: 1; min-height: 320px; }
.tarjeta--destacada .tarjeta-cuerpo { padding: 22px; gap: 11px; }
.tarjeta--destacada .tarjeta-titulo { font-size: 32px; line-height: 1.18; text-wrap: balance; }
.tarjeta--destacada .tarjeta-resumen { font-size: 17px; line-height: 1.65; text-wrap: pretty; }
.tarjeta--destacada .tarjeta-cabecera { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.tarjeta--destacada .etiqueta-tipo { align-self: auto; }
.tarjeta--destacada .tarjeta-meta { font-size: 14.5px; }

.tarjeta--lateral .tarjeta-foto { min-height: 158px; }
.tarjeta--lateral .tarjeta-cuerpo { padding: 16px; gap: 8px; }
.tarjeta--lateral .tarjeta-titulo { font-size: 20px; }

.sin-resultados {
  grid-column: 1 / -1;
  padding: 60px 0;
  text-align: center;
}
.sin-resultados h2 { font-size: 28px; margin-bottom: 12px; }

/* ---------- Botones y paginación ---------- */

.boton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid var(--tinta);
  color: var(--tinta);
  background: transparent;
  font-weight: 700;
  font-size: 16px;
  font-family: var(--sans);
  padding: 13px 26px;
  border-radius: 999px;
  cursor: pointer;
}
.boton:hover { background: var(--tinta); color: var(--papel-2); }
.boton--solido {
  background: var(--verde);
  border-color: var(--verde);
  color: #fff;
}
.boton--solido:hover { background: var(--verde-osc); border-color: var(--verde-osc); color: #fff; }

.paginacion { margin-top: 40px; padding: 0 0 48px; display: flex; justify-content: center; }
.paginacion .nav-links { display: flex; gap: 6px; flex-wrap: wrap; }
.paginacion .page-numbers {
  min-width: 44px; height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0 12px;
  border: 1.5px solid var(--linea-2);
  border-radius: 999px;
  color: var(--tinta-2);
  font-weight: 600;
}
.paginacion .page-numbers:hover { background: var(--papel-3); }
.paginacion .page-numbers.current {
  background: var(--tinta); border-color: var(--tinta); color: var(--papel-2);
}
.paginacion .page-numbers.dots { border-color: transparent; }

/* ---------- Entrada ---------- */

.entrada { max-width: 820px; margin: 0 auto; padding: 44px 32px 0; }

.entrada-cabecera { display: flex; flex-direction: column; gap: 16px; padding-bottom: 26px; }
.entrada-cabecera .etiqueta-tipo { align-self: flex-start; }
.entrada-titulo { font-size: 44px; line-height: 1.12; letter-spacing: -.015em; text-wrap: balance; }
.entrada-meta {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  font-size: 15.5px; color: var(--apagado);
}
.entrada-meta img { height: 34px; width: auto; display: block; }

.entrada-contenido { font-size: 18px; line-height: 1.75; color: var(--texto); }
.entrada-contenido p { margin: 0 0 1.25rem; text-wrap: pretty; }
.entrada-contenido h2 { font-size: 30px; margin: 2.2rem 0 .8rem; }
.entrada-contenido h3 { font-size: 24px; margin: 1.8rem 0 .7rem; }
.entrada-contenido a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
.entrada-contenido img { border-radius: 6px; }
.entrada-contenido figure { margin: 1.8rem 0; }
.entrada-contenido figcaption { font-size: 14.5px; color: var(--apagado); text-align: center; margin-top: 8px; }
.entrada-contenido blockquote {
  margin: 1.8rem 0;
  padding: 0 0 0 22px;
  border-left: 3px solid var(--teja);
  font: 400 20px/1.55 var(--serif);
  color: var(--tinta);
}
.entrada-contenido ul, .entrada-contenido ol { padding-left: 22px; }
.entrada-contenido li { margin-bottom: .5rem; }

.entrada-pie {
  margin: 40px 0 0;
  padding: 22px 0;
  border-top: 1.5px solid var(--linea);
  display: flex;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  font-size: 15.5px;
}

.galeria-entrada { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 30px 0; }
.galeria-entrada a { display: block; }
.galeria-entrada img { display: block; width: 100%; height: 150px; object-fit: cover; border-radius: 5px; }

/* ---------- Comentarios ---------- */

.comentarios { max-width: 820px; margin: 0 auto; padding: 20px 32px 60px; }
.comentarios-titulo { font-size: 26px; margin-bottom: 26px; }
.lista-comentarios, .lista-comentarios .children { list-style: none; padding: 0; margin: 0; }
.lista-comentarios .children { padding-left: 26px; border-left: 2px solid var(--linea); margin-top: 12px; }
.lista-comentarios li { margin-bottom: 12px; }
.lista-comentarios .comment-body {
  background: var(--papel-2);
  border: 1.5px solid var(--linea);
  border-radius: 8px;
  padding: 20px;
}
.lista-comentarios .comment-author { font: 700 17px/1.3 var(--serif); color: var(--tinta); }
.lista-comentarios .comment-author cite { font-style: normal; }
.lista-comentarios .comment-metadata { font-size: 13.5px; color: var(--apagado); margin-bottom: 10px; }
.lista-comentarios .comment-metadata a { color: var(--apagado); }
.lista-comentarios .comment-content { font-size: 16.5px; line-height: 1.65; }
.lista-comentarios .reply a {
  display: inline-block;
  margin-top: 8px;
  font: 600 13.5px/1 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.comment-respond { margin-top: 34px; }
.comment-reply-title { font-size: 24px; margin-bottom: 18px; }
.comment-form { display: flex; flex-direction: column; gap: 14px; }
.comment-form label {
  display: block;
  font: 600 11.5px/1 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--apagado-2);
  margin-bottom: 6px;
}
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea,
.buscador-pagina input[type="search"] {
  width: 100%;
  padding: 13px 15px;
  border: 1.5px solid var(--linea-2);
  border-radius: 8px;
  background: var(--papel);
  color: var(--tinta);
  font-family: var(--sans);
  font-size: 16.5px;
}
.comment-form textarea { min-height: 150px; resize: vertical; }
.comment-form .comment-notes, .comment-form .comment-form-url { display: none; }
.comment-form .form-submit { margin: 0; }
.comment-form input[type="submit"] {
  border: 0;
  background: var(--verde);
  color: #fff;
  font-weight: 700;
  font-size: 16.5px;
  font-family: var(--sans);
  padding: 14px 26px;
  border-radius: 999px;
  cursor: pointer;
}
.comment-form input[type="submit"]:hover { background: var(--verde-osc); }

/* ---------- Formularios de plugins ----------
 * Contact Form 7, WPForms y Gravity Forms sueltan su propio HTML dentro de
 * la página. Aquí se le da el aspecto del tema sin tocar los plugins.
 * ------------------------------------------- */

.bloque-formulario {
  margin: 34px 0 0;
  padding: 26px;
  background: var(--papel-2);
  border: 1.5px solid var(--linea);
  border-radius: 8px;
}
.bloque-formulario > h2 { font-size: 26px; margin-bottom: 8px; }
.bloque-formulario > p { margin: 0 0 20px; font-size: 16.5px; color: var(--texto); }

.wpcf7 label,
.wpforms-field-label,
.gfield_label {
  display: block;
  font: 600 11.5px/1 var(--mono) !important;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--apagado-2);
  margin-bottom: 6px;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="date"],
.wpcf7 input[type="number"],
.wpcf7 select,
.wpcf7 textarea,
.wpforms-field input[type="text"],
.wpforms-field input[type="email"],
.wpforms-field select,
.wpforms-field textarea,
.gfield input[type="text"],
.gfield input[type="email"],
.gfield select,
.gfield textarea {
  width: 100%;
  padding: 13px 15px;
  border: 1.5px solid var(--linea-2);
  border-radius: 8px;
  background: var(--papel);
  color: var(--tinta);
  font-family: var(--sans);
  font-size: 16.5px;
  box-sizing: border-box;
}
.wpcf7 textarea, .wpforms-field textarea, .gfield textarea { min-height: 150px; resize: vertical; }

.wpcf7 input:focus, .wpcf7 textarea:focus, .wpcf7 select:focus,
.wpforms-field input:focus, .wpforms-field textarea:focus,
.gfield input:focus, .gfield textarea:focus {
  outline: 2px solid var(--verde);
  outline-offset: 1px;
  border-color: var(--verde);
}

.wpcf7-form p,
.wpforms-field-container .wpforms-field,
.gform_fields .gfield { margin-bottom: 16px; }

.wpcf7 input[type="submit"],
.wpforms-submit,
.gform_button {
  border: 0 !important;
  background: var(--verde) !important;
  color: #fff !important;
  font-weight: 700;
  font-size: 16.5px;
  font-family: var(--sans);
  padding: 14px 26px !important;
  border-radius: 999px !important;
  cursor: pointer;
}
.wpcf7 input[type="submit"]:hover,
.wpforms-submit:hover,
.gform_button:hover { background: var(--verde-osc) !important; }

/* Zona de arrastrar archivos (crónicas y multimedia) */
.codedropz-upload-handler,
.wpforms-field-file-upload .dz-message,
.gform_drop_area {
  border: 2px dashed var(--linea-2) !important;
  border-radius: 8px !important;
  background: var(--papel) !important;
  padding: 30px 20px !important;
  text-align: center;
  color: var(--apagado) !important;
  font-size: 16.5px;
}
.codedropz-upload-handler:hover, .gform_drop_area:hover { border-color: var(--verde) !important; }

/* Avisos */
.wpcf7-not-valid-tip, .wpforms-error, .gfield_description.validation_message {
  color: var(--teja) !important;
  font-size: 14.5px !important;
  font-weight: 600;
}
.wpcf7-response-output,
.wpforms-confirmation-container-full,
.gform_confirmation_message {
  margin: 18px 0 0 !important;
  padding: 16px 18px !important;
  border: 1.5px solid var(--linea) !important;
  border-radius: 8px;
  background: var(--papel-3);
  font-size: 16.5px;
  color: var(--tinta);
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output { border-color: var(--teja) !important; }
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--verde) !important; }

/* ---------- Formularios propios del tema ---------- */

.alc-form { display: flex; flex-direction: column; gap: 18px; }

.alc-campo { display: flex; flex-direction: column; gap: 6px; }

.alc-campo label {
  font: 600 11.5px/1.4 var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--apagado-2);
}
.alc-opcional {
  font-family: var(--sans);
  letter-spacing: 0;
  text-transform: none;
  font-weight: 500;
  color: var(--apagado);
}

.alc-campo input[type="text"],
.alc-campo input[type="email"],
.alc-campo input[type="date"],
.alc-campo textarea {
  width: 100%;
  padding: 13px 15px;
  border: 1.5px solid var(--linea-2);
  border-radius: 8px;
  background: var(--papel);
  color: var(--tinta);
  font-family: var(--sans);
  font-size: 16.5px;
  line-height: 1.5;
  box-sizing: border-box;
}
.alc-campo textarea { resize: vertical; min-height: 120px; }

.alc-campo input:focus, .alc-campo textarea:focus {
  outline: 2px solid var(--verde);
  outline-offset: 1px;
  border-color: var(--verde);
}

.alc-campo input[type="file"] {
  width: 100%;
  padding: 22px 18px;
  border: 2px dashed var(--linea-2);
  border-radius: 8px;
  background: var(--papel);
  color: var(--texto);
  font-family: var(--sans);
  font-size: 16px;
  box-sizing: border-box;
  cursor: pointer;
}
.alc-campo input[type="file"]:hover { border-color: var(--verde); }

.alc-ayuda { font-size: 14.5px; line-height: 1.5; color: var(--apagado); }

.alc-form button[type="submit"] { align-self: flex-start; min-height: 48px; }

/* El campo trampa del anti-spam: fuera de la vista, pero no display:none
   (algunos robots se saltan lo oculto con display). */
.alc-trampa {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.alc-aviso {
  margin: 0 0 4px;
  padding: 16px 18px;
  border: 1.5px solid var(--linea);
  border-radius: 8px;
  background: var(--papel);
  font-size: 17px;
  line-height: 1.6;
  color: var(--tinta);
}
.alc-aviso--bien { border-color: var(--verde); }
.alc-aviso--mal { border-color: var(--teja); }

/* Llamada a participar, al final de crónicas y álbumes */
.aviso-participa {
  margin: 34px 0 0;
  background: var(--papel-3);
  border: 1.5px solid var(--linea);
  border-radius: 8px;
  padding: 24px;
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.aviso-participa-texto { flex: 1; min-width: 260px; display: flex; flex-direction: column; gap: 6px; }
.aviso-participa-texto strong { font: 700 22px/1.25 var(--serif); color: var(--tinta); }
.aviso-participa-texto span { font-size: 16.5px; line-height: 1.6; color: var(--texto); }

/* ---------- Página estática, búsqueda, 404 ---------- */

.pagina { max-width: 820px; margin: 0 auto; padding: 44px 32px 60px; }
.pagina-titulo { font-size: 40px; margin-bottom: 24px; letter-spacing: -.015em; }

.buscador-pagina { max-width: 560px; margin: 30px auto 0; display: flex; gap: 10px; }

.bloque-404 { max-width: 700px; margin: 0 auto; padding: 80px 32px; text-align: center; }
.bloque-404 h1 { font-size: 40px; margin-bottom: 16px; }

/* ---------- Secciones: La Asociación y Boletines ---------- */

.pagina--ancha { max-width: var(--ancho); }

.seccion-intro {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-bottom: 8px;
}
.seccion-intro .pagina-titulo { margin: 0; font-size: 46px; line-height: 1.1; letter-spacing: -.02em; }
.seccion-texto { max-width: 720px; font-size: 17.5px; line-height: 1.7; }
.seccion-texto p { margin: 0 0 1rem; text-wrap: pretty; }
.seccion-texto--grande { font-size: 19px; }

.fila-botones { display: flex; gap: 12px; flex-wrap: wrap; padding-top: 6px; }

.bloque { margin-top: 52px; display: flex; flex-direction: column; gap: 22px; }
.bloque--estrecho { max-width: 720px; }
.bloque-titulo { font-size: 30px; }
.bloque-cabecera {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.centrado { text-align: center; margin: 34px 0 0; }

/* Cifras */

.rejilla-cifras {
  margin-top: 36px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5px;
  background: var(--linea);
  border: 1.5px solid var(--linea);
  border-radius: 8px;
  overflow: hidden;
}
.cifra { background: var(--papel-2); padding: 22px; display: flex; flex-direction: column; gap: 4px; }
.cifra-dato { font: 700 34px/1 var(--serif); color: var(--tinta); }
.cifra-texto { font-size: 14.5px; color: var(--apagado); }

/* Junta directiva */

.rejilla-junta { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.miembro { display: flex; flex-direction: column; gap: 11px; }
.miembro-foto {
  height: 190px;
  border-radius: 8px;
  border: 1.5px solid #ddd6c9;
  background-color: var(--papel-3);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  align-items: flex-end;
  padding: 10px;
}
.miembro-sin-foto {
  font: 500 11px/1.3 var(--mono);
  color: var(--apagado-2);
  background: var(--papel);
  padding: 5px 7px;
  border-radius: 3px;
}
.miembro-nombre { font: 700 19px/1.25 var(--serif); color: var(--tinta); }
.miembro-cargo {
  font: 500 11.5px/1.4 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--teja);
}

/* Documentos */

.lista-documentos {
  display: flex;
  flex-direction: column;
  border: 1.5px solid var(--linea);
  border-radius: 8px;
  overflow: hidden;
}
.lista-documentos > a {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  background: var(--papel-2);
  color: inherit;
  border-bottom: 1.5px solid var(--linea);
}
.lista-documentos > a:last-child { border-bottom: 0; }
.lista-documentos > a:hover { background: var(--papel-3); color: inherit; }
.doc-tipo {
  font: 600 11px/1 var(--mono);
  letter-spacing: .08em;
  color: #fff;
  background: var(--apagado);
  padding: 6px 7px;
  border-radius: 3px;
}
.doc-tipo--pdf { background: var(--teja); }
.doc-tipo--web { background: var(--azul); }
.doc-nombre { flex: 1; font-size: 16.5px; font-weight: 600; color: var(--tinta); }
.doc-flecha { font-size: 15.5px; font-weight: 700; color: var(--verde); }

/* Nuestra historia */

.historia { display: flex; flex-direction: column; }
.hito { display: grid; grid-template-columns: 120px 1fr; }
.hito-anio {
  display: flex;
  justify-content: flex-end;
  padding: 2px 22px 0 0;
  font: 700 30px/1 var(--serif);
  color: var(--tinta);
}
.hito-cuerpo {
  position: relative;
  border-left: 2px solid var(--linea);
  padding: 0 0 40px 30px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.hito-cuerpo::before {
  content: "";
  position: absolute;
  left: -9px;
  top: 4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--teja);
  border: 3px solid var(--papel);
}
.hito--ultimo .hito-cuerpo { border-left-color: transparent; padding-bottom: 10px; }
.hito--ultimo .hito-cuerpo::before { background: var(--verde); }
.hito-antetitulo {
  font: 600 11.5px/1.4 var(--mono);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--teja);
}
.hito--ultimo .hito-antetitulo { color: var(--verde); }
.hito-titulo { font-size: 24px; line-height: 1.25; }
.hito-texto { margin: 0; font-size: 17px; line-height: 1.7; max-width: 620px; text-wrap: pretty; }
.hito-texto p { margin: 0 0 10px; }
.hito-texto p:last-child { margin-bottom: 0; }
.hito-texto ul, .hito-texto ol { margin: 10px 0 0; padding-left: 22px; }
.hito-texto li { margin-bottom: 4px; }
.hito-texto li:last-child { margin-bottom: 0; }
.hito-texto a { color: var(--verde); }
.hito-media {
  display: block;
  width: 100%;
  max-width: 560px;
  margin-top: 4px;
  border-radius: 8px;
  border: 1.5px solid var(--linea);
}

.muro--tres { grid-template-columns: repeat(3, 1fr); padding: 0; }
.muro--tres .tarjeta--destacada { grid-column: auto; grid-row: auto; }
.muro--tres .tarjeta--destacada .tarjeta-cuerpo { padding: 18px; gap: 9px; }
.muro--tres .tarjeta--destacada .tarjeta-titulo { font-size: 21px; line-height: 1.28; }
.muro--tres .tarjeta--destacada .tarjeta-resumen { display: none; }
.muro--tres .tarjeta-foto { flex: 1; min-height: 170px; }

/* Boletines */

.rejilla-boletines {
  margin-top: 36px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.boletin {
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  overflow: hidden;
  background: var(--papel-2);
  border: 1.5px solid var(--linea);
  color: inherit;
  transition: border-color .25s ease;
}
.boletin:hover { border-color: #c6bca9; color: inherit; }
.boletin-portada {
  flex: 1;
  min-height: 250px;
  border-bottom: 1.5px solid var(--linea);
  background-color: var(--papel-3);
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  align-items: flex-end;
  padding: 12px;
}
.boletin-sin-portada {
  font: 500 11px/1.3 var(--mono);
  color: var(--apagado-2);
  background: var(--papel);
  padding: 5px 7px;
  border-radius: 3px;
}
.boletin-cuerpo { padding: 18px; display: flex; flex-direction: column; gap: 8px; }
.boletin-numero {
  align-self: flex-start;
  font: 600 11px/1 var(--mono);
  letter-spacing: .08em;
  color: #fff;
  background: var(--teja);
  padding: 6px 8px;
  border-radius: 3px;
}
.boletin-titulo { font: 700 21px/1.28 var(--serif); color: var(--tinta); }
.boletin-detalle { font-size: 14.5px; color: var(--apagado); }
.boletin-accion { font-size: 15.5px; font-weight: 700; color: var(--verde); padding-top: 4px; }

@media (max-width: 1024px) {
  .rejilla-cifras, .rejilla-junta { grid-template-columns: repeat(2, 1fr); }
  .rejilla-boletines, .muro--tres { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 860px) {
  .seccion-intro .pagina-titulo { font-size: 34px; }
  .seccion-texto--grande { font-size: 17.5px; }
  .rejilla-boletines, .muro--tres { grid-template-columns: 1fr; }
  .bloque { margin-top: 38px; }
  .bloque-titulo { font-size: 25px; }
  .hito { grid-template-columns: 74px 1fr; }
  .hito-anio { font-size: 21px; padding-right: 14px; }
  .hito-cuerpo { padding-left: 22px; padding-bottom: 30px; }
  .hito-titulo { font-size: 21px; }
}

/* ---------- Pie ---------- */

.pie {
  background: var(--tinta);
  color: #b9b2a5;
  padding: 34px 32px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.pie a { color: #b9b2a5; }
.pie a:hover { color: #fff; }
.pie-fila {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.pie-marca { display: flex; align-items: center; gap: 12px; }
.pie-marca img { height: 40px; width: auto; display: block; }
.pie-marca span { font: 700 18px/1.2 var(--serif); color: var(--papel-2); }
.pie-menu ul { display: flex; gap: 18px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; font-size: 14.5px; }
.pie-legal {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  border-top: 1px solid #3a3630;
  padding-top: 16px;
}
.pie-direccion { font: 400 13px/1.8 var(--mono); color: var(--apagado-2); }
.pie-social { display: flex; gap: 18px; font-size: 14.5px; }

/* ---------- Móvil ---------- */

@media (max-width: 1024px) {
  .muro { grid-template-columns: repeat(2, 1fr); }
  .tarjeta--destacada { grid-column: 1 / -1; grid-row: auto; }
  .tarjeta--destacada .tarjeta-foto { min-height: 300px; }
}

@media (max-width: 860px) {
  .menu-btn { display: block; }

  /* Capa oscura que cubre la página cuando el menú lateral está abierto. */
  .menu-fondo {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 998;
    background: rgba(35, 33, 29, .5);
    opacity: 0;
    pointer-events: none;
    transition: opacity .28s ease;
  }
  .menu-fondo.esta-abierto { opacity: 1; pointer-events: auto; }

  /* Menú como cajón lateral que entra desde la izquierda. */
  .menu-principal {
    position: fixed;
    top: 0; left: 0; bottom: 0;
    z-index: 999;
    width: min(82vw, 320px);
    margin: 0;
    padding: 20px 16px calc(20px + env(safe-area-inset-bottom));
    background: var(--papel);
    box-shadow: 4px 0 30px rgba(35, 33, 29, .28);
    overflow-y: auto;
    transform: translateX(-100%);
    transition: transform .28s ease;
  }
  .menu-principal.esta-abierto { transform: translateX(0); }

  .menu-cerrar {
    display: block;
    margin: 0 0 8px auto;
    width: 44px; height: 44px;
    border: 0; border-radius: 999px;
    background: var(--papel-3);
    color: var(--tinta); font-size: 26px; line-height: 1;
    cursor: pointer;
  }
  .menu-cerrar:hover { background: var(--linea); }

  .menu-principal ul { flex-direction: column; gap: 2px; }
  .menu-principal a {
    padding: 14px 16px;
    border-radius: 8px;
    background: transparent;
    color: var(--tinta-2);
    font-size: 17px;
  }
  .menu-principal a:hover { background: var(--papel-3); color: var(--tinta); }
  .menu-principal .enlace-buscar {
    margin-top: 8px;
    border-radius: 8px;
    background: var(--papel-2);
    border: 1px solid var(--linea);
  }
  .menu-principal .enlace-buscar:hover { background: var(--papel-3); }
  .menu-principal .current-menu-item > a,
  .menu-principal .current_page_item > a,
  .menu-principal .current-menu-parent > a {
    background: var(--verde);
    color: #fff;
  }
  .cabecera-barra { flex-wrap: nowrap; padding: 14px 20px; }
  .marca { flex: 1 1 auto; min-width: 0; }
  .marca img { height: 40px; }
  .marca-nombre { font-size: 17px; }
  .menu-btn { flex: 0 0 auto; margin-left: 12px; }
  .barra-datos { padding: 9px 20px; font-size: 11px; justify-content: center; text-align: center; }
  .cabecera:not(.cabecera--interior) { min-height: 260px; }
  .cabecera-titulo { padding: 0 20px 22px; }
  .cabecera-h1 { font-size: 34px; }
  .contenedor { padding: 0 20px; }
  .filtros { padding: 14px 20px; gap: 8px; overflow-x: auto; flex-wrap: nowrap; }
  .filtro { white-space: nowrap; padding: 11px 16px; font-size: 15px; }
  .filtro-anio { margin-left: 0; }
  .filtro-anio select { padding: 11px 16px; font-size: 15px; }
  .buscador-inline { margin-left: 0; width: 100%; }
  .muro { grid-template-columns: 1fr; gap: 18px; padding: 22px 0 34px; }
  .tarjeta--destacada .tarjeta-foto { min-height: 220px; }
  .tarjeta--destacada .tarjeta-titulo { font-size: 26px; }
  .entrada, .comentarios, .pagina { padding-left: 20px; padding-right: 20px; }
  .entrada-titulo { font-size: 32px; }
  .entrada-contenido { font-size: 17.5px; }
  .galeria-entrada { grid-template-columns: repeat(2, 1fr); }
  .pie { padding: 28px 20px; }
  .pie-fila, .pie-legal { flex-direction: column; align-items: flex-start; }
}

@media print {
  .barra-datos, .filtros, .menu-principal, .menu-btn, .pie, .comentarios, .paginacion { display: none !important; }
  body { background: #fff; }
  .cabecera::before { background: none; }
}
