/* Villamayor Social: estilo de periódico local.
   Sin tipografías externas (Google Fonts enviaría la IP de cada visitante a terceros, RGPD):
   titulares con las serif del sistema y texto con la sans del sistema. */

:root {
  --papel: #f7f3ea;
  --superficie: #fffdf8;
  --tinta: #1b1a17;
  --tinta-suave: #5d5850;
  --linea: #d8d0bf;
  --linea-fuerte: #1b1a17;
  /* Colores del escudo de Villamayor: sinople (verde), azur (azul) y oro (la piedra de Villamayor). */
  --acento: #1d6b47;          /* verde: botones, sección activa */
  --acento-texto: #ffffff;
  --azul: #1d4f8c;            /* azul: antetítulos de sección */
  --oro: #b8862b;             /* oro: detalles */
  --denuncia: #9a5a0a;
  --duda: #1d4f8c;
  --oficial: #1d4f8c;
  --verificado: #1d4f8c;   /* azul del escudo */
  --exito: #e7f2ea;
  --exito-borde: #2d6a4f;
  --error: #fbe9e7;
  --error-borde: #a3261f;
  --advertencia: #fdf3dc;
  --advertencia-borde: #9a6400;
  --info: #e9eff6;
  --info-borde: #1f5f8b;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Times New Roman", serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root {
    --papel: #151412;
    --superficie: #1d1c19;
    --tinta: #ece6da;
    --tinta-suave: #a9a296;
    --linea: #3a372f;
    --linea-fuerte: #ece6da;
    --acento: #5cc08f;
    --acento-texto: #10140f;
    --azul: #86b4ef;
    --oro: #e3b45a;
    --denuncia: #e6a24a;
    --duda: #86b4ef;
    --oficial: #86b4ef;
    --verificado: #86b4ef;
    --exito: #18291f;
    --error: #3a1b18;
    --advertencia: #33280f;
    --info: #172433;
  }
}

* { box-sizing: border-box; }

body {
  margin: 0;
  border-top: 5px solid;
  border-image: linear-gradient(90deg, var(--azul) 0 34%, var(--acento) 34% 67%, var(--oro) 67% 100%) 1;
  font-family: var(--sans);
  font-size: 1rem;
  line-height: 1.55;
  color: var(--tinta);
  background: var(--papel);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

a { color: inherit; }
img { max-width: 100%; height: auto; }
h1, h2, h3 { font-family: var(--serif); line-height: 1.15; }

.contenedor { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0 16px; }
main.contenedor { flex: 1; padding-top: 1.25rem; padding-bottom: 3rem; }
.saltar { position: absolute; left: -999px; }
.saltar:focus { left: 16px; top: 8px; background: var(--superficie); padding: 0.4rem 0.8rem; z-index: 10; }

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

.cabecera { background: var(--papel); }
.barra-superior {
  display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; flex-wrap: wrap;
  font-size: 0.85rem; padding-top: 0.55rem; padding-bottom: 0.55rem; border-bottom: 1px solid var(--linea);
}
.fecha-hoy { color: var(--tinta-suave); }
.fecha-hoy::first-letter { text-transform: uppercase; }
.usuario { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
/* Barra de la cuenta: enlaces, campana y botón de menú, todos en el verde del escudo y a la misma altura. */
.usuario a:not(.boton), .usuario .enlace { display: inline-flex; align-items: center; color: var(--acento); font-weight: 600; text-decoration: none; line-height: 1; }
.usuario a:not(.boton):hover, .usuario .enlace:hover { text-decoration: underline; text-underline-offset: 3px; }
.usuario__enlaces { align-items: center; }
.usuario .en-linea { display: inline-flex; }

.cabecera__marca { text-align: center; padding-top: 1.4rem; padding-bottom: 1rem; }
.lema { margin: 0.5rem 0 0; font-family: var(--serif); font-style: italic; color: var(--tinta-suave); font-size: 1.02rem; }

.secciones { border-top: 3px double var(--azul); border-bottom: 1px solid var(--linea-fuerte); background: var(--papel); position: sticky; top: 0; z-index: 5; }
.secciones__lista {
  display: flex; gap: 0.2rem; overflow-x: auto; scrollbar-width: none; white-space: nowrap;
  justify-content: safe center;
}
.secciones__lista::-webkit-scrollbar { display: none; }
.secciones__lista a {
  flex: none; padding: 0.7rem 0.75rem; font-size: 0.82rem; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; text-decoration: none; border-bottom: 3px solid transparent;
}
.secciones__lista a:hover { color: var(--acento); }
.secciones__lista a[aria-current="page"] { color: var(--acento); border-bottom-color: var(--acento); }
.secciones__lista .secciones__portada { display: inline-flex; align-items: center; padding-top: 0.55rem; padding-bottom: 0.55rem; }
.secciones__lista .secciones__portada:not([aria-current]) { color: var(--tinta-suave); }

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

/* Pie en columnas, como los periódicos: marca, redes y «Volver arriba» a la izquierda; enlaces agrupados a la derecha. */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
/* Un verde muy claro, sacado del de la web, para separar el pie del cuerpo; en modo oscuro se adapta solo. */
.pie { background: color-mix(in srgb, var(--acento) 7%, var(--papel)); border-top: 1px solid color-mix(in srgb, var(--acento) 25%, var(--papel)); padding: 2rem 0 2.2rem; font-size: 0.92rem; margin-top: 2rem; }
/* Las tres columnas de enlaces, cada una del ancho de su texto, con el mismo hueco entre ellas y pegadas a la derecha. */
.pie__rejilla { display: grid; grid-template-columns: minmax(0, 1fr) repeat(3, auto); gap: 2rem 4rem; align-items: start; }
.pie__marca-bloque { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; }
.pie__marca { text-decoration: none; }
.pie__redes { display: flex; gap: 1.1rem; }
.pie__redes a { display: inline-flex; color: var(--acento); }
.pie__redes a:hover { opacity: 0.75; }

/* RF-155: página «En mantenimiento». */
.mantenimiento { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 2rem 16px; }
.mantenimiento__sello { margin-bottom: 1rem; }
.mantenimiento__marca { margin: 0; font-size: clamp(2.2rem, 9vw, 3.4rem); font-weight: normal; }
.mantenimiento__raya { width: 4rem; border: 0; border-top: 1px solid var(--linea-fuerte); margin: 1.8rem auto 1.5rem; }
.mantenimiento__titulo { margin: 0 0 0.4rem; font-family: var(--serif); font-size: 1.4rem; }
.mantenimiento__texto { margin: 0; color: var(--tinta-suave); }
.mantenimiento__redes { justify-content: center; margin-top: 1.2rem; }
.pie__derechos { margin: 0; color: var(--tinta-suave); font-size: 0.85rem; }
.pie__arriba { display: inline-flex; align-items: center; gap: 0.4rem; }
.pie__columna { display: flex; flex-direction: column; gap: 0.55rem; }
/* Rótulos como los antetítulos de las noticias; enlaces como el menú de secciones. */
.pie__columna h2 {
  margin: 0 0 0.3rem; font-family: var(--sans); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.07em;
  text-transform: uppercase; color: var(--azul);
}
.pie__columna a { color: var(--tinta); text-decoration: none; }
.pie__columna a:hover { color: var(--acento); text-decoration: underline; }
@media (max-width: 860px) { .pie__rejilla { grid-template-columns: repeat(3, auto); justify-content: start; column-gap: 3rem; } .pie__marca-bloque { grid-column: 1 / -1; } }
@media (max-width: 480px) { .pie__rejilla { grid-template-columns: 1fr; gap: 1.5rem; } }

/* ---- Portada ---- */

.titulo-seccion {
  font-size: clamp(1.8rem, 5vw, 2.6rem); margin: 0.2rem 0 0.8rem; padding-bottom: 0.4rem;
  border-bottom: 1px solid var(--linea-fuerte);
}
.barra-filtros {
  display: flex; justify-content: space-between; align-items: center; gap: 0.8rem 1.5rem; flex-wrap: wrap;
  margin-bottom: 1.4rem; padding-bottom: 0.6rem; border-bottom: 1px solid var(--linea);
}
.pestanas { display: flex; gap: 1.2rem; flex-wrap: wrap; }
.pestanas a { text-decoration: none; font-size: 0.95rem; color: var(--tinta-suave); padding: 0.2rem 0; border-bottom: 2px solid transparent; }
.pestanas a:hover { color: var(--tinta); }
.pestanas a[aria-current="page"] { color: var(--tinta); font-weight: 700; border-bottom-color: var(--tinta); }

.antetitulo { margin: 0 0 0.35rem; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--azul); }
.antetitulo a { text-decoration: none; }
.antetitulo a:hover { text-decoration: underline; }
.etiqueta-tipo { display: inline-block; padding: 0.05rem 0.4rem; margin-right: 0.35rem; border-radius: 2px; color: var(--acento-texto); background: var(--tinta); }
.etiqueta-tipo--denuncia { background: var(--denuncia); }
.etiqueta-tipo--duda { background: var(--duda); }

.titular { margin: 0 0 0.45rem; font-weight: 700; font-size: 1.3rem; letter-spacing: -0.01em; }
.titular a { text-decoration: none; }
.titular a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.titular--grande { font-size: clamp(1.7rem, 4vw, 2.5rem); }
.entradilla { font-family: var(--serif); font-size: 1.12rem; line-height: 1.5; margin: 0 0 0.6rem; }

.firma, .contadores { font-size: 0.82rem; color: var(--tinta-suave); margin: 0.25rem 0; }
.firma a { color: var(--tinta); font-weight: 600; text-decoration: none; }
.firma a:hover { text-decoration: underline; }
.firma__origen { text-transform: uppercase; letter-spacing: 0.05em; font-size: 0.72rem; margin-right: 0.25rem; }
.contadores a { color: inherit; }

.apertura {
  display: grid; grid-template-columns: 3fr 2fr; gap: 1.6rem; align-items: start;
  padding-bottom: 1.6rem; margin-bottom: 1.6rem; border-bottom: 1px solid var(--linea-fuerte);
}
.apertura--sin-imagen { grid-template-columns: 1fr; max-width: 820px; }
.apertura__imagen img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }

