/* ===== Colores y tipografía (puedes cambiar estos valores) ===== */
:root {
  --papel: #fbf8f1;
  --tinta: #222019;
  --gris: #6b665c;
  --linea: #ddd6c7;
  --acento: #7a2420;      /* rojo burdeos */
  --acento-suave: #f1e6dc;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --sans: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--papel);
  color: var(--tinta);
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--acento); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { text-decoration-thickness: 2px; }
.marco { max-width: 1080px; margin: 0 auto; padding: 0 28px; }
.saltar { position: absolute; left: -999px; }
.saltar:focus { left: 12px; top: 12px; background: #fff; padding: 6px 10px; z-index: 10; }

/* ===== Cabecera ===== */
.cabecera { border-bottom: 1px solid var(--linea); }
.cabecera-fila { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 22px; padding-bottom: 18px; flex-wrap: wrap; }
.marca { text-decoration: none; color: var(--tinta); display: flex; flex-direction: column; }
.marca-nombre { font-size: 1.65rem; letter-spacing: .01em; line-height: 1.15; }
.marca-lema { font-family: var(--sans); font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--gris); margin-top: 4px; }
.menu { display: flex; align-items: center; gap: 26px; font-family: var(--sans); font-size: .9rem; flex-wrap: wrap; }
.menu a { color: var(--tinta); text-decoration: none; padding: 4px 0; border-bottom: 2px solid transparent; }
.menu a:hover { color: var(--acento); }
.menu a[aria-current="page"] { border-bottom-color: var(--acento); }
.idiomas { color: var(--gris); font-size: .82rem; letter-spacing: .06em; padding-left: 20px; border-left: 1px solid var(--linea); }
.idiomas strong { color: var(--tinta); font-weight: 600; }

/* ===== Foto de la biblioteca ===== */
.banda {
  height: 150px;
  background: #3a2e22 url("biblioteca.jpg") center 42% / cover no-repeat;
  border-bottom: 1px solid var(--linea);
}
.banda-alta { height: 330px; }

/* ===== Contenido general ===== */
main.marco { padding-top: 44px; padding-bottom: 64px; min-height: 50vh; }
h1 { font-weight: normal; font-size: 2.3rem; line-height: 1.2; margin: 0 0 18px; }
h2 { font-weight: normal; }
.intro { color: var(--gris); font-size: 1.02rem; max-width: 46em; }
.texto { max-width: 42em; }
.texto p { margin: 0 0 1.05em; }

/* ===== Portada ===== */
.portada { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 56px; align-items: start; }
.portada h1 { margin-bottom: 6px; }
.portada .cargo { font-family: var(--sans); font-size: .92rem; color: var(--gris); margin: 0 0 26px; }
.accesos { border-top: 3px solid var(--acento); padding-top: 14px; font-family: var(--sans); font-size: .92rem; }
.accesos h2 { font-family: var(--sans); font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--gris); margin: 0 0 10px; }
.accesos ul { list-style: none; padding: 0; margin: 0 0 26px; }
.accesos li { border-bottom: 1px solid var(--linea); }
.accesos li a { display: block; padding: 9px 0; text-decoration: none; color: var(--tinta); }
.accesos li a:hover { color: var(--acento); }
.destacado { background: var(--acento-suave); padding: 16px 18px; font-family: var(--serif); font-size: .98rem; line-height: 1.5; }
.destacado em { display: block; }

/* ===== Páginas de bibliografía ===== */
.con-lateral { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 52px; align-items: start; }
.lateral { position: sticky; top: 20px; font-family: var(--sans); font-size: .9rem; }
.lateral-titulo { font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; margin: 6px 0 12px; }
.lateral-titulo a { color: var(--gris); text-decoration: none; }
.lateral ul { list-style: none; padding: 0; margin: 0; border-top: 3px solid var(--acento); }
.lateral li a { display: block; padding: 9px 0; border-bottom: 1px solid var(--linea); color: var(--tinta); text-decoration: none; font-weight: 600; }
.lateral li a:hover { color: var(--acento); }
.lateral li a[aria-current="page"] { color: var(--acento); }