/* Columnas de ancho idéntico (el hueco es un gap, no padding) para que todas las imágenes midan lo mismo;
   la línea separadora va en medio del hueco. */
.rejilla { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 2.4rem; }
.pieza { position: relative; padding: 0 0 1.5rem; margin-bottom: 1.5rem; }
.rejilla .pieza::before { content: ""; position: absolute; top: 0; bottom: 0; left: -1.2rem; border-left: 1px solid var(--linea); }
.rejilla .pieza:nth-child(3n + 1)::before { display: none; }
.pieza__imagen { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; margin-bottom: 0.7rem; }
.pieza__texto { font-size: 0.95rem; margin: 0 0 0.5rem; color: var(--tinta); }

.vacio { text-align: center; padding: 3rem 1rem; font-family: var(--serif); font-size: 1.15rem; border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea); }

.paginacion { display: flex; justify-content: space-between; gap: 1rem; margin: 1rem 0; padding-top: 1rem; border-top: 1px solid var(--linea); font-size: 0.92rem; }

/* RF-121: «Cargar más» y «Lo más leído / Lo más comentado» al final de la portada. */
.cargar-mas { text-align: center; margin: 0.5rem 0 2rem; }
.cargar-mas .boton { min-width: 14rem; }
.cargar-mas .boton[aria-busy="true"] { opacity: 0.6; cursor: progress; }
.cargar-mas__estado { min-height: 1.2em; margin: 0.5rem 0 0; font-size: 0.85rem; color: var(--tinta-suave); }
.cargar-mas__volver { text-align: center; font-size: 0.9rem; margin: 0 0 2rem; }
.lo-mas { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; border-top: 3px solid var(--linea-fuerte); border-bottom: 1px solid var(--linea-fuerte); padding: 1rem 0 0.4rem; margin: 0 0 1.8rem; }
.lo-mas__cabecera { font-family: var(--serif); font-size: 1.25rem; margin: 0 0 0.6rem; }
.lo-mas ol { list-style: none; margin: 0; padding: 0; }
.lo-mas li { display: grid; grid-template-columns: 2.2rem 1fr; gap: 0.4rem; padding: 0.55rem 0; border-top: 1px solid var(--linea); }
.lo-mas li:first-child { border-top: 0; }
.lo-mas__numero { font-family: var(--serif); font-size: 2rem; line-height: 1; color: var(--acento); font-weight: 700; }
.lo-mas__seccion { display: block; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--azul); font-weight: 600; }
.lo-mas__titular { display: block; font-family: var(--serif); font-size: 1.02rem; line-height: 1.25; color: var(--tinta); text-decoration: none; font-weight: 600; }
.lo-mas__titular:hover { text-decoration: underline; }
.lo-mas__comentarios { display: inline-block; font-size: 0.75rem; color: var(--tinta-suave); text-decoration: none; margin-top: 0.15rem; }
.lo-mas__comentarios:hover { text-decoration: underline; }
@media (max-width: 640px) { .lo-mas { grid-template-columns: 1fr; gap: 1rem; } }

/* ---- Artículo ---- */

.articulo { max-width: 720px; margin: 0 auto; }
.titular--articulo { font-size: clamp(1.9rem, 5vw, 2.8rem); margin: 0.2rem 0 0.7rem; }
.fuente { font-size: 0.85rem; color: var(--tinta-suave); margin: 0.2rem 0 1rem; font-style: italic; }
.articulo__imagen { margin: 1rem 0 1.2rem; }
.articulo__imagen img { display: block; width: 100%; }
/* RF-27: crédito solo en las fotos de archivo cuya licencia lo exige; discreto, que no moleste. */
.credito { margin: 0.3rem 0 0; font-size: 0.7rem; line-height: 1.3; color: var(--tinta-suave); text-align: right; }
.credito a { color: inherit; text-decoration: none; }
.credito a:hover { text-decoration: underline; }
.articulo__cuerpo { font-family: var(--serif); font-size: 1.15rem; line-height: 1.7; }
/* Negritas del texto (RF-10): datos y frases importantes. */
.articulo__cuerpo strong { font-weight: 700; color: var(--tinta); }
/* Formato ampliado de la Redacción (RF-10): subtítulos, listas, citas y enlaces. */
.articulo__cuerpo h2 { font-size: 1.3rem; line-height: 1.3; margin: 1.6rem 0 0.4rem; }
.articulo__cuerpo ul { margin: 0 0 1rem; padding-left: 1.3rem; }
.articulo__cuerpo li { margin: 0.2rem 0; }
.articulo__cuerpo blockquote { margin: 1.2rem 0; padding: 0.1rem 0 0.1rem 1rem; border-left: 3px solid var(--acento); font-style: italic; color: var(--tinta-suave); }
.articulo__cuerpo blockquote p { margin: 0; }
.articulo__cuerpo a:not(.mencion) { color: var(--azul); }
.galeria { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 0.5rem; margin: 1rem 0; }
.galeria img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
.acciones { display: flex; gap: 1.2rem; align-items: center; flex-wrap: wrap; margin: 1.2rem 0 0; padding-top: 1rem; border-top: 1px solid var(--linea); font-size: 0.92rem; }
.confirmado { color: var(--verificado); font-weight: 700; }

.comentarios { max-width: 720px; margin: 2.2rem auto 0; }
.titulo-bloque { font-size: 1.4rem; border-top: 3px double var(--linea-fuerte); padding-top: 0.8rem; margin: 0 0 0.6rem; }
.comentario { border-top: 1px solid var(--linea); padding: 0.75rem 0; }
.comentario p { margin: 0.2rem 0; }
.comentario--pendiente { opacity: 0.7; }
.autoria { font-size: 0.82rem; color: var(--tinta-suave); }
.autoria a { color: var(--tinta); font-weight: 600; text-decoration: none; }
.respuestas { margin-left: 1.2rem; border-left: 2px solid var(--linea); padding-left: 0.9rem; }
.responder summary { cursor: pointer; color: var(--acento); font-size: 0.85rem; padding: 0.3rem 0; }
.nuevo-comentario { margin-top: 1.2rem; }

/* ---- Páginas de cuenta y formularios ---- */

.tarjeta { background: var(--superficie); border: 1px solid var(--linea); border-top: 3px solid var(--linea-fuerte); padding: 1.4rem; margin: 0 auto 1.2rem; max-width: 760px; }
.tarjeta--estrecha { max-width: 460px; }
.tarjeta h1 { font-size: 1.8rem; margin: 0 0 0.8rem; }
.tarjeta h2 { font-size: 1.25rem; margin: 1.4rem 0 0.5rem; }
.nota, .ayuda { color: var(--tinta-suave); font-size: 0.88rem; }

.boton {
  display: inline-block; background: var(--acento); color: var(--acento-texto); border: 1px solid var(--acento);
  border-radius: 3px; padding: 0.55rem 1.1rem; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer;
}
.boton:hover { filter: brightness(1.1); }
.boton--pequeno { padding: 0.25rem 0.7rem; font-size: 0.82rem; }
.usuario .boton { color: var(--acento-texto); }
.boton--secundario { background: transparent; color: var(--tinta); border-color: var(--linea-fuerte); }
.boton--peligro { background: var(--error-borde); border-color: var(--error-borde); color: #fff; }
.enlace { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-decoration: underline; cursor: pointer; }
.en-linea { display: inline; margin: 0; }

.campo { margin-bottom: 1rem; display: flex; flex-direction: column; gap: 0.3rem; }
.campo label { font-weight: 700; font-size: 0.92rem; }
.campo--casilla label { font-weight: 400; display: flex; gap: 0.5rem; align-items: flex-start; }
.campo--casilla input { margin-top: 0.3rem; }
.campo input:not([type=checkbox]):not([type=radio]), .campo select, .campo textarea {
  width: 100%; padding: 0.55rem 0.65rem; font: inherit; color: var(--tinta);
  background: var(--superficie); border: 1px solid var(--linea); border-radius: 3px;
}
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: 2px solid var(--acento); outline-offset: 1px; }
.campo--error input, .campo--error select, .campo--error textarea { border-color: var(--error-borde); }
.campo label:has(> input[type=radio]) { font-weight: 400; display: flex; gap: 0.5rem; align-items: center; padding: 0.15rem 0; }
.error { color: var(--error-borde); }
.ayuda ul { margin: 0.2rem 0 0; padding-left: 1.1rem; }

.aviso { border-left: 4px solid var(--info-borde); background: var(--info); padding: 0.7rem 0.9rem; margin: 0 auto 1rem; max-width: 1120px; }
.aviso--success { border-color: var(--exito-borde); background: var(--exito); }
.aviso--error { border-color: var(--error-borde); background: var(--error); }
.aviso--warning { border-color: var(--advertencia-borde); background: var(--advertencia); }


/* Insignias: check de verificado y edificio de perfil oficial, con su explicación al pasar o tocar. */
.insignia { position: relative; display: inline-flex; align-items: center; margin-left: 0.25rem; font-size: 1.05em; line-height: 1; vertical-align: -0.12em; cursor: help; }
.insignia--verificado { color: var(--verificado); }
.insignia--oficial { font-size: 1em; }
.insignia:focus { outline: none; }
.insignia::after {
  content: attr(data-ayuda); position: absolute; left: 50%; bottom: calc(100% + 6px); transform: translateX(-50%);
  background: var(--tinta); color: var(--papel); font-family: var(--sans); font-size: 0.75rem; font-weight: 600;
  white-space: nowrap; padding: 0.3rem 0.55rem; border-radius: 4px; opacity: 0; pointer-events: none; transition: opacity 0.12s; z-index: 10;
}
.insignia:hover::after, .insignia:focus::after { opacity: 1; }