.herramientas { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; margin: 4px 0 18px; font-family: var(--sans); font-size: .86rem; }
.filtro { flex: 1 1 240px; padding: 8px 12px; border: 1px solid var(--linea); background: #fff; font: inherit; border-radius: 3px; }
.filtro:focus { outline: 2px solid var(--acento); outline-offset: 0; border-color: transparent; }
.solo { color: var(--gris); display: flex; gap: 6px; align-items: center; cursor: pointer; }

.decadas { font-family: var(--sans); font-size: .9rem; margin-bottom: 8px; color: var(--linea); }
.decadas a { text-decoration: none; padding: 0 2px; }
.decadas a:hover { text-decoration: underline; }
.decadas .sep { padding: 0 8px; }

.lista h2 { font-size: 1.05rem; font-weight: 700; margin: 26px 0 6px; font-family: var(--serif); }
.lista ul { margin: 0; padding-left: 0; list-style: none; }
.lista li { margin: 0 0 .7em; padding-left: 1.4em; text-indent: -1.4em; }
.lista li::before { content: none; }
.separador-decada { text-align: center; color: var(--gris); letter-spacing: .5em; margin: 34px 0 6px; font-size: .9rem; }
.enlace-texto {
  font-family: var(--sans); font-size: .7rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  text-indent: 0; display: inline-block; border: 1px solid var(--acento); border-radius: 3px; padding: 0 6px; margin-left: 6px;
  text-decoration: none; vertical-align: 2px; line-height: 1.6;
}
.enlace-texto:hover { background: var(--acento); color: #fff; }
.sin-resultados { color: var(--gris); font-style: italic; }
.arriba { margin-top: 40px; font-family: var(--sans); font-size: .85rem; }

/* Índice de publicaciones */
.indice { list-style: none; padding: 0; margin: 28px 0; border-top: 3px solid var(--acento); max-width: 42em; }
.indice li { border-bottom: 1px solid var(--linea); }
.indice a { display: flex; justify-content: space-between; padding: 12px 0; text-decoration: none; color: var(--tinta); font-size: 1.15rem; }
.indice a:hover { color: var(--acento); }
.indice .n { font-family: var(--sans); font-size: .85rem; color: var(--gris); }

/* ===== CV ===== */
.cv h2 { font-family: var(--sans); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--acento); border-top: 1px solid var(--linea); padding-top: 18px; margin: 34px 0 12px; }
.cv ul { padding-left: 1.2em; }
.cv li { margin-bottom: .4em; }
.descargas { font-family: var(--sans); font-size: .9rem; display: flex; gap: 12px; flex-wrap: wrap; margin: 6px 0 10px; }
.descargas a { border: 1px solid var(--acento); border-radius: 3px; padding: 6px 12px; text-decoration: none; }
.descargas a:hover { background: var(--acento); color: #fff; }

/* ===== Pie ===== */
.pie { border-top: 1px solid var(--linea); font-family: var(--sans); font-size: .82rem; color: var(--gris); }
.pie-fila { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-top: 22px; padding-bottom: 28px; }

/* ===== Pantallas pequeñas ===== */
@media (max-width: 820px) {
  body { font-size: 17px; }
  .portada, .con-lateral { grid-template-columns: 1fr; gap: 28px; }
  .lateral { position: static; }
  .lateral ul { display: flex; flex-wrap: wrap; gap: 0 18px; border-top: 0; }
  .lateral li a { border-bottom: 0; padding: 4px 0; }
  .banda-alta { height: 200px; }
  .banda { height: 110px; }
  .idiomas { border-left: 0; padding-left: 0; }
  h1 { font-size: 1.9rem; }
}
@media print {
  .cabecera, .banda, .lateral, .herramientas, .decadas, .pie, .arriba { display: none; }
  .con-lateral { display: block; }
}