.votos { display: flex; gap: 0.6rem; flex-wrap: wrap; }
.voto { font: inherit; font-size: 0.88rem; font-weight: 600; padding: 0.35rem 0.8rem; border-radius: 999px; cursor: pointer; background: transparent; color: var(--acento); border: 1px solid var(--acento); }
.voto:hover { background: color-mix(in srgb, var(--acento) 10%, transparent); }
.voto--no { color: var(--tinta-suave); border-color: var(--linea); }
.voto--no:hover { color: var(--error-borde); border-color: var(--error-borde); background: transparent; }
.voto--activo { background: var(--acento); color: var(--acento-texto); }
.voto--no.voto--activo { background: var(--error-borde); border-color: var(--error-borde); color: #fff; }

.datos { display: grid; grid-template-columns: max-content 1fr; gap: 0.35rem 1rem; margin: 0.75rem 0; }
.datos dt { color: var(--tinta-suave); }
.datos dd { margin: 0; }
.lista-opciones { padding-left: 1.2rem; }
.lista-opciones li { margin-bottom: 0.5rem; }
.ficha-oficial { border-left: 3px solid var(--azul); padding-left: 1rem; }
.datos dd a { overflow-wrap: anywhere; }

.tipos { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; margin: 1rem 0; }
.tipo { border-top: 2px solid var(--linea-fuerte); padding: 0.8rem 0 0; }
.tipo h2 { margin-top: 0; }
.fila-lista { display: flex; flex-direction: column; padding: 0.6rem 0; border-top: 1px solid var(--linea); }

/* ---- Pantallas estrechas ---- */

@media (max-width: 860px) {
  .apertura { grid-template-columns: 1fr; gap: 1rem; }
  .rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 2rem; }
  .rejilla .pieza:nth-child(n)::before { display: block; left: -1rem; }
  .rejilla .pieza:nth-child(2n + 1)::before { display: none; }
}

@media (max-width: 560px) {
  .rejilla { grid-template-columns: minmax(0, 1fr); }
  .rejilla .pieza:nth-child(n) { padding: 0 0 1.2rem; border-bottom: 1px solid var(--linea); }
  .rejilla .pieza:nth-child(n)::before { display: none; }
  .secciones__lista { justify-content: flex-start; }
  .pestanas { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 1rem; width: 100%; white-space: nowrap; }
  .pestanas::-webkit-scrollbar { display: none; }
  .datos { grid-template-columns: 1fr; }
  .datos dd { margin-bottom: 0.4rem; }
  .tarjeta { padding: 1rem; }
  .barra-superior { font-size: 0.8rem; }
  .fecha-hoy { display: none; }
}

/* Perfiles oficiales: nombre en el azul del escudo y respuestas con un fondo azulado tenue. */
.firma a.autor--oficial, .autoria a.autor--oficial { color: var(--azul); font-weight: 700; }
.comentario--oficial {
  background: color-mix(in srgb, var(--azul) 7%, var(--papel));
  border-top-color: transparent; border-left: 3px solid var(--azul);
  padding: 0.75rem 0.9rem; margin: 0.4rem 0; border-radius: 0 4px 4px 0;
}
.respuesta-oficial { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--azul); margin-left: 0.2rem; }

/* Logotipo: 'Villamayor' fino en azul y 'Social' grueso en verde, con la línea dorada bajo 'Social'. */
.marca { display: inline-flex; align-items: center; gap: 0.6rem; text-decoration: none; }
.marca__sello { width: clamp(2.6rem, 7vw, 4rem); height: auto; }
.logotipo { font-family: "Helvetica Neue", Helvetica, Arial, var(--sans); letter-spacing: -0.03em; line-height: 1; white-space: nowrap; }
.logotipo__villamayor { font-weight: 300; color: var(--azul); }
.logotipo__social { font-weight: 800; color: var(--acento); position: relative; margin-left: 0.14em; }
.logotipo__social::after { content: ""; position: absolute; left: 0.04em; right: 0.04em; bottom: -0.16em; height: 0.11em; background: var(--oro); }
.marca .logotipo { font-size: clamp(1.9rem, 7.5vw, 3.6rem); }
.pie__marca { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 1.4rem; }
.insignia--redaccion img { display: block; width: 1.1em; height: 1.1em; }

/* Avisos (campana de la cabecera y lista) */
.campana { position: relative; display: inline-flex; align-items: center; color: var(--acento); }
.campana--nuevos { color: var(--acento); }
.campana__cuenta { position: absolute; top: -0.45rem; right: -0.6rem; min-width: 1.05rem; height: 1.05rem; padding: 0 0.25rem; border-radius: 999px; background: var(--acento); color: var(--acento-texto); font-size: 0.68rem; font-weight: 700; line-height: 1.05rem; text-align: center; }
.aviso-fila { display: grid; gap: 0.15rem; padding: 0.7rem 0; border-top: 1px solid var(--linea); }
.aviso-fila--nuevo { background: color-mix(in srgb, var(--acento) 7%, transparent); padding-left: 0.6rem; border-left: 3px solid var(--acento); }
.aviso-fila__tipo { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--azul); }
.reportar { color: var(--tinta-suave); font-size: 0.85em; }
.acciones .reportar { margin-left: auto; }
.cita-reporte { margin: 0 0 1rem; padding: 0.6rem 0.9rem; border-left: 3px solid var(--linea); font-family: var(--serif); }

/* Moderación desde la web (solo administración, RF-41) */
.moderar { font-size: 0.85rem; }
.moderar summary { cursor: pointer; color: var(--azul); font-weight: 700; }
.moderar__form { display: flex; gap: 0.4rem; flex-wrap: wrap; align-items: center; margin-top: 0.4rem; }
.moderar__form input { flex: 1; min-width: 12rem; font: inherit; padding: 0.3rem 0.5rem; border: 1px solid var(--linea); border-radius: 3px; background: var(--superficie); color: var(--tinta); }
.comentario--oculto { opacity: 0.55; border-left: 3px dashed var(--error-borde); padding-left: 0.6rem; }
.marca-oculto { color: var(--error-borde); }

/* Nota de contexto (RF-26) */
.nota-contexto { margin: 1rem 0 1.4rem; padding: 0.9rem 1.1rem; border: 1px solid color-mix(in srgb, var(--oro) 55%, var(--linea)); border-left: 4px solid var(--oro); background: color-mix(in srgb, var(--oro) 9%, var(--papel)); border-radius: 0 6px 6px 0; }
.nota-contexto__titulo { margin: 0 0 0.4rem; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: color-mix(in srgb, var(--oro) 70%, var(--tinta)); }
.nota-contexto p { margin: 0.3rem 0; }
.nota-contexto__cita, .nota-contexto__pie { font-size: 0.85rem; color: var(--tinta-suave); }
.nota-contexto__fuentes { margin: 0.4rem 0; padding-left: 1.1rem; font-size: 0.88rem; word-break: break-word; }
.con-nota { color: color-mix(in srgb, var(--oro) 70%, var(--tinta)); font-weight: 600; }

/* Menciones (RF-131) */
.mencion { color: var(--azul); font-weight: 600; text-decoration: none; }
.mencion:hover { text-decoration: underline; }
.con-sugerencias { position: relative; }
.sugerencias { position: absolute; z-index: 5; list-style: none; margin: 0; padding: 0.3rem 0; border: 1px solid var(--linea); border-radius: 8px; background: var(--superficie); box-shadow: 0 6px 20px rgb(0 0 0 / 0.14); width: max-content; max-width: min(22rem, 100%); }
.sugerencias li { display: flex; align-items: center; gap: 0.6rem; padding: 0.45rem 0.8rem; cursor: pointer; font-size: 0.92rem; }
.sugerencias__icono { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; flex: none; border-radius: 50%; background: color-mix(in srgb, var(--azul) 12%, transparent); font-size: 1.05rem; }
.sugerencias__texto { display: flex; flex-direction: column; line-height: 1.25; }
.sugerencias__texto strong { color: var(--azul); }
.sugerencias__texto span { color: var(--tinta-suave); font-size: 0.85rem; }
.sugerencias li.activa, .sugerencias li:hover { background: color-mix(in srgb, var(--azul) 10%, transparent); }
.fuente-medio { font-size: 0.9rem; color: var(--tinta-suave); border-top: 1px solid var(--linea); padding-top: 0.6rem; margin-top: 1rem; }

/* Captcha: el campo trampa no lo ve nadie (7.2). */
.campo--trampa { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Textos legales (fase 6) */
.texto-legal h2 { margin-top: 1.6rem; }
.texto-legal li { margin-bottom: 0.35rem; }
.pendiente { background: var(--advertencia); border-bottom: 1px dashed var(--advertencia-borde); padding: 0 0.2rem; font-size: 0.92em; }
.tabla { width: 100%; border-collapse: collapse; margin: 1rem 0; font-size: 0.92rem; }
.tabla th, .tabla td { text-align: left; vertical-align: top; padding: 0.5rem 0.6rem; border-bottom: 1px solid var(--linea); }
.tabla th { border-bottom: 2px solid var(--linea-fuerte); }
@media (max-width: 600px) {
  .tabla thead { display: none; }
  .tabla tr { display: block; border-bottom: 2px solid var(--linea-fuerte); padding: 0.4rem 0; }
  .tabla td { display: block; border: 0; padding: 0.25rem 0; }
  .tabla td::before { content: attr(data-titulo); display: block; font-weight: 700; font-size: 0.8rem; color: var(--tinta-suave); }
}

/* Compartir y redes (fase 7, RF-115) */
.icono-red { display: block; }
.compartir { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; }
.compartir__titulo { font-size: 0.85rem; color: var(--tinta-suave); margin-right: 0.2rem; }
.compartir__boton { display: inline-flex; padding: 0.35rem; border: 0; background: none; border-radius: 50%; cursor: pointer; color: var(--acento); transition: background-color 0.15s; }
.compartir__boton:hover, .compartir__boton:focus-visible { background: color-mix(in srgb, var(--acento) 12%, transparent); }
.compartir__aviso { font-size: 0.85rem; color: var(--acento); }
.barra-superior__izquierda { display: flex; align-items: center; gap: 0.9rem; flex-wrap: wrap; }

/* Lupa, menú y panel lateral (RF-150, RF-151) */
.solo-lectores { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.usuario__enlaces { display: contents; }
.icono-cabecera { display: inline-flex; align-items: center; color: var(--acento); }
.icono-cabecera:hover, .campana:hover { text-decoration: none; opacity: 0.75; }

html:has(.panel-lateral[open]) { overflow: hidden; }
.panel-lateral {
  margin: 0 0 0 auto; height: 100dvh; max-height: 100dvh; width: min(24rem, 88vw); max-width: none; padding: 0; border: 0;
  background: var(--superficie); color: var(--tinta); box-shadow: -8px 0 30px rgba(0, 0, 0, 0.25);
  border-radius: 14px 0 0 14px; transition: transform 0.25s ease, display 0.25s allow-discrete, overlay 0.25s allow-discrete;
  transform: translateX(100%);
}
.panel-lateral[open] { display: flex; flex-direction: column; transform: none; }
@starting-style { .panel-lateral[open] { transform: translateX(100%); } }
.panel-lateral::backdrop { background: rgba(0, 0, 0, 0.45); }
.panel-lateral__cabecera { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.2rem; border-bottom: 1px solid var(--linea); }
.panel-lateral__marca { display: flex; align-items: center; gap: 0.5rem; text-decoration: none; }
.panel-lateral__marca .logotipo { font-size: 1.45rem; }
.panel-lateral__cerrar { display: inline-flex; padding: 0.3rem; border: 0; background: none; color: var(--acento); cursor: pointer; }
.panel-lateral__cuerpo { overflow-y: auto; padding: 1.2rem; display: flex; flex-direction: column; gap: 1.2rem; }
.panel-lateral__redes { display: flex; gap: 1rem; justify-content: center; }
.panel-lateral__redes a { display: inline-flex; color: var(--acento); }
.panel-lateral__redes a:hover { opacity: 0.75; }
.panel-lateral__campo { display: flex; align-items: center; gap: 0.5rem; padding: 0.55rem 0.8rem; border: 1px solid var(--linea); border-radius: 8px; background: var(--papel); color: var(--tinta-suave); }
.panel-lateral__campo:focus-within { border-color: var(--acento); outline: 2px solid var(--acento); outline-offset: 0; }
.panel-lateral__campo input { flex: 1; min-width: 0; border: 0; background: transparent; font: inherit; font-size: 1.05rem; color: var(--tinta); outline: none; }
.panel-lateral__ayuda { display: block; margin: 0.4rem 0 0 0.9rem; font-style: italic; color: var(--tinta-suave); }
.panel-lateral__secciones, .panel-lateral__cuenta { display: flex; flex-direction: column; }
.panel-lateral__secciones a, .panel-lateral__cuenta a, .panel-lateral__cuenta button {
  display: block; padding: 0.85rem 0.9rem; border-bottom: 1px solid var(--linea); border-left: 3px solid transparent;
  text-decoration: none; font-size: 1.05rem; color: var(--tinta); text-align: left; width: 100%;
}
.panel-lateral__secciones a:hover, .panel-lateral__cuenta a:hover { color: var(--acento); }
.panel-lateral__secciones a[aria-current="page"] { border-left-color: var(--acento); color: var(--acento); font-weight: 700; }
.panel-lateral__cuenta { border-top: 2px solid var(--linea-fuerte); }
.panel-lateral__cuenta button { font: inherit; font-size: 1.05rem; background: none; border-left: 3px solid transparent; cursor: pointer; }

/* Página de resultados */
.buscador { display: flex; gap: 0.4rem; align-items: center; }
.buscador input[type="search"] { flex: 1; min-width: 0; font: inherit; padding: 0.45rem 0.6rem; border: 1px solid var(--linea); border-radius: 3px; background: var(--superficie); color: var(--tinta); }
.buscador input[type="search"]:focus { outline: 2px solid var(--acento); outline-offset: 1px; }
.buscador--pagina { margin: 0.5rem 0 1rem; max-width: 40rem; }
.resultados-busqueda { margin-bottom: 1rem; }

@media (min-width: 641px) {
  .panel-lateral__cuenta { display: none; } /* en ordenador ya están en la barra */
}
@media (max-width: 640px) {
  /* Móvil: arriba solo Publicar, campana y el botón de menú y buscador; la cuenta va en el panel lateral.
     El menú de secciones se queda visible y se desplaza de lado (16/10/2026, RF-151). */
  .usuario__enlaces { display: none; }
  /* Las secciones que no caben se insinúan con un degradado a la derecha: invita a deslizar. */
  .secciones__lista { padding-right: 1.5rem; mask-image: linear-gradient(to right, #000 82%, transparent); }
}

/* Herramientas bajo la publicación: compartir y menú «⋯» (RF-50, RF-45) */
.herramientas { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin: 1.2rem 0 0.4rem; }
.mas-opciones { position: relative; margin-left: auto; }
.mas-opciones summary { list-style: none; cursor: pointer; display: flex; padding: 0.35rem; border-radius: 50%; color: var(--tinta-suave); }
.mas-opciones summary::-webkit-details-marker { display: none; }
.mas-opciones summary:hover, .mas-opciones[open] summary { background: color-mix(in srgb, var(--tinta) 8%, transparent); color: var(--tinta); }
.mas-opciones__menu { position: absolute; right: 0; top: calc(100% + 4px); z-index: 4; min-width: 15rem; display: flex; flex-direction: column; background: var(--superficie); border: 1px solid var(--linea); border-radius: 8px; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12); padding: 0.3rem 0; }
.mas-opciones__menu a { padding: 0.6rem 1rem; font-size: 0.9rem; color: var(--tinta); text-decoration: none; }
.mas-opciones__menu a:hover { background: color-mix(in srgb, var(--acento) 10%, transparent); color: var(--acento); }

/* Franja de la administración en una publicación (RF-41, RF-120) */
.franja-admin { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem 1rem; padding: 0.7rem 1rem; margin-bottom: 1rem; border: 1px solid color-mix(in srgb, var(--azul) 45%, transparent); border-left: 4px solid var(--azul); border-radius: 6px; background: color-mix(in srgb, var(--azul) 8%, var(--papel)); font-size: 0.88rem; }
.franja-admin__titulo { font-weight: 800; color: var(--azul); text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.75rem; }
.franja-admin__form { display: flex; gap: 0.4rem; flex: 1; min-width: 16rem; }
.franja-admin__form input { flex: 1; min-width: 0; font: inherit; padding: 0.3rem 0.5rem; border: 1px solid var(--linea); border-radius: 3px; background: var(--superficie); color: var(--tinta); }
.franja-admin__enlace { color: var(--azul); font-weight: 600; }

/* Mis avisos (RF-133) */
.titulo-con-enlace { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.preferencias-avisos fieldset { border: 0; border-top: 1px solid var(--linea); padding: 0.8rem 0 0.4rem; margin: 0 0 0.6rem; }
.preferencias-avisos legend { font-weight: 800; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--azul); padding-right: 0.5rem; }
.preferencia { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem 1.2rem; flex-wrap: wrap; padding: 0.55rem 0; border-bottom: 1px dashed var(--linea); }
.preferencia__nombre { font-weight: 600; }
.preferencia__opciones { display: flex; gap: 0.4rem 1rem; flex-wrap: wrap; font-size: 0.9rem; }
.preferencia__opciones label { display: inline-flex; align-items: center; gap: 0.3rem; cursor: pointer; }

/* ---- Tablón del pueblo (RF-160 a RF-163) ---- */

.panel-lateral__accesos { display: flex; flex-direction: column; }
.panel-lateral__accesos a {
  display: flex; align-items: center; gap: 0.7rem; padding: 0.85rem 0.9rem; border-bottom: 1px solid var(--linea);
  border-left: 3px solid transparent; text-decoration: none; font-size: 1.05rem; color: var(--tinta);
}
.panel-lateral__accesos svg { flex: none; color: var(--acento); }
.panel-lateral__accesos a:hover { color: var(--acento); }
.panel-lateral__accesos a[aria-current="page"] { border-left-color: var(--acento); color: var(--acento); font-weight: 700; }
.tipo--tablon { grid-column: 1 / -1; border-top: 2px solid var(--oro); }

.etiqueta-anuncio {
  display: inline-block; padding: 0.05rem 0.4rem; margin-right: 0.35rem; border-radius: 2px; font-size: 0.7rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.04em; color: #ffffff; background: var(--error-borde);
}
.etiqueta-anuncio--encontrado { background: var(--acento); color: var(--acento-texto); }
.etiqueta-anuncio--resuelto { background: var(--tinta-suave); color: var(--papel); }
.miniatura {
  width: 56px; height: 56px; flex: none; display: grid; place-items: center; font-size: 1.7rem; overflow: hidden;
  background: var(--superficie); border: 1px solid var(--linea); border-radius: 4px;
}
.miniatura img { width: 100%; height: 100%; object-fit: cover; }
.miniatura--grande { width: 84px; height: 84px; font-size: 2.4rem; }
.chip {
  display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.85rem; padding: 0.25rem 0.7rem; border: 1px solid var(--linea);
  border-radius: 999px; color: var(--tinta); text-decoration: none; background: var(--superficie);
}
.chip:hover { border-color: var(--acento); color: var(--acento); }
.chip[aria-current="page"] { background: var(--tinta); color: var(--papel); border-color: var(--tinta); }

/* Franja de la portada */
.franja-tablon { border-top: 3px solid var(--oro); border-bottom: 1px solid var(--linea-fuerte); padding: 1rem 0 0.4rem; margin: 0 0 1.8rem; }
.franja-tablon__cabecera { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; font-family: var(--serif); font-size: 1.25rem; margin: 0 0 0.6rem; }
.franja-tablon__cabecera a { color: var(--tinta); text-decoration: none; }
.franja-tablon__cabecera .franja-tablon__todo { font-family: var(--sans); font-size: 0.85rem; font-weight: 600; color: var(--acento); }
.accesos { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0 0 0.8rem; }
.franja-tablon__anuncios { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 1.6rem; }
.franja-tablon__anuncios li { display: flex; gap: 0.6rem; align-items: flex-start; padding: 0.5rem 0; }
.franja-tablon__texto { font-size: 0.92rem; line-height: 1.3; }
.franja-tablon__texto a { color: var(--tinta); text-decoration: none; font-weight: 600; }
.franja-tablon__texto a:hover { text-decoration: underline; }
.franja-tablon__texto small { display: block; color: var(--tinta-suave); font-size: 0.75rem; margin-top: 0.15rem; }
@media (max-width: 860px) { .franja-tablon__anuncios { grid-template-columns: 1fr; } }

/* Página del tablón y fichas */
.cabecera-pagina { border-bottom: 3px solid var(--linea-fuerte); margin: 0 0 1.2rem; padding-bottom: 0.6rem; }
.cabecera-pagina h1 { font-family: var(--serif); font-size: 2rem; margin: 0; }
.cabecera-pagina p { margin: 0.2rem 0 0; color: var(--tinta-suave); }
.bloque-tablon { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; font-family: var(--serif); font-size: 1.35rem; margin: 1.6rem 0 0.7rem; }
.bloque-tablon .boton { font-family: var(--sans); }
.fichas { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0.8rem; }
.ficha-tarjeta {
  display: block; background: var(--superficie); border: 1px solid var(--linea); border-top: 3px solid var(--azul);
  padding: 0.8rem 0.9rem; text-decoration: none; color: var(--tinta); border-radius: 2px;
}
.ficha-tarjeta:hover { border-color: var(--azul); }
.ficha-tarjeta--destacada { border-top-color: var(--oro); }
.ficha-tarjeta__icono { font-size: 1.5rem; }
.ficha-tarjeta strong { display: block; font-family: var(--serif); font-size: 1.05rem; margin: 0.2rem 0; }
.ficha-tarjeta small { display: block; color: var(--tinta-suave); font-size: 0.8rem; line-height: 1.35; }
.filtros-tablon { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0 0 1rem; }
.filtros-tablon__separador { width: 0.6rem; }
.anuncios { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 0.8rem; }
.anuncio { display: flex; gap: 0.75rem; background: var(--superficie); border: 1px solid var(--linea); padding: 0.7rem; border-radius: 2px; }
.anuncio--resuelto { opacity: 0.7; }
.anuncio__titulo { font-family: var(--serif); font-size: 1rem; margin: 0.3rem 0 0.2rem; line-height: 1.25; }
.anuncio__titulo a { color: var(--tinta); text-decoration: none; }
.anuncio__titulo a:hover { text-decoration: underline; }
.anuncio__datos { margin: 0; font-size: 0.8rem; color: var(--tinta-suave); }
.nota--tablon { margin-top: 1.2rem; }
.volver { margin: 0 0 0.8rem; font-size: 0.9rem; }
.ficha { max-width: 760px; }
.ficha__contenido h2 { font-family: var(--serif); font-size: 1.15rem; margin: 1.4rem 0 0.4rem; }
.ficha__fila { display: flex; justify-content: space-between; gap: 1rem; padding: 0.6rem 0; border-top: 1px solid var(--linea); align-items: center; flex-wrap: wrap; }
.ficha__fila small { display: block; color: var(--tinta-suave); font-size: 0.8rem; }
.ficha__fila--aviso { background: var(--error); border: 0; border-left: 4px solid var(--error-borde); padding: 0.7rem 0.9rem; margin: 0 0 1rem; }
.ficha__tel { font-weight: 700; color: var(--acento); text-decoration: none; white-space: nowrap; font-size: 1.05rem; }
.ficha__fila--aviso .ficha__tel { color: var(--error-borde); font-size: 1.4rem; }

/* Datos del anuncio en su página */
.datos-anuncio { background: var(--superficie); border: 1px solid var(--linea); border-left: 4px solid var(--oro); padding: 0.8rem 1rem; margin: 0.8rem 0 1.2rem; }
.datos-anuncio dl { display: flex; flex-wrap: wrap; gap: 0.4rem 1.6rem; margin: 0; }
.datos-anuncio dt { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--tinta-suave); }
.datos-anuncio dd { margin: 0; font-weight: 600; }
.datos-anuncio__estado { margin: 0.7rem 0 0; font-size: 0.9rem; color: var(--tinta-suave); }
.datos-anuncio__estado--resuelto { color: var(--acento); font-weight: 700; }
.datos-anuncio__entrega { margin: 0.4rem 0 0; font-size: 0.9rem; }
.datos-anuncio__acciones { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.8rem; }

/* ---- Organismos (RF-143, RF-144) ---- */

.organismos__grupo {
  font-family: var(--sans); font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--azul);
  font-weight: 700; margin: 1.6rem 0 0.5rem; border-bottom: 1px solid var(--linea); padding-bottom: 0.3rem;
}
.organismos { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 0.9rem; }
.organismo { display: flex; flex-direction: column; gap: 0.5rem; background: var(--superficie); border: 1px solid var(--linea); padding: 1rem; border-radius: 2px; }
.organismo__cabecera { display: flex; gap: 0.7rem; align-items: center; }
.organismo__icono {
  width: 48px; height: 48px; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: 1.5rem;
  background: color-mix(in srgb, var(--azul) 12%, transparent);
}
.organismo__nombre { font-family: var(--serif); font-size: 1.08rem; font-weight: 700; color: var(--tinta); text-decoration: none; line-height: 1.2; }
.organismo__nombre:hover { text-decoration: underline; }
.organismo__alias { font-size: 0.8rem; color: var(--tinta-suave); }
.organismo__datos { margin: 0; font-size: 0.88rem; }
.organismo__datos div { display: flex; gap: 0.5rem; margin: 0.15rem 0; }
.organismo__datos dt { color: var(--tinta-suave); min-width: 5.2rem; }
.organismo__datos dd { margin: 0; overflow-wrap: anywhere; }
.organismo__boton { align-self: flex-start; margin-top: auto; }
.publicaciones-perfil { margin-top: 1.5rem; }

/* ---- Agenda (RF-170 a RF-173) ---- */

.campo[hidden] { display: none; }
.hoja-calendario {
  width: 3.4rem; flex: none; text-align: center; border: 1px solid var(--linea-fuerte); background: var(--superficie); line-height: 1.05;
}
.hoja-calendario b { display: block; font-size: 0.62rem; letter-spacing: 0.08em; background: var(--acento); color: var(--acento-texto); padding: 0.15rem 0; }
.hoja-calendario strong { display: block; font-family: var(--serif); font-size: 1.5rem; padding-top: 0.15rem; }
.hoja-calendario small { display: block; font-size: 0.6rem; letter-spacing: 0.08em; color: var(--tinta-suave); padding-bottom: 0.2rem; }
.hoja-calendario--grande { width: 4rem; }
.hoja-calendario--grande strong { font-size: 1.8rem; }
.hoja-calendario--rango b { letter-spacing: 0.02em; }
.hoja-calendario--rango strong, .hoja-calendario--grande.hoja-calendario--rango strong { font-size: 1.25rem; padding: 0.35rem 0 0.1rem; white-space: nowrap; }

/* Tira de la portada */
.tira-agenda {
  display: flex; align-items: center; gap: 1.2rem; border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea);
  padding: 0.45rem 0; margin: 0 0 1.2rem; font-size: 0.88rem; white-space: nowrap;
}
/* Solo se deslizan los eventos: «Agenda» y «Ver todo» quedan siempre a la vista. */
.tira-agenda__eventos {
  display: flex; gap: 1.2rem; flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none;
  mask-image: linear-gradient(to right, #000 calc(100% - 2rem), transparent);
}
.tira-agenda__eventos::-webkit-scrollbar { display: none; }
.tira-agenda a { text-decoration: none; flex: none; }
.tira-agenda__rotulo { display: inline-flex; gap: 0.35rem; align-items: center; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--acento); }
.tira-agenda__evento { color: var(--tinta); }
.tira-agenda__evento b { color: var(--azul); font-size: 0.75rem; letter-spacing: 0.05em; margin-right: 0.2rem; }
.tira-agenda__evento b.pronto { color: var(--acento); }
.tira-agenda__evento:hover { color: var(--acento); }
.tira-agenda__todo { color: var(--acento); font-weight: 600; }

/* Página de la agenda */
.cabecera-pagina--con-boton { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; flex-wrap: wrap; }
.cabecera-pagina h1 svg { color: var(--acento); vertical-align: -0.15em; }
.agenda { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 2rem; align-items: start; }
.agenda__grupo {
  font-family: var(--sans); font-size: 0.75rem; letter-spacing: 0.07em; text-transform: uppercase; color: var(--azul);
  margin: 1.4rem 0 0.2rem; border-bottom: 1px solid var(--linea); padding-bottom: 0.3rem;
}
.agenda__grupo:first-child { margin-top: 0; }
.agenda__evento { display: flex; gap: 1rem; padding: 0.8rem 0; border-bottom: 1px solid var(--linea); align-items: flex-start; }
.agenda__texto { flex: 1; min-width: 0; }
.agenda__texto h3 { font-family: var(--serif); font-size: 1.15rem; margin: 0 0 0.2rem; }
.agenda__texto h3 a { color: var(--tinta); text-decoration: none; }
.agenda__texto h3 a:hover { text-decoration: underline; }
.agenda__texto p { margin: 0; font-size: 0.88rem; color: var(--tinta-suave); }
.agenda__ire { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 0.3rem; font-size: 0.8rem; color: var(--tinta-suave); }
.agenda__mes { background: var(--superficie); border: 1px solid var(--linea); padding: 0.8rem; }
.agenda__mes-cabecera { display: grid; grid-template-columns: 2rem 1fr 2rem; align-items: center; margin: 0 0 0.5rem; }
.agenda__mes-cabecera h2 { font-family: var(--serif); margin: 0; font-size: 1.05rem; text-align: center; }
.agenda__mes-cabecera a { font-size: 1.5rem; line-height: 1; color: var(--acento); text-decoration: none; text-align: center; font-weight: 700; }
.agenda__mes-cabecera a:hover { opacity: 0.7; }
.agenda__filtro { margin: 0 0 0.6rem; font-weight: 600; }
.agenda__filtro::first-letter { text-transform: uppercase; }
.agenda__mes table { width: 100%; border-collapse: collapse; font-size: 0.8rem; text-align: center; }
.agenda__mes th { color: var(--tinta-suave); font-weight: 600; padding: 0.2rem 0; }
.agenda__mes td { padding: 0.15rem 0; }
.agenda__mes td span, .agenda__mes td a { display: inline-grid; place-items: center; width: 1.7rem; height: 1.7rem; border-radius: 50%; }
.agenda__mes td.con-evento a { background: var(--acento); color: var(--acento-texto); font-weight: 700; text-decoration: none; }
.agenda__mes td.con-evento a:hover { outline: 2px solid var(--tinta); }
.agenda__mes td.elegido a { outline: 2px solid var(--tinta); }
.agenda__mes td.hoy span, .agenda__mes td.hoy a { outline: 2px solid var(--oro); }
@media (max-width: 860px) { .agenda { grid-template-columns: 1fr; } .agenda__mes { display: none; } }

/* Datos del evento en su página */
.datos-evento { display: flex; gap: 1rem; align-items: flex-start; background: var(--superficie); border: 1px solid var(--linea); border-left: 4px solid var(--acento); padding: 0.8rem 1rem; margin: 0.8rem 0 1.2rem; }
.datos-evento__texto { flex: 1; min-width: 0; }
.datos-evento__cuando { margin: 0; font-weight: 700; }
.datos-evento__cuando::first-letter { text-transform: uppercase; }
.datos-evento__lugar { margin: 0.1rem 0 0; color: var(--tinta-suave); }
.datos-evento__acciones { display: flex; flex-wrap: wrap; gap: 0.6rem 1rem; align-items: center; margin-top: 0.7rem; }
.datos-evento__calendario { font-size: 0.88rem; font-weight: 600; }

/* ---- Novedades de la web (RF-153) ---- */

.pie__derechos a { color: inherit; }
.novedades { max-width: 760px; }
.novedades__version { border-bottom: 1px solid var(--linea); padding: 0.4rem 0 1rem; }
.novedades__version h2 { font-family: var(--serif); font-size: 1.3rem; margin: 0.6rem 0 0.1rem; }
.novedades__numero { font-family: var(--sans); font-size: 0.85rem; font-weight: 700; color: var(--acento-texto); background: var(--acento); padding: 0.1rem 0.45rem; border-radius: 2px; vertical-align: 0.15em; margin-right: 0.3rem; }
.novedades__fecha { margin: 0 0 0.4rem; font-size: 0.8rem; color: var(--tinta-suave); text-transform: uppercase; letter-spacing: 0.05em; }
.novedades__version ul { margin: 0.3rem 0; padding-left: 1.2rem; }
.novedades__fixes { font-size: 0.82rem; color: var(--tinta-suave); margin-top: 0.6rem; }
.novedades__fixes p { margin: 0; font-weight: 700; }

/* Página de enlaces de la biografía de Instagram (RF-117). */
.enlaces-bio { max-width: 640px; margin: 0 auto; }
.enlaces-bio__intro { color: var(--tinta-suave); margin-top: 0; }
.enlaces-bio__pieza { display: flex; gap: 1rem; align-items: flex-start; padding: 1rem 0; border-top: 1px solid var(--linea); }
.enlaces-bio__pieza img { flex: none; border-radius: 4px; object-fit: cover; }
.enlaces-bio__tipo { margin: 0 0 0.3rem; font-size: 0.8rem; color: var(--tinta-suave); text-transform: uppercase; letter-spacing: 0.05em; }
.enlaces-bio ul { margin: 0; padding-left: 1.1rem; }
.enlaces-bio li { margin: 0.35rem 0; }
.enlaces-bio a { font-family: var(--serif); font-size: 1.08rem; color: var(--tinta); }
.enlaces-bio__recientes { margin-bottom: 2rem !important; }