/* ---- catalogo-layout.css ---- */
/* ARCA del Tormes -- catalogo.css dividido en ficheros manejables.
   ============================================================================
   Bloque: Layout / navegacion (cat-nav-*, cat-topbar-*, cat-page-*).
   Extraido mecanicamente de catalogo.css (script de particion por prefijo de
   clase real, no reescrito a mano) para reducir el fichero monolitico. SIN
   CAPA a proposito -- se mantiene la misma prioridad de cascada que tenia
   dentro de catalogo.css (nunca tuvo capa), asi que mover estas reglas aqui
   no cambia que gana frente a que en ningun conflicto de especificidad
   existente. Cargado justo despues de catalogo.css en base.html para
   conservar el mismo orden relativo (reglas generales primero, estas
   despues), igual que estaban fisicamente despues en el fichero original en
   la mayoria de los casos.
   ============================================================================ */

.cat-nav {
  display: grid;
  gap: .3rem;
  padding-top: 1rem;
  border-top: 1px solid rgb(255 255 255 / 16%);
}

.cat-nav a {
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: .72rem .8rem;
  border-left: 3px solid transparent;
  color: #eef4f6;
  font-weight: 700;
  text-decoration: none;
}

.cat-nav a span {
  display: inline-grid;
  width: 1.5rem;
  place-items: center;
  color: #d9b978;
  font-size: 1.15rem;
}

.cat-nav a:hover,
.cat-nav a[aria-current="page"] {
  border-left-color: #d9b978;
  background: rgb(255 255 255 / 9%);
  color: #fff;
}

.cat-page {
  min-height: 100vh;
  margin-left: 258px;
}

.cat-topbar {
  position: sticky;
  z-index: 30;
  top: 0;
  display: flex;
  min-height: 58px;
  align-items: center;
  justify-content: flex-end;
  padding: .75rem clamp(1rem, 4vw, 4rem);
  border-bottom: 1px solid var(--cat-line);
  background: rgb(255 253 248 / 94%);
  box-shadow: 0 5px 18px rgb(25 39 45 / 6%);
  backdrop-filter: blur(12px);
}

.cat-topbar p {
  margin: 0;
  color: var(--cat-ink-soft);
  font-size: .9rem;
}

.cat-topbar__brand {
  display: none;
}

.cat-topbar {
  gap: .5rem 1rem;
}

.cat-page-header {
  max-width: 70rem;
  margin-bottom: clamp(2.5rem, 6vw, 5rem);
}

.cat-page-header > p:last-child {
  max-width: 58rem;
  margin: 1.2rem 0 0;
  color: var(--cat-ink-soft);
  font-family: var(--cat-serif);
  font-size: 1.25rem;
}

.cat-page-header--collection {
  display: flex;
  max-width: none;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid var(--cat-line);
}

.cat-page-header--collection > div:first-child {
  max-width: 70rem;
}

.cat-page-header__count {
  display: grid;
  min-width: 118px;
  text-align: right;
}

.cat-page-header__count strong {
  font-family: var(--cat-serif);
  font-size: 2.6rem;
  line-height: 1;
}

.cat-page-header__count span {
  color: var(--cat-ink-soft);
}

/* ── Menú de navegación en móvil (cajón accesible) ──
 * Antes de esta regla, .cat-sidebar desaparecía por completo por debajo de
 * 900px sin ningún sustituto: en móvil no había manera de llegar a
 * Hemeroteca, Documentos, Territorio, Destacados, etc. salvo desde enlaces
 * sueltos dentro de cada página. Se sustituye por un cajón deslizante
 * controlado por un botón hamburguesa en la topbar (ver .cat-nav-toggle y
 * catalogo/nav-toggle.js), con fondo oscurecido, cierre con Escape, cierre
 * al pulsar fuera y devolución de foco al botón que lo abrió.
 */

.cat-nav-toggle {
  display: none;
}

.cat-nav-backdrop {
  display: none;
}

@media (max-width: 900px) {
/* El comportamiento real del sidebar en movil (cajon con boton hamburguesa,
     o en linea si no hay JS) lo define responsive-a11y.css, que se carga el
     ultimo. Aqui ya no se oculta: ocultarlo dejaba 14 secciones inaccesibles
     sin depender del orden de carga de las hojas de estilo. */
.cat-page {
    margin-left: 0;
  }
.cat-topbar {
    position: sticky;
    top: 0;
    justify-content: space-between;
    backdrop-filter: blur(12px);
  }
/* El z-index real (30, por encima del contenido pero por debajo del cajon
     abierto) lo fija responsive-a11y.css, que se carga el ultimo. */
.cat-topbar__brand {
    display: flex;
    align-items: center;
    gap: .65rem;
    color: var(--cat-ink);
    font-weight: 700;
    text-decoration: none;
  }
}

@media (max-width: 680px) {
.cat-topbar p {
    display: none;
  }
.cat-section__head,
  .cat-page-header--collection {
    align-items: start;
    flex-direction: column;
  }
}

.cat-topbar__search {
  display: flex;
  width: min(100%, 720px);
  min-height: 38px;
  border: 1px solid #bdb09e;
  background: #fff;
  box-shadow: 0 6px 20px rgb(21 37 46 / 7%);
}

.cat-topbar__search input {
  min-width: 0;
  flex: 1;
  padding: .45rem .85rem;
  border: 0;
  background: transparent;
  color: var(--cat-ink);
  font: .88rem var(--cat-sans);
}

.cat-topbar__search button {
  display: inline-flex;
  gap: .35rem;
  align-items: center;
  justify-content: center;
  min-width: 94px;
  padding: .45rem .8rem;
  border: 0;
  background: var(--cat-red);
  color: #fff;
  font: 700 .82rem var(--cat-sans);
  cursor: pointer;
}

.cat-topbar__search button:hover,
.cat-topbar__search button:focus-visible {
  background: var(--cat-blue-deep);
  color: #fff;
}

@media (max-width: 900px) {
.cat-topbar__search {
    width: min(66vw, 620px);
  }
}

@media (max-width: 680px) {
.cat-topbar {
    flex-wrap: wrap;
    min-height: 0;
  }
.cat-topbar__search {
    width: min(68vw, 480px);
  }
.cat-topbar__search button {
    min-width: 44px;
  }
.cat-topbar__search button span:last-child {
    display: none;
  }
}

/* Portada editorial, navegación uniforme y descargas integradas · 2026-07-30. */

.cat-nav {
  gap: .22rem;
  padding-top: .85rem;
}

.cat-nav a {
  position: relative;
  display: grid;
  min-height: 43px;
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: .6rem;
  align-items: center;
  padding: .48rem .55rem;
  border: 1px solid transparent;
  border-left-color: transparent;
  border-radius: 2px;
  color: #e5edef;
  font-size: .8rem;
  line-height: 1.18;
}

.cat-nav a::before {
  position: absolute;
  inset: .35rem auto .35rem -.05rem;
  width: 3px;
  background: transparent;
  content: "";
}

.cat-nav a .cat-nav__icon {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border: 1px solid rgb(226 185 103 / 22%);
  border-radius: 50%;
  background: rgb(255 255 255 / 3%);
  color: #e0bc76;
  font-size: inherit;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.cat-nav__icon svg {
  width: 1.05rem;
  height: 1.05rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.65;
}

.cat-nav a .cat-nav__label {
  display: block;
  width: auto;
  color: inherit;
  font-size: inherit;
}

.cat-nav a:hover,
.cat-nav a:focus-visible {
  border-color: rgb(255 255 255 / 12%);
  border-left-color: rgb(255 255 255 / 12%);
  background: rgb(255 255 255 / 6%);
  color: #fff;
  text-decoration: none;
}

.cat-nav a[aria-current="page"] {
  border-color: rgb(224 188 118 / 28%);
  border-left-color: rgb(224 188 118 / 28%);
  background:
    linear-gradient(90deg, rgb(224 188 118 / 13%), transparent 70%),
    rgb(255 255 255 / 7%);
  color: #fff;
}

.cat-nav a[aria-current="page"]::before {
  background: #e0bc76;
}

.cat-nav a:hover .cat-nav__icon,
.cat-nav a:focus-visible .cat-nav__icon,
.cat-nav a[aria-current="page"] .cat-nav__icon {
  border-color: #e0bc76;
  background: #e0bc76;
  color: #173d4e;
}

.cat-topbar--home {
  min-height: 48px;
  padding-block: .6rem;
}

.cat-topbar__home-note {
  color: #617078 !important;
  font-size: .78rem !important;
  letter-spacing: .025em;
}

@media (max-width: 760px) {
.cat-topbar__home-note {
    display: none;
  }
}

@media (max-width: 900px) {
.cat-editorial-header > p:last-child,
  .cat-page-header > p:last-child {
    font-size: .97rem;
    line-height: 1.55;
  }
}

/* Entradilla de página: el párrafo de contexto que antes vivía dentro de la
   cabecera oscura en «Qué es ARCA» y «Datos abiertos». Al sacarlo, el fondo
   pasa de azul a crema, así que necesita la tinta del cuerpo; si se hubiera
   dejado el color claro que traía habría quedado ilegible. Es el mismo error
   que ya se cometió otras veces esta jornada al mover elementos entre
   fondos, así que aquí va declarado desde el principio. */

.cat-page-intro {
  /* Antes 62ch (~550px): con las cabeceras del sitio a 78rem/62rem de ancho
     util, esa caja quedaba visiblemente estrecha con un hueco vacio a su
     derecha (capturado en pantalla real, 23-ago-2026). Se iguala al resto
     de bloques de prosa de la pagina (.cat-about-prose, 62rem). */
  max-width: min(100%, 62rem);
  margin: 0 0 clamp(2rem, 4vw, 3rem);
}

.cat-page-intro--split {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(220px, .7fr);
  gap: 1.5rem 2.5rem;
  align-items: start;
  max-width: min(100%, 78rem);
}

.cat-page-intro--split .cat-about-hero__actions {
  flex-direction: column;
  align-items: flex-start;
  margin-top: 0;
}

@media (max-width: 760px) {
.cat-page-intro--split { grid-template-columns: 1fr; }
}

.cat-page-intro .cat-action-chip .cat-action-chip__label { flex: 1; color: var(--cat-blue-deep); font-weight: 700; font-size: 1rem; }

.cat-page-intro .cat-action-chip .cat-action-chip__arrow { flex-shrink: 0; color: var(--cat-red); font-weight: 700; font-size: 1.1rem; transition: transform .15s ease; }

.cat-page-intro .cat-action-chip--primary .cat-action-chip__label { color: #fff; }

.cat-page-intro .cat-action-chip--primary .cat-action-chip__arrow { color: #f1cb6c; }

.cat-page-intro p {
  margin: 0 0 1rem;
  color: var(--cat-ink);
  font-size: 1.02rem;
  line-height: 1.7;
}

.cat-page-intro a:not(.cat-button) {
  color: var(--cat-red);
}

/* ---- catalogo-home.css ---- */
/* ARCA del Tormes -- catalogo.css dividido en ficheros manejables.
   ============================================================================
   Bloque: Portada (cat-home-*).
   Extraido mecanicamente de catalogo.css (script de particion por prefijo de
   clase real, no reescrito a mano) para reducir el fichero monolitico. SIN
   CAPA a proposito -- se mantiene la misma prioridad de cascada que tenia
   dentro de catalogo.css (nunca tuvo capa), asi que mover estas reglas aqui
   no cambia que gana frente a que en ningun conflicto de especificidad
   existente. Cargado justo despues de catalogo.css en base.html para
   conservar el mismo orden relativo (reglas generales primero, estas
   despues), igual que estaban fisicamente despues en el fichero original en
   la mayoria de los casos.
   ============================================================================ */

/* Ajustes editoriales 2026-07-31: exportación, destacados y acordeones. */

.cat-home-hero .cat-hero__tools {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: none;
}

@media (max-width: 1050px) {
.cat-home-hero .cat-hero__tools, .cat-featured-studies-grid { grid-template-columns: 1fr; }
}

.cat-home-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(380px, .78fr);
  gap: clamp(2rem, 4vw, 4.5rem);
  align-items: stretch;
  overflow: hidden;
  margin: calc(clamp(1.25rem, 3vw, 3.5rem) * -1) calc(clamp(1rem, 4vw, 4.5rem) * -1) 0;
  padding: clamp(3rem, 6vw, 5.5rem) clamp(1rem, 4vw, 4.5rem);
  background:
    radial-gradient(circle at 70% 18%, rgb(185 138 60 / 12%), transparent 27rem),
    repeating-linear-gradient(90deg, transparent 0 7px, rgb(36 78 99 / 2.5%) 7px 8px),
    linear-gradient(135deg, #fffdf8 0%, #f1eadf 68%, #e4d8c7 100%);
  border-bottom: 1px solid var(--cat-line);
}

.cat-home-hero__content {
  position: relative;
  z-index: 1;
  align-self: center;
}

.cat-home-hero h1 {
  max-width: 11ch;
  font-size: clamp(3rem, 5vw, 5.35rem);
}

.cat-home-hero h1 em {
  color: var(--cat-red);
  font-weight: 500;
}

.cat-home-hero__lead {
  max-width: 45rem;
  margin: 1.35rem 0 1.8rem;
  color: var(--cat-ink-soft);
  font: clamp(1.1rem, 1.65vw, 1.42rem)/1.55 var(--cat-serif);
}

.cat-home-search {
  max-width: none;
}

.cat-home-search .cat-search__control {
  min-height: 58px;
}

.cat-home-hero .cat-hero__tools {
  max-width: none;
  margin-top: 1.15rem;
}

.cat-home-hero .cat-hero__amanuense,
.cat-home-hero .cat-hero__occupation {
  min-height: 124px;
}

.cat-home-hero__note {
  margin: 1.1rem 0 0;
  padding-top: .9rem;
  border-top: 1px solid #c8bba7;
  color: var(--cat-ink-soft);
  font-size: .8rem;
}

.cat-home-hero__note strong {
  color: var(--cat-blue-deep);
  font-family: var(--cat-serif);
  font-size: .92rem;
}

.cat-home-hero__note a {
  margin-left: .35rem;
  color: var(--cat-red-deep);
  font-weight: 800;
  white-space: nowrap;
}

.cat-home-hero__feature {
  position: relative;
  display: flex;
  min-height: 600px;
  align-items: end;
  overflow: hidden;
  border: 1px solid #aa9676;
  background: var(--cat-blue-deep);
  box-shadow: 0 24px 55px rgb(28 43 49 / 19%);
  color: #fff;
  text-decoration: none;
}

.cat-home-hero__feature > img,
.cat-home-hero__feature-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.cat-home-hero__feature > img {
  object-fit: cover;
  filter: sepia(.16) contrast(1.08);
  transition: transform .55s ease;
}

.cat-home-hero__feature-shade {
  background:
    linear-gradient(180deg, rgb(10 34 45 / 5%) 20%, rgb(10 34 45 / 92%) 100%),
    linear-gradient(90deg, rgb(10 34 45 / 18%), transparent);
}

.cat-home-hero__feature-copy {
  position: relative;
  z-index: 1;
  display: grid;
  gap: .65rem;
  padding: clamp(1.5rem, 4vw, 2.75rem);
}

.cat-home-hero__feature-copy .cat-eyebrow {
  color: #f0d18c;
}

.cat-home-hero__feature-copy > strong {
  max-width: 15ch;
  color: #fff;
  font: 650 clamp(2rem, 3vw, 3.1rem)/1.02 var(--cat-serif);
}

.cat-home-hero__feature-copy > span:not(.cat-eyebrow, .cat-home-hero__feature-link) {
  color: #e8eef0;
  font-size: .92rem;
  line-height: 1.55;
}

.cat-home-hero__feature-link {
  margin-top: .45rem;
  color: #fff;
  font-weight: 800;
}

.cat-home-hero__feature:hover,
.cat-home-hero__feature:focus-visible {
  color: #fff;
}

.cat-home-hero__feature:hover > img,
.cat-home-hero__feature:focus-visible > img {
  transform: scale(1.035);
}

.cat-home-section {
  padding-top: clamp(4rem, 7vw, 6.5rem);
}

.cat-home-section__head {
  display: flex;
  gap: 2rem;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 1.6rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--cat-line);
}

.cat-home-section__head > p,
.cat-home-section__head > a {
  max-width: 36rem;
  margin: 0;
}

.cat-home-section__head > p {
  color: var(--cat-ink-soft);
}

.cat-home-portals {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--cat-line);
  border-left: 1px solid var(--cat-line);
}

.cat-home-portals > a {
  position: relative;
  display: grid;
  min-height: 175px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: .8rem 1rem;
  align-content: start;
  padding: 1.35rem;
  border-right: 1px solid var(--cat-line);
  border-bottom: 1px solid var(--cat-line);
  background: rgb(255 253 248 / 64%);
  color: var(--cat-ink);
  text-decoration: none;
  transition: background .18s ease, color .18s ease;
}

.cat-home-portals__number {
  color: var(--cat-red);
  font: 700 .72rem var(--cat-sans);
}

.cat-home-portals > a > span:nth-child(2) {
  display: grid;
  gap: .25rem;
}

.cat-home-portals strong {
  font: 650 1.35rem/1.08 var(--cat-serif);
}

.cat-home-portals small,
.cat-home-portals__meta {
  color: var(--cat-ink-soft);
  font-size: .78rem;
}

.cat-home-portals__meta {
  grid-column: 2;
  align-self: end;
  padding-top: 1rem;
}

.cat-home-portals__arrow {
  grid-column: 3;
  grid-row: 1 / span 2;
  color: var(--cat-red);
  font-size: 1.2rem;
}

.cat-home-portals > a:hover,
.cat-home-portals > a:focus-visible {
  background: var(--cat-blue-deep);
  color: #fff;
}

.cat-home-portals > a:hover strong,
.cat-home-portals > a:focus-visible strong {
  color: #fff;
}

.cat-home-portals > a:hover small,
.cat-home-portals > a:hover .cat-home-portals__meta,
.cat-home-portals > a:focus-visible small,
.cat-home-portals > a:focus-visible .cat-home-portals__meta {
  color: #cbd8dc;
}

.cat-home-portals > a:hover .cat-home-portals__number,
.cat-home-portals > a:hover .cat-home-portals__arrow,
.cat-home-portals > a:focus-visible .cat-home-portals__number,
.cat-home-portals > a:focus-visible .cat-home-portals__arrow {
  color: #f0d18c;
}

.cat-home-recent {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--cat-line);
  border-left: 1px solid var(--cat-line);
}

.cat-home-recent > a {
  display: grid;
  min-height: 145px;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: start;
  padding: 1.25rem;
  border-right: 1px solid var(--cat-line);
  border-bottom: 1px solid var(--cat-line);
  background: rgb(255 253 248 / 52%);
  color: var(--cat-ink);
  text-decoration: none;
}

.cat-home-recent__number {
  color: var(--cat-red);
  font: 650 1.35rem var(--cat-serif);
}

.cat-home-recent__copy {
  display: grid;
  gap: .25rem;
}

.cat-home-recent__copy .cat-eyebrow {
  margin: 0 0 .15rem;
}

.cat-home-recent__copy strong {
  color: var(--cat-ink);
  font: 650 1.18rem/1.15 var(--cat-serif);
}

.cat-home-recent__copy small {
  margin-top: .35rem;
  color: var(--cat-ink-soft);
}

.cat-home-recent__arrow {
  color: var(--cat-red);
}

.cat-home-recent > a:hover,
.cat-home-recent > a:focus-visible {
  background: #efe5d3;
  color: var(--cat-ink);
}

.cat-home-about {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr);
  gap: clamp(2rem, 5vw, 5rem);
  margin: clamp(5rem, 9vw, 8rem) calc(clamp(1rem, 4vw, 4.5rem) * -1) -5rem;
  padding: clamp(2.5rem, 5vw, 4.5rem) clamp(1rem, 4vw, 4.5rem);
  background: var(--cat-blue-deep);
  color: #e8eff1;
}

.cat-home-about .cat-kicker {
  color: #f0d18c;
}

.cat-home-about h2 {
  max-width: 15ch;
  color: #fff;
}

.cat-home-about__copy > p:not(.cat-kicker) {
  max-width: 50rem;
  color: #cbd8dc;
  font-size: 1rem;
  line-height: 1.65;
}

.cat-home-about__copy > div {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  margin-top: 1.5rem;
}

/* Mismo caso que .cat-text-link: medido a 177x22px el 2026-08-15, por
   debajo del mínimo de 24px de WCAG 2.2 §2.5.8, y sin excepción «inline»
   porque va suelto junto a un botón, no dentro de una frase. */

.cat-home-about__secondary {
  display: inline-block;
  padding-block: .15rem;
  color: #fff;
  font-weight: 800;
  line-height: 1.5;
}

.cat-home-kpis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid rgb(255 255 255 / 18%);
  border-left: 1px solid rgb(255 255 255 / 18%);
}

.cat-home-kpis article {
  display: grid;
  min-height: 135px;
  align-content: center;
  padding: 1.2rem;
  border-right: 1px solid rgb(255 255 255 / 18%);
  border-bottom: 1px solid rgb(255 255 255 / 18%);
}

.cat-home-kpis strong {
  color: #fff;
  font: 650 clamp(2rem, 3vw, 3rem)/1 var(--cat-serif);
}

.cat-home-kpis span {
  margin-top: .35rem;
  color: #fff;
  font-weight: 800;
}

.cat-home-kpis small {
  margin-top: .15rem;
  color: #aebfc6;
}

.cat-home-about .cat-button {
  padding: .72rem 1rem;
  border: 1px solid #f0d18c;
  background: #f0d18c;
  color: var(--cat-blue-deep);
  text-decoration: none;
}

.cat-home-about .cat-button:hover,
.cat-home-about .cat-button:focus-visible {
  border-color: #fff;
  background: #fff;
  color: var(--cat-red-deep);
}

@media (max-width: 1250px) {
.cat-home-hero {
    grid-template-columns: 1fr;
  }
.cat-home-hero__feature {
    min-height: 420px;
  }
.cat-home-portals {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
.cat-home-about {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
.cat-home-hero {
    padding-top: 2.75rem;
  }
.cat-home-hero__feature {
    min-height: 360px;
  }
.cat-home-section__head {
    align-items: flex-start;
    flex-direction: column;
    gap: .7rem;
  }
.cat-home-portals,
  .cat-home-recent {
    grid-template-columns: 1fr;
  }
.cat-home-about {
    grid-template-columns: 1fr;
  }
.cat-home-kpis {
    grid-template-columns: 1fr;
  }
}

/* Ajuste de portada: hero limpio, relatos compactos y accesos editoriales · 2026-07-30 */

.cat-home-hero {
  display: block;
  padding-top: clamp(3.25rem, 5vw, 4.75rem);
  padding-bottom: clamp(3.5rem, 5.5vw, 5rem);
}

.cat-home-hero__content {
  width: min(100%, 74rem);
}

/* Envoltorios añadidos para el hero a pantalla completa en móvil (ver media
   query de 900px más abajo). En escritorio no cambian nada visualmente:
   __screen es un div sin estilo propio y __more solo repite el ancho de
   __content para que las herramientas y la nota sigan alineadas igual que
   antes de introducir el envoltorio. */

.cat-home-hero__more {
  width: min(100%, 74rem);
}

/* Las fotos de fondo, la filigrana del logo y el aviso de scroll son
   EXCLUSIVAMENTE de móvil: se ocultan por defecto y solo el media query de
   900px los muestra/posiciona. Tercera vez que falta un elemento en esta
   lista (antes .cat-hero-band__bg, ahora .cat-home-hero__marca): cualquier
   <img> o <div> nuevo que solo tenga reglas dentro de un media query de
   móvil se renderiza en escritorio como bloque normal a tamaño natural, sin
   posicionar. Añadido aquí para que quede en un único sitio y no se repita. */

.cat-home-hero__bg,
.cat-home-hero__scrollcue,
.cat-home-hero__marca,
.cat-home-hero__cifras,
.cat-back-to-top {
  display: none;
}

/* --------------------------------------------------------------------------
   PORTADA DE ESCRITORIO — MAPA RETIRADO, 2026-08-15
   --------------------------------------------------------------------------
   El bloque de abajo (vigente desde 2026-08-14) ponía el mapa circular de
   Salvatierra en la mitad derecha del hero de escritorio. El propietario lo
   retiró en vivo el 2026-08-15 tras aprobar el rediseño de la portada móvil
   (pantalla clara + logo, ver /prototipo/splash-movil/): "estoy mirando la
   version de escritorio actual y veo que está metido el mapa circular,
   quítalo". No se sustituye por otra imagen: se revierte a "papel y texto",
   el estado documentado como previo a la introducción del mapa (ver
   comentario histórico que sigue). El WebP no se borra (norma de
   originales/derivados del proyecto); simplemente deja de referenciarse
   aquí.

   Nota histórica (2026-08-14, ya no vigente): "Hasta ahora la primera
   pantalla del catálogo no enseñaba nada del catálogo: en escritorio era
   papel y texto, y en móvil una superficie azul con un arco decorativo...
   Se probó antes una versión con la imagen a sangre completa detrás del
   texto y se descartó por medición: el titular quedaba ilegible." Esa
   medición sigue siendo la razón por la que NO se prueba aquí ninguna
   imagen a sangre completa sin la máscara/columna que la aislaba del texto.
   -------------------------------------------------------------------------- */

.cat-home-hero h1 {
  max-width: none;
  font-size: clamp(3.25rem, 4.8vw, 4.85rem);
}

.cat-home-hero__lead,
.cat-home-hero .cat-home-search,
.cat-home-hero .cat-hero__tools,
.cat-home-hero__note {
  max-width: 64rem;
}

.cat-home-highlights {
  padding-top: clamp(2.75rem, 4.5vw, 4.25rem);
}

.cat-home-highlights__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(.85rem, 1.5vw, 1.3rem);
}

.cat-home-highlight {
  position: relative;
  display: flex;
  height: clamp(290px, 21vw, 340px);
  min-height: 290px;
  align-items: end;
  overflow: hidden;
  border: 1px solid #a7967b;
  background: var(--cat-blue-deep);
  box-shadow: 0 14px 30px rgb(30 43 48 / 12%);
  color: #fff;
  text-decoration: none;
  transition:
    border-color .22s ease,
    box-shadow .22s ease,
    transform .22s ease;
}

.cat-home-highlight__media,
.cat-home-highlight__shade {
  position: absolute;
  inset: 0;
}

.cat-home-highlight__media {
  display: grid;
  overflow: hidden;
  place-items: center;
  background:
    radial-gradient(circle at 50% 35%, rgb(240 209 140 / 15%), transparent 52%),
    var(--cat-blue-deep);
}

.cat-home-highlight__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: sepia(.14) contrast(1.07) brightness(.88);
  transition: transform .5s ease, filter .5s ease;
}

.cat-home-highlight:nth-child(2) .cat-home-highlight__media img {
  object-position: center 58%;
}

.cat-home-highlight--series .cat-home-highlight__media img {
  object-position: center;
  transform: scale(1.24);
  filter: sepia(.3) contrast(1.15) brightness(.72);
}

.cat-home-highlight__shade {
  background:
    linear-gradient(180deg, rgb(8 28 37 / 4%) 12%, rgb(8 28 37 / 18%) 38%, rgb(8 28 37 / 94%) 100%),
    linear-gradient(90deg, rgb(8 28 37 / 30%), transparent 75%);
}

.cat-home-highlight__copy {
  position: relative;
  z-index: 1;
  display: grid;
  width: 100%;
  gap: .42rem;
  padding: clamp(1.15rem, 2vw, 1.6rem);
}

.cat-home-highlight__copy .cat-eyebrow {
  color: #f0d18c;
}

.cat-home-highlight__copy > strong {
  display: -webkit-box;
  overflow: hidden;
  max-width: 18ch;
  color: #fff;
  font: 650 clamp(1.4rem, 1.8vw, 1.85rem)/1.04 var(--cat-serif);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.cat-home-highlight__summary {
  color: #e9eff1;
  font-size: .82rem;
  line-height: 1.45;
}

.cat-home-highlight__link {
  margin-top: .15rem;
  color: #fff;
  font-size: .8rem;
  font-weight: 800;
}

.cat-home-highlight__fallback {
  color: #f0d18c;
  font: italic 3.2rem var(--cat-serif);
}

.cat-home-highlight:hover,
.cat-home-highlight:focus-visible {
  border-color: #d9af55;
  box-shadow: 0 20px 38px rgb(24 38 44 / 18%);
  color: #fff;
  transform: translateY(-3px);
}

.cat-home-highlight:hover .cat-home-highlight__media img,
.cat-home-highlight:focus-visible .cat-home-highlight__media img {
  filter: sepia(.08) contrast(1.08) brightness(.94);
  transform: scale(1.035);
}

.cat-home-highlight--series:hover .cat-home-highlight__media img,
.cat-home-highlight--series:focus-visible .cat-home-highlight__media img {
  transform: scale(1.29);
}

.cat-home-highlights + .cat-home-explore {
  padding-top: clamp(3.75rem, 6vw, 5.75rem);
}

.cat-home-portals {
  gap: 1rem;
  border: 0;
}

.cat-home-portals > a {
  min-height: 164px;
  padding: 1.15rem 1.2rem;
  border: 1px solid #d5c9b8;
  border-top: 3px solid var(--cat-blue-deep);
  background:
    linear-gradient(135deg, rgb(240 209 140 / 9%), transparent 44%),
    #fffdf8;
  box-shadow: 0 8px 20px rgb(39 49 51 / 6%);
  transition:
    border-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease;
}

.cat-home-portals__number {
  display: grid;
  width: 2.15rem;
  height: 2.15rem;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid #dbc993;
  border-radius: 50%;
  background: #f6edda;
  color: var(--cat-red-deep);
}

.cat-home-portals > a > span:nth-child(2) {
  align-self: center;
}

.cat-home-portals strong {
  color: var(--cat-ink);
  font-size: 1.28rem;
}

.cat-home-portals__meta {
  width: max-content;
  margin-top: auto;
  padding: .3rem .55rem;
  border: 1px solid #e3d8c8;
  background: #f6f0e6;
  color: var(--cat-ink-soft);
  line-height: 1;
}

.cat-home-portals__arrow {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border: 1px solid #d8cbb9;
  border-radius: 50%;
  color: var(--cat-red-deep);
  font-size: .95rem;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}

.cat-home-portals > a:hover,
.cat-home-portals > a:focus-visible {
  border-color: #a98d62;
  border-top-color: var(--cat-red);
  background:
    linear-gradient(135deg, rgb(240 209 140 / 14%), transparent 48%),
    #fffdf8;
  box-shadow: 0 15px 30px rgb(39 49 51 / 11%);
  color: var(--cat-ink);
  transform: translateY(-3px);
}

.cat-home-portals > a:hover strong,
.cat-home-portals > a:focus-visible strong {
  color: var(--cat-ink);
}

.cat-home-portals > a:hover small,
.cat-home-portals > a:hover .cat-home-portals__meta,
.cat-home-portals > a:focus-visible small,
.cat-home-portals > a:focus-visible .cat-home-portals__meta {
  color: var(--cat-ink-soft);
}

.cat-home-portals > a:hover .cat-home-portals__number,
.cat-home-portals > a:focus-visible .cat-home-portals__number {
  color: var(--cat-red-deep);
}

.cat-home-portals > a:hover .cat-home-portals__arrow,
.cat-home-portals > a:focus-visible .cat-home-portals__arrow {
  border-color: var(--cat-red);
  background: var(--cat-red);
  color: #fff;
  transform: translateX(2px);
}

@media (max-width: 1100px) {
.cat-home-highlights__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
.cat-home-highlight:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
.cat-home-hero h1 {
    font-size: clamp(2.75rem, 13vw, 4rem);
  }
.cat-home-highlights__grid {
    grid-template-columns: 1fr;
  }
.cat-home-highlight,
  .cat-home-highlight:last-child:nth-child(odd) {
    height: 300px;
    grid-column: auto;
  }
.cat-home-portals {
    gap: .8rem;
  }
}

/* Overrides finales: estas reglas deben quedar después del tema heredado. */

.cat-home-hero .cat-hero__tools {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: none;
}

.cat-home-hero .cat-hero__amanuense,
.cat-home-hero .cat-hero__occupation,
.cat-home-hero .cat-hero__featured { min-height: 124px; }

@media (max-width: 900px) {
.cat-home-hero .cat-hero__tools { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
.cat-body--inmersiva .cat-main > *:not(.cat-home-hero, .cat-home-about),
  .cat-body--inmersiva .cat-home-hero__more {
    padding-inline: 1.35rem;
  }
/* .cat-home-about ya sangraba a pantalla completa con márgenes negativos
     calculados contra el padding de .cat-main. Al quitar ese padding esos
     márgenes desbordaban 32px a la derecha (medido en vivo). Se anulan y
     el bloque conserva su propio padding interior. */
.cat-body--inmersiva .cat-home-about {
    margin-inline: 0;
    padding-inline: 1.35rem;
  }
/* --- Lienzo compartido por el hero de portada y el de sección -------- */
.cat-home-hero {
    margin: 0;
    padding: 0;
    border-bottom: 0;
    background: none;
  }
.cat-home-hero__screen {
    position: relative;
    display: flex;
    /* Antes 100svh con la topbar en position:fixed flotando encima (ver nota
       más arriba: se retiró por el conflicto con .is-encogida). Con la
       topbar de vuelta en el flujo normal, "pantalla completa" es 100svh
       MENOS lo que ocupa la barra. Aproximado a su min-height habitual en
       móvil (58px + padding); pendiente de confirmar el ajuste exacto en
       vivo tras el rebuild, un margen de unos pocos px no es visualmente
       grave. */
    min-height: calc(100svh - 4.8rem);
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
    margin-inline: 0;
    overflow: hidden;
    /* Color sólido bajo la foto. Cumple dos funciones reales:
       1) Si la imagen no carga, el texto claro seguiría siendo legible; sin
          esto quedaría blanco sobre la crema del body, es decir invisible.
       2) Las herramientas de accesibilidad no pueden leer una imagen de
          fondo: recorren los ancestros buscando un background-color sólido.
          Sin él llegaban hasta el body (#f5f1e8) y medían el titular blanco
          a 1,13:1, marcando error en las 6 páginas. Con este color miden
          18,90:1. El contraste sobre la foto real ya era de 8,71 a 11,08:1.
       Va dentro del media query a propósito: en escritorio la foto está
       oculta y un fondo oscuro dejaría un bloque negro. */
    background-color: #0d1210;
  }
.cat-home-hero__bg {
    position: absolute;
    z-index: 0;
    display: block;
    inset: 0;
  }
.cat-home-hero__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 38%;
  }
/* Oscurecido en dos tramos: suave arriba, para que la foto respire bajo
     la cabecera flotante, y muy denso en el tercio inferior, donde va todo
     el texto. Medido para que el blanco supere holgadamente 4.5:1. */
.cat-home-hero__bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
      linear-gradient(180deg, rgb(8 14 18 / 34%) 0%, rgb(8 14 18 / 30%) 34%, rgb(11 14 12 / 78%) 62%, rgb(9 11 9 / 94%) 82%, rgb(8 10 8 / 97%) 100%);
  }
/* --- Texto sobre la foto -------------------------------------------- */
.cat-home-hero__screen .cat-home-hero__content {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: none;
    margin: 0;
    padding-inline: 1.35rem;
    border: 0;
    padding-bottom: 1rem;
  }
.cat-home-hero__screen .cat-home-hero__lead {
    color: #ece7dc;
  }
.cat-home-hero__screen .cat-kicker {
    color: #f2d494;
  }
.cat-home-hero__screen h1 {
    color: #fff;
  }
.cat-home-hero__screen h1 em {
    color: #f4c3b3;
  }
/* El bloque de texto ocupaba el 65% de la pantalla (474px de 726) y
     dejaba la foto reducida a una franja. Medido en vivo: el lead iba a
     17,6px con interlineado 27,3px, cinco líneas. Con estos tamaños el
     texto baja a cerca de la mitad y la imagen recupera protagonismo. */
.cat-home-hero__screen h1 {
    font-size: clamp(2rem, 9vw, 2.75rem);
    letter-spacing: -.03em;
    line-height: 1.06;
  }
.cat-home-hero__screen .cat-home-hero__lead {
    margin: .85rem 0 1.15rem;
    font-size: .95rem;
    line-height: 1.5;
  }
.cat-home-hero__screen .cat-kicker {
    font-size: .68rem;
    letter-spacing: .09em;
  }
.cat-home-hero__screen .cat-search label {
    color: #fff;
  }
.cat-home-hero__screen .cat-search > p {
    display: none;
  }
/* Deja respirar la foto por arriba: el texto arranca en el tercio
     inferior en lugar de pegarse al borde de la pantalla. */
.cat-home-hero__screen::before {
    content: "";
    flex: 1 1 auto;
    min-height: 4.5rem;
  }
.cat-home-hero__scrollcue {
    position: relative;
    z-index: 1;
    display: block;
    margin: 0 auto;
    padding-bottom: 1.5rem;
    color: #e6e1d6;
    font-size: .72rem;
    letter-spacing: .08em;
    text-align: center;
    text-transform: uppercase;
  }
.cat-home-hero__more {
    padding-top: 2.25rem;
  }
.cat-body--snap .cat-main > section:not(.cat-home-hero),
  .cat-body--snap .cat-home-hero__screen,
  .cat-body--snap .cat-home-hero__more {
    scroll-snap-align: start;
  }
}

@media (min-width: 901px) {
.cat-home-hero .cat-hero__amanuense,
  .cat-home-hero .cat-hero__occupation,
  .cat-home-hero .cat-hero__featured { grid-template-columns: minmax(96px, 34%) minmax(0, 1fr); }
.cat-home-hero .cat-hero__amanuense-copy,
  .cat-home-hero .cat-hero__occupation-copy,
  .cat-home-hero .cat-hero__featured-copy { padding: .85rem; }
.cat-home-hero .cat-hero__amanuense strong,
  .cat-home-hero .cat-hero__occupation strong,
  .cat-home-hero .cat-hero__featured strong { font-size: clamp(1.05rem, 1.55vw, 1.35rem); }
}

@media (max-width: 900px) {
.cat-home-hero__screen {
    position: relative;
    isolation: isolate;
    background-color: #122e3b;
    background-image:
      linear-gradient(160deg, #1a4155 0%, #122e3b 52%, #0d2029 100%);
  }
.cat-home-hero__screen::before {
    content: "";
    position: absolute;
    z-index: -2;
    inset: 0;
    /* Derivado WebP de 107 KB creado el 2026-08-14 a partir del PNG original
       de 1.370 KB (misma resolución, 869×900; solo cambia el formato). El
       original no se ha tocado, conforme a la norma del proyecto: es un
       fichero nuevo, no una sustitución. */
    background-image: url("destacados/mapa-tres-leguas/mapa-salvatierra-portada.c3c09c887b77.webp");
    background-position: 58% 32%;
    background-size: cover;
    filter: sepia(.45) contrast(1.05) brightness(.62) saturate(.75);
  }
/* Velo vertical: transparente arriba, donde solo hay mapa, y denso abajo,
     donde está el texto. Sin él, el titular claro caería sobre las zonas
     claras del mapa. */
.cat-home-hero__screen::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background:
      linear-gradient(180deg, rgb(10 28 37 / 42%) 0%, rgb(10 28 37 / 55%) 38%, rgb(10 28 37 / 88%) 66%, rgb(9 24 31 / 96%) 100%);
  }
.cat-home-hero__screen .cat-home-hero__bg {
    display: none;
  }
.cat-home-hero__marca {
    position: absolute;
    z-index: 0;
    top: 12%;
    right: -14%;
    width: 84%;
    opacity: .1;
    filter: grayscale(1) brightness(3);
    pointer-events: none;
  }
/* Anillos concéntricos muy tenues, ecos del círculo del logo: dan
     profundidad sin competir con el texto ni depender de una fotografía. */
.cat-home-hero__screen::after {
    content: "";
    position: absolute;
    z-index: 0;
    top: 6%;
    right: -34%;
    width: 92%;
    aspect-ratio: 1;
    border: 2px solid rgb(240 199 108 / 13%);
    border-radius: 50%;
    pointer-events: none;
  }
.cat-home-hero__screen .cat-home-hero__content,
  .cat-home-hero__scrollcue {
    position: relative;
    z-index: 1;
  }
}

@media (max-width: 900px) {
.cat-home-hero__screen {
    background-color: #fdfbf9;
    background-image: none;
    justify-content: center;
  }
.cat-home-hero__screen::before,
  .cat-home-hero__screen::after {
    content: none;
  }
.cat-home-hero__marca {
    display: block;
    position: relative;
    z-index: 1;
    top: auto;
    right: auto;
    width: auto;
    height: 200px;
    margin: 0 auto 1rem;
    opacity: 1;
    filter: none;
  }
.cat-home-hero__screen .cat-home-hero__content {
    padding-bottom: 2rem;
    text-align: center;
  }
.cat-home-hero__screen .cat-kicker,
  .cat-home-hero__screen h1,
  .cat-home-hero__screen .cat-home-hero__lead {
    color: #122e3b;
  }
.cat-home-hero__screen h1 em {
    color: #8d2631;
  }
.cat-home-hero__screen .cat-search label {
    color: #122e3b;
  }
.cat-home-hero__scrollcue {
    color: #122e3b;
  }
/* El buscador grande se retira del hero de móvil: ya hay acceso a la
     búsqueda desde el icono del topbar (cat-search-toggle), y repetirlo
     aquí solo quitaba espacio a la pantalla de entrada. Sigue intacto en
     escritorio, donde no hay ese icono y el buscador del hero es la única
     entrada. */
.cat-home-hero__screen .cat-home-search {
    display: none;
  }
}

@media (max-width: 900px) {
.cat-home-hero__marca {
    height: 172px;
    margin-bottom: .65rem;
  }
.cat-home-hero__screen .cat-home-hero__content {
    padding-bottom: 1.1rem;
  }
.cat-home-hero__screen h1 {
    font-size: clamp(1.9rem, 8.7vw, 2.45rem);
  }
.cat-home-hero__screen .cat-home-hero__lead {
    max-width: 31ch;
    margin: .7rem auto 1rem;
    font-size: .91rem;
    line-height: 1.45;
  }
}

/* ---- catalogo-ficha-lugar.css ---- */
/* ARCA del Tormes -- catalogo.css dividido en ficheros manejables.
   ============================================================================
   Bloque: Ficha de lugar / territorio (cat-place-*, cat-territory-*, cat-map-*, cat-population-*).
   Extraido mecanicamente de catalogo.css (script de particion por prefijo de
   clase real, no reescrito a mano) para reducir el fichero monolitico. SIN
   CAPA a proposito -- se mantiene la misma prioridad de cascada que tenia
   dentro de catalogo.css (nunca tuvo capa), asi que mover estas reglas aqui
   no cambia que gana frente a que en ningun conflicto de especificidad
   existente. Cargado justo despues de catalogo.css en base.html para
   conservar el mismo orden relativo (reglas generales primero, estas
   despues), igual que estaban fisicamente despues en el fichero original en
   la mayoria de los casos.
   ============================================================================ */

.cat-placeholder {
  position: relative;
  display: grid;
  place-items: center;
  background:
    repeating-linear-gradient(135deg, transparent 0 10px, rgb(255 255 255 / 7%) 10px 11px),
    linear-gradient(145deg, #dcd2c3, #b9aa94);
}

.cat-placeholder--personas {
  background:
    radial-gradient(circle at 50% 38%, #d5c4a6 0 16%, transparent 16.5%),
    radial-gradient(ellipse at 50% 105%, #a38662 0 42%, transparent 42.5%),
    #eee5d6;
}

.cat-placeholder--lugares {
  background:
    radial-gradient(circle at 68% 35%, rgb(255 255 255 / 30%) 0 7%, transparent 7.5%),
    linear-gradient(165deg, #8ba6a4 0 42%, #d4c49b 42% 62%, #778f70 62%);
}

.cat-placeholder--publicaciones {
  background:
    repeating-linear-gradient(0deg, #e6dccb 0 7px, #d2c5b1 7px 8px);
}

.cat-placeholder--audiovisuales {
  background: linear-gradient(145deg, #365e72, #162f3b);
}

.cat-placeholder__mark {
  display: grid;
  width: 4rem;
  height: 4rem;
  place-items: center;
  border: 1px solid rgb(255 255 255 / 55%);
  border-radius: 50%;
  color: #fff;
  font-family: var(--cat-serif);
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-shadow: 0 1px 8px rgb(0 0 0 / 30%);
}

.cat-viewer__stage--empty .cat-placeholder__mark {
  background: var(--cat-blue);
}

/* Patrones por materia para "todavía sin digitalizar", reutilizando los
   fondos ya definidos en .cat-placeholder--*. Se repiten aquí en vez de
   depender de la clase .cat-placeholder porque .cat-viewer__stage define su
   propio fondo a cuadros más abajo en este mismo archivo y lo pisaría. */

.cat-viewer__stage--empty.cat-placeholder--personas {
  background:
    radial-gradient(circle at 50% 38%, #d5c4a6 0 16%, transparent 16.5%),
    radial-gradient(ellipse at 50% 105%, #a38662 0 42%, transparent 42.5%),
    #eee5d6;
}

.cat-viewer__stage--empty.cat-placeholder--lugares {
  background:
    radial-gradient(circle at 68% 35%, rgb(255 255 255 / 30%) 0 7%, transparent 7.5%),
    linear-gradient(165deg, #8ba6a4 0 42%, #d4c49b 42% 62%, #778f70 62%);
}

.cat-viewer__stage--empty.cat-placeholder--publicaciones {
  background: repeating-linear-gradient(0deg, #e6dccb 0 7px, #d2c5b1 7px 8px);
}

.cat-viewer__stage--empty.cat-placeholder--audiovisuales {
  background: linear-gradient(145deg, #365e72, #162f3b);
}

.cat-viewer__stage--empty.cat-placeholder--audiovisuales strong,
.cat-viewer__stage--empty.cat-placeholder--audiovisuales p {
  color: #fff;
}

.cat-authority-profile,
.cat-place-profile,
.cat-periodical-profile {
  margin-bottom: 3.5rem;
  background: rgb(255 253 248 / 72%);
  border: 1px solid var(--cat-line);
  box-shadow: 0 18px 44px rgb(26 47 57 / 8%);
}

.cat-authority-portrait figcaption,
.cat-place-emblem figcaption {
  margin-top: .55rem;
  color: var(--cat-ink-soft);
  font-size: .7rem;
  line-height: 1.4;
}

.cat-place-profile {
  overflow: hidden;
}

.cat-place-profile__identity {
  display: grid;
  grid-template-columns: minmax(190px, 280px) minmax(0, 1fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center;
  padding: clamp(1.4rem, 4vw, 3rem);
}

.cat-place-emblem {
  display: grid;
  justify-items: center;
  margin: 0;
  padding: 1.4rem;
  background: #f4f0e7;
  border: 1px solid var(--cat-line);
}

.cat-place-emblem img {
  width: 100%;
  max-width: 190px;
  max-height: 230px;
  object-fit: contain;
}

.cat-place-emblem__fallback {
  display: grid;
  width: 150px;
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid var(--cat-line);
  border-radius: 50%;
  color: var(--cat-red-deep);
  font: 700 4rem var(--cat-serif);
}

.cat-place-summary {
  max-width: 54rem;
  margin: .3rem 0 1.4rem;
  color: var(--cat-blue-deep);
  font: 1.35rem/1.5 var(--cat-serif);
}

.cat-place-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--cat-line);
  border-left: 1px solid var(--cat-line);
}

.cat-place-facts div {
  min-height: 78px;
  padding: .7rem .8rem;
  border-right: 1px solid var(--cat-line);
  border-bottom: 1px solid var(--cat-line);
}

.cat-place-facts dt {
  color: var(--cat-ink-soft);
  /* .65rem (10.4px) es la alerta "Very small text" que marca WAVE en la
     ficha de lugar (Tipo, Provincia, Comarca...). El contraste ya era
     correcto (var(--cat-ink-soft): 7.90:1); solo faltaba subir el tamaño. */
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.cat-place-facts dd {
  margin: .2rem 0 0;
  color: var(--cat-blue-deep);
  font-weight: 700;
}

.cat-place-same-region {
  margin: .9rem 0 0;
  color: var(--cat-ink-soft);
  font-size: .9rem;
}

.cat-place-same-region a {
  color: var(--cat-blue-deep);
  text-decoration: underline;
}

.cat-place-map {
  border-top: 1px solid var(--cat-line);
}

.cat-place-map iframe {
  display: block;
  width: 100%;
  height: 320px;
  border: 0;
}

.cat-place-map > div {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem 1.4rem;
  justify-content: space-between;
  padding: .75rem 1rem;
  background: var(--cat-blue-deep);
  color: #dce7eb;
  font-size: .72rem;
}

.cat-place-map a {
  color: #fff;
}

@media (max-width: 980px) {
.cat-place-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
.cat-authority-profile--person,
  .cat-place-profile__identity {
    grid-template-columns: 1fr;
  }
.cat-identity-grid,
  .cat-place-facts,
  .cat-periodical-stats {
    grid-template-columns: 1fr;
  }
.cat-place-map iframe {
    height: 260px;
  }
}

.cat-place-symbols {
  display: grid;
  grid-template-columns: minmax(130px, 0.8fr) minmax(150px, 1.2fr);
  align-items: stretch;
  gap: 0.85rem;
}

.cat-place-symbols .cat-place-emblem {
  min-width: 0;
  padding: 1.15rem;
  border: 1px solid #d8cfbf;
  background: #fbf8f1;
}

.cat-place-symbols .cat-place-emblem img {
  width: 100%;
  height: 170px;
  object-fit: contain;
}

.cat-place-symbols .cat-place-emblem--flag img {
  height: 145px;
}

.cat-place-symbols figcaption {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  margin-top: 0.8rem;
  color: #66717b;
  font-size: 0.76rem;
  line-height: 1.35;
}

.cat-place-symbols figcaption strong {
  color: #173a4b;
  font-size: 0.72rem;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.cat-authority-directory,
.cat-territory-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1rem;
}

.cat-authority-directory__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 36px rgba(25, 43, 51, 0.12);
}

/* Alineado al lenguaje visual de cat-card (catalogo-componentes.css):
   filete dorado arriba, radio, fondo degradado crema y sombra al hover.
   No se sustituye por cat-card porque la estructura es distinta (escudo +
   bandera + fila de datos en pildoras, que cat-card no tiene) -- ver
   docs/THEME-ARCA.md. */
.cat-territory-grid > a {
  display: grid;
  grid-template-columns: 92px 1fr;
  grid-template-rows: auto auto 1fr auto auto;
  column-gap: 1rem;
  min-height: 220px;
  padding: 1.1rem;
  border: 1px solid var(--cat-line);
  border-top: 3px solid var(--cat-gold);
  border-radius: 8px;
  background: linear-gradient(180deg, var(--cat-surface), #f7f2e6);
  color: inherit;
  text-decoration: none;
  box-shadow: 0 2px 8px rgb(21 37 46 / 7%);
  transition: transform .18s ease, box-shadow .18s ease, border-top-color .18s ease;
}

.cat-territory-grid > a:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgb(18 46 59 / 16%);
}

.cat-territory-grid__symbol {
  grid-row: 1 / 6;
  display: grid;
  width: 92px;
  height: 118px;
  place-items: center;
  background: #f2ecdf;
  color: #173a4b;
  font: 600 2.6rem "Source Serif 4", serif;
}

.cat-territory-grid__symbol img { width: 100%; height: 100%; object-fit: contain; }

.cat-territory-grid__symbol .cat-territory-grid__flag {
  width: 72px;
  height: 38px;
  margin-top: 0.45rem;
  border: 1px solid rgba(23, 58, 75, 0.16);
  background: #fff;
}

.cat-territory-grid__symbol:has(.cat-territory-grid__flag) {
  height: 164px;
  padding: 0.35rem;
}

.cat-territory-grid__facts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0.7rem 0;
  color: #596b73;
  font-size: 0.76rem;
}

.cat-territory-grid__facts span {
  padding: 0.24rem 0.48rem;
  border: 1px solid #ddd3c3;
  background: #f8f4ec;
}

.cat-territory-grid > .cat-territory-grid__featured {
  border: 2px solid #b4852f;
  background: linear-gradient(135deg, #fffdf7, #f8f0dc);
}

.cat-territory-grid small { color: #8d2631; font-weight: 700; text-transform: uppercase; }

.cat-territory-grid strong { color: #173a4b; font: 600 var(--cat2-text-3) "Source Serif 4", serif; }

.cat-territory-grid em { color: #75664c; font-size: 0.72rem; font-style: normal; font-weight: 700; }

@media (max-width: 850px) {
.cat-place-symbols,
  .cat-time-compare__toolbar,
  .cat-biography__hero,
  .cat-biography__body,
  .cat-story__intro,
  .cat-story__gallery {
    grid-template-columns: 1fr;
  }
}

.cat-periodical-context dt,
.cat-directory-search label,
.cat-place-people-search label {
  color: #8d2631;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.cat-place-people-search,
.cat-directory-search {
  padding: 1.15rem;
  border: 1px solid #d8cbb6;
  background: #f8f3e8;
}

.cat-place-people-search > div,
.cat-directory-search > div { display: flex; gap: 0.6rem; margin-top: 0.55rem; }

.cat-place-people-search input,
.cat-directory-search input {
  min-width: 0;
  flex: 1;
  padding: 0.8rem 0.9rem;
  border: 1px solid #b7aa96;
  background: #fff;
  font: inherit;
}

.cat-place-people-search button,
.cat-directory-search button {
  padding: 0.8rem 1.2rem;
  border: 0;
  background: #173e4d;
  color: #fff;
  font-weight: 750;
  cursor: pointer;
}

.cat-population-chart {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  gap: 2rem;
  align-items: center;
  margin-top: 1rem;
}

.cat-population-chart__canvas {
  min-width: 0;
  padding: 1rem 0 0;
  background: #fffdf8;
  border-bottom: 3px solid #173e4d;
}

.cat-population-chart svg { display: block; width: 100%; height: auto; }

.cat-population-chart__summary {
  display: grid;
  gap: 1rem;
  padding: 1.5rem;
  border-top: 4px solid #d6a12e;
  background: #173e4d;
  color: #fff;
}

.cat-population-chart__summary strong { font: 600 var(--cat2-text-4)/1.2 "Source Serif 4", serif; }

.cat-population-chart__summary span { color: #d8e2e5; line-height: 1.55; }

.cat-territory-note {
  align-self: start;
  padding: 2rem;
  background: #173e4d;
  color: #fff;
  box-shadow: 14px 14px 0 #d6a12e;
}

.cat-territory-note .cat-eyebrow { color: #e3b74d; }

.cat-territory-note blockquote { margin: 1rem 0 2rem; font: 500 1.25rem/1.65 "Source Serif 4", serif; }

.cat-territory-note > div > span { color: #b7c6cb; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.1em; }

.cat-territory-note em { display: inline-block; margin: 0.6rem 0.4rem 0 0; padding: 0.35rem 0.6rem; border: 1px solid #66808a; border-radius: 999px; font-style: normal; }

.cat-territory-note a { display: inline-block; margin: 0.6rem 0.4rem 0 0; padding: 0.35rem 0.6rem; border: 1px solid #66808a; border-radius: 999px; color: #fff; text-decoration: underline; }

@media (max-width: 980px) {
.cat-periodical-context,
  .cat-population-chart,
  .cat-biography--editorial .cat-biography__hero,
  .cat-biography__overview { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
.cat-place-people-search > div,
  .cat-directory-search > div { flex-wrap: wrap; }
.cat-place-people-search input,
  .cat-directory-search input { flex-basis: 100%; }
}

.cat-video-card__body dl,
.cat-place-video dl {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1.25rem;
  margin: auto 0 0;
  padding-top: 1rem;
}

.cat-video-card__body dl div,
.cat-place-video dl div {
  display: grid;
  gap: 0.1rem;
}

.cat-video-card__body dt,
.cat-place-video dt {
  color: #7e1117;
  /* 0.67rem (10.72px) es la alerta "Very small text" de WAVE en el bloque de
     vídeo de la ficha de lugar (Fecha, Procedencia). El contraste efectivo
     (dorado #f0c65a sobre #173f4e) ya daba ~7:1; solo faltaba el tamaño. */
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.cat-video-card__body dd,
.cat-place-video dd {
  margin: 0;
  font-size: 0.86rem;
}

.cat-video-player video,
.cat-place-video video {
  display: block;
  width: 100%;
  max-height: min(72vh, 48rem);
  background: #102f3b;
}

.cat-place-video {
  display: grid;
  grid-template-columns: minmax(18rem, 34%) minmax(0, 1fr);
  gap: 0;
  margin: 2.4rem 0;
  overflow: hidden;
  border: 1px solid var(--line, #d8cfbd);
  background: #173f4e;
  box-shadow: 0 18px 42px rgba(18, 44, 54, 0.1);
}

.cat-place-video__copy {
  display: flex;
  flex-direction: column;
  padding: clamp(1.4rem, 3vw, 2.5rem);
  color: #eef5f4;
}

.cat-place-video__copy .cat-kicker {
  color: #f0c65a;
}

/* Tamaño pedido explicitamente: clamp hasta 2.65rem quedaba demasiado
   grande en movil. */
.cat-place-video__copy h2 {
  margin: 0.25rem 0 0.8rem;
  color: #fff;
  font-size: 1.5rem;
}

.cat-place-video__copy > p:not(.cat-kicker) {
  line-height: 1.65;
}

.cat-place-video__copy dt {
  color: #f0c65a;
}

.cat-place-video__copy .cat-text-link {
  align-self: flex-start;
  margin-top: 1.25rem;
  color: #fff;
}

.cat-place-video video {
  min-height: 25rem;
  object-fit: contain;
}

@media (max-width: 1050px) {
.cat-place-video {
    grid-template-columns: 1fr;
  }
.cat-place-video video {
    min-height: 0;
  }
}

.cat-sidebar a:hover,
.cat-hero__archive a:hover,
.cat-footer a:hover,
.cat-feature-hero a:hover,
.cat-story__hero a:hover,
.cat-territory-note a:hover,
.cat-record-facts a:hover,
.cat-place-map a:hover,
.cat-subhome-actions a:hover,
.cat-population-chart__summary a:hover,
.cat-place-video a:hover,
.cat-video-metadata a:hover,
.cat-video-player figcaption a:hover {
  color: #ffe08a;
}

.cat-place-symbols__pending {
  display: grid;
  min-width: min(100%, 260px);
  max-width: 320px;
  align-content: center;
  justify-items: start;
  padding: 1.4rem;
  border: 1px dashed #aa9b83;
  background: #f4f0e7;
}

.cat-place-symbols__pending > span {
  color: #9b6a24;
  font-size: 1.8rem;
}

.cat-place-symbols__pending strong {
  margin-top: .35rem;
  color: #173e4d;
  font: 650 1.05rem var(--cat-serif);
}

.cat-place-symbols__pending p {
  margin: .35rem 0 0;
  color: var(--cat-ink-soft);
  font-size: .82rem;
  line-height: 1.45;
}

.cat-place-links {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  align-items: center;
  margin-top: 1rem;
}

.cat-place-links a,
.cat-place-links span {
  display: inline-flex;
  padding: .38rem .72rem;
  border: 1px solid rgb(255 255 255 / 55%);
  border-radius: 999px;
  color: #fff;
  font-size: .82rem;
  font-weight: 750;
  text-decoration: none;
}

.cat-place-links a:hover {
  border-color: #ffd66d;
  background: #ffd66d;
  color: #132832;
}

.cat-place-links--light {
  margin: 1rem 0 2rem;
  padding: 1rem;
  border-block: 1px solid var(--cat-line);
}

.cat-place-links--light a,
.cat-place-links--light span {
  border-color: #af9e82;
  color: #173e4d;
}

.cat-place-links--light a:hover {
  color: #132832;
}

.cat-population-chart__canvas {
  position: relative;
}

.cat-population-compare {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem 1rem;
  align-items: center;
  margin: 1.2rem 0 .4rem;
  padding: 1rem;
  border: 1px solid #d6cab7;
  background: #f3ede2;
}

.cat-population-compare label {
  color: #6f151e;
  font-weight: 850;
}

/* Bug real medido en vivo (Fase 7 de este plan, ver docs/THEME-ARCA.md):
   40.78px de alto, por debajo del minimo tactil de 44px que exige el
   catalogo de componentes aprobado para controles de accion. */
.cat-population-compare select {
  min-width: min(100%, 280px);
  min-height: 44px;
  padding: .5rem 2.3rem .5rem .8rem;
  border: 1px solid #7d8b90;
  border-radius: 2px;
  background: #fff;
  color: #173e4d;
  font: 700 .9rem var(--cat-sans);
}

.cat-population-compare p {
  margin: 0 0 0 auto;
  color: #596b73;
  font-size: .8rem;
}

.cat-population-historical-key {
  display: flex;
  gap: .7rem;
  align-items: center;
  margin: .8rem 0 0;
  color: #5b4a35;
  font-size: .82rem;
}

.cat-population-historical-key i {
  flex: 0 0 38px;
  border-top: 3px dashed #9d2732;
}

.cat-population-chart__legend {
  display: grid;
  gap: .5rem;
  padding-bottom: .9rem;
  border-bottom: 1px solid rgb(255 255 255 / 25%);
}

.cat-population-chart__legend span {
  display: flex;
  gap: .55rem;
  align-items: center;
  color: #fff;
  font-weight: 750;
}

/* El atributo hidden nativo tiene menos especificidad que la regla anterior
   y quedaba pisado: la leyenda de comparación se veía siempre, vacía y sin
   texto, incluso con "Sin comparación" seleccionado. */

.cat-population-chart__legend span[hidden] {
  display: none;
}

.cat-population-chart__legend i {
  width: 30px;
  height: 4px;
  background: #9d2732;
}

.cat-population-chart__legend span:nth-child(2) i {
  height: 0;
  border-top: 4px dashed #69c3df;
  background: transparent;
}

@media (max-width: 900px) {
.cat-population-chart {
    grid-template-columns: 1fr;
  }
.cat-population-compare p {
    flex-basis: 100%;
    margin-left: 0;
  }
}

/* Relato cartográfico: Salvatierra de Tormes en tres leguas. */

/* Bug real de desbordamiento horizontal en movil (313px de exceso,
   confirmado con getBoundingClientRect): sin grid-template-columns, el
   track implicito de este grid se dimensiona al contenido MAS ANCHO de
   cualquiera de sus secciones (transcripcion/bibliografia/tabla), y esa
   anchura se propaga a TODOS los items de la columna -- incluida la
   cabecera, que en si misma no tiene ningun contenido que la justifique.
   minmax(0,1fr) fuerza el track a no crecer mas alla del contenedor;
   el contenido que de verdad necesite mas espacio debe resolverlo con su
   propio overflow-x, no estirando la pagina entera. */
.cat-map-story {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(3rem, 6vw, 6rem);
}

.cat-map-story__hero {
  position: relative;
  min-height: min(72vh, 720px);
  overflow: hidden;
  background: var(--cat-blue-deep);
  color: #fff;
}

.cat-map-story__hero > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: sepia(.22) saturate(.8) contrast(1.08);
}

.cat-map-story__hero::after {
  position: absolute;
  inset: 0;
  content: "";
  background:
    linear-gradient(90deg, rgba(7, 30, 46, .96) 0%, rgba(7, 30, 46, .82) 42%, rgba(7, 30, 46, .18) 78%),
    linear-gradient(0deg, rgba(7, 30, 46, .62), transparent 50%);
}

.cat-map-story__hero-copy {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: min(780px, 70%);
  min-height: min(72vh, 720px);
  padding: clamp(2rem, 5vw, 5rem);
}

.cat-map-story__hero-copy h1 {
  max-width: 12ch;
  margin: .3rem 0 1rem;
  color: #fff;
  font-size: clamp(3rem, 7vw, 7rem);
  /* line-height:.92 se pensaba para títulos cortos de 1-2 líneas. El título
     real de este destacado («Salvatierra de Tormes en tres leguas», 37
     caracteres) parte a 3 líneas con max-width:12ch y a .92 las líneas se
     tocaban entre sí, en escritorio y en móvil. 1.04 mantiene el aspecto
     ajustado del titular editorial sin que las líneas se solapen. */
  line-height: 1.04;
}

.cat-map-story__hero-copy > p:not(.cat-kicker, .cat-review-state) {
  max-width: 56ch;
  font-size: clamp(1.05rem, 1.7vw, 1.35rem);
  line-height: 1.65;
}

.cat-map-story__hero .cat-kicker {
  color: #ffd76d;
}

.cat-map-story__hero .cat-place-links a {
  border-color: rgba(255, 255, 255, .58);
  color: #fff;
  background: rgba(6, 28, 43, .68);
}

.cat-map-story__hero .cat-place-links a:hover,
.cat-map-story__hero .cat-place-links a:focus-visible {
  border-color: #ffd76d;
  color: var(--cat-blue-deep);
  background: #ffd76d;
}

.cat-map-story__lead {
  display: grid;
  grid-template-columns: minmax(280px, .8fr) minmax(360px, 1.2fr);
  gap: clamp(2rem, 6vw, 7rem);
  align-items: start;
  padding-inline: clamp(1rem, 3vw, 3rem);
}

.cat-map-story__lead h2,
.cat-map-story__people h2,
.cat-source-panel h2 {
  margin: .35rem 0 0;
  font-size: clamp(2.2rem, 4.5vw, 4.7rem);
  line-height: 1.02;
}

.cat-map-story__lead > div:last-child {
  font-family: var(--cat-serif);
  font-size: clamp(1.1rem, 1.7vw, 1.35rem);
  line-height: 1.85;
}

.cat-map-sheet-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.cat-map-sheet,
.cat-facsimile-grid figure {
  margin: 0;
  border: 1px solid var(--cat-line);
  background: #fffdf8;
}

.cat-map-sheet a,
.cat-facsimile-grid a {
  position: relative;
  display: block;
  overflow: hidden;
  color: #fff;
  background: var(--cat-blue-deep);
}

.cat-map-sheet img {
  display: block;
  width: 100%;
  height: clamp(360px, 42vw, 650px);
  object-fit: contain;
  background: #e9e0cf;
  transition: transform .35s ease;
}

.cat-map-sheet a > span,
.cat-facsimile-grid a > span {
  position: absolute;
  right: .8rem;
  bottom: .8rem;
  padding: .55rem .7rem;
  background: rgba(9, 37, 55, .94);
  color: #fff;
  font-size: .78rem;
  font-weight: 700;
}

.cat-map-sheet a:hover img,
.cat-map-sheet a:focus-visible img,
.cat-facsimile-grid a:hover img,
.cat-facsimile-grid a:focus-visible img {
  transform: scale(1.025);
}

.cat-map-sheet figcaption,
.cat-facsimile-grid figcaption {
  padding: .9rem 1rem;
  font-family: var(--cat-serif);
  font-size: 1rem;
}

.cat-map-story__people {
  display: grid;
  grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr);
  gap: clamp(2rem, 5vw, 5rem);
  padding: clamp(2rem, 5vw, 5rem);
  background: #173d4e;
  color: #fff;
}

.cat-map-story__people h2,
.cat-map-story__people .cat-kicker {
  color: #fff;
}

.cat-map-story__person-grid {
  display: grid;
  gap: .75rem;
}

.cat-map-story__person-grid > a,
.cat-map-story__person-grid > article {
  display: grid;
  grid-template-columns: 82px 1fr;
  gap: 1rem;
  min-height: 104px;
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, .24);
  color: #fff;
  background: rgba(255, 255, 255, .06);
}

.cat-map-story__person-grid > article {
  grid-template-columns: 1fr;
}

.cat-map-story__person-grid > a:hover,
.cat-map-story__person-grid > a:focus-visible {
  border-color: #ffd76d;
  color: var(--cat-blue-deep);
  background: #ffd76d;
}

.cat-map-story__person-grid img {
  width: 82px;
  height: 82px;
  object-fit: cover;
}

.cat-map-story__person-grid span,
.cat-map-story__person-grid article {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.cat-map-story__person-grid strong {
  font-family: var(--cat-serif);
  font-size: 1.35rem;
}

.cat-map-story__person-grid small {
  margin-bottom: .3rem;
  color: inherit;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.cat-map-story__person-grid p {
  margin: .35rem 0 0;
  line-height: 1.55;
}

@media (max-width: 760px) {
.cat-map-story__hero-copy {
    width: auto;
  }
/* Pieza editorial deliberadamente mayor que el resto de cabeceras del
   sitio (decision del propietario: se mantiene la escala grande, no se
   unifica a .cat-hero) -- pero no tenia NINGUN ajuste de movil: el
   clamp(3rem,7vw,7rem) de escritorio se resolvia a su minimo fijo, 3rem
   (48px), sin bajar mas por estrecho que fuera el viewport. Aqui se le
   da un tramo propio para movil: sigue siendo mayor que el titular
   estandar (44px), pero no se queda plantado en 48px en un telefono de
   320px. */
.cat-map-story__hero-copy h1 {
    font-size: clamp(2.2rem, 9vw, 3rem);
    line-height: 1.08;
  }
.cat-map-story__hero::after {
    background: linear-gradient(0deg, rgba(7, 30, 46, .98), rgba(7, 30, 46, .38));
  }
.cat-map-story__lead,
  .cat-map-story__people,
  .cat-source-panel,
  .cat-map-sheet-grid {
    grid-template-columns: 1fr;
  }
}

/* Transcripción completa del mapa de tres leguas. */

.cat-map-story .cat-transcription {
  display: block;
  max-height: none;
  overflow: visible;
  padding: 0;
  border: 0;
  border-top: 4px solid var(--cat-red);
  background: #fffdf8;
  box-shadow: var(--cat-shadow);
}

.cat-map-story .cat-transcription details {
  border-bottom: 1px solid var(--cat-line);
}

.cat-map-story .cat-transcription summary {
  display: flex;
  gap: 1.5rem;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem clamp(1.5rem, 4vw, 3.5rem);
  cursor: pointer;
  list-style: none;
  background: #173d4e;
  color: #fff;
}

.cat-map-story .cat-transcription summary::-webkit-details-marker {
  display: none;
}

.cat-map-story .cat-transcription footer {
  display: flex;
  gap: .8rem 2rem;
  justify-content: space-between;
  padding: 1rem clamp(1.5rem, 4vw, 3.5rem);
  background: #f5eedf;
  color: var(--cat-ink-soft);
  font-size: .78rem;
}

@media (max-width: 680px) {
.cat-map-story .cat-transcription summary,
  .cat-map-story .cat-transcription footer {
    align-items: flex-start;
    flex-direction: column;
  }
}

.cat-territory-reading-hero {
  margin-bottom: 1.25rem;
  padding: clamp(1.5rem, 5vw, 4rem);
  color: #fff;
  background: linear-gradient(120deg, #102f3c, #1f4d5d);
}

.cat-territory-reading-hero h1 { max-width: 14ch; margin: .2rem 0 .8rem; color: #fff; font-size: clamp(2rem, 4vw, 3.6rem); line-height: 1.05; }

.cat-territory-reading-hero > p:not(.cat-kicker) { max-width: 58rem; color: #e1eaeb; font-size: clamp(1.05rem, 2vw, 1.3rem); line-height: 1.6; }

.cat-territory-reading-hero .cat-kicker { color: #f0d18c; }

.cat-territory-reading-choices { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.5rem; }

.cat-territory-reading-choices a { padding: .65rem .9rem; border: 1px solid rgb(255 255 255 / 45%); color: #fff; font-weight: 800; text-decoration: none; }

.cat-territory-reading-choices a[aria-current="page"], .cat-territory-reading-choices a:hover, .cat-territory-reading-choices a:focus-visible { color: var(--cat-blue-deep); background: #f0d18c; outline: none; }

.cat-territory-reading-summary { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); gap: 2rem; margin-bottom: 1.25rem; padding: clamp(1.25rem, 3vw, 2.5rem); border: 1px solid var(--cat-line); background: #fffdf8; }

.cat-territory-reading-summary h2 { margin: .15rem 0 .6rem; font-size: clamp(2rem, 4vw, 3.5rem); }

.cat-territory-reading-summary p { max-width: 48rem; margin: 0; color: var(--cat-ink-soft); }

.cat-territory-reading-summary dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-content: center; margin: 0; }

.cat-territory-reading-summary dl div { padding: .7rem; border-left: 1px solid var(--cat-line); }

.cat-territory-reading-summary dt { color: var(--cat-red-deep); font: clamp(1.8rem, 3vw, 3rem)/1 var(--cat-serif); }

.cat-territory-reading-summary dd { margin: .3rem 0 0; font-size: .76rem; line-height: 1.35; }

.cat-territory-reading-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-bottom: 2.5rem; }

.cat-territory-reading-card { display: flex; flex-direction: column; min-height: 100%; padding: 1.5rem; border: 1px solid var(--cat-line); border-top: 4px solid var(--cat-gold); background: #fffdf8; }

.cat-territory-reading-card--water { border-top-color: var(--cat-blue-deep); background: #eef4f3; }

.cat-territory-reading-card h3 { margin: .15rem 0 .65rem; font-size: clamp(1.65rem, 2.5vw, 2.3rem); line-height: 1.05; }

.cat-territory-reading-card > p:not(.cat-kicker) { color: var(--cat-ink-soft); line-height: 1.58; }

.cat-territory-reading-card dl { margin: 1rem 0 auto; }

.cat-territory-reading-card dl div { padding: .7rem 0; border-top: 1px solid var(--cat-line); }

.cat-territory-reading-card dt { margin-bottom: .2rem; color: var(--cat-red-deep); font: 800 .69rem/1.3 var(--cat-sans); letter-spacing: .08em; text-transform: uppercase; }

.cat-territory-reading-card dd { margin: 0; color: var(--cat-ink-soft); font-size: .9rem; line-height: 1.45; }

.cat-territory-reading-card__actions { display: flex; flex-wrap: wrap; gap: .65rem 1rem; margin: 1.25rem 0 0 !important; }

.cat-territory-reading-card__actions a { color: var(--cat-red-deep); font-weight: 800; }

.cat-territory-reading-method { margin-bottom: 2.5rem; padding: clamp(1.25rem, 3vw, 2.5rem); border-left: 5px solid var(--cat-blue-deep); background: #f1eee6; }

.cat-territory-reading-method h2 { margin: .2rem 0 1rem; font-size: clamp(1.8rem, 3vw, 2.8rem); }

.cat-territory-reading-method ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; padding: 0; list-style-position: inside; }

.cat-territory-reading-method li { color: var(--cat-ink-soft); line-height: 1.55; }

.cat-territory-reading-method li strong { color: var(--cat-ink); }

@media (max-width: 800px) {
.cat-data-jury > div, .cat-territory-reading-grid, .cat-territory-reading-method ol { grid-template-columns: 1fr; }
.cat-territory-reading-summary { grid-template-columns: 1fr; gap: 1.25rem; }
}

@media (max-width: 520px) {
.cat-territory-reading-summary dl { grid-template-columns: 1fr; }
.cat-territory-reading-summary dl div { border-top: 1px solid var(--cat-line); border-left: 0; }
}

/* ---- catalogo-personas.css ---- */
/* ARCA del Tormes -- catalogo.css dividido en ficheros manejables.
   ============================================================================
   Bloque: Personas y autoridades (cat-person-*, cat-biography-*, cat-authority-*, cat-registered-*).
   Extraido mecanicamente de catalogo.css (script de particion por prefijo de
   clase real, no reescrito a mano) para reducir el fichero monolitico. SIN
   CAPA a proposito -- se mantiene la misma prioridad de cascada que tenia
   dentro de catalogo.css (nunca tuvo capa), asi que mover estas reglas aqui
   no cambia que gana frente a que en ningun conflicto de especificidad
   existente. Cargado justo despues de catalogo.css en base.html para
   conservar el mismo orden relativo (reglas generales primero, estas
   despues), igual que estaban fisicamente despues en el fichero original en
   la mayoria de los casos.
   ============================================================================ */

.cat-person-results {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--cat-line);
}

.cat-person-results > a {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: .9rem;
  align-items: center;
  min-height: 86px;
  padding: .85rem 1rem;
  border-right: 1px solid var(--cat-line);
  border-bottom: 1px solid var(--cat-line);
  color: var(--cat-ink);
  text-decoration: none;
}

.cat-person-results > a:hover {
  background: var(--cat-surface);
}

.cat-person-results__portrait {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 50%;
  background: #e5d8c1;
  color: var(--cat-red-deep);
  font: 700 1.15rem var(--cat-serif);
}

.cat-person-results strong,
.cat-person-results small {
  display: block;
}

.cat-person-results strong {
  font: 600 1.15rem var(--cat-serif);
}

.cat-person-results small {
  margin-top: .2rem;
  color: var(--cat-ink-soft);
}

.cat-person-results em {
  color: var(--cat-ink-soft);
  font-size: .75rem;
  font-style: normal;
  text-align: right;
}

@media (max-width: 680px) {
.cat-resource-grid,
  .cat-collection-grid,
  .cat-series-grid,
  .cat-media-strip,
  .cat-relations,
  .cat-person-results,
  .cat-subhome-actions,
  .cat-digital-grid {
    grid-template-columns: 1fr;
  }
.cat-person-results > a {
    grid-template-columns: 48px 1fr;
  }
.cat-person-results em {
    grid-column: 2;
    text-align: left;
  }
}

.cat-authority-profile--person {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: stretch;
  padding: clamp(1.15rem, 3vw, 2rem);
}

/* Misma regla que catalogo-ficha-lugar.css @media(max-width:680px), repetida
   aqui a proposito: esta hoja se carga despues en base.html, asi que su
   regla base (sin media query) gana el empate de especificidad sobre la
   regla responsive del otro archivo aunque esa media query este activa.
   Los 210px fijos de la primera columna no caben en movil y truncan el
   texto de la segunda columna (visto en produccion en viewport de 320px,
   ficha de persona). Duplicar la regla en el mismo archivo evita depender
   del orden de <link> entre hojas de estilo. */
@media (max-width: 680px) {
  .cat-authority-profile--person {
    grid-template-columns: 1fr;
  }
}

.cat-authority-portrait {
  display: grid;
  align-content: start;
  margin: 0;
}

.cat-authority-portrait img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border: 1px solid #c9bda8;
  filter: saturate(.72) contrast(.96);
}

.cat-authority-profile__body {
  min-width: 0;
}

@media (max-width: 680px) {
.cat-authority-portrait {
    max-width: 170px;
  }
}

.cat-editorial-header h1,
.cat-biography h1,
.cat-story h1 {
  margin: 0.35rem 0 1rem;
  color: #112f4e;
  font-family: "Source Serif 4", Georgia, serif;
  font-size: clamp(2.8rem, 6vw, 5.4rem);
  font-weight: 600;
  letter-spacing: -0.045em;
  line-height: 0.96;
}

.cat-authority-canonical {
  margin: 0 0 0.65rem;
  color: #173a4b;
  font-family: "Source Serif 4", Georgia, serif;
  font-size: 1.8rem;
}

.cat-authority-canonical small {
  color: #7e3036;
  font-family: "Atkinson Hyperlegible", sans-serif;
  font-size: 0.88rem;
  font-weight: 700;
}

/* Variante "persona" de cat-card (catalogo aprobado: fila horizontal con
   avatar circular, no tarjeta con filete superior). Colores hardcoded ->
   tokens del sitio, y el hover pasa de rojo a dorado (acento del
   catalogo) en vez de un rojo propio de esta pieza. */
.cat-person-card {
  display: grid;
  grid-template-columns: 42px 1fr auto;
  gap: 0.7rem;
  align-items: center;
  min-height: 66px;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--cat-line);
  color: inherit;
  text-decoration: none;
}

.cat-person-card:hover { border-color: var(--cat-gold); background: #fffaf2; }

.cat-person-card__avatar {
  display: grid;
  overflow: hidden;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 50%;
  background: var(--cat-blue-deep);
  color: #fff;
  font-family: var(--cat-serif);
}

/* Ampliacion real (no cosmetica): cat-person-card solo soportaba la
   inicial en texto. .cat-occupation-people (oficio_detalle.html) tambien
   necesita miniatura real cuando existe -- se añade aqui, no se duplica
   la pieza para dar cabida a una imagen. */
.cat-person-card__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cat-person-card > span:nth-child(2) { display: grid; }

.cat-person-card small { color: var(--cat-ink-soft); }

.cat-person-card em {
  color: var(--cat-red-deep);
  font-size: 0.74rem;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.cat-authority-directory { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.cat-authority-directory__card { grid-template-columns: minmax(88px, 34%) minmax(0, 1fr); }

.cat-authority-directory__copy { padding: .9rem; }

.cat-authority-directory__copy strong { font-size: var(--cat2-text-3); }

.cat-authority-directory__card {
  display: grid;
  grid-template-columns: 120px 1fr;
  min-height: 230px;
  border: 1px solid #d6ccbc;
  background: #fff;
  color: inherit;
  text-decoration: none;
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.cat-authority-directory__portrait {
  display: grid;
  overflow: hidden;
  place-items: center;
  background: #173b49;
  color: #fff;
  font: 600 3rem "Source Serif 4", serif;
}

.cat-authority-directory__portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cat-authority-directory__copy {
  display: flex;
  flex-direction: column;
  padding: 1.15rem;
}

.cat-authority-directory__copy small { color: #8d2631; font-weight: 700; text-transform: uppercase; }

.cat-authority-directory__copy strong { margin: 0.35rem 0 0; color: #173a4b; font: 600 var(--cat2-text-3) "Source Serif 4", serif; }

.cat-authority-directory__copy em { color: #596b73; font-size: 0.83rem; font-style: normal; }

.cat-authority-directory__copy > span { margin-top: 0.8rem; line-height: 1.5; }

.cat-authority-directory__copy mark { margin-top: auto; padding-top: 0.8rem; background: transparent; color: #8a5b0a; font-size: 0.72rem; }

.cat-biography__hero {
  display: grid;
  grid-template-columns: minmax(240px, 340px) minmax(0, 1fr);
  gap: clamp(2rem, 6vw, 5rem);
  align-items: center;
  padding: 1.5rem 0 3.5rem;
}

.cat-biography__hero figure { margin: 0; }

.cat-biography__hero figure > img,
.cat-biography__hero figure > span {
  display: grid;
  width: 100%;
  aspect-ratio: 4 / 5;
  place-items: center;
  object-fit: cover;
  background: #173b49;
  color: #fff;
  font: 600 6rem "Source Serif 4", serif;
}

.cat-biography__hero figcaption { margin-top: 0.5rem; color: #5a6a71; font-size: 0.75rem; }

.cat-biography__dates { color: #8d2631; font-weight: 700; letter-spacing: 0.08em; }

.cat-biography__lead { max-width: 720px; color: #354d58; font-size: 1.15rem; line-height: 1.75; }

.cat-authority-status { display: inline-block; margin: 0.5rem 0 1rem; padding: 0.45rem 0.65rem; border: 1px solid #d7a94f; background: #fff6dc; color: #75500d; font-size: 0.78rem; font-weight: 700; }

.cat-biography__body {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(260px, 0.8fr);
  gap: 2rem;
  padding: 2.2rem;
  background: #f5f0e6;
}

.cat-biography__body h2 { color: #173a4b; font: 600 var(--cat2-text-4) "Source Serif 4", serif; }

.cat-biography__body aside { padding-left: 2rem; border-left: 1px solid #cfc3af; }

.cat-biography__highlights { display: grid; gap: 0.65rem; padding-left: 1.2rem; }

@media (max-width: 850px) {
.cat-biography__body aside { padding: 1.5rem 0 0; border-top: 1px solid #cfc3af; border-left: 0; }
  /* Mismas reglas que catalogo-ficha-lugar.css @media(max-width:850px),
     repetidas aqui a proposito -- mismo bug de cascada documentado en
     CORRECCIONES-RENDIMIENTO-Y-UI-20260906.md S2 (esta hoja se carga
     despues en base.html, su regla base gana el empate de especificidad
     sobre la responsive del otro archivo). */
.cat-biography__hero,
  .cat-biography__body { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
.cat-authority-directory__card { grid-template-columns: 90px 1fr; }
.cat-authority-directory__portrait { min-height: 210px; }
.cat-person-card { grid-template-columns: 42px 1fr; }
.cat-person-card em { grid-column: 2; }
}

.cat-biography--editorial .cat-biography__hero {
  grid-template-columns: minmax(260px, 360px) minmax(0, 1fr);
  gap: clamp(2.5rem, 6vw, 7rem);
  align-items: center;
  padding: clamp(2rem, 4vw, 4.5rem);
  background: linear-gradient(105deg, #f1eadc 0 34%, #fbf8f1 34%);
  border: 1px solid #d7cbb9;
}

.cat-biography--editorial .cat-biography__hero figure > img,
.cat-biography--editorial .cat-biography__hero figure > span {
  width: 100%;
  height: clamp(340px, 43vw, 520px);
  object-fit: cover;
  object-position: top center;
  box-shadow: 18px 18px 0 #173e4d;
}

.cat-biography__identity h1 {
  max-width: 950px;
  margin: 0.35rem 0 0.9rem;
  font-size: clamp(2.1rem, 4vw, 3.8rem);
  line-height: 1.05;
}

.cat-biography__signature {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem 1.4rem;
  align-items: center;
  padding: 0.85rem 0;
  border-block: 1px solid #d6cab7;
}

.cat-biography__signature span { color: #8d2631; font-weight: 850; letter-spacing: 0.08em; }

.cat-biography__signature strong { color: #173e4d; font: 600 var(--cat2-text-2) "Source Serif 4", serif; }

.cat-biography__actions { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; margin-top: 1.4rem; }

.cat-biography__overview {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, 0.7fr);
  gap: clamp(2.5rem, 6vw, 6rem);
  padding: clamp(3rem, 6vw, 6rem) clamp(1rem, 3vw, 3rem);
}

/* Mismas reglas que catalogo-ficha-lugar.css @media(max-width:980px),
   repetidas aqui a proposito -- mismo bug de cascada de S2 en
   CORRECCIONES-RENDIMIENTO-Y-UI-20260906.md. Incluye la variante
   ".cat-biography--editorial .cat-biography__hero" porque esa tambien tiene
   su propia regla base (mas arriba, misma especificidad de 2 clases) en
   este archivo. */
@media (max-width: 980px) {
  .cat-biography--editorial .cat-biography__hero,
  .cat-biography__overview {
    grid-template-columns: 1fr;
  }
}

.cat-biography__overview h2 { margin-top: 0.3rem; font: 600 clamp(2rem, 3.2vw, 3.4rem) "Source Serif 4", serif; }

.cat-biography__timeline { display: grid; gap: 0; margin: 2rem 0 0; padding: 0; list-style: none; border-top: 1px solid #d2c5b1; }

.cat-biography__timeline li { display: grid; grid-template-columns: 70px 1fr; gap: 1rem; padding: 1.25rem 0; border-bottom: 1px solid #d2c5b1; }

.cat-biography__timeline li span { color: #b47b18; font: 700 1.4rem "Source Serif 4", serif; }

.cat-biography__timeline li p { margin: 0; color: #27424e; font-size: 1.05rem; line-height: 1.6; }

@media (max-width: 980px) {
.cat-biography--editorial .cat-biography__hero { background: #fbf8f1; }
.cat-biography--editorial .cat-biography__hero figure { max-width: 420px; }
}

.cat-registered-people { margin: clamp(3rem, 6vw, 5rem) 0; }

.cat-registered-people__search { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; align-items: end; margin: 1.2rem 0; padding: 1rem; border-top: 3px solid var(--cat-blue-deep); background: #ece5d8; }

.cat-registered-people__search label { display: grid; gap: .25rem; }

.cat-registered-people__search label span { font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }

.cat-registered-people__search input { width: 100%; min-height: 44px; padding: .55rem .7rem; border: 1px solid #b9ae9d; border-radius: 0; background: #fff; color: var(--cat-ink); font: inherit; }

.cat-registered-people__search input:focus { border-color: var(--cat-red-deep); outline: 2px solid rgb(142 32 43 / 18%); }

.cat-registered-people__search p { margin: 0; padding: .45rem .7rem; border: 1px solid #cfae70; background: #fbf3e3; color: var(--cat-red-deep); font-weight: 800; white-space: nowrap; }

.cat-registered-people__empty { padding: 2rem; border: 1px dashed var(--cat-line); color: var(--cat-ink-soft); text-align: center; }

.cat-registered-people__alphabet { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; }

.cat-registered-people__letter { min-width: 0; background: transparent; }

.cat-registered-people__letter[open] { grid-column: 1 / -1; }

.cat-registered-people__letter > summary { display: grid; grid-template-columns: 42px minmax(0, 1fr) 28px; gap: .7rem; align-items: center; min-height: 62px; padding: .55rem .8rem; border: 1px solid #c9d1cd; border-left: 4px solid #c9922f; cursor: pointer; list-style: none; background: #e8eeeb; color: var(--cat-blue-deep); clip-path: polygon(0 0, calc(100% - .65rem) 0, 100% 50%, calc(100% - .65rem) 100%, 0 100%); transition: background .2s ease, transform .2s ease; }

.cat-registered-people__letter > summary::-webkit-details-marker { display: none; }

.cat-registered-people__letter > summary strong { font: 650 var(--cat2-text-3) var(--cat-serif); }

.cat-registered-people__letter > summary span { color: var(--cat-ink-soft); font-size: .7rem; font-weight: 800; }

.cat-registered-people__letter > summary i { display: grid; width: 1.45rem; height: 1.45rem; place-items: center; border: 1px solid #c9922f; border-radius: 50%; background: #fff9ee; color: var(--cat-red-deep); font-style: normal; transition: transform .2s ease; }

.cat-registered-people__letter > summary:hover, .cat-registered-people__letter > summary:focus-visible { background: #dce7e3; transform: translateY(-1px); }

.cat-registered-people__letter[open] > summary { background: #d9e4e1; }

.cat-registered-people__letter[open] > summary i { transform: rotate(45deg); }

.cat-registered-people__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }

.cat-registered-people__letter > .cat-registered-people__list { margin-top: .75rem; padding: 1rem; border: 1px solid var(--cat-line); background: #f4efe6; }

.cat-registered-people__list > details { background: transparent; }

.cat-registered-people__list > details > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto 32px; gap: .7rem; align-items: center; min-height: 54px; padding: .78rem 1.2rem .78rem 1rem; border-left: 4px solid #c9922f; cursor: pointer; list-style: none; background: #fffdf8; box-shadow: inset 0 0 0 1px #d8cdbd, 0 5px 12px rgb(25 45 54 / 5%); color: var(--cat-blue-deep); clip-path: polygon(0 0, calc(100% - .9rem) 0, 100% 50%, calc(100% - .9rem) 100%, 0 100%); transition: background .2s ease, box-shadow .2s ease, transform .2s ease; }

.cat-registered-people__list > details > summary::-webkit-details-marker { display: none; }

.cat-registered-people__list > details > summary span { font: 650 var(--cat2-text-2) var(--cat-serif); }

.cat-registered-people__list > details > summary small { color: var(--cat-red-deep); font-size: .65rem; font-weight: 800; }

.cat-registered-people__list > details > summary i { display: grid; width: 1.55rem; height: 1.55rem; place-items: center; border: 1px solid #c9922f; border-radius: 50%; background: #f6eddd; color: var(--cat-red-deep); font-style: normal; transition: transform .2s ease, background .2s ease; }

.cat-registered-people__list > details > summary:hover, .cat-registered-people__list > details > summary:focus-visible { background: #f3ede3; box-shadow: inset 0 0 0 1px #c8b99f, 0 8px 18px rgb(25 45 54 / 9%); transform: translateY(-1px); }

.cat-registered-people__list > details[open] > summary { background: #e8ece9; box-shadow: inset 0 0 0 1px #b8c3c1; }

.cat-registered-people__list > details[open] > summary i { transform: rotate(45deg); }

.cat-registered-people__list > details > div { margin-right: .9rem; padding: 1rem; border: 1px solid var(--cat-line); border-top: 0; background: #fff; }

.cat-registered-people__list > details p { color: var(--cat-ink-soft); }

.cat-registered-people__list > details a { color: var(--cat-red-deep); font-weight: 800; }

.cat-registered-people__notice { padding: .75rem; border-left: 3px solid #c9922f; background: #fbf3e3; }

.cat-registered-people__records { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; }

.cat-registered-people__records a { display: inline-flex; min-height: 44px; align-items: center; padding: .5rem .75rem; border: 1px solid #bda77e; background: #fffaf0; color: var(--cat-red-deep); text-decoration: none; }

.cat-registered-people__records a:hover, .cat-registered-people__records a:focus-visible { border-color: var(--cat-red-deep); background: #f3e6cf; text-decoration: underline; text-underline-offset: .18em; }

@media (max-width: 1050px) {
.cat-authority-directory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cat-registered-people__alphabet { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
.cat-authority-directory, .cat-registered-people__list { grid-template-columns: 1fr; }
.cat-registered-people__alphabet { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 430px) {
.cat-registered-people__alphabet { grid-template-columns: 1fr; }
}

.cat-person-record__hero,
.cat-artwork__hero {
  display: grid;
  grid-template-columns: minmax(260px, 36%) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
  padding: clamp(1.5rem, 4vw, 4rem);
  border: 1px solid var(--cat-line);
  background: var(--cat-surface);
}

.cat-person-record__hero figure,
.cat-artwork__hero figure {
  margin: 0;
}

.cat-person-record__hero figure img {
  width: 100%;
  max-height: 590px;
  object-fit: cover;
  object-position: top;
  box-shadow: 14px 14px 0 #173e4d;
}

.cat-person-record__hero figcaption {
  margin-top: 1rem;
  color: var(--cat-ink-soft);
  font-size: .75rem;
}

.cat-person-record__hero h1,
.cat-artwork__hero h1 {
  margin: .25rem 0 .6rem;
  font-size: clamp(2rem, 4vw, 3.6rem);
  line-height: 1.05;
}

.cat-person-record__dates {
  color: var(--cat-red);
  font-weight: 850;
  letter-spacing: .08em;
}

.cat-person-record__occupation,
.cat-artwork__creator {
  color: #173e4d;
  font: 650 1.35rem var(--cat-serif);
}

.cat-person-record__lead {
  max-width: 54rem;
  font-size: 1.08rem;
  line-height: 1.75;
}

.cat-person-record__facts {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 3rem;
  padding: clamp(2.5rem, 5vw, 5rem);
}

.cat-person-record__facts h2 {
  font: 650 clamp(2rem, 3vw, 3rem) var(--cat-serif);
}

.cat-person-record__facts li {
  margin-block: .7rem;
}

.cat-person-record__facts aside {
  padding: 2rem;
  border-top: 4px solid #d6a12e;
  background: #173e4d;
  color: #fff;
}

.cat-person-record__facts aside .cat-eyebrow {
  color: #f0c65a;
}

.cat-person-record__facts dl,
.cat-artwork__metadata,
.cat-artwork__auction dl {
  display: grid;
  gap: 0;
  margin-top: 1.5rem;
}

.cat-person-record__facts dl div,
.cat-artwork__metadata div,
.cat-artwork__auction dl div {
  display: grid;
  grid-template-columns: minmax(120px, .35fr) minmax(0, 1fr);
  gap: 1rem;
  padding: .7rem 0;
  border-top: 1px solid rgb(255 255 255 / 24%);
}

.cat-person-record__facts dt,
.cat-artwork__metadata dt,
.cat-artwork__auction dt {
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.cat-person-record__facts dd,
.cat-artwork__metadata dd,
.cat-artwork__auction dd {
  margin: 0;
}

.cat-person-record__facts aside dd a {
  color: #fff;
  text-decoration: underline;
}

.cat-person-record__facts aside dd a:hover,
.cat-person-record__facts aside dd a:focus-visible {
  color: #ffe08a;
}

@media (max-width: 850px) {
.cat-person-record__hero,
  .cat-artwork__hero,
  .cat-person-record__facts,
  .cat-artwork__auction {
    grid-template-columns: 1fr;
  }
  /* La rejilla EXTERIOR de arriba colapsa bien, pero cada fila
     etiqueta/valor de dentro (.cat-person-record__facts dl div) es una
     rejilla propia con su propio minmax(120px, ...) -- nadie la tocaba, así
     que a 320px el valor se quedaba con ~8px reales de ancho (comprobado
     con getBoundingClientRect en /personas-reconocidas/nicolas-rodriguez-
     laso/: dt 120px, dd 8px) y el texto se rompía letra a letra. Misma
     rejilla compartida por .cat-artwork__metadata/.cat-artwork__auction dl
     (línea 578 de este fichero), así que se corrige aquí para las tres. */
  .cat-person-record__facts dl div,
  .cat-artwork__metadata div,
  .cat-artwork__auction dl div {
    grid-template-columns: 1fr;
    gap: .25rem;
  }
}

@media (max-width: 480px) {
  /* Con la rejilla ya colapsada (arriba), quedaba un problema aparte: tres
     paddings pensados para escritorio se apilan en el mismo eje horizontal
     -- contenedor de página (16px), .cat-person-record__facts (mínimo real
     2.5rem/40px por el clamp) y el aside oscuro (2rem/32px fijo, sin regla
     de móvil). Comprobado con getBoundingClientRect a 320px: 88px de hueco
     A CADA LADO antes de llegar al texto (176px de 320px, más de la
     mitad), dejando solo 144px de columna útil -- de ahí la sensación de
     "mucho padding, no se ajusta al ancho" pese a que ya no se rompe.
     Se reduce aquí, no en el clamp/valor de escritorio, para no tocar
     cómo se ve en pantallas anchas. */
  .cat-person-record__facts { padding: 1.25rem; }
  .cat-person-record__facts aside { padding: 1.1rem; }
}

@media (max-width: 900px) {
/* `.cat-editorial-header h1` imponía clamp(2.8rem, 6vw, 5.4rem): 44,8px
     como MÍNIMO en móvil, ignorando la regla móvil de `.cat-main h1` por
     empate de especificidad y orden de cascada. Los párrafos de cabecera
     iban a 1,08-1,25rem con interlineado 1,75, lo que multiplicaba los
     saltos de línea en pantallas estrechas. */
.cat-editorial-header h1,
  .cat-biography h1,
  .cat-story h1 {
    font-size: clamp(1.95rem, 8.2vw, 2.6rem);
    letter-spacing: -.025em;
    line-height: 1.1;
  }
}

@media (max-width: 560px) {
.cat-registered-people__search { grid-template-columns: 1fr; align-items: stretch; }
.cat-registered-people__search p { justify-self: start; }
}

/* Ajustes de cierre de maqueta: legibilidad de autoridades, portada y
   evidencias. Se declaran al final para corregir las reglas históricas sin
   alterar la escala de los demás encabezados. */

.cat-biography__identity h1 {
  max-width: 16ch;
  font-size: clamp(2.1rem, 4vw, 3.8rem);
  line-height: 1.05;
}

@media (max-width: 680px) {
.cat-biography--editorial .cat-biography__hero {
    gap: 1.35rem;
    padding: 1.2rem;
  }
.cat-biography--editorial .cat-biography__hero figure {
    max-width: 220px;
  }
.cat-biography--editorial .cat-biography__hero figure > img,
  .cat-biography--editorial .cat-biography__hero figure > span {
    height: auto;
    aspect-ratio: 4 / 5;
  }
.cat-biography__hero figcaption {
    font-size: .72rem;
    line-height: 1.45;
  }
}

/* ---- catalogo-estudios.css ---- */
/* ARCA del Tormes -- catalogo.css dividido en ficheros manejables.
   ============================================================================
   Bloque: Estudios destacados (cat-study-*, cat-hero-*, cat-feature-*, cat-story-*).
   Extraido mecanicamente de catalogo.css (script de particion por prefijo de
   clase real, no reescrito a mano) para reducir el fichero monolitico. SIN
   CAPA a proposito -- se mantiene la misma prioridad de cascada que tenia
   dentro de catalogo.css (nunca tuvo capa), asi que mover estas reglas aqui
   no cambia que gana frente a que en ningun conflicto de especificidad
   existente. Cargado justo despues de catalogo.css en base.html para
   conservar el mismo orden relativo (reglas generales primero, estas
   despues), igual que estaban fisicamente despues en el fichero original en
   la mayoria de los casos.
   ============================================================================ */

.cat-featured__grid {
  display: grid;
  grid-auto-rows: 1fr;
  gap: 1.5rem;
}

.cat-feature-card {
  display: grid;
  grid-template-columns: minmax(240px, .85fr) minmax(0, 1.4fr);
  min-height: 0;
  height: 300px;
  overflow: hidden;
  background: var(--cat-surface);
  border: 1px solid var(--cat-line);
  box-shadow: var(--cat-shadow);
  color: var(--cat-ink);
  text-decoration: none;
}

.cat-feature-card:hover {
  color: var(--cat-ink);
  transform: translateY(-2px);
}

.cat-feature-card__media {
  min-height: 240px;
  background:
    linear-gradient(rgb(20 50 63 / 30%), rgb(20 50 63 / 62%)),
    radial-gradient(circle at 35% 30%, #62849a, #1d4357);
}

.cat-feature-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: sepia(.18) contrast(1.05);
}

.cat-feature-card__fallback {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  color: rgb(255 255 255 / 75%);
  font-family: var(--cat-serif);
  font-size: clamp(2.5rem, 8vw, 6rem);
  font-style: italic;
  writing-mode: vertical-rl;
}

.cat-feature-card__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(1.35rem, 3vw, 2.5rem);
}

.cat-feature-card__content > strong {
  display: block;
  margin-bottom: .75rem;
  font-family: var(--cat-serif);
  font-size: clamp(1.55rem, 2.5vw, 2.2rem);
  line-height: 1.05;
}

.cat-feature-card__content > span:not(.cat-eyebrow, .cat-text-link) {
  display: -webkit-box;
  overflow: hidden;
  color: var(--cat-ink-soft);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.cat-feature-card .cat-text-link {
  margin-top: 1rem;
}

.cat-feature-hero {
  position: relative;
  display: grid;
  min-height: min(68vh, 680px);
  align-items: end;
  overflow: hidden;
  background: var(--cat-blue-deep);
}

.cat-feature-hero__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: grayscale(.35) sepia(.18) contrast(1.05);
}

.cat-feature-hero::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgb(7 22 29 / 88%) 0%,
    rgb(7 22 29 / 72%) 58%,
    rgb(7 22 29 / 35%) 100%
  );
  content: "";
}

.cat-feature-hero--fallback {
  background:
    radial-gradient(circle at 75% 20%, #7392a1, transparent 25rem),
    linear-gradient(135deg, #2d637b, #142f3b);
}

.cat-feature-hero__overlay {
  position: relative;
  z-index: 1;
  max-width: 75rem;
  padding: clamp(2rem, 6vw, 5rem);
  color: #fff;
}

.cat-feature-hero__overlay .cat-kicker {
  color: #e8c783;
}

.cat-feature-hero__overlay h1 {
  max-width: 65rem;
  color: #fff;
  font-size: clamp(2.35rem, 4.5vw, 4.5rem);
  text-shadow: 0 2px 18px rgb(0 0 0 / 45%);
}

.cat-feature-hero__overlay p:not(.cat-kicker) {
  max-width: 52rem;
  color: #dce7eb;
  font-size: 1.15rem;
}

.cat-feature-intro {
  max-width: 72rem;
  margin: 2rem auto 0;
  padding: clamp(1.5rem, 4vw, 3rem);
  background: var(--cat-surface);
  border: 1px solid var(--cat-line);
  border-top: 4px solid var(--cat-gold);
}

.cat-feature-intro h2 {
  margin-bottom: 1rem;
}

.cat-feature-intro > p:not(.cat-kicker) {
  color: var(--cat-ink-soft);
  font: 1.12rem/1.7 var(--cat-serif);
}

.cat-feature-intro small {
  display: block;
  margin-top: .75rem;
  color: #68777e;
}

@media (max-width: 900px) {
.cat-feature-card {
    grid-template-columns: 1fr;
    height: auto;
  }
.cat-feature-card__media {
    min-height: 120px;
  }
/* La escritura vertical tiene sentido en la columna angosta y alta del
     escritorio (grid de 2 columnas); en movil la tarjeta pasa a 1 columna
     ancha y baja, y ese mismo texto giraba 90 grados ocupando toda la
     tarjeta sin aportar nada legible (capturado en pantalla real, 23-ago-2026). */
.cat-feature-card__fallback {
    writing-mode: horizontal-tb;
    font-size: clamp(1.4rem, 6vw, 2.2rem);
  }
}

.cat-story__hero {
  position: relative;
  min-height: min(68vh, 680px);
  overflow: hidden;
  background: #173b49;
}

.cat-story__hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(0.64); }

.cat-story__hero > div { position: absolute; z-index: 1; right: 0; bottom: 0; max-width: 720px; padding: clamp(2rem, 6vw, 5rem); color: #fff; }

.cat-story__hero h1 { color: #fff; }

.cat-story__hero p:last-child { font-size: 1.15rem; line-height: 1.65; }

.cat-story__intro {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 3rem;
  padding: 4rem 0;
}

.cat-story__intro h2 { margin: 0; color: #173a4b; font: 600 var(--cat2-text-4) "Source Serif 4", serif; }

.cat-story__intro blockquote { margin: 1.5rem 0; padding-left: 1.2rem; border-left: 4px solid #b48328; color: #674616; font: 600 1.35rem/1.5 "Source Serif 4", serif; }

.cat-story__gallery {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  grid-template-rows: repeat(2, minmax(220px, 1fr));
  gap: 0.7rem;
}

.cat-story__gallery figure { position: relative; min-height: 240px; margin: 0; overflow: hidden; }

.cat-story__gallery figure:first-child { grid-row: 1 / 3; }

.cat-story__gallery img { width: 100%; height: 100%; object-fit: cover; }

.cat-story__gallery figcaption { position: absolute; right: 0; bottom: 0; left: 0; padding: 0.65rem 0.8rem; background: rgba(13, 38, 49, 0.82); color: #fff; font-size: 0.78rem; }

@media (max-width: 850px) {
.cat-story__gallery { grid-template-rows: auto; }
.cat-story__gallery figure:first-child { grid-row: auto; }
  /* Mismas reglas que catalogo-ficha-lugar.css @media(max-width:850px),
     repetidas aqui a proposito -- mismo bug de cascada de S2 en
     CORRECCIONES-RENDIMIENTO-Y-UI-20260906.md (esta hoja se carga despues
     en base.html). */
.cat-story__intro,
  .cat-story__gallery { grid-template-columns: 1fr; }
}

.cat-hero__featured {
  display: grid;
  grid-template-columns: minmax(132px, 38%) minmax(0, 1fr);
  min-height: 124px;
  overflow: hidden;
  border: 1px solid #8f7441;
  background: #283f4a;
  box-shadow: var(--cat-shadow);
  color: #fff;
  text-decoration: none;
}

.cat-hero__featured > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: sepia(.5) contrast(1.08) brightness(.8);
  transition: transform .4s ease;
}

.cat-hero__featured-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  gap: .25rem;
  padding: 1rem 1.15rem;
  background: linear-gradient(135deg, rgb(240 209 140 / 9%), transparent 58%), #283f4a;
}

.cat-hero__featured .cat-eyebrow { margin: 0; color: #f0d18c; font-size: .72rem; }

.cat-hero__featured strong { color: #fff; font: 650 clamp(1.3rem, 2vw, 1.65rem)/1.05 var(--cat-serif); }

.cat-hero__featured-copy > span:not(.cat-eyebrow) { color: #d5e0e4; font-size: .74rem; line-height: 1.35; }

.cat-hero__featured:hover, .cat-hero__featured:focus-visible { border-color: #f0d18c; color: #fff; transform: translateY(-2px); }

.cat-hero__featured:hover > img, .cat-hero__featured:focus-visible > img { transform: scale(1.04); }

/* Unificación 2026-08-14: esta cabecera conserva SOLO su fotografía de fondo
   (es la única del catálogo que la tiene). Se le quitaron el min-height de
   390px, el padding propio del contenedor interior y el tamaño de titular de
   hasta 6,5rem: con ellos, destacados medía 104px de titular frente a los
   57,6px del resto y era la cabecera más alta del sitio. Ahora es el mismo
   bloque que las demás, solo que con textura fotográfica en vez de degradado. */

.cat-featured-index__hero {
  position: relative;
  overflow: hidden;
  background: var(--cat-blue-deep);
}

.cat-featured-index__hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: sepia(.5) contrast(1.05) brightness(.38); }

.cat-featured-index__hero > div { position: relative; width: auto; color: #fff; }

.cat-featured-index__hero h1 { margin: .25rem 0 1rem; color: #fff; }

/* El tamaño propio (1.15rem) se quitó el 2026-08-14: el párrafo de
   destacados salía más grande (18,4px) que en las demás páginas (15,52px).
   El resto de esta cabecera (foto real, h1 grande) es intencionadamente
   distinto —es la única página con fotografía de fondo— y se conserva. */

.cat-featured-index__hero p:last-child { max-width: 42rem; font-family: var(--cat-serif); }

.cat-featured-index__section { margin: 0 0 clamp(3rem, 6vw, 5.5rem); }

.cat-featured-studies-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }

.cat-featured-studies-grid > a { display: grid; grid-template-rows: 235px 1fr; overflow: hidden; border: 1px solid #b9aa94; background: #fffdf8; color: var(--cat-ink); box-shadow: 0 14px 30px rgb(30 43 48 / 10%); text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }

.cat-featured-studies-grid > a:hover, .cat-featured-studies-grid > a:focus-visible { color: var(--cat-ink); transform: translateY(-4px); box-shadow: 0 20px 38px rgb(30 43 48 / 16%); }

.cat-featured-studies-grid__media { overflow: hidden; }

.cat-featured-studies-grid__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }

.cat-featured-studies-grid > a:hover img { transform: scale(1.035); }

.cat-featured-studies-grid__copy { display: flex; flex-direction: column; gap: .65rem; padding: 1.25rem; }

.cat-featured-studies-grid__copy small { color: var(--cat-red-deep); font-size: .64rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }

.cat-featured-studies-grid__copy strong { color: var(--cat-blue-deep); font: 650 var(--cat2-text-3)/1.1 var(--cat-serif); }

.cat-featured-studies-grid__copy span { color: var(--cat-ink-soft); font-size: .85rem; line-height: 1.55; }

.cat-featured-studies-grid__copy em { margin-top: auto; color: var(--cat-red-deep); font-size: .76rem; font-style: normal; font-weight: 800; }

.cat-featured-routes { display: grid; border-top: 1px solid var(--cat-line); }

.cat-featured-routes > a { display: grid; grid-template-columns: 56px minmax(0, 1fr) 40px; gap: 1rem; align-items: center; padding: 1.25rem .5rem; border-bottom: 1px solid var(--cat-line); color: var(--cat-ink); text-decoration: none; }

.cat-featured-routes > a > span { color: var(--cat-red); font: 650 1.2rem var(--cat-serif); }

.cat-featured-routes small { color: var(--cat-red-deep); font-size: .65rem; font-weight: 800; text-transform: uppercase; }

.cat-featured-routes strong { display: block; margin: .2rem 0; color: var(--cat-blue-deep); font: 650 var(--cat2-text-3) var(--cat-serif); }

.cat-featured-routes p { margin: 0; color: var(--cat-ink-soft); }

.cat-featured-routes em { display: grid; width: 2rem; height: 2rem; place-items: center; border: 1px solid var(--cat-red); border-radius: 50%; color: var(--cat-red); font-style: normal; }

.cat-featured-routes > a:hover, .cat-featured-routes > a:focus-visible { background: #f5efe5; color: var(--cat-ink); }

.cat-study__hero { position: relative; min-height: min(680px, 72vh); overflow: hidden; background: var(--cat-blue-deep); color: #fff; }

.cat-study__hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.5); }

.cat-study__hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(12 39 52 / 88%) 0, rgb(12 39 52 / 45%) 58%, transparent); }

/* Ancho y tamaño de fuente ya se rompían entre sí para títulos largos antes
   de hoy (confirmado: "El pantano de Santa Teresa" y "Castillo de
   Salvatierra de Tormes" ya partían en 3 líneas desperdigadas a 1536px de
   ancho, sin que este bloque se hubiera tocado en meses -- no es una
   regresión de la sesión de anuarios, es un fallo real que ya estaba ahí y
   que solo se ha detectado ahora). El hueco de texto real (caja menos
   relleno) se quedaba en ~550px con una fuente de hasta 96px: nunca cabía
   más de una o dos palabras por línea. Caja más ancha y techo de fuente más
   bajo para que los títulos de 20-35 caracteres queden en dos líneas
   equilibradas, no en tres o cuatro sueltas. */

.cat-study__hero-copy { position: relative; z-index: 1; width: min(980px, 83%); padding: clamp(3rem, 8vw, 5rem); }

.cat-study__hero .cat-kicker { color: #ffd66d; text-shadow: 0 2px 10px rgb(0 0 0 / 70%); }

.cat-study__hero h1 { margin: .35rem 0 1.25rem; color: #fff; font: 650 clamp(2.1rem, 4vw, 3.6rem)/1.1 var(--cat-serif); }

.cat-study__hero-copy > p:last-child { font: clamp(1.05rem, 1.7vw, 1.35rem)/1.62 var(--cat-serif); }

.cat-study__caption { position: absolute; z-index: 2; right: 1rem; bottom: .75rem; max-width: 30rem; margin: 0; color: #dce6e9; font-size: .67rem; text-align: right; }

@media (max-width: 560px) {
.cat-study__hero { min-height: 580px; }
.cat-study__hero-copy { width: auto; padding: 2.3rem 1.35rem 4.8rem; }
.cat-study__hero h1 { font-size: clamp(2.35rem, 10vw, 2.65rem); line-height: 1; }
.cat-study__hero-copy > p:last-child { font-size: 1.02rem; line-height: 1.55; }
.cat-study__caption { right: .8rem; bottom: .55rem; left: .8rem; max-width: none; text-align: left; }
}

.cat-study__stats { display: grid; grid-template-columns: repeat(3, 1fr); background: #f0d18c; }

.cat-study__stats > div { display: grid; gap: .2rem; padding: 1.35rem; text-align: center; }

.cat-study__stats > div + div { border-left: 1px solid rgb(79 54 14 / 22%); }

.cat-study__stats strong { color: var(--cat-blue-deep); font: 650 var(--cat2-text-4) var(--cat-serif); }

.cat-study__stats span { color: #5d441d; font-size: .68rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }

.cat-study__lead { max-width: 850px; margin: clamp(3rem, 7vw, 6rem) auto; text-align: center; }

.cat-study__lead h2 { margin: .4rem 0 1rem; color: var(--cat-blue-deep); font: 650 clamp(2.2rem, 4vw, 3.5rem)/1.06 var(--cat-serif); }

.cat-study__lead > p:last-child { color: var(--cat-ink-soft); font: 1.18rem/1.72 var(--cat-serif); }

.cat-study__restricted-dossier { display: grid; grid-template-columns: minmax(190px, 30%) minmax(0, 1fr); gap: clamp(1.4rem, 4vw, 3.5rem); align-items: start; max-width: 980px; margin: 0 auto clamp(3rem, 7vw, 5rem); padding: clamp(1.2rem, 3vw, 2.2rem); border-top: 4px solid var(--cat-red); background: #efe8dc; }

.cat-study__restricted-dossier figure { margin: 0; padding: .55rem; background: #fffdf8; box-shadow: 0 10px 22px rgb(25 45 54 / 14%); }

.cat-study__restricted-dossier img { display: block; width: 100%; height: auto; border: 1px solid #d1c3ad; }

.cat-study__restricted-dossier figcaption { margin-top: .55rem; color: var(--cat-ink-soft); font-size: .71rem; line-height: 1.45; }

.cat-study__restricted-dossier h2 { margin: .25rem 0 .9rem; color: var(--cat-blue-deep); font: 650 clamp(1.8rem, 3.5vw, 2.65rem)/1.06 var(--cat-serif); }

.cat-study__restricted-dossier > div > p:not(.cat-kicker):not(.cat-study__restricted-dossier-notice) { color: var(--cat-ink-soft); font: 1rem/1.65 var(--cat-serif); }

.cat-study__restricted-dossier-notice { margin: 1.25rem 0 0; padding: .75rem .9rem; border-left: 3px solid #c9922f; background: #fbf3e3; color: var(--cat-red-deep); font-size: .82rem; font-weight: 800; line-height: 1.5; }

.cat-study__timeline { margin-bottom: clamp(3rem, 6vw, 5rem); }

.cat-study__timeline ol { position: relative; display: flex; flex-wrap: wrap; margin: 2rem 0 0; padding: 0; list-style: none; }

.cat-study__timeline li { position: relative; box-sizing: border-box; width: 20%; padding: 2.5rem 1rem 1.5rem; }

.cat-study__timeline li::after { content: ""; position: absolute; top: 1rem; right: 0; left: 0; height: 2px; background: #c9922f; }

.cat-study__timeline li::before { content: ""; position: absolute; z-index: 1; top: .58rem; left: 1rem; width: .85rem; height: .85rem; border: 3px solid #fffdf8; border-radius: 50%; background: var(--cat-red); box-shadow: 0 0 0 1px var(--cat-red); }

.cat-study__timeline strong { color: var(--cat-red-deep); font: 650 var(--cat2-text-3) var(--cat-serif); }

.cat-study__timeline li p { color: var(--cat-ink-soft); font-size: .8rem; line-height: 1.55; }

.cat-study-accordion { display: grid; gap: 1rem; margin-bottom: clamp(3rem, 6vw, 5rem); }

.cat-study-accordion details { border-bottom: 2px solid #c9922f; background: #fffdf8; }

.cat-study-accordion summary { display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; width: 100%; padding: 1.05rem 1.4rem; cursor: pointer; list-style: none; background: var(--cat-blue-deep); color: #fff; clip-path: polygon(0 0, calc(100% - 1.4rem) 0, 100% 50%, calc(100% - 1.4rem) 100%, 0 100%); }
/* #main-content details > summary (ficha-lugar.css) fija "background: none
   !important" para el acordeon generico de la ficha de lugar -- mismo
   parche de especificidad ya aplicado en catalogo-utilidades-migradas.css
   para .cat-accordion--pref: igualar con #main-content en el selector para
   que el navy de este acordeon (texto blanco ya fijo arriba) gane. Sin
   esto el texto blanco quedaba sobre el fondo crema de la pagina, 1.01:1
   (auditoria WCAG, 2026-08-31). */
#main-content .cat-study-accordion summary {
  background: var(--cat-blue-deep) !important;
  border-bottom: none !important;
}
/* Mismo problema que arriba pero para el "small": #main-content details >
   summary small (ficha-lugar.css) fija un marron pensado para fondo
   crema; sobre el navy de este acordeon daba 1.94:1. */
#main-content .cat-study-accordion summary small {
  color: #f0d18c !important;
}

.cat-study-accordion summary::-webkit-details-marker { display: none; }

.cat-study-accordion summary span { display: grid; gap: .15rem; }

.cat-study-accordion summary small { color: #f0d18c; font-size: .63rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }

.cat-study-accordion summary strong { color: #fff; font: 650 var(--cat2-text-3) var(--cat-serif); }

.cat-study-accordion summary i { display: grid; width: 1.9rem; height: 1.9rem; place-items: center; border: 1px solid #f0d18c; border-radius: 50%; color: #f0d18c; font-style: normal; transition: transform .2s ease; }

.cat-study-accordion details[open] summary i { transform: rotate(45deg); }

.cat-study-accordion details > div { padding: 1.35rem 1.6rem; border: 1px solid var(--cat-line); border-top: 0; }

.cat-study-accordion details > div p { color: var(--cat-ink-soft); font: 1rem/1.7 var(--cat-serif); }

.cat-study-accordion details > div h3 { margin: 2rem 0 .6rem; padding-top: 1.6rem; border-top: 1px solid var(--cat-line); color: var(--cat-red-deep); font: 700 var(--cat2-text-2) var(--cat-serif); text-transform: uppercase; letter-spacing: .04em; }

.cat-study-accordion details > div h3:first-child { margin-top: 0; padding-top: 0; border-top: 0; }

.cat-study__gallery { margin-bottom: clamp(3rem, 6vw, 5rem); }

.cat-study__gallery > div { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8rem; }

.cat-study__gallery figure { position: relative; margin: 0; overflow: hidden; border: 1px solid var(--cat-line); background: #d8d0c3; }

.cat-study__gallery button { display: block; width: 100%; padding: 0; border: 0; cursor: zoom-in; background: transparent; aspect-ratio: 4 / 3; }

.cat-study__gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }

.cat-study__gallery button:hover img, .cat-study__gallery button:focus-visible img { transform: scale(1.04); }

.cat-study__gallery figcaption { min-height: 3.7rem; padding: .65rem .75rem; background: var(--cat-blue-deep); color: #fff; font-size: .68rem; line-height: 1.45; }

.cat-study-lightbox { width: min(1100px, 94vw); max-height: 92vh; padding: 0; border: 1px solid #d8c9ae; background: #0b202a; color: #fff; }

.cat-study-lightbox::backdrop { background: rgb(4 15 20 / 88%); }

.cat-study-lightbox > button { position: absolute; z-index: 2; top: .7rem; right: .7rem; display: grid; width: 2.6rem; height: 2.6rem; place-items: center; border: 1px solid #f0d18c; border-radius: 50%; background: #102f3d; color: #fff; cursor: pointer; font-size: 1.5rem; }

.cat-study-lightbox figure { display: grid; margin: 0; }

.cat-study-lightbox img { width: 100%; max-height: 82vh; object-fit: contain; }

.cat-study-lightbox figcaption { padding: .75rem 1rem; color: #e8e1d6; font-size: .8rem; }

.cat-study__sources { display: block; margin-bottom: 3rem; padding: clamp(1.5rem, 4vw, 3rem); background: #efe8dc; border-top: 4px solid var(--cat-red); }

.cat-study__sources > div:first-child { max-width: 46rem; margin-bottom: 1.8rem; }

.cat-study__sources h2 { margin: .25rem 0 .6rem; color: var(--cat-blue-deep); font: 650 var(--cat2-text-4) var(--cat-serif); }

.cat-study__sources ul { margin: 0; padding: 0; list-style: none; }

.cat-study__sources li a { display: flex; justify-content: space-between; padding: .7rem 0; border-bottom: 1px solid #c9bcaa; color: var(--cat-blue-deep); font-weight: 800; text-decoration: none; }

.cat-study__sources-group + .cat-study__sources-group { margin-top: 1.4rem; }

.cat-study__sources-plain { display: grid; gap: 0; }

.cat-study__sources-plain li { padding: .55rem 0; border-bottom: 1px solid #c9bcaa; color: var(--cat-ink-soft); font-size: .86rem; line-height: 1.5; }

@media (max-width: 1050px) {
.cat-hero__amanuense, .cat-hero__occupation, .cat-hero__featured { grid-template-columns: minmax(145px, 28%) minmax(0, 1fr); }
.cat-study__timeline ol { flex-direction: column; }
.cat-study__timeline li { width: 100%; padding: .25rem 1rem 1.5rem 3.3rem; }
.cat-study__timeline li::after { top: 0; right: auto; bottom: 0; left: 1.38rem; width: 2px; height: auto; }
.cat-study__timeline li::before { top: .48rem; left: 1rem; }
.cat-study__gallery > div { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
.cat-hero__amanuense, .cat-hero__occupation, .cat-hero__featured { grid-template-columns: 100px minmax(0, 1fr); }
.cat-study__stats { grid-template-columns: 1fr; }
.cat-study__stats > div + div { border-top: 1px solid rgb(79 54 14 / 22%); border-left: 0; }
.cat-study__gallery > div { grid-template-columns: 1fr; }
.cat-study__restricted-dossier { grid-template-columns: 1fr; }
.cat-study__restricted-dossier figure { width: min(280px, 100%); }
.cat-study__hero { min-height: 520px; }
.cat-study__hero-copy { width: 100%; padding: 3rem 1.4rem; }
}

.cat-story__hero > img {
  filter: brightness(.5) saturate(.88);
}

.cat-story__hero > div {
  max-width: min(760px, 86%);
  background: linear-gradient(100deg, rgb(8 25 32 / 92%), rgb(8 25 32 / 68%));
  text-shadow: 0 2px 14px rgb(0 0 0 / 55%);
}

.cat-story__hero .cat-kicker {
  color: #ffd66d;
}

.cat-story__hero p:last-of-type {
  color: #fff;
}

@media (max-width: 850px) {
.cat-story__hero > div {
    max-width: 100%;
  }
}

/* Herramientas destacadas bajo el buscador. */

.cat-hero__tools {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  max-width: 58rem;
  margin-top: 1.3rem;
}

.cat-hero__occupation {
  display: grid;
  grid-template-columns: minmax(132px, 38%) minmax(0, 1fr);
  min-height: 146px;
  overflow: hidden;
  border: 1px solid #8d642e;
  background: #8a331f;
  color: #fff8e9;
  box-shadow: var(--cat-shadow);
  text-decoration: none;
}

.cat-hero__occupation > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: sepia(.15) contrast(1.04);
  transition: transform .4s ease;
}

.cat-hero__occupation-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  gap: .25rem;
  padding: 1rem 1.15rem;
  background:
    linear-gradient(135deg, rgb(255 255 255 / 8%), transparent 55%),
    #8a331f;
}

.cat-hero__occupation .cat-eyebrow {
  margin: 0;
  color: #f0d18c;
  font-size: .72rem;
}

.cat-hero__occupation strong {
  color: #fff;
  font: 650 clamp(1.3rem, 2vw, 1.65rem)/1.05 var(--cat-serif);
}

.cat-hero__occupation-copy > span:not(.cat-eyebrow) {
  color: #f4e5d6;
  font-size: .74rem;
  line-height: 1.35;
}

.cat-hero__occupation:hover,
.cat-hero__occupation:focus-visible {
  border-color: #f0d18c;
  color: #fff;
  transform: translateY(-2px);
}

.cat-hero__occupation:hover > img,
.cat-hero__occupation:focus-visible > img {
  transform: scale(1.035);
}

/* Segunda columna de una cabecera .cat-hero de dos columnas: cifras clave a
   la derecha, mismo patrón que .cat-arch-stats (yacimientos). Genérica a
   propósito -- la reutilizan .cat-occupation-hero y las cabeceras de los
   anuarios comerciales (anuario_montejo.html, anuario_salvatierra.html). */

.cat-hero-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  align-self: end;
  margin: 0;
  border: 1px solid rgb(255 255 255 / 24%);
}

.cat-hero-stats div { padding: 1rem .7rem; text-align: center; }

.cat-hero-stats div + div { border-left: 1px solid rgb(255 255 255 / 24%); }

.cat-hero-stats dt { color: #c9d9df; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; }

.cat-hero-stats dd { margin: .2rem 0 0; color: #fff; font-family: var(--cat-serif); font-size: 2rem; font-weight: 700; }

.cat-hero__archive--compact {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: .7rem 1rem;
  align-items: center;
  max-width: 58rem;
  margin-top: 1.25rem;
  padding: .9rem 0 0;
  border-top: 1px solid #c9bdab;
  background: transparent;
  color: var(--cat-ink-soft);
  box-shadow: none;
}

.cat-hero__archive--compact .cat-eyebrow {
  margin: 0;
  color: var(--cat-red-deep);
  white-space: nowrap;
}

.cat-hero__archive--compact strong {
  color: var(--cat-blue-deep);
  font: 650 .98rem/1.4 var(--cat-serif);
}

.cat-hero__archive--compact p {
  margin: 0;
  color: var(--cat-ink-soft);
  font-size: .82rem;
  line-height: 1.5;
}

.cat-hero__archive--compact a {
  color: var(--cat-blue-deep);
  font-size: .78rem;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.cat-hero__archive--compact a:hover,
.cat-hero__archive--compact a:focus-visible {
  color: var(--cat-red);
  text-decoration: underline;
  text-underline-offset: .2rem;
}

.cat-hero__amanuense {
  position: relative;
  display: grid;
  grid-template-columns: minmax(132px, 38%) minmax(0, 1fr);
  min-height: 146px;
  overflow: hidden;
  border: 1px solid #b49b74;
  background: #f2eadb;
  color: #fff;
  box-shadow: var(--cat-shadow);
  text-decoration: none;
}

.cat-hero__amanuense::after {
  display: none;
}

.cat-hero__amanuense > img {
  position: relative;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 44% 43%;
  filter: sepia(.12) contrast(1.03);
  transition: transform .4s ease;
}

.cat-hero__amanuense-copy {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .25rem;
  padding: 1rem 1.15rem;
  background: var(--cat-blue-deep);
}

.cat-hero__amanuense .cat-eyebrow {
  margin: 0;
  color: #f0d18c;
  font-size: .72rem;
}

.cat-hero__amanuense strong {
  color: #fff;
  font: 650 clamp(1.45rem, 2.2vw, 1.8rem)/1 var(--cat-serif);
}

.cat-hero__amanuense-copy > span:not(.cat-eyebrow) {
  color: #eaf0f1;
  font-size: .74rem;
  line-height: 1.35;
}

.cat-hero__amanuense:hover,
.cat-hero__amanuense:focus-visible {
  border-color: #e4bd6e;
  color: #fff;
  transform: translateY(-2px);
}

.cat-hero__amanuense:hover > img,
.cat-hero__amanuense:focus-visible > img {
  transform: scale(1.035);
}

@media (max-width: 900px) {
.cat-hero__archive--compact {
    max-width: none;
  }
.cat-hero__tools {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
.cat-hero__archive--compact,
  .cat-transcription__intro {
    grid-template-columns: 1fr;
  }
.cat-hero__archive--compact {
    gap: .35rem;
  }
.cat-hero__archive--compact .cat-eyebrow {
    white-space: normal;
  }
}

@media (max-width: 1050px) {
.cat-featured-studies-grid { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
.cat-hero__amanuense, .cat-hero__occupation, .cat-hero__featured { grid-template-columns: minmax(145px, 28%) minmax(0, 1fr); }
}

@media (max-width: 680px) {
.cat-hero__amanuense, .cat-hero__occupation, .cat-hero__featured { grid-template-columns: 100px minmax(0, 1fr); }
}

.cat-study-official { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr); gap: 1.5rem; margin: 2rem 0; padding: 1.4rem; border-top: 4px solid var(--cat-gold); background: var(--cat-blue-deep); color: #fff; }

.cat-study-official figure { margin: 0; }

.cat-study-official figure button { display: block; width: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; }

.cat-study-official figure img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }

.cat-study-official figcaption { margin-top: .5rem; color: #c8d6dc; font-size: .78rem; }

.cat-study-official h2 { margin: .15rem 0 .7rem; color: #fff; font-family: var(--cat-serif); font-size: clamp(1.7rem, 3vw, 2.5rem); }

.cat-study-official .cat-kicker { color: #f0d18c; }

.cat-study-official dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 1rem 0; border-top: 1px solid rgb(255 255 255 / 20%); }

.cat-study-official dl div { padding: .6rem .3rem; border-bottom: 1px solid rgb(255 255 255 / 20%); }

.cat-study-official dt { color: #f0d18c; font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }

.cat-study-official dd { margin: .2rem 0 0; }

.cat-study-official a { display: inline-block; padding: .55rem .75rem; background: #f4d080; color: #173746; font-weight: 700; text-decoration: none; }

@media (max-width: 1100px) {
.cat-study-official { grid-template-columns: 1fr; }
}

/* Tres herramientas bajo el buscador en lugar de dos. */

.cat-hero__tools {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: 72rem;
}

.cat-hero__about {
  display: grid;
  grid-template-columns: minmax(132px, 38%) minmax(0, 1fr);
  min-height: 146px;
  overflow: hidden;
  border: 1px solid #7d7a3f;
  background: #2f3a26;
  color: #f3f1e2;
  box-shadow: var(--cat-shadow);
  text-decoration: none;
}

.cat-hero__about > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: sepia(.35) contrast(1.06) brightness(.94);
  transition: transform .4s ease;
}

.cat-hero__about-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  gap: .25rem;
  padding: 1rem 1.15rem;
  background: linear-gradient(135deg, rgb(240 209 140 / 10%), transparent 58%), #2f3a26;
}

.cat-hero__about .cat-eyebrow { margin: 0; color: #f0d18c; font-size: .72rem; }

.cat-hero__about strong { color: #fff; font: 650 clamp(1.3rem, 2vw, 1.65rem)/1.05 var(--cat-serif); }

.cat-hero__about-copy > span:not(.cat-eyebrow) { color: #e3e6d2; font-size: .74rem; line-height: 1.35; }

.cat-hero__about:hover, .cat-hero__about:focus-visible { border-color: #f0d18c; color: #fff; transform: translateY(-2px); }

.cat-hero__about:hover > img, .cat-hero__about:focus-visible > img { transform: scale(1.035); }

@media (max-width: 1050px) {
.cat-hero__about { grid-template-columns: minmax(145px, 28%) minmax(0, 1fr); }
}

@media (max-width: 680px) {
.cat-hero__about { grid-template-columns: 100px minmax(0, 1fr); }
}

/* --------------------------------------------------------------------------
   REESCRITURA 2026-08-14: de "capa encima" a FUENTE ÚNICA.
   --------------------------------------------------------------------------
   Hasta hoy `.cat-hero` solo aportaba el lienzo (fondo, color) y dejaba que
   cada componente antiguo siguiera imponiendo su propia maquetación: por eso
   el título medía 57,6px en seis páginas, 86,4px en yacimientos y territorio
   y 104px en destacados; por eso territorio salía a 960px de ancho y el
   resto a 1058px; por eso cronología salía centrada y las demás a la
   izquierda. Cada arreglo puntual tapaba un síntoma y dejaba el componente
   viejo entero por debajo, así que el fallo reaparecía en otra página.

   Ahora `.cat-hero` declara TODAS las propiedades dimensionales — display,
   ancho, márgenes, padding, alineación, tamaño y color de letra — de forma
   explícita, incluidas las que "no hacían falta" (display:block,
   max-width:none, margin-inline:0, text-align:left). Declararlas es
   justamente lo que neutraliza a los componentes antiguos: todos pesan
   (0,1,0) igual que `.cat-hero`, y este bloque va al final del fichero, así
   que gana todos los empates. Lo que NO se declare aquí es exactamente lo
   que un componente antiguo podrá volver a imponer.

   Criterio confirmado contra sistemas de diseño de referencia (USWDS,
   Carbon, Atlassian, GC Design System): un único componente de cabecera
   reutilizado, no una familia de cabeceras que se parecen.
   -------------------------------------------------------------------------- */

.cat-hero {
  display: block;
  position: relative;
  overflow: hidden;
  max-width: none;
  margin: 0 0 clamp(2rem, 4vw, 3rem);
  padding: clamp(1.75rem, 4vw, 3.5rem);
  border-top: 0;
  border-right: 0;
  border-bottom: 4px solid var(--cat-gold);
  border-left: 0;
  background-color: #122e3b;
  background-image:
    linear-gradient(100deg, rgb(16 48 62 / 97%) 0 61%, rgb(16 48 62 / 78%)),
    radial-gradient(circle at 80% 20%, #447181, #173746);
  color: #fff;
  text-align: left;
  box-shadow: none;
}

/* Filigrana de marca: decisión del propietario 2026-08-14, quitarla de
   todas las cabeceras (no solo ocultarla en un ancho). El elemento
   <img class="cat-hero__marca"> sigue en el HTML de cada plantilla (no se
   toca la plantilla, cambio mínimo y reversible desde aquí), pero ya no se
   pinta en ninguna resolución. Antes de esto tuvo dos fallos propios en la
   misma jornada: colisión de especificidad con ".cat-hero > *" (title
   quedaba en la columna de cifras de yacimientos) y, más tarde, quedaba
   descolocada por la cabecera de "qué es ARCA" al crecer de más por el
   fallo de la imagen gigante. Con la filigrana fuera, ninguno de los dos
   puede volver a pasar aquí. */

img.cat-hero__marca {
  display: none;
}

.cat-hero > * {
  position: relative;
  z-index: 1;
}

/* Red de seguridad contra el fallo que más veces ha reaparecido hoy: una
   imagen dentro de la cabecera con `width:100%` y sin límite propio, que en
   escritorio se estiraba hasta el ancho entero del bloque y disparaba la
   altura de esa página (pasó con el grabado de «Qué es ARCA»). Al haber
   pasado la cabecera a `display:block`, cualquier figura que antes vivía en
   una segunda columna cae ahora en flujo normal y correría el mismo riesgo,
   así que el límite se declara una sola vez para todas.

   El límite se aplica a `figure`, no a `img` en general: las fotografías de
   fondo (destacados, y las de móvil) son `img` posicionadas en absoluto que
   deben cubrir el bloque entero, y un `max-width` las encogía a 26rem. Se
   comprobó en vivo: la foto de destacados pasaba a medir 416px de ancho
   dentro de una cabecera de 1059px. Las imágenes de contenido del catálogo
   van siempre dentro de un `figure`, así que el criterio separa bien los dos
   casos. */

.cat-hero figure {
  max-width: min(100%, 26rem);
}

.cat-hero figure img {
  width: 100%;
  height: auto;
}

/* Los bloques de cifras (yacimientos, documentos, materias) estaban montados
   como segunda columna de un grid o de un flex. Con la cabecera unificada
   caen debajo del texto: necesitan su propia separación o quedan pegados al
   párrafo. */

.cat-hero .cat-arch-stats,
.cat-hero .cat-page-header__count,
.cat-hero > dl,
.cat-hero > strong {
  margin-top: 1.6rem;
}

/* Efecto colateral de la unificación, detectado el 2026-08-14 midiendo
   contraste en vivo: el contador de documentos, artículos y elementos
   digitales usaba `var(--cat-ink-soft)` (#40535d), pensado para el fondo
   crema en el que vivía antes. Dentro de la cabecera azul el ratio caía a
   **1,77:1** —muy por debajo del 4,5:1 que exige WCAG AA— y la palabra
   («documentos», «artículos»…) quedaba casi ilegible. Se le da el mismo
   color que al resto de texto secundario de la cabecera. */

.cat-hero .cat-page-header__count span,
.cat-hero .cat-page-header__count small {
  color: #c9d9df;
}

.cat-hero .cat-kicker,
.cat-hero .cat-eyebrow {
  color: #f0c76c;
}

/* Un solo tamaño de titular para todo el catálogo. 3,6rem (57,6px a 1440px)
   es el que ya tenían seis páginas —hemeroteca, documentos, digitales,
   artículos, datos abiertos y qué es ARCA—, así que se toma como estándar y
   se le imponen las tres que se habían quedado fuera: yacimientos y
   territorio (86,4px) y destacados (104px). El `font-size` explícito es
   imprescindible: sin él, cada `.cat-X-hero h1` antiguo pesa lo mismo (0,1,1)
   y le ganaba la partida a esta regla por no tener rival. */

.cat-hero h1 {
  max-width: 24ch;
  margin: .1rem 0 .8rem;
  color: #fff;
  font-family: var(--cat-serif);
  font-size: clamp(2.1rem, 4.6vw, 3.6rem);
  font-weight: 650;
  letter-spacing: -.03em;
  line-height: 1.02;
}

/* Igual que con el titular: el tamaño va declarado a propósito para
   neutralizar los `__lead` y demás párrafos con medida propia que tenía cada
   cabecera antigua (oficios usaba clamp(1.15rem, 2vw, 1.5rem)). */

.cat-hero p,
.cat-hero > div > p {
  max-width: 62ch;
  color: #d9e3e7;
  font-family: var(--cat-sans);
  font-size: 1.02rem;
  line-height: 1.65;
}

/* Fallo 6 (barrido 2026-08-14): el tema ya tenía .cat-page-header > p:last-child
   y .cat-editorial-header > p:last-child (líneas 691 y 2644), que pesan
   (0,2,0) y ganaban siempre a ".cat-hero p" (0,1,1) aunque esta vaya después
   en el archivo: la regla anterior no alcanza. Mismo peso aquí para que
   gane por ir después, en vez de perder por pesar menos. Confirmado en vivo
   en /catalogo/clasificacion/: el párrafo salía en rgb(64,83,93), casi
   invisible sobre el fondo azul. Ya existía un aviso idéntico sobre este
   mismo patrón en la bitácora (sesión anterior, con .cat-hero-band); volvió
   a pasar porque el sistema unificado de hoy es nuevo y no heredó ese aviso. */

.cat-hero > p:last-child,
.cat-hero > p:last-of-type,
.cat-hero > div > p:last-child {
  max-width: 62ch;
  color: #d9e3e7;
  font-family: var(--cat-sans);
  font-size: 1.02rem;
  line-height: 1.65;
}

.cat-hero a:not(.cat-button) {
  color: #f0d18c;
}

.cat-hero strong,
.cat-hero dd {
  color: #fff;
}

.cat-hero dt,
.cat-hero small {
  color: #c9d9df;
}

/* La miga de pan pasa a ir dentro del bloque oscuro. */

.cat-hero .cat-breadcrumb,
.cat-hero .cat-breadcrumb a,
.cat-hero .cat-breadcrumb span {
  color: #cddae0;
}

.cat-hero .cat-breadcrumb a:hover {
  color: #fff;
}

@media (max-width: 900px) {
/* Cabecera compacta, NO a pantalla completa. La versión anterior copiaba
     el min-height:100svh del hero de portada a las 16 cabeceras de sección
     (territorio, hemeroteca, destacados...); el resultado en vivo era una
     pantalla entera de azul marino con el título empujado fuera de la
     vista, confirmado con capturas del propietario en territorio.html.
     Solo la portada (.cat-home-hero__screen, otra clase) es una pantalla
     completa; aquí el titular debe verse sin desplazar. */
.cat-hero {
    max-width: none;
    /* margin-inline explícito: `.cat-arch-hero` (yacimientos) se salía a
       -1rem por los lados en móvil y no coincidía con ninguna otra. */
    margin: 0 0 1.5rem;
    padding: 3.5rem 1.35rem 2rem;
    border-bottom: 0;
  }
/* Cuando la plantilla aporta foto, ocupa todo el bloque; el color sólido
     queda debajo como respaldo y como fondo declarado para las herramientas
     de accesibilidad, que no saben leer una imagen. */
.cat-hero__bg {
    position: absolute;
    z-index: 0;
    inset: 0;
  }
.cat-hero__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
.cat-hero__bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
      linear-gradient(180deg, rgb(8 14 18 / 40%) 0%, rgb(8 14 18 / 34%) 32%, rgb(11 14 12 / 80%) 62%, rgb(9 11 9 / 95%) 84%, rgb(8 10 8 / 97%) 100%);
  }
.cat-hero h1 {
    font-size: clamp(2rem, 9vw, 2.75rem);
    line-height: 1.06;
  }
/* Los `:last-child` van repetidos a propósito: `.cat-editorial-header >
     p:last-child` y `.cat-page-header > p:last-child` pesan (0,2,1) también
     dentro de esta misma media query (más arriba en el fichero), y un
     `.cat-hero > p` a secas (0,1,2) perdería contra ellos. */
.cat-hero > p,
  .cat-hero > div > p,
  .cat-hero > p:last-child,
  .cat-hero > p:last-of-type,
  .cat-hero > div > p:last-child {
    font-size: .97rem;
    line-height: 1.55;
  }
}

/* La cabecera de datos abiertos no debe conservar la estrecha columna de
   lectura de las cabeceras generales: en esta página el espacio libre no
   informa, y el texto explica el alcance de la descarga. */

.cat-data-hero.cat-hero > div > p:last-child {
  max-width: 72rem;
}

.cat-study__fieldnote {
  max-width: 72rem;
  margin: 0 0 1.2rem;
  padding: .9rem 1rem;
  border-left: 4px solid var(--cat-gold);
  background: #f7edda;
  color: var(--cat-ink-soft);
  font-size: .9rem;
  line-height: 1.6;
}

.cat-study__related-grid.cat-resource-grid--compact {
  /* auto-fill (no auto-fit): con un solo registro relacionado, auto-fit
     colapsaba las columnas vacías y la única tarjeta se estiraba a todo el
     ancho (visto en produccion en el dossier de un solo documento del
     Pantano de Santa Teresa). auto-fill conserva las columnas vacías, así
     que la tarjeta mantiene su tamaño natural aunque solo haya una. */
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1rem;
}

.cat-study__related-grid.cat-resource-grid--compact .cat-resource-card {
  min-height: 100%;
  border-top: 3px solid var(--cat-gold);
  box-shadow: 0 8px 20px rgb(21 37 46 / 8%);
}

.cat-study__related-grid.cat-resource-grid--compact .cat-resource-card__media {
  aspect-ratio: 4 / 3;
  max-height: none;
}

.cat-study__related-grid.cat-resource-grid--compact .cat-resource-card__body {
  min-height: 188px;
}

.cat-study__related-grid.cat-resource-grid--compact .cat-resource-card__body > span:not(.cat-eyebrow, .cat-resource-card__meta) {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

@media (max-width: 680px) {
.cat-study__related-grid.cat-resource-grid--compact {
    grid-template-columns: 1fr;
  }
}

/* ---- catalogo-hemeroteca.css ---- */
/* ARCA del Tormes -- catalogo.css dividido en ficheros manejables.
   ============================================================================
   Bloque: Hemeroteca (cat-periodical-*, cat-source-*, cat-transcription-*).
   Extraido mecanicamente de catalogo.css (script de particion por prefijo de
   clase real, no reescrito a mano) para reducir el fichero monolitico. SIN
   CAPA a proposito -- se mantiene la misma prioridad de cascada que tenia
   dentro de catalogo.css (nunca tuvo capa), asi que mover estas reglas aqui
   no cambia que gana frente a que en ningun conflicto de especificidad
   existente. Cargado justo despues de catalogo.css en base.html para
   conservar el mismo orden relativo (reglas generales primero, estas
   despues), igual que estaban fisicamente despues en el fichero original en
   la mayoria de los casos.
   ============================================================================ */

.cat-periodical-accordion__references {
  margin: 1rem 0 0;
}

.cat-periodical-accordion__references a {
  display: inline-flex;
  gap: .35rem;
  align-items: center;
  color: var(--cat-blue-deep);
  font-weight: 700;
}

.cat-transcription {
  max-height: 65vh;
  overflow: auto;
  padding: clamp(1rem, 3vw, 2rem);
  background: #fffdf8;
  border: 1px solid var(--cat-line);
  color: #26383f;
  font-family: var(--cat-serif);
  font-size: 1.02rem;
  line-height: 1.75;
}

.cat-periodical-accordion {
  display: grid;
  gap: .8rem;
}

.cat-periodical-accordion__item {
  overflow: hidden;
  background: var(--cat-surface);
  border: 1px solid var(--cat-line);
  box-shadow: 0 8px 22px rgb(21 37 46 / 5%);
}

.cat-periodical-accordion__item summary {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto 42px;
  gap: 1rem;
  align-items: center;
  padding: 1rem 1.25rem;
  cursor: pointer;
  list-style: none;
  background: #f8f3e9;
}

.cat-periodical-accordion__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  padding: 0 .5rem;
  border-radius: 999px;
  background: var(--cat-blue-deep);
  color: #fff;
  font: 700 .95rem var(--cat-sans);
  flex-shrink: 0;
}

.cat-periodical-accordion__item[open] .cat-periodical-accordion__badge {
  background: #fff;
  color: var(--cat-blue-deep);
}

.cat-periodical-accordion__item summary::-webkit-details-marker {
  display: none;
}

.cat-periodical-accordion__item summary:hover,
.cat-periodical-accordion__item summary:focus-visible {
  background: #efe5d3;
}

.cat-periodical-accordion__item[open] summary {
  background: var(--cat-blue-deep);
  color: #fff;
}

.cat-periodical-accordion__number {
  color: var(--cat-red);
  font: 650 1.25rem var(--cat-serif);
}

.cat-periodical-accordion__item[open] .cat-periodical-accordion__number {
  color: #f0d18c;
}

.cat-periodical-accordion__title {
  display: grid;
  gap: .15rem;
}

.cat-periodical-accordion__title strong {
  color: var(--cat-ink);
  font: 650 clamp(1.15rem, 2vw, 1.45rem)/1.2 var(--cat-serif);
}

.cat-periodical-accordion__title small {
  color: var(--cat-ink-soft);
  font-size: .78rem;
}

.cat-periodical-accordion__item[open] .cat-periodical-accordion__title strong {
  color: #fff;
}

.cat-periodical-accordion__item[open] .cat-periodical-accordion__title small {
  color: #c9d7dc;
}

.cat-periodical-accordion__toggle {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  justify-self: end;
  border: 1px solid currentColor;
  border-radius: 50%;
  color: var(--cat-red);
  font: 700 1.25rem/1 var(--cat-sans);
  transition: transform .2s ease;
}

.cat-periodical-accordion__item[open] .cat-periodical-accordion__toggle {
  color: #f0d18c;
  transform: rotate(45deg);
}

.cat-periodical-accordion__panel {
  padding: 1.2rem 1.25rem 1.35rem calc(52px + 2.25rem);
}

.cat-periodical-accordion__eyebrow {
  margin: 0 0 .45rem;
  color: var(--cat-red-deep);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.cat-periodical-accordion__panel ol {
  margin: 0 0 1.25rem;
  padding: 0;
  list-style: none;
}

.cat-periodical-accordion__panel li {
  border-bottom: 1px solid var(--cat-line);
}

.cat-periodical-accordion__panel > ol > li > a {
  display: grid;
  grid-template-columns: minmax(105px, 135px) minmax(0, 1fr);
  gap: .8rem;
  padding: .75rem 0;
  color: var(--cat-ink);
  text-decoration: none;
}

.cat-periodical-accordion__places {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .5rem;
  padding: 0 0 .6rem;
}

.cat-periodical-accordion__places-label {
  flex: 0 0 auto;
  color: var(--cat-ink-soft);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.cat-periodical-accordion__places .cat-subject-chips {
  gap: .4rem;
}

.cat-periodical-accordion__places .cat-subject-chips li {
  font-size: .74rem;
}

.cat-periodical-accordion__places .cat-subject-chips a {
  padding: .35rem .65rem;
}

.cat-periodical-accordion__panel > ol > li > a:hover strong,
.cat-periodical-accordion__panel > ol > li > a:focus-visible strong {
  color: var(--cat-red);
  text-decoration: underline;
  text-underline-offset: .18rem;
}

.cat-periodical-accordion__panel > ol > li > a span {
  color: var(--cat-ink-soft);
  font-size: .76rem;
}

.cat-periodical-accordion__link {
  display: inline-flex;
}

.cat-periodical-pending {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--cat-line);
}

.cat-periodical-pending__label {
  margin: 0 0 .6rem;
  color: var(--cat-ink-soft);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.cat-source-links {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: 1rem;
}

.cat-source-links a {
  padding: .45rem .65rem;
  background: var(--cat-surface);
  border: 1px solid var(--cat-line);
  font-size: .75rem;
  text-decoration: none;
}

.cat-periodical-profile {
  display: grid;
  grid-template-columns: minmax(330px, 1.2fr) minmax(0, 1fr);
  overflow: hidden;
}

.cat-periodical-masthead {
  display: grid;
  min-height: 300px;
  align-content: center;
  padding: clamp(2rem, 5vw, 4rem);
  background:
    linear-gradient(rgb(22 58 73 / 88%), rgb(22 58 73 / 94%)),
    repeating-linear-gradient(0deg, transparent 0 27px, rgb(255 255 255 / 8%) 28px 29px);
  color: #fff;
}

.cat-periodical-masthead > span {
  color: #e7c369;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.cat-periodical-masthead > strong {
  margin: .75rem 0;
  font: 600 clamp(2.2rem, 4vw, 4rem)/1.02 var(--cat-serif);
}

.cat-periodical-masthead > small {
  max-width: 32rem;
  color: #c9d7dc;
}

.cat-periodical-stats {
  display: grid;
  grid-template-columns: 1fr;
  align-content: center;
  padding: clamp(1.5rem, 4vw, 3rem);
}

.cat-periodical-stats div {
  display: grid;
  min-height: 94px;
  align-content: center;
  padding: 1rem;
  border-bottom: 1px solid var(--cat-line);
}

.cat-periodical-stats strong {
  color: var(--cat-red-deep);
  font: 600 clamp(1.5rem, 3vw, 2.6rem) var(--cat-serif);
}

.cat-periodical-stats span {
  color: var(--cat-ink-soft);
  font-size: .75rem;
}

.cat-periodical-description {
  grid-column: 1 / -1;
  margin: 0;
  padding: 1.2rem clamp(1.5rem, 4vw, 3rem);
  border-top: 1px solid var(--cat-line);
}

@media (max-width: 980px) {
.cat-periodical-profile {
    grid-template-columns: 1fr;
  }
.cat-periodical-masthead {
    min-height: 250px;
  }
}

.cat-source-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 0.8rem;
}

.cat-source-cards a {
  display: grid;
  min-height: 145px;
  padding: 1rem;
  border: 1px solid #d7cdbc;
  color: inherit;
  text-decoration: none;
}

.cat-source-cards small { color: #8d2631; font-weight: 700; text-transform: uppercase; }

.cat-source-cards strong { margin: 0.5rem 0; color: #173a4b; font-family: "Source Serif 4", serif; font-size: var(--cat2-text-2); }

.cat-source-cards span { margin-top: auto; color: #8d2631; font-weight: 700; }

/* Lectura editorial de fichas, directorios y series históricas · 2026-07-29 */

.cat-periodical-context {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr);
  gap: clamp(2rem, 5vw, 5rem);
  padding: clamp(2rem, 4vw, 4rem);
  border-top: 1px solid #d8cdbb;
  background: #fbf8f1;
}

/* Misma regla que catalogo-ficha-lugar.css @media(max-width:980px), repetida
   aqui a proposito: esta hoja se carga despues en base.html, asi que su
   regla base (sin media query) gana el empate de especificidad sobre la
   regla responsive del otro archivo aunque esa media query este activa.
   El minmax(320px, ...) de la columna derecha no cabe en movil y produce
   una sola palabra por linea superpuesta con la lista dt/dd (visto en
   produccion en viewport de 320px). Duplicar la regla en el mismo archivo
   evita depender del orden de <link> entre hojas de estilo. */
@media (max-width: 980px) {
  .cat-periodical-context {
    grid-template-columns: 1fr;
  }
}

.cat-periodical-context .cat-periodical-description {
  max-width: 760px;
  color: #263f4b;
  font: 500 clamp(1.15rem, 1.6vw, 1.45rem)/1.7 "Source Serif 4", serif;
}

.cat-periodical-context dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border-top: 3px solid #173e4d;
}

.cat-periodical-context dl div { padding: 1rem 0; border-bottom: 1px solid #d8cdbb; }

.cat-periodical-context dl div:nth-child(odd) { padding-right: 1.25rem; }

.cat-periodical-context dd {
  margin: 0.35rem 0 0;
  color: #173a4b;
  font-weight: 650;
  line-height: 1.45;
}

.cat-periodical-context dl .cat-periodical-context__sources {
  grid-column: 1 / -1;
  padding-right: 0;
}

.cat-periodical-context__sources dd {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem .9rem;
}

.cat-periodical-context__sources a {
  color: #173a4b;
  font-size: .88rem;
  font-weight: 700;
  text-decoration-color: #bb8b3f;
  text-decoration-thickness: 1px;
  text-underline-offset: .22em;
}

.cat-periodical-context__sources a:hover,
.cat-periodical-context__sources a:focus-visible { color: #8d2631; }

@media (max-width: 620px) {
.cat-periodical-context dl,
  .cat-entity-cards,
  .cat-people-grid--directory { grid-template-columns: 1fr; }
}

/* Corte oblicuo en el borde derecho, como los acordeones documentales --
   solo la forma; el color (crema cerrado, navy abierto) lo decide el
   bloque de arriba, no se fuerza aqui. */

.cat-periodical-accordion__item { overflow: visible; border: 0; background: transparent; box-shadow: none; }

.cat-periodical-accordion__item summary {
  position: relative;
  margin-right: 1.25rem;
  padding-right: 2.5rem;
  border-bottom: 3px solid #c9922f;
  clip-path: polygon(0 0, calc(100% - 1.2rem) 0, 100% 50%, calc(100% - 1.2rem) 100%, 0 100%);
}

.cat-periodical-accordion__panel { margin: 0 1.25rem 0 0; border: 1px solid var(--cat-line); border-top: 0; background: #fffdf8; }

@media (max-width: 680px) {
.cat-periodical-accordion__item summary { grid-template-columns: 30px minmax(0, 1fr) auto 30px; gap: .6rem; margin-right: 0; padding: .75rem .65rem; clip-path: none; }
.cat-periodical-accordion__number { font-size: 1rem; }
.cat-periodical-accordion__title strong { font-size: 1rem; line-height: 1.25; }
.cat-periodical-accordion__badge { min-width: 1.7rem; height: 1.7rem; font-size: .8rem; }
.cat-periodical-accordion__toggle { width: 1.7rem; height: 1.7rem; font-size: 1.05rem; }
.cat-periodical-accordion__panel { margin-right: 0; padding: 1rem; }
.cat-periodical-accordion__panel > ol > li > a { grid-template-columns: 1fr; gap: .2rem; }
}

.cat-source-reference {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1rem;
  align-items: center;
  padding: .75rem 0;
  border-bottom: 1px solid #e1d7c8;
}

.cat-source-reference > span {
  flex: 1 1 320px;
}

.cat-source-reference a {
  color: #741923;
  font-weight: 800;
}

.cat-source-reference small {
  color: #765b36;
  font-weight: 700;
}

.cat-occupation-context .cat-source-links {
  margin-top: 1.4rem;
}

.cat-occupation-context .cat-source-links a {
  color: var(--cat-red);
}

.cat-source-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
  gap: clamp(2rem, 6vw, 7rem);
  padding: clamp(2rem, 5vw, 5rem);
  border-top: 4px solid var(--cat-red);
  background: #f0e7d7;
}

/* Misma regla que catalogo-ficha-lugar.css @media(max-width:760px), repetida
   aqui a proposito: mismo bug de cascada que .cat-periodical-context y
   .cat-authority-profile--person (ver CORRECCIONES-RENDIMIENTO-Y-UI-20260906.md
   S2) -- esta hoja se carga despues en base.html y su regla base gana el
   empate de especificidad. El minmax(280px, ...) no cabe en movil y
   superponia el boton "Leer el estudio completo en PDF" sobre el titulo
   "Trazabilidad de la serie" (visto en produccion, mapa-tres-leguas). */
@media (max-width: 760px) {
  .cat-source-panel {
    grid-template-columns: 1fr;
  }
}

.cat-source-panel dl {
  display: grid;
  gap: .75rem;
  margin-top: 2rem;
}

.cat-source-panel dl div {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 1rem;
  padding-top: .75rem;
  border-top: 1px solid #cdbfa9;
}

@media (max-width: 480px) {
  /* Mismo mecanismo que .cat-person-record__facts dl div (catalogo-
     personas.css): la fila etiqueta/valor de arriba (130px + 1fr) es una
     rejilla propia que el colapso de .cat-source-panel (@media 760px, más
     arriba) no toca. A 320px el mínimo de contenido de esa fila fuerza al
     contenedor padre a crecer por encima del ancho real disponible --
     confirmado: 12px de desbordamiento horizontal en /destacados/
     salvatierra-tres-leguas/ (scrollWidth 332 vs clientWidth 320). Se
     apila la etiqueta sobre el valor, igual que en persona/artwork.
     IMPORTANTE: esta regla tiene que ir DESPUÉS de la base de la que
     depende (arriba) -- puesta antes, la base (sin media query, siempre
     activa) le gana el empate de cascada y el colapso no llega a
     aplicarse nunca (error real cometido y corregido en esta misma
     sesión: primer intento no funcionó por este motivo exacto). */
  .cat-source-panel dl div {
    grid-template-columns: 1fr;
    gap: .25rem;
  }
}

.cat-source-panel dt {
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.cat-source-panel dd {
  margin: 0;
}

.cat-source-panel__actions {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 1rem;
}

.cat-transcription__intro {
  display: grid;
  grid-template-columns: minmax(280px, .85fr) minmax(320px, 1.15fr);
  gap: clamp(1.5rem, 5vw, 5rem);
  align-items: end;
  padding: clamp(1.5rem, 4vw, 3.5rem);
  border-bottom: 1px solid var(--cat-line);
  background: #efe5d3;
}

/* Bug real de desbordamiento horizontal en movil (confirmado con
   getBoundingClientRect: 289px de exceso en /destacados/salvatierra-tres-
   leguas/): las dos columnas tienen suelo minimo fijo (280px + 320px =
   600px + gap), sin ningun colapso a una columna para pantallas
   estrechas -- se sale de cualquier viewport por debajo de ese suelo. */
@media (max-width: 680px) {
.cat-transcription__intro {
    grid-template-columns: 1fr;
  }
}

.cat-transcription__intro h2 {
  margin-top: .3rem;
}

.cat-transcription__intro > p {
  margin: 0;
  color: var(--cat-ink-soft);
  font: clamp(1rem, 1.5vw, 1.2rem)/1.65 var(--cat-serif);
}

.cat-transcription summary > span:first-child {
  display: grid;
  gap: .25rem;
}

.cat-transcription summary small {
  color: #f0d18c;
  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.cat-transcription summary strong {
  color: #fff;
  font: 650 clamp(1.15rem, 2vw, 1.55rem)/1.2 var(--cat-serif);
}

.cat-transcription__toggle {
  white-space: nowrap;
  font-size: .78rem;
  font-weight: 800;
}

.cat-transcription__hide {
  display: none;
}

.cat-transcription details[open] .cat-transcription__show {
  display: none;
}

.cat-transcription details[open] .cat-transcription__hide {
  display: inline;
}

.cat-transcription__toggle .cat-transcription__icon {
  display: inline-grid;
  width: 1.8rem;
  height: 1.8rem;
  margin-left: .45rem;
  place-items: center;
  border: 1px solid rgb(255 255 255 / 55%);
  border-radius: 50%;
  font-size: 1.15rem;
}

.cat-transcription details[open] .cat-transcription__icon {
  transform: rotate(45deg);
}

.cat-transcription__body {
  max-width: 76ch;
  margin: 0 auto;
  columns: auto;
  padding: clamp(1.75rem, 5vw, 4rem);
}

.cat-transcription__body p {
  break-inside: avoid;
  margin: 0 0 1.25rem;
  color: #243f51;
  font: 1.03rem/1.8 var(--cat-serif);
}

.cat-transcription__body p:first-child {
  color: var(--cat-red-deep);
  font-weight: 700;
}

/* ---- catalogo-territorio-hist.css ---- */
/* ARCA del Tormes -- catalogo.css dividido en ficheros manejables.
   ============================================================================
   Bloque: Territorio historico / cartografia (cat-arch-*, cat-cartography-*, cat-viewer-*, cat-tree-*).
   Extraido mecanicamente de catalogo.css (script de particion por prefijo de
   clase real, no reescrito a mano) para reducir el fichero monolitico. SIN
   CAPA a proposito -- se mantiene la misma prioridad de cascada que tenia
   dentro de catalogo.css (nunca tuvo capa), asi que mover estas reglas aqui
   no cambia que gana frente a que en ningun conflicto de especificidad
   existente. Cargado justo despues de catalogo.css en base.html para
   conservar el mismo orden relativo (reglas generales primero, estas
   despues), igual que estaban fisicamente despues en el fichero original en
   la mayoria de los casos.
   ============================================================================ */

/* Franja de cifras del cuadro de clasificacion: lectura rapida del volumen
   real del archivo antes de entrar en el arbol, al estilo de la "ficha
   tecnica" que abre los cuadros de clasificacion de archivos historicos
   (fondo, colecciones, series, unidades documentales). */

.cat-archive-register {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: 0;
  margin: 0 0 2rem;
  border: 1px solid var(--cat-line);
  border-top: 4px solid var(--cat-blue-deep);
  background: var(--cat-surface);
}

.cat-archive-register > div {
  padding: 1.1rem 1.2rem;
  border-left: 1px solid var(--cat-line);
  text-align: center;
}

.cat-archive-register > div:first-child {
  border-left: none;
}

.cat-archive-register strong {
  display: block;
  font: 650 2rem var(--cat-serif);
  color: var(--cat-blue-deep);
}

.cat-archive-register span {
  display: block;
  margin-top: .2rem;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--cat-ink-soft);
}

@media (max-width: 680px) {
.cat-archive-register > div {
    border-left: none;
    border-top: 1px solid var(--cat-line);
  }
.cat-archive-register > div:first-child {
    border-top: none;
  }
}

.cat-tree-root__head .cat-eyebrow code,
.cat-tree-children .cat-eyebrow code {
  font-size: .78em;
  color: var(--cat-ink-soft);
  background: none;
  padding: 0;
}

.cat-tree-root {
  background: var(--cat-surface);
  border: 1px solid var(--cat-line);
}

.cat-tree-root__head {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 1rem 1.4rem;
  align-items: start;
  padding: clamp(1.25rem, 3vw, 2.2rem);
}

.cat-tree-code {
  color: var(--cat-red);
  font: 600 1.5rem var(--cat-serif);
}

.cat-tree-root__head h2 {
  font-size: clamp(1.55rem, 3vw, 2.25rem);
}

.cat-tree-root__head h2 a,
.cat-tree-children h3 a {
  color: var(--cat-ink);
  text-decoration: none;
}

.cat-tree-root__head h2 a:hover,
.cat-tree-children h3 a:hover {
  color: var(--cat-red-deep);
  text-decoration: underline;
}

.cat-tree-root__head p,
.cat-tree-children p {
  max-width: 65rem;
  margin: .65rem 0 0;
  color: var(--cat-ink-soft);
}

.cat-tree-count {
  padding: .35rem .65rem;
  background: var(--cat-paper);
  color: var(--cat-ink-soft);
  font-size: .8rem;
  font-weight: 700;
  white-space: nowrap;
}

.cat-tree-children {
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--cat-line);
  list-style: none;
}

.cat-tree-children li {
  position: relative;
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 1rem 1.4rem;
  padding: 1.3rem 2rem 1.3rem calc(clamp(1.25rem, 3vw, 2.2rem) + 2.5rem);
  border-bottom: 1px solid #e8e1d6;
}

.cat-tree-children li:last-child {
  border-bottom: 0;
}

.cat-tree-children .cat-tree-code {
  font-size: 1rem;
}

.cat-tree-children h3 {
  font-size: 1.25rem;
}

.cat-tree-line {
  position: absolute;
  left: clamp(1.25rem, 3vw, 2.2rem);
  top: 0;
  bottom: 0;
  width: 1.5rem;
  border-left: 1px solid #b7aa96;
  border-bottom: 1px solid #b7aa96;
}

.cat-tree-children li:last-child .cat-tree-line {
  bottom: 50%;
}

.cat-tree-empty {
  padding: 1rem 2rem;
  border-top: 1px solid var(--cat-line);
  color: #68777e;
}

.cat-tree-empty span {
  margin-right: .5rem;
  color: var(--cat-gold);
}

.cat-viewer-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(260px, .55fr);
  gap: 1.5rem;
  align-items: start;
}

.cat-viewer {
  min-width: 0;
  overflow: hidden;
  background: #e7e1d6;
  border: 1px solid var(--cat-line);
  box-shadow: var(--cat-shadow);
}

.cat-viewer__stage {
  display: grid;
  min-height: 480px;
  place-items: center;
  background:
    repeating-conic-gradient(#dfd8cb 0 25%, #e8e2d7 0 50%) 50% / 24px 24px;
}

.cat-viewer__stage img,
.cat-viewer__stage video,
.cat-viewer__stage object {
  display: block;
  width: 100%;
  max-height: 78vh;
  object-fit: contain;
  background: #1b252a;
}

.cat-viewer__stage object {
  min-height: 72vh;
}

.cat-viewer__stage--empty {
  align-content: center;
  padding: 3rem;
  text-align: center;
}

.cat-viewer__stage--empty strong {
  margin-top: 1rem;
  font: 600 1.5rem var(--cat-serif);
}

.cat-viewer__stage--empty p {
  max-width: 28rem;
  color: var(--cat-ink-soft);
}

.cat-viewer__caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.2rem;
  background: var(--cat-surface);
}

.cat-viewer__caption div {
  display: grid;
}

.cat-viewer__caption span {
  color: var(--cat-ink-soft);
  font-size: .82rem;
}

.cat-viewer__caption a {
  white-space: nowrap;
}

@media (max-width: 900px) {
/* Tamano e z-index del logo y la topbar en movil: los define
     responsive-a11y.css, que se carga el ultimo. */
.cat-viewer-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
.cat-tree-root__head {
    grid-template-columns: 44px 1fr;
  }
.cat-tree-count {
    grid-column: 2;
    justify-self: start;
  }
.cat-tree-children li {
    grid-template-columns: 44px 1fr;
    padding-left: 1.25rem;
  }
.cat-tree-line {
    display: none;
  }
.cat-viewer__stage {
    min-height: 340px;
  }
.cat-viewer__stage object {
    min-height: 60vh;
  }
.cat-viewer__caption {
    align-items: start;
    flex-direction: column;
  }
}

/* Inventario arqueológico JCyL */

.cat-arch-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
  gap: clamp(1.5rem, 4vw, 4rem);
  margin-bottom: 2rem;
  padding: clamp(1.6rem, 4vw, 3.5rem);
  border-bottom: 4px solid var(--cat-gold);
  background:
    linear-gradient(100deg, rgb(16 48 62 / 97%) 0 61%, rgb(16 48 62 / 78%)),
    radial-gradient(circle at 80% 20%, #447181, #173746);
  color: #fff;
}

.cat-arch-hero h1,
.cat-arch-detail-hero h1 { margin: .1rem 0 .8rem; color: #fff; font-family: var(--cat-serif); font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.05; }

/* Addenda 2026-08-14 (misma jornada, tras el rebuild anterior): esta regla
   fijaba font-size:1.12rem (17,92px). Al tener más peso (0,2,2) que
   ".cat-hero > div > p" (0,1,2), ganaba SIEMPRE sin importar el orden en
   el archivo — es un empate de especificidad distinto a los ya corregidos
   (aquellos eran empates reales; este no era empate, era mayor peso por el
   ":last-child"). Detectado en vivo: yacimientos medía 17,92px en vez del
   estándar 15,52px. Se quita el tamaño; el resto de la regla (max-width,
   color) no cambia porque coincide con el sistema unificado. */

.cat-arch-hero > div > p:last-child { max-width: 760px; margin: 0; color: #d9e3e7; }

.cat-arch-hero .cat-kicker,
.cat-arch-detail-hero .cat-kicker { color: #f0c76c; }

.cat-arch-stats { display: grid; grid-template-columns: repeat(3, 1fr); align-self: end; margin: 0; border: 1px solid rgb(255 255 255 / 24%); }

.cat-arch-stats div { padding: 1rem .7rem; text-align: center; }

.cat-arch-stats div + div { border-left: 1px solid rgb(255 255 255 / 24%); }

.cat-arch-stats dt { color: #c9d9df; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; }

.cat-arch-stats dd { margin: .2rem 0 0; color: #fff; font-family: var(--cat-serif); font-size: 2rem; font-weight: 700; }

.cat-arch-workbench { margin-bottom: 2.4rem; border: 1px solid #cfc5b5; background: #fffdf8; box-shadow: var(--cat-shadow); }

.cat-arch-workbench__heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--cat-line); }

.cat-arch-workbench__heading h2,
.cat-arch-catalogue > header h2,
.cat-arch-detail-copy h2,
.cat-arch-detail-aside h2,
.cat-arch-related h2 { margin: .1rem 0 0; font-family: var(--cat-serif); font-size: clamp(1.55rem, 3vw, 2.3rem); }

.cat-arch-map-tools { display: flex; max-width: 470px; align-items: end; gap: .8rem; }

.cat-arch-map-tools p { margin: 0; color: var(--cat-ink-soft); font-size: .9rem; text-align: right; }

.cat-arch-map-tools button { flex: 0 0 auto; min-height: 38px; padding: .45rem .7rem; border: 1px solid var(--cat-red-deep); background: transparent; color: var(--cat-red-deep); font: inherit; font-size: .78rem; font-weight: 800; cursor: pointer; }

.cat-arch-map-tools button:hover,
.cat-arch-map-tools button[aria-expanded="true"] { background: var(--cat-red-deep); color: #fff; }

.cat-arch-map-frame { position: relative; overflow: hidden; }

.cat-arch-map { position: relative; height: 380px; min-height: 0; max-height: 380px; overflow: hidden; background: #e9e3d6; transition: height .22s ease, max-height .22s ease; }

.cat-arch-map.cat-arch-map--expanded { height: 620px; max-height: 620px; }

.cat-arch-map--detail { height: 320px; max-height: 320px; border: 1px solid var(--cat-line); }

.cat-arch-map-status { position: absolute; right: .75rem; bottom: .75rem; z-index: 500; max-width: min(420px, calc(100% - 1.5rem)); margin: 0; padding: .6rem .75rem; border-left: 4px solid var(--cat-gold); background: rgb(255 253 248 / 94%); color: var(--cat-ink); font-size: .78rem; box-shadow: 0 5px 18px rgb(20 35 42 / 15%); }

.cat-arch-map--unavailable { display: grid; place-items: center; padding: 2rem; color: var(--cat-ink-soft); text-align: center; }

.cat-arch-popup { display: grid; gap: .28rem; min-width: 180px; font-family: var(--cat-sans); }

.cat-arch-popup small { color: var(--cat-red-deep); font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }

.cat-arch-popup strong { font-family: var(--cat-serif); font-size: var(--cat2-text-2); }

.cat-arch-popup span { color: var(--cat-ink-soft); font-size: .8rem; }

.cat-arch-popup a { margin-top: .25rem; font-weight: 700; }

.cat-arch-catalogue > header { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }

.cat-arch-result-count { margin: 0; padding: .35rem .65rem; border: 1px solid #cfae70; background: #fbf3e3; color: var(--cat-red-deep); font-weight: 700; }

.cat-arch-filters { display: grid; grid-template-columns: minmax(190px, 1.3fr) repeat(3, minmax(145px, 1fr)) auto; gap: .7rem; margin-bottom: 1.4rem; padding: 1rem; border-top: 3px solid var(--cat-blue-deep); background: #ece5d8; }

.cat-arch-filters__field { display: grid; gap: .2rem; }

.cat-arch-filters__field label { font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.cat-arch-filters input,
.cat-arch-filters select { width: 100%; min-height: 43px; padding: .55rem .65rem; border: 1px solid #b9ae9d; border-radius: 0; background: #fff; color: var(--cat-ink); font: inherit; }

.cat-arch-filters button { align-self: end; min-height: 43px; padding: .55rem .8rem; border: 1px solid var(--cat-red-deep); background: transparent; color: var(--cat-red-deep); font: inherit; font-weight: 700; cursor: pointer; }

.cat-arch-filters button:hover { background: var(--cat-red-deep); color: #fff; }

.cat-arch-municipalities { display: grid; gap: .75rem; }

.cat-arch-municipality { border: 1px solid var(--cat-line); background: #fffdf8; }

.cat-arch-municipality[hidden] { display: none; }

.cat-arch-municipality > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto 32px; gap: .8rem; align-items: center; min-height: 62px; padding: .7rem 1rem; cursor: pointer; list-style: none; background: #edf0eb; color: var(--cat-blue-deep); transition: background .18s ease; }

.cat-arch-municipality > summary::-webkit-details-marker { display: none; }

.cat-arch-municipality > summary:hover,
.cat-arch-municipality[open] > summary { background: #e1e9e5; }

.cat-arch-municipality > summary strong { font-family: var(--cat-serif); font-size: var(--cat2-text-2); }

.cat-arch-municipality > summary span { color: var(--cat-ink-soft); font-size: .76rem; font-weight: 800; }

.cat-arch-municipality > summary span b { display: inline-grid; min-width: 1.8rem; min-height: 1.8rem; margin-right: .25rem; place-items: center; border-radius: 50%; background: #f2e1dc; color: var(--cat-red-deep); }

.cat-arch-municipality > summary i { display: grid; width: 1.55rem; height: 1.55rem; place-items: center; border: 1px solid var(--cat-gold); border-radius: 50%; color: var(--cat-red-deep); font-style: normal; transition: transform .18s ease; }

.cat-arch-municipality[open] > summary i { transform: rotate(45deg); }

.cat-arch-municipality > .cat-arch-grid { padding: 1rem; border-top: 1px solid var(--cat-line); background: #f4efe6; }

.cat-arch-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }

.cat-arch-card { display: grid; grid-template-columns: 96px minmax(0, 1fr); min-height: 220px; border: 1px solid var(--cat-line); background: #fffdf8; box-shadow: 0 6px 16px rgb(21 37 46 / 6%); }

.cat-arch-card[hidden] { display: none; }

.cat-arch-card__index { display: flex; flex-direction: column; justify-content: space-between; padding: 1rem .75rem; background: var(--cat-blue-deep); color: #fff; }

.cat-arch-card__index span { color: #f0d18c; font-size: .72rem; font-weight: 700; line-height: 1.25; text-transform: uppercase; }

.cat-arch-card__index strong { font-family: var(--cat-serif); font-size: var(--cat2-text-3); font-weight: 600; }

.cat-arch-card__body { display: flex; flex-direction: column; padding: 1rem 1.15rem; }

.cat-arch-card__body h3 { margin: .15rem 0 .45rem; font-family: var(--cat-serif); font-size: var(--cat2-text-3); line-height: 1.1; }

.cat-arch-card__body > p:not(.cat-kicker) { margin: .7rem 0; color: var(--cat-ink-soft); }

/* 22px de alto: por debajo del objetivo mínimo de 24×24 del criterio WCAG
   2.2 §2.5.8, y son 84 enlaces en la página de yacimientos, uno por ficha.
   Al ser `display:block` no les vale la excepción de enlace en línea. */

.cat-arch-card__body > a { margin-top: auto; padding-block: .2rem; font-weight: 700; text-decoration: none; }

.cat-arch-tags { display: flex; flex-wrap: wrap; gap: .3rem; }

.cat-arch-tags span { padding: .18rem .4rem; background: #f2e7cf; color: #643e12; font-size: .72rem; }

.cat-arch-empty { padding: 3rem; border: 1px dashed var(--cat-line); text-align: center; }

.cat-arch-source { margin-top: 2rem; padding: 1rem 1.2rem; border-left: 4px solid var(--cat-gold); background: #f7edda; color: var(--cat-ink-soft); font-size: .9rem; }

.cat-arch-source p { margin: .25rem 0; }

.cat-arch-detail-hero { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; padding: clamp(1.6rem, 4vw, 3.2rem); border-bottom: 4px solid var(--cat-gold); background: var(--cat-blue-deep); color: #fff; }

.cat-arch-detail-hero > div > p:last-child { margin: 0; color: #cfdee3; }

.cat-arch-detail-hero__id { flex: 0 0 auto; min-width: 110px; padding: .7rem; border: 1px solid rgb(255 255 255 / 30%); color: #f0d18c; font-size: .72rem; letter-spacing: .1em; text-align: center; text-transform: uppercase; }

.cat-arch-detail-hero__id strong { color: #fff; font-family: var(--cat-serif); font-size: var(--cat2-text-3); letter-spacing: 0; }

.cat-arch-detail-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(310px, .65fr); gap: 2rem; align-items: start; }

.cat-arch-detail-copy { display: grid; gap: 1.25rem; }

.cat-arch-detail-copy > section,
.cat-arch-detail-aside > section { padding: 1.4rem; border: 1px solid var(--cat-line); background: #fffdf8; }

.cat-arch-lead { margin-bottom: 0; white-space: pre-line; font-family: var(--cat-serif); font-size: 1.12rem; line-height: 1.75; }

.cat-arch-muted { color: var(--cat-ink-soft); font-style: italic; }

.cat-arch-editorial-note { margin-top: 1rem; padding: .7rem .85rem; border-left: 3px solid var(--cat-gold); background: #f8f0e1; color: var(--cat-ink-soft); font-size: .86rem; }

.cat-arch-attributions { display: grid; gap: .65rem; margin-top: 1rem; }

.cat-arch-attributions article { padding: .9rem 1rem; border-left: 4px solid var(--cat-blue); background: #f3eee4; }

.cat-arch-attributions article > div { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }

.cat-arch-attributions ul { margin: .55rem 0 0; padding-left: 1.2rem; color: var(--cat-ink-soft); }

.cat-arch-certainty { padding: .18rem .42rem; border: 1px solid #a8a092; color: var(--cat-ink-soft); font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }

.cat-arch-certainty--segura { border-color: #447460; color: #315c4a; }

.cat-arch-certainty--posible { border-color: #c18a2c; color: #7b5516; }

.cat-arch-detail-aside { display: grid; gap: 1rem; }

.cat-arch-coordinates { margin: .5rem 0 0; color: var(--cat-ink-soft); font-variant-numeric: tabular-nums; text-align: right; }

.cat-arch-facts { margin: .75rem 0 0; }

.cat-arch-facts div { display: grid; grid-template-columns: 105px minmax(0, 1fr); gap: .7rem; padding: .55rem 0; border-top: 1px solid var(--cat-line); }

.cat-arch-facts dt { color: var(--cat-red-deep); font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }

.cat-arch-facts dd { margin: 0; }

.cat-arch-official { border-top: 4px solid var(--cat-red) !important; }

.cat-arch-official a { display: inline-block; padding: .55rem .75rem; background: var(--cat-red-deep); color: #fff; font-weight: 700; text-decoration: none; }

.cat-arch-table-wrap { overflow-x: auto; }

.cat-arch-table-wrap table { width: 100%; border-collapse: collapse; }

.cat-arch-table-wrap td { padding: .55rem; border: 1px solid var(--cat-line); }

.cat-arch-related { margin-top: 2rem; }

.cat-arch-related > div { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; }

.cat-arch-related a { display: flex; flex-direction: column; min-height: 145px; padding: .9rem; border-top: 3px solid var(--cat-gold); background: var(--cat-blue-deep); color: #fff; text-decoration: none; }

.cat-arch-related a small { color: #f0d18c; }

.cat-arch-related a strong { margin: .45rem 0; font-family: var(--cat-serif); font-size: var(--cat2-text-2); }

.cat-arch-related a span { margin-top: auto; color: #d5e1e5; }

@media (max-width: 1100px) {
.cat-arch-hero { grid-template-columns: 1fr; }
.cat-arch-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cat-arch-filters button { align-self: stretch; }
.cat-arch-detail-layout { grid-template-columns: 1fr; }
.cat-arch-related > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
.cat-arch-hero,
  .cat-arch-detail-hero { margin-inline: -1rem; }
.cat-arch-hero h1,
  .cat-arch-detail-hero h1 { font-size: clamp(2.3rem, 13vw, 3.5rem); }
/* Se mantienen las tres cifras en fila también en móvil (2026-08-14): al
     apilarlas, esta cabecera medía 686px de alto frente a los 236-277px de
     las demás y era, con diferencia, la más larga del catálogo en móvil.
     Son tres números cortos con una etiqueta de una palabra: caben. */
.cat-arch-stats { grid-template-columns: repeat(3, 1fr); }
.cat-arch-stats div { padding: .7rem .5rem; }
.cat-arch-stats dt { font-size: .68rem; }
.cat-arch-workbench__heading { display: block; }
.cat-arch-map-tools { display: block; max-width: none; margin-top: .7rem; }
.cat-arch-map-tools p { margin-bottom: .6rem; text-align: left; }
.cat-arch-map { height: 330px; min-height: 0; max-height: 330px; }
.cat-arch-map.cat-arch-map--expanded { height: 500px; max-height: 500px; }
.cat-arch-map--detail { height: 290px; max-height: 290px; }
.cat-arch-filters,
  .cat-arch-grid,
  .cat-arch-related > div { grid-template-columns: 1fr; }
.cat-arch-card { grid-template-columns: 72px minmax(0, 1fr); }
.cat-arch-detail-hero { align-items: start; }
.cat-arch-detail-hero__id { min-width: 84px; }
}

@media (max-width: 560px) {
.cat-arch-municipality > summary { grid-template-columns: minmax(0, 1fr) auto 28px; padding-inline: .75rem; }
.cat-arch-municipality > summary span { font-size: 0; }
.cat-arch-municipality > summary span b { margin-right: 0; font-size: .72rem; }
.cat-arch-card { grid-template-columns: 72px minmax(0, 1fr); }
}

/* Cartografía histórica del Fondo Familia Gallego Angulo */

/* cat-section-hero no tenia NINGUN CSS propio (confirmado: grep vacio en
   todo el catalogo) -- heredaba el h1/kicker base sin la afinacion que ya
   tiene .cat-hero (aplicada a proposito a 6 paginas del sitio, ver
   catalogo-estudios.css "Un solo tamaño de titular para todo el catalogo").
   Resultado real medido con getComputedStyle: h1 a 45px/51.2px (movil/
   escritorio) en vez de 33.75px/57.6px... -- ver nota abajo, kicker a
   12.16px en vez de 15.52-16.32px. Bug real senalado por el propietario
   (capturas: tamaños de fuente no uniformes entre territorio.html/ficha de
   lugar y cartografia_historica*.html). Se iguala aqui el tamaño de h1 y
   kicker al mismo valor que .cat-hero, SIN adoptar su fondo navy (esta
   cabecera es intencionalmente clara) -- alineacion de lenguaje tipografico,
   no sustitucion de componente completo (mismo criterio que cat-territory-
   grid/cat-cartography-card en este mismo fichero). */
.cat-section-hero .cat-kicker {
  font-size: 1rem;
}
.cat-section-hero h1 {
  max-width: 24ch;
  font-size: clamp(2.1rem, 4.6vw, 3.6rem);
  font-weight: 650;
  letter-spacing: -.03em;
  line-height: 1.02;
}
@media (max-width: 900px) {
  .cat-section-hero h1 {
    font-size: clamp(2rem, 9vw, 2.75rem);
    line-height: 1.06;
  }
}

.cat-cartography-index,
.cat-cartography-record { margin-block: 1.5rem 3rem; }

.cat-cartography-grid { display: grid; gap: 1.2rem; grid-template-columns: 1fr; }

/* Alineado al lenguaje visual de cat-card: filete dorado arriba, radio,
   sombra al hover. No se sustituye por cat-card porque la estructura es
   distinta (imagen + <dl> de metadatos, que cat-card no tiene) -- ver
   docs/THEME-ARCA.md. */
.cat-cartography-card { display: grid; grid-template-columns: minmax(18rem, .72fr) minmax(0, 1.28fr); overflow: hidden; border: 1px solid #d6c9b5; border-top: 3px solid var(--cat-gold); border-radius: 8px; background: #fffdf8; box-shadow: 0 2px 8px rgb(21 37 46 / 7%); transition: transform .18s ease, box-shadow .18s ease; }

.cat-cartography-card:hover { transform: translateY(-3px); box-shadow: 0 10px 22px rgb(18 46 59 / 16%); }

.cat-cartography-card img { width: 100%; height: 100%; min-height: 18rem; object-fit: cover; border-right: 4px solid #bd7c16; }

.cat-cartography-card > div { padding: 1.2rem; }

.cat-cartography-card h3 { margin: .25rem 0 .7rem; color: #173f4d; font: var(--cat2-text-3) var(--cat-serif); }

.cat-cartography-card h3 a { color: inherit; text-decoration: none; }

.cat-cartography-card h3 a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .18em; }

.cat-cartography-card dl { display: grid; gap: .35rem; margin: 1rem 0; }

.cat-cartography-card dl div { display: grid; grid-template-columns: 5rem 1fr; gap: .5rem; }

.cat-cartography-card dt { color: #7f1d29; font-weight: 800; }

.cat-cartography-card dd { margin: 0; }

.cat-cartography-record__figure { margin: 1.5rem 0; border: 1px solid #d6c9b5; background: #f2eadb; }

.cat-cartography-record__figure img { display: block; width: 100%; max-height: 72vh; object-fit: contain; }

.cat-cartography-record__viewer { width: 100%; height: 72vh; background: #e4dac6; }

.cat-cartography-record__zoom-toggle { display: block; width: 100%; border: 0; border-top: 1px solid #d6c9b5; border-bottom: 1px solid #d6c9b5; background: #173f4d; color: #fff; font: inherit; font-weight: 700; padding: .8rem 1rem; text-align: center; cursor: pointer; }

.cat-cartography-record__zoom-toggle:hover,
.cat-cartography-record__zoom-toggle:focus-visible { background: #0e2933; }

.cat-cartography-record__figure figcaption { padding: .7rem 1rem; color: #4b443b; }

.cat-cartography-metadata { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid #d6c9b5; border-left: 1px solid #d6c9b5; }

.cat-cartography-metadata div { padding: .8rem 1rem; border-right: 1px solid #d6c9b5; border-bottom: 1px solid #d6c9b5; }

.cat-cartography-metadata dt { margin-bottom: .2rem; color: #7f1d29; font-size: .78rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }

.cat-cartography-metadata dd { margin: 0; color: #173f4d; font-weight: 700; }

.cat-cartography-record__actions { display: flex; flex-wrap: wrap; gap: .7rem; }

@media (max-width: 900px) {
.cat-cartography-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
.cat-cartography-card { grid-template-columns: 1fr; }
.cat-cartography-card img { height: 16rem; min-height: 0; border-right: 0; border-bottom: 4px solid #bd7c16; }
.cat-cartography-metadata { grid-template-columns: 1fr; }
}

/* ---- catalogo-oficios-materias.css ---- */
/* ARCA del Tormes -- catalogo.css dividido en ficheros manejables.
   ============================================================================
   Bloque: Oficios y materias (cat-occupation-*, cat-subject-*, cat-directory-*).
   Extraido mecanicamente de catalogo.css (script de particion por prefijo de
   clase real, no reescrito a mano) para reducir el fichero monolitico. SIN
   CAPA a proposito -- se mantiene la misma prioridad de cascada que tenia
   dentro de catalogo.css (nunca tuvo capa), asi que mover estas reglas aqui
   no cambia que gana frente a que en ningun conflicto de especificidad
   existente. Cargado justo despues de catalogo.css en base.html para
   conservar el mismo orden relativo (reglas generales primero, estas
   despues), igual que estaban fisicamente despues en el fichero original en
   la mayoria de los casos.
   ============================================================================ */

.cat-entity-cards,
.cat-subject-chips {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.cat-subject-chips { display: flex; flex-wrap: wrap; }

/* catalogo-hemeroteca.css ya trae un @media(max-width:620px) que colapsa
   .cat-entity-cards a 1 columna -- pero ese fichero carga ANTES que este en
   base.html, así que la regla base de aquí (2 columnas, sin suelo mínimo
   pero igual de estrecha en la práctica) le gana el empate de
   especificidad y el colapso nunca llega a aplicarse. Mismo mecanismo que
   .cat-source-panel/.cat-transcription__intro, encontrado hoy con
   auditoría estática del CSS (visto en producción: "Cartografía y
   geografía"/"Justicia y jurisdicción" partidas letra a letra en el índice
   de entidades). Se repite aquí la misma regla para que el fichero que
   gana la cascada sea también el que la aplica. */
@media (max-width: 620px) {
  .cat-entity-cards { grid-template-columns: 1fr; }
}

.cat-subject-chips li {
  padding: 0.55rem 0.85rem;
  border: 1px solid #dbcdaF;
  border-radius: 999px;
  background: #f5efe2;
  color: #5e3c19;
  font-size: 0.84rem;
  font-weight: 650;
}

.cat-directory-callout {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.2rem;
  background: #fff3cf;
  border-left: 4px solid #d49d28;
}

.cat-directory-callout p { margin: 0; }

.cat-directory-callout a { color: #7c151f; font-weight: 800; }

.cat-directory-hero {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 2rem;
  /* Esta regla se carga después de la cabecera común y antes anulaba por
     completo su relleno horizontal. En Materias, el título quedaba pegado
     al borde oscuro y podía parecer recortado junto al menú lateral. */
  padding: 2.5rem clamp(1.5rem, 4vw, 3.5rem);
  border-bottom: 1px solid #d8cdbb;
}

.cat-directory-hero h1 { max-width: 920px; margin: 0.25rem 0 0.6rem; }

.cat-directory-hero p { max-width: 780px; }

.cat-directory-search { margin: 2rem 0; }

.cat-directory-search > p { margin: 0.6rem 0 0; color: #5a6a71; }

.cat-directory-search a { align-self: center; color: #7c151f; font-weight: 700; }

@media (max-width: 620px) {
.cat-directory-hero,
  .cat-directory-callout { align-items: flex-start; flex-direction: column; }
}

.cat-subject-chips li {
  padding: 0;
  overflow: hidden;
  flex-shrink: 0;
}

.cat-subject-chips a {
  display: block;
  padding: .55rem .85rem;
  color: #5e3c19;
  text-decoration: none;
  white-space: nowrap;
}

.cat-subject-chips a:hover {
  background: #173e4d;
  color: #fff;
}

.cat-subject-directory__hero {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: end;
}

/* El rojo del tema (#8d2631) se cambió el 2026-08-14: desde que esta
   cabecera va sobre el bloque azul oscuro del sistema unificado, ese rojo
   sobre #122e3b no llega al contraste mínimo de WCAG AA. Se usa el dorado
   de las demás cifras de cabecera. */

.cat-subject-directory__hero > strong {
  flex: 0 0 auto;
  color: #f0c76c;
  font: 600 2rem var(--cat-serif);
}

.cat-directory-search [data-subject-result-count] {
  align-self: center;
  color: #596b73;
  font-size: .85rem;
}

.cat-subject-directory {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}

.cat-directory-search > .cat-subject-directory {
  display: grid;
}

.cat-subject-directory__card {
  display: grid;
  align-content: space-between;
  min-height: 180px;
  border: 1px solid #d6cab7;
  background: #fffdf8;
}

.cat-subject-directory__card[hidden] {
  display: none !important;
}

.cat-subject-directory__card > a {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: .8rem;
  padding: 1.15rem;
  color: #173e4d;
  text-decoration: none;
}

.cat-subject-directory__card > a:hover,
.cat-subject-directory__card > a:focus-visible {
  background: #173e4d;
  color: #fff;
}

.cat-subject-directory__mark {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 50%;
  background: #f5dfaa;
  color: #71151e;
  font: 750 1.25rem var(--cat-serif);
}

.cat-subject-directory__card strong,
.cat-subject-directory__card small {
  display: block;
}

.cat-subject-directory__card strong {
  font: 650 1.2rem/1.18 var(--cat-serif);
}

.cat-subject-directory__card .cat-subject-directory__family {
  margin: 0 0 .4rem;
  color: var(--cat-red);
  font-size: .64rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.cat-subject-directory__card > a:hover .cat-subject-directory__family,
.cat-subject-directory__card > a:focus-visible .cat-subject-directory__family {
  color: #f2dca8;
}

.cat-subject-directory__card small {
  margin-top: .35rem;
  opacity: .78;
}

.cat-subject-directory__card dl {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .8rem;
  margin: 0;
  padding: .75rem 1.15rem;
  border-top: 1px solid #e0d7c8;
  background: #f5f0e7;
}

.cat-subject-directory__card dl div {
  display: flex;
  gap: .3rem;
  color: #52656d;
  font-size: .72rem;
}

.cat-subject-directory__card dt,
.cat-subject-directory__card dd {
  margin: 0;
}

.cat-subject-directory__card dd {
  color: #741923;
  font-weight: 850;
}

@media (max-width: 1180px) {
.cat-subject-directory {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
.cat-subject-directory {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
.cat-subject-directory__hero {
    align-items: start;
    flex-direction: column;
  }
.cat-subject-directory {
    grid-template-columns: 1fr;
  }
}

.cat-occupation-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .55fr);
  gap: clamp(2rem, 5vw, 5rem);
  margin: 1.2rem 0 0;
  padding: clamp(2rem, 5vw, 5rem);
  overflow: hidden;
  background:
    radial-gradient(circle at 80% 15%, rgb(219 177 95 / 18%), transparent 23rem),
    var(--cat-blue-deep);
  color: #f4f0e6;
  box-shadow: var(--cat-shadow);
}

.cat-occupation-hero h1 {
  max-width: 720px;
  margin: .2rem 0 1rem;
  color: #fff;
  font-size: clamp(3rem, 6vw, 6.3rem);
  line-height: .92;
}

.cat-occupation-hero .cat-kicker {
  color: #edc978;
}

.cat-occupation-hero__lead {
  max-width: 64rem;
  color: #e6edf0;
  font: 500 clamp(1.15rem, 2vw, 1.5rem)/1.6 var(--cat-serif);
}

/* Sección de contexto de oficios: los dos párrafos y los enlaces de
   referencia salieron del <header> el 2026-08-14 porque hacían de aquella la
   cabecera más alta del catálogo (1098px frente a 258-401px). Al pasar de
   fondo azul oscuro a fondo claro, los colores que traían —texto #dbe5e8 y
   enlaces en blanco— quedaban ilegibles: se pasan a la tinta del tema.
   Llevaba además un grabado del zapatero en una segunda columna (hotlink a
   Wikimedia): se retiró el 2026-08-15 a petición del propietario, mismo
   criterio que en «Qué es ARCA». Sin imagen, la sección pasa a una sola
   columna también en escritorio -- ya no hace falta el grid de dos
   columnas ni sus reglas de imagen, que se han quitado con ella. */

.cat-occupation-context {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: start;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

.cat-occupation-hero__principles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 0;
}

.cat-occupation-hero__principles p {
  margin: 0;
  padding: 1rem 1.1rem;
  border-top: 2px solid #d6a74d;
  background: rgb(255 253 248 / 75%);
  color: var(--cat-ink);
  font-size: .9rem;
  line-height: 1.55;
}

.cat-occupation-places {
  margin: 1.6rem 0 2.6rem;
}

.cat-occupation-places__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.1rem;
}

.cat-occupation-place-card {
  position: relative;
  display: grid;
  align-content: center;
  gap: .55rem;
  min-height: 190px;
  padding: 1.9rem 2rem;
  border: 1px solid var(--cat-line);
  border-radius: 12px;
  background: #fffdf9;
  text-decoration: none;
  color: var(--cat-ink);
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}

.cat-occupation-place-card.is-available {
  background:
    radial-gradient(circle at 85% 12%, rgb(219 177 95 / 22%), transparent 14rem),
    var(--cat-blue-deep);
  color: #f4f0e6;
  box-shadow: 0 14px 30px rgb(30 43 48 / 16%);
}

.cat-occupation-place-card.is-available strong {
  color: #fff;
  font-size: 1.5rem;
}

.cat-occupation-place-card.is-available span {
  color: #dce6ea;
}

.cat-occupation-place-card.is-available .cat-occupation-place-card__badge {
  color: #2b2110;
}

.cat-occupation-place-card.is-available:hover,
.cat-occupation-place-card.is-available:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 20px 38px rgb(24 38 44 / 22%);
}

.cat-occupation-place-card.is-pending {
  background: #eef1f0;
  color: var(--cat-ink-soft);
  border: 1px dashed #a9b8b3;
}

.cat-occupation-place-card__badge {
  justify-self: start;
  font-family: var(--cat-sans);
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  border-radius: 20px;
  padding: .25rem .7rem;
  background: #edc978;
  color: #2b2110;
}

.cat-occupation-place-card.is-pending .cat-occupation-place-card__badge {
  background: var(--cat-surface);
  color: var(--cat-ink-soft);
  border: 1px solid var(--cat-line);
}

.cat-occupation-place-card strong {
  font: 700 1.3rem var(--cat-serif);
}

.cat-occupation-place-card span {
  font-size: .9rem;
  color: var(--cat-ink-soft);
  line-height: 1.4;
}

.cat-occupation-place-card em {
  margin-top: .5rem;
  font-style: normal;
  font-family: var(--cat-sans);
  font-size: .84rem;
  font-weight: 700;
  color: #edc978;
}

@media (max-width: 760px) {
.cat-occupation-places__grid { grid-template-columns: 1fr; }
}

.cat-occupation-search {
  margin: 1.5rem 0 2.2rem;
  padding: 1.2rem;
  border: 1px solid var(--cat-line);
  background: #f8f3e9;
}

.cat-occupation-search label {
  display: block;
  margin-bottom: .5rem;
  color: var(--cat-red);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.cat-occupation-search > div {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.cat-occupation-search input {
  min-width: 0;
  flex: 1;
  padding: .9rem 1rem;
  border: 1px solid #b9ae9d;
  background: #fff;
  color: var(--cat-ink);
  font: inherit;
}

.cat-occupation-search span {
  min-width: 10rem;
  color: var(--cat-ink-soft);
  font-size: .8rem;
  text-align: right;
}

.cat-occupation-group {
  margin-top: 2.8rem;
}

.cat-occupation-group > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding-bottom: .8rem;
  border-bottom: 2px solid var(--cat-blue-deep);
}

.cat-occupation-group h3 {
  margin: .15rem 0 0;
  font-size: clamp(1.8rem, 3vw, 2.7rem);
}

.cat-occupation-group > header > p {
  margin: 0;
  color: var(--cat-ink-soft);
  font-size: .78rem;
}

.cat-occupation-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}

.cat-occupation-card {
  min-width: 0;
  border: 1px solid var(--cat-line);
  background: #fffdf9;
}

.cat-occupation-card[hidden],
.cat-occupation-group[hidden] {
  display: none;
}

.cat-occupation-card a {
  display: grid;
  grid-template-columns: 3.1rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .85rem;
  min-height: 8.4rem;
  padding: 1rem;
  color: var(--cat-ink);
  text-decoration: none;
}

.cat-occupation-card__initial {
  display: grid;
  width: 3.1rem;
  aspect-ratio: 1;
  place-items: center;
  border-radius: 50%;
  background: var(--cat-blue-deep);
  color: #fff;
  font: 650 1.45rem var(--cat-serif);
}

.cat-occupation-card__body {
  display: grid;
  gap: .35rem;
}

.cat-occupation-card__body strong {
  font: 650 1.2rem var(--cat-serif);
}

.cat-occupation-card__body small {
  color: var(--cat-ink-soft);
  line-height: 1.4;
}

.cat-occupation-card__body > span {
  color: var(--cat-red);
  font-size: .7rem;
  font-weight: 700;
}

.cat-occupation-card__arrow {
  color: var(--cat-red);
  font-size: 1.25rem;
}

.cat-occupation-card a:hover,
.cat-occupation-card a:focus-visible {
  background: #f3ead9;
  color: var(--cat-ink);
}

.cat-occupation-detail-hero {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) minmax(210px, .32fr);
  align-items: center;
  gap: clamp(1.4rem, 4vw, 4rem);
  margin: 1rem 0 0;
  padding: clamp(2rem, 5vw, 4rem);
  border-top: 5px solid #a83a24;
  background: #f0e7d6;
}

.cat-occupation-detail-hero__mark {
  display: grid;
  width: clamp(6rem, 11vw, 10rem);
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid #9c8062;
  border-radius: 50%;
  color: var(--cat-red);
  font: 650 clamp(3rem, 7vw, 6rem) var(--cat-serif);
}

.cat-occupation-detail-hero h1 {
  margin: .15rem 0 .8rem;
  font-size: clamp(2.1rem, 4vw, 3.6rem);
  line-height: 1.05;
}

.cat-occupation-detail-hero__description {
  max-width: 62rem;
  color: var(--cat-ink-soft);
  font: 500 1.2rem/1.65 var(--cat-serif);
}

.cat-occupation-detail-hero__stats {
  margin: 0;
  border-left: 1px solid #cbbba4;
}

.cat-occupation-detail-hero__stats div {
  padding: 1rem 0 1rem 1.5rem;
  border-bottom: 1px solid #cbbba4;
}

.cat-occupation-detail-hero__stats dt {
  color: var(--cat-ink-soft);
  font-size: .67rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.cat-occupation-detail-hero__stats dd {
  margin: .15rem 0 0;
  color: var(--cat-red);
  font: 650 2rem var(--cat-serif);
}

/* .cat-occupation-people ya no fija el estilo de cada persona -- eso lo
   hace cat-person-card real (catalogo-personas.css), la misma pieza que
   usa "Personas asociadas" en la ficha de lugar. Aqui solo queda el
   contenedor de rejilla. */
.cat-occupation-people {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .65rem;
}

.cat-occupation-places {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
}

.cat-occupation-places a,
.cat-occupation-places > span {
  display: grid;
  gap: .15rem;
  min-width: 12rem;
  padding: .8rem 1rem;
  border: 1px solid #bfae91;
  background: #f7f0e3;
  color: var(--cat-ink);
  text-decoration: none;
}

.cat-occupation-places small {
  color: var(--cat-ink-soft);
}

.cat-occupation-places a:hover,
.cat-occupation-places a:focus-visible {
  background: var(--cat-blue-deep);
  color: #fff;
}

.cat-occupation-places a:hover small,
.cat-occupation-places a:focus-visible small {
  color: #e2ebee;
}

@media (max-width: 1200px) {
.cat-occupation-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
.cat-occupation-people {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
.cat-occupation-hero,
  .cat-occupation-detail-hero {
    grid-template-columns: 1fr;
  }
.cat-occupation-hero__principles {
    grid-template-columns: 1fr;
  }
.cat-occupation-detail-hero__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid #cbbba4;
    border-left: 0;
  }
.cat-occupation-detail-hero__stats div {
    padding-left: 0;
  }
.cat-occupation-people {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
.cat-occupation-hero__principles,
  .cat-occupation-grid,
  .cat-occupation-people {
    grid-template-columns: 1fr;
  }
.cat-occupation-search > div,
  .cat-occupation-group > header {
    align-items: stretch;
    flex-direction: column;
  }
.cat-occupation-search span {
    min-width: 0;
    text-align: left;
  }
}

@media (max-width: 900px) {
.cat-directory-hero h1 {
    font-size: clamp(1.95rem, 8.2vw, 2.6rem);
    line-height: 1.1;
  }
}

/* ---- catalogo-utilidades-migradas.css ---- */
/* ARCA del Tormes -- catalogo.css dividido en ficheros manejables.
   ============================================================================
   Bloque: Utilidades transversales (cat-timeline, cat-accordion, cat-chart, cat-export).
   Extraido mecanicamente de catalogo.css (script de particion por prefijo de
   clase real, no reescrito a mano) para reducir el fichero monolitico. SIN
   CAPA a proposito -- se mantiene la misma prioridad de cascada que tenia
   dentro de catalogo.css (nunca tuvo capa), asi que mover estas reglas aqui
   no cambia que gana frente a que en ningun conflicto de especificidad
   existente. Cargado justo despues de catalogo.css en base.html para
   conservar el mismo orden relativo (reglas generales primero, estas
   despues), igual que estaban fisicamente despues en el fichero original en
   la mayoria de los casos.
   ============================================================================ */

.cat-accordion {
  border-bottom: 1px solid var(--cat-line);
}

/* Tamaño pedido explicitamente: 1.5rem (24px) era demasiado grande en
   movil, tipografia general del sitio revisada a la baja. */
.cat-accordion summary {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem;
  padding: 1.25rem .2rem;
  cursor: pointer;
  font: 600 .9rem var(--cat-serif);
  list-style: none;
}

/* El titulo (primer hijo) crece para ocupar el hueco disponible -- con
   justify-content:space-between y 3 hijos (titulo/badge/icono "+"), el
   badge quedaba flotando solo en mitad del acordeon, sin relacion visual
   con el icono que abre/cierra. Con flex:1 aqui, badge e icono quedan
   siempre juntos, pegados a la derecha, sea cual sea el ancho del
   titulo -- bug real señalado en "Empresas y negocios"/"Servicios"
   (._economia_local.html, _servicios_publicos.html) y "Transcripcion y
   contenido textual"/"Personas asociadas" (detalle_ficha.html). */
.cat-accordion summary > span:first-child {
  flex: 1;
  min-width: 0;
}

/* Bug real senalado en captura (movil, "Empresas y negocios"/"Servicios"):
   con flex:1 el titulo se comprime a una columna estrecha y se parte en
   2-3 lineas; align-items:center deja el badge flotando encima del texto
   envuelto, tapandolo. Solo pasa cuando hay badge (3 hijos) -- en movil,
   el titulo pasa a ocupar toda la fila y badge+icono caen a la fila
   siguiente, ya juntos. :has() ya se usa en el resto del sitio
   (cat-territory-grid__symbol:has(...)). En escritorio (901px+, ver
   media query mas abajo) vuelve a la fila unica ya verificada. */
.cat-accordion summary:has(.cat-accordion__badge) {
  flex-wrap: wrap;
  row-gap: .5rem;
}
.cat-accordion summary:has(.cat-accordion__badge) > span:first-child {
  flex-basis: 100%;
}

.cat-accordion summary::-webkit-details-marker {
  display: none;
}

.cat-accordion summary span:last-child {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border: 1px solid var(--cat-line);
  border-radius: 50%;
  color: var(--cat-red);
  font-family: var(--cat-sans);
  transition: transform .18s ease;
}

.cat-accordion[open] summary span:last-child {
  transform: rotate(45deg);
}

/* Bug real senalado por el propietario (captura: "Indice de entidades"
   pegado al borde izquierdo, sin el mismo margen que el resto de la
   ficha): el padding horizontal correcto (.9rem) solo llegaba via
   ficha-lugar.css, cargado UNICAMENTE en paginas con ficha.grupo ==
   "lugares" -- esta pieza tambien vive en fichas de documento/persona,
   que no cargan ese fichero y se quedaban con el 0 horizontal de aqui.
   Se fija el padding correcto en la base, para cualquier tipo de ficha. */
.cat-accordion__body {
  padding: 0 .9rem 2rem;
  color: var(--cat-ink-soft);
}

.cat-accordion__body h3 {
  color: var(--cat-ink);
  font-size: 1.15rem;
}

.cat-accordion--pref {
  border: 1px solid #cfc5b5;
  background: #fff;
  box-shadow: 0 12px 32px rgba(29, 42, 49, 0.07);
}

/* Trabajo de "sustituir por los componentes validados del inventario":
   cabecera crema propia -> misma variante navy/dorado "preferida" que
   ya llevan el indice de pagina, cat-section__head y los acordeones de
   yacimientos. */
.cat-accordion--pref > summary {
  min-height: 5.5rem;
  padding: 1.2rem 1.45rem;
  background: var(--cat-blue-deep);
  border-bottom: 3px solid var(--cat-gold);
}
/* #main-content details > summary (ficha-lugar.css) fija background: none
   con !important -- mismo patron de especificidad que el resto de parches
   de esta sesion: se iguala con #main-content en el selector y !important
   en la propiedad. */
#main-content .cat-accordion--pref > summary {
  background: var(--cat-blue-deep) !important;
  border-bottom: 3px solid var(--cat-gold) !important;
}

.cat-accordion--pref summary > span:first-child {
  display: grid;
  gap: 0.15rem;
}

/* #main-content details > summary small (ficha-lugar.css, especificidad de
   ID) fija #6b5c46 -- se iguala especificidad con #main-content en el
   selector para que este dorado gane. */
#main-content .cat-accordion--pref summary small {
  /* #8d2631 (granate) pensado para fondo crema -- sobre navy el dorado
     claro es el que ya usa el resto del sitio (7.68:1, ver nota del
     catalogo de tokens sobre gold-500 fallando AA sobre navy). */
  color: #f2c45d;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* Bug real senalado por el propietario (capturas repetidas, movil): este
   titulo no tenia NINGUN ajuste de movil, 1.65rem (26.4px) fijo en
   cualquier ancho -- causa principal de "titulos enormes" en los
   acordeones --pref (Empresas y negocios, Servicios, Personas asociadas,
   Descripcion, yacimientos, historia conectada...). El catalogo real
   especifica "movil: cabecera baja un escalon tipografico" para esta
   pieza -- clamp() en vez de un valor fijo, escritorio sin cambio. */
.cat-accordion--pref summary strong {
  color: #fff;
  font: 600 clamp(1.25rem, 5.2vw, 1.65rem) "Source Serif 4", Georgia, serif;
}

/* La pastilla del contador (.cat-accordion__badge) es navy/blanco -- sobre
   la cabecera navy de esta variante se fundiria con el fondo. Mismo ajuste
   que el resto del sistema hace cuando un contador vive sobre navy (ver
   .mj2 ... [open] > summary > .mj2-count): blanco con texto navy.
   Bug real encontrado al revisar el diseño en movil (captura del
   propietario: badge "4"/"2" casi invisible, blanco sobre fondo claro):
   el selector por descendencia se colaba en los acordeones ANIDADOS
   (cat-economia__group, sin --pref, con fondo claro propio) porque viven
   dentro del arbol DOM del acordeon --pref exterior. Se limita a hijo
   directo del summary de ESTE nivel, no cualquier descendiente. */
.cat-accordion--pref > summary > .cat-accordion__badge {
  background: #fff;
  color: var(--cat-blue-deep);
}
/* El "+" (span final del summary, ver regla base .cat-accordion summary
   span:last-child mas arriba) usa var(--cat-red) sobre borde crema --
   pensado para la cabecera clara anterior. Sobre navy, blanco con borde
   dorado es lo que ya usa el resto de acordeones navy del sitio. */
.cat-accordion--pref > summary span:last-child {
  border-color: #f2c45d;
  color: #fff;
}

/* Bug real señalado ("los numeros o avisos de los acordeones son
   pequeños") y confirmado en el catalogo de componentes aprobado
   (https://claude.ai/code/artifact/b98b7759-...): texto plano de
   0.84rem sin ningun fondo, se leia como parte del titulo en vez de
   como un dato aparte. Se convierte en pastilla real -- mismo
   tratamiento navy/blanco que .cat-accordion__badge del catalogo,
   adaptado a que aqui el contenido es una frase ("1200 palabras"), no
   solo un digito, asi que no lleva min-width fijo de circulo. */
/* min-width/height 2rem: spec real del artifact ("antes 1.6rem, muy
   pequeña -- se sube a 2rem"). display:inline-flex+justify-center para que
   un badge de un solo digito quede circular, no solo una pastilla ancha. */
.cat-accordion__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  margin-left: auto;
  flex-shrink: 0;
  padding: 0 .5rem;
  border-radius: 999px;
  background: var(--cat-blue-deep);
  color: #fff;
  font-size: .82rem;
  font-weight: 700;
  white-space: nowrap;
}

/* Trabajo de "sustituir por los componentes validados del inventario":
   cabecera crema propia (kicker granate, titulo navy) -> misma variante
   navy/dorado "preferida" que ya llevan el indice de pagina,
   cat-section__head y .cat-accordion--pref (Personas asociadas).
   El comentario anterior aqui decia "se unifican al lenguaje de
   .cat-accordion--pref" pero prominent ya cambio a navy hoy -- esto
   se habia quedado desactualizado, corregido ahora. */

.cat-accordion--text,
.cat-accordion--entities {
  margin-top: 1rem;
  border: 1px solid #cfc5b5;
  background: #fff;
  box-shadow: 0 12px 32px rgba(29, 42, 49, 0.07);
}

.cat-accordion--text > summary,
.cat-accordion--entities > summary {
  min-height: 5.5rem;
  padding: 1.2rem 1.45rem;
  background: var(--cat-blue-deep);
  border-bottom: 3px solid var(--cat-gold);
}
/* #main-content details > summary (ficha-lugar.css) fija background/
   border-bottom con !important e ID -- mismo parche que
   .cat-accordion--pref, especificidad igualada. */
#main-content .cat-accordion--text > summary,
#main-content .cat-accordion--entities > summary {
  background: var(--cat-blue-deep) !important;
  border-bottom: 3px solid var(--cat-gold) !important;
}

.cat-accordion--text > summary > span:first-child,
.cat-accordion--entities > summary > span:first-child { display: grid; gap: 0.15rem; }

/* #main-content details > summary small fija #6b5c46 con especificidad
   de ID -- se iguala aqui tambien. */
#main-content .cat-accordion--text > summary small,
#main-content .cat-accordion--entities > summary small {
  /* #8d2631 (granate) pensado para fondo crema -- sobre navy, dorado
     claro (mismo motivo documentado ya varias veces en este fichero:
     dorado oscuro falla AA sobre navy). */
  color: #f2c45d;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.cat-accordion--text > summary strong,
.cat-accordion--entities > summary strong {
  color: #fff;
  font: 600 1.35rem/1.1 "Source Serif 4", serif;
}

.cat-accordion--text[open] > summary,
.cat-accordion--entities[open] > summary { border-bottom: 3px solid var(--cat-gold); }

/* Contador/badge y "+/-" dentro de estas cabeceras, si los llevan: mismo
   ajuste que .cat-accordion--pref para que no se fundan con el
   nuevo fondo navy. */
.cat-accordion--text summary .cat-accordion__badge,
.cat-accordion--entities summary .cat-accordion__badge {
  background: #fff;
  color: var(--cat-blue-deep);
}
.cat-accordion--text > summary span:last-child,
.cat-accordion--entities > summary span:last-child {
  border-color: #f2c45d;
  color: #fff;
}

.cat-chart-grid { stroke: #e4dbcc; stroke-width: 1; }

.cat-chart-axis { fill: #607278; font: 12px system-ui, sans-serif; }

.cat-chart-axis--year { font-weight: 700; }

.cat-chart-line { stroke: #9d2732; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }

.cat-chart-point { fill: #d6a12e; stroke: #173e4d; stroke-width: 2; }

.cat-chart-point:focus { outline: none; stroke: #fff; stroke-width: 5; }

/* Menú compacto de descarga: no invade las cabeceras ni las fichas de lugar. */

.cat-export-menu {
  position: relative;
  width: min(100%, 18rem);
  margin-top: 1rem;
  border: 1px solid #c9bcaa;
  background: #fffdf8;
  color: var(--cat-blue-deep);
}

.cat-export-menu > summary {
  display: grid;
  grid-template-columns: 1.8rem minmax(0, 1fr) 1.4rem;
  gap: .55rem;
  align-items: center;
  min-height: 44px;
  padding: .5rem .65rem;
  cursor: pointer;
  list-style: none;
}

.cat-export-menu > summary::-webkit-details-marker { display: none; }

.cat-export-menu__icon { display: grid; width: 1.65rem; height: 1.65rem; place-items: center; border-radius: 50%; background: #efe3cf; color: var(--cat-red); font-weight: 900; }

.cat-export-menu summary > span:nth-child(2) { display: grid; }

.cat-export-menu summary strong { color: inherit; font-size: .78rem; }

.cat-export-menu summary small { color: var(--cat-ink-soft); font-size: .72rem; }

.cat-export-menu__chevron { justify-self: end; color: var(--cat-red); font-size: 1rem; transition: transform .2s ease; }

.cat-export-menu[open] .cat-export-menu__chevron { transform: rotate(45deg); }

.cat-export-menu__links { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #ded3c2; }

.cat-export-menu__links a { display: grid; gap: .08rem; padding: .55rem .45rem; color: var(--cat-blue-deep); text-align: center; text-decoration: none; }

.cat-export-menu__links a + a { border-left: 1px solid #ded3c2; }

.cat-export-menu__links strong { font-size: .69rem; }

.cat-export-menu__links span { color: var(--cat-ink-soft); font-size: .7rem; }

.cat-export-menu__links a:hover, .cat-export-menu__links a:focus-visible { background: var(--cat-red); color: #fff; }

.cat-export-menu__links a:hover span, .cat-export-menu__links a:focus-visible span { color: #f7e8e9; }

.cat-record-facts .cat-export-menu { width: 100%; border-color: rgb(255 255 255 / 22%); background: rgb(255 255 255 / 5%); color: #fff; }

.cat-record-facts .cat-export-menu summary small, .cat-record-facts .cat-export-menu__links span { color: #b9c9cf; }

.cat-record-facts .cat-export-menu__links { border-color: rgb(255 255 255 / 18%); }

.cat-record-facts .cat-export-menu__links a { color: #fff; }

.cat-record-facts .cat-export-menu__links a + a { border-color: rgb(255 255 255 / 18%); }

.cat-timeline-hero { max-width: 900px; margin: 1rem auto clamp(3rem, 7vw, 6rem); text-align: center; }

/* El tamaño, la familia tipográfica y el color propios de este h1 se
   quitaron el 2026-08-14 igual que en el párrafo de abajo, pero por
   descuido solo se hizo con el párrafo: este h1 seguía fijando
   `color: var(--cat-blue-deep)` (#173746, pensado para fondo claro) sobre
   el fondo azul oscuro que .cat-hero unificó ese mismo día -- texto
   invisible, confirmado en producción (ratio de contraste ~1:1). Ahora lo
   gobierna .cat-hero h1 (texto blanco), como el resto de cabeceras. */

/* El tamaño y la familia tipográfica propios se quitaron el 2026-08-14:
   hacían que el párrafo de cronología saliera más grande (19,2px) que en
   las otras 17 páginas (15,52px), medido con getComputedStyle. El color
   ya lo fija .cat-hero > p:last-of-type, más abajo en el archivo. */

.cat-timeline-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-top: 1.5rem; }

.cat-timeline-legend span, .cat-timeline-event__card li { padding: .3rem .55rem; border: 1px solid #d3c6b2; background: #fffdf8; color: var(--cat-blue-deep); font-size: .67rem; font-weight: 800; }

.cat-timeline-event { position: relative; display: grid; grid-template-columns: 1fr 92px 1fr; align-items: start; margin-bottom: clamp(2.5rem, 7vw, 6rem); opacity: 0; transform: translateY(34px); transition: opacity .65s ease, transform .65s ease; }

.cat-timeline-event.is-visible { opacity: 1; transform: none; }

.cat-timeline-event::before { content: ""; grid-column: 2; justify-self: center; width: 15px; height: 15px; margin-top: 1.25rem; border: 4px solid #fffdf8; border-radius: 50%; background: var(--cat-red); box-shadow: 0 0 0 2px #c9922f; }

/* Bug real señalado en captura y confirmado en el catalogo de componentes
   aprobado: con periodos largos ("Paleoli­tico inferior") el texto envuelve
   a 2 lineas y, alineado a la derecha justo contra el borde de la columna,
   la segunda linea queda pegada al punto de la timeline -- se ven
   "juntos". Se amplia el padding horizontal (1.2rem -> 1.75rem) para dar
   aire real antes del punto en ambos lados (columna par e impar comparten
   esta regla, solo cambia text-align). */
.cat-timeline-event__date { grid-column: 1; grid-row: 1; padding: .7rem 1.75rem; text-align: right; }

.cat-timeline-event__date strong { display: block; color: var(--cat-red-deep); font: 650 var(--cat2-text-3) var(--cat-serif); }

.cat-timeline-event__date span { color: var(--cat-ink-soft); font-size: .66rem; font-weight: 800; text-transform: uppercase; }

.cat-timeline-event__card { grid-column: 3; grid-row: 1; padding: 1.35rem; border-top: 4px solid #c9922f; background: #fff; box-shadow: 0 14px 38px rgb(30 43 48 / 10%); }

.cat-timeline-event:nth-of-type(even) .cat-timeline-event__date { grid-column: 3; text-align: left; }

.cat-timeline-event:nth-of-type(even) .cat-timeline-event__card { grid-column: 1; }

.cat-timeline-event__card h2 { margin: .25rem 0 .65rem; color: var(--cat-blue-deep); font: 650 var(--cat2-text-4)/1.08 var(--cat-serif); }

.cat-timeline-event__card > p:not(.cat-kicker) { color: var(--cat-ink-soft); line-height: 1.65; }

.cat-timeline-event__card ul { display: flex; flex-wrap: wrap; gap: .35rem; margin: 1rem 0; padding: 0; list-style: none; }

.cat-timeline-event__card a { color: var(--cat-red-deep); font-size: .74rem; font-weight: 800; }

.cat-timeline-event__media { display: block; margin: -1.35rem -1.35rem 1.2rem; overflow: hidden; color: inherit; text-decoration: none; }

.cat-timeline-event__media img { display: block; width: 100%; height: 220px; object-fit: cover; filter: saturate(.82) contrast(1.04); transition: transform .35s ease; }

.cat-timeline-event__media span { display: block; padding: .55rem .75rem; border-bottom: 1px solid var(--cat-line); background: #f4eee4; color: var(--cat-ink-soft); font-size: .72rem; font-weight: 500; line-height: 1.45; }

.cat-timeline-event__media:hover img, .cat-timeline-event__media:focus-visible img { transform: scale(1.025); }

.cat-timeline-note { max-width: 900px; margin: 2rem auto 4rem; padding: 1.25rem 1.5rem; border-left: 4px solid #c9922f; background: #efe8dc; }

/* Fichas documentales enlazadas desde la cronología. */

.cat-timeline-source { margin-top: 1rem; }

.cat-timeline-source__hero { position: relative; min-height: 470px; overflow: hidden; background: var(--cat-blue-deep); color: #fff; }

.cat-timeline-source__hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.7) brightness(.38); }

.cat-timeline-source__hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(9 37 49 / 92%), rgb(9 37 49 / 52%) 64%, transparent); }

.cat-timeline-source__hero--plain { min-height: 380px; background: linear-gradient(135deg, #0d3545, #265a68); }

.cat-timeline-source__hero > div { position: relative; z-index: 1; width: min(850px, 88%); padding: clamp(3rem, 8vw, 7rem); }

.cat-timeline-source__hero .cat-kicker { color: #f2cb67; }

.cat-timeline-source__date { margin: .8rem 0 0; color: #f2cb67; font: 650 clamp(1.7rem, 3vw, 2.7rem) var(--cat-serif); }

.cat-timeline-source__hero h1 { max-width: 780px; margin: .25rem 0 1rem; color: #fff; font: 650 clamp(2rem, 4vw, 3.6rem)/1.1 var(--cat-serif); }

.cat-timeline-source__hero div > p:last-child { max-width: 720px; margin: 0; color: #edf3f4; font: clamp(1rem, 1.6vw, 1.28rem)/1.65 var(--cat-serif); }

.cat-timeline-source__layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, 340px); gap: clamp(2rem, 5vw, 5rem); padding: clamp(2rem, 5vw, 5rem) 0; }

.cat-timeline-source__figure { margin: 0 0 3rem; border: 1px solid var(--cat-line); background: #fff; box-shadow: 0 16px 38px rgb(30 43 48 / 10%); }

.cat-timeline-source__figure a { display: block; overflow: hidden; }

.cat-timeline-source__figure img { display: block; width: 100%; max-height: 540px; object-fit: cover; transition: transform .35s ease; }

.cat-timeline-source__figure a:hover img, .cat-timeline-source__figure a:focus-visible img { transform: scale(1.018); }

.cat-timeline-source__figure figcaption { padding: .8rem 1rem; color: var(--cat-ink-soft); font-size: .72rem; line-height: 1.5; }

.cat-timeline-source__sections { display: grid; gap: 0; border-top: 1px solid var(--cat-line); }

.cat-timeline-source__sections > div { padding: 2rem .4rem; border-bottom: 1px solid var(--cat-line); }

.cat-timeline-source__sections h2, .cat-timeline-source__sources h2 { margin: .3rem 0 .7rem; color: var(--cat-blue-deep); font: 650 clamp(1.7rem, 3vw, 2.45rem)/1.1 var(--cat-serif); }

.cat-timeline-source__sections p:last-child { max-width: 760px; margin-bottom: 0; color: var(--cat-ink-soft); font: 1rem/1.75 var(--cat-serif); }

.cat-timeline-source__sources { margin-top: 3rem; }

.cat-timeline-source__sources > div { display: grid; margin-top: 1rem; border-top: 1px solid var(--cat-line); }

.cat-timeline-source__sources a { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(0, 1fr) 2rem; gap: 1rem; align-items: center; padding: 1rem .25rem; border-bottom: 1px solid var(--cat-line); color: var(--cat-ink); text-decoration: none; }

.cat-timeline-source__sources a:hover, .cat-timeline-source__sources a:focus-visible { background: #f4eee4; color: var(--cat-ink); }

.cat-timeline-source__sources strong { color: var(--cat-blue-deep); font-size: .82rem; }

.cat-timeline-source__sources span { color: var(--cat-ink-soft); font-size: .74rem; line-height: 1.5; }

.cat-timeline-source__sources em { color: var(--cat-red); font-style: normal; font-size: 1.2rem; }

.cat-timeline-source__layout > aside { align-self: start; position: sticky; top: 1rem; display: grid; gap: 1rem; }

.cat-timeline-source__facts, .cat-timeline-source__confidence, .cat-timeline-source__related { padding: 1.35rem; border-top: 4px solid #c9922f; background: #fff; box-shadow: 0 12px 30px rgb(30 43 48 / 9%); }

.cat-timeline-source__facts dl { margin: .8rem 0 0; }

.cat-timeline-source__facts dl > div { padding: .75rem 0; border-top: 1px solid var(--cat-line); }

.cat-timeline-source__facts dt { color: var(--cat-red-deep); font-size: .72rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }

.cat-timeline-source__facts dd { margin: .25rem 0 0; color: var(--cat-blue-deep); font: 650 .94rem/1.45 var(--cat-serif); }

.cat-timeline-source__confidence { border-top-color: var(--cat-red); background: #f3ece1; }

.cat-timeline-source__confidence p:last-child { margin-bottom: 0; color: var(--cat-ink-soft); font-size: .78rem; line-height: 1.6; }

.cat-timeline-source__related { display: grid; gap: .65rem; }

.cat-timeline-source__related a { display: flex; justify-content: space-between; gap: 1rem; padding-top: .65rem; border-top: 1px solid var(--cat-line); color: var(--cat-blue-deep); font-size: .78rem; font-weight: 800; text-decoration: none; }

.cat-timeline-source__related a:hover, .cat-timeline-source__related a:focus-visible { color: var(--cat-red); }

.cat-timeline-source__back { margin: 0 0 4rem; }

.cat-timeline-source__back a { color: var(--cat-red-deep); font-weight: 800; }

@media (max-width: 680px) {
.cat-timeline-event { grid-template-columns: 44px minmax(0, 1fr); }
.cat-timeline-event::before { grid-column: 1; grid-row: 1; margin-top: 1.2rem; }
.cat-timeline-event__date, .cat-timeline-event:nth-of-type(even) .cat-timeline-event__date { grid-column: 2; grid-row: 1; padding: 0 0 .65rem; text-align: left; }
.cat-timeline-event__card, .cat-timeline-event:nth-of-type(even) .cat-timeline-event__card { grid-column: 2; grid-row: 2; }
.cat-timeline-event__media img { height: 180px; }
.cat-timeline-source__layout { grid-template-columns: 1fr; }
.cat-timeline-source__layout > aside { position: static; }
.cat-timeline-source__sources a { grid-template-columns: 1fr 1.5rem; }
.cat-timeline-source__sources span { grid-column: 1 / -1; grid-row: 2; }
.cat-timeline-source__sources em { grid-column: 2; grid-row: 1; }
}

@media (prefers-reduced-motion: reduce) {
.cat-timeline-event { opacity: 1; transform: none; transition: none; }
}

.cat-chart-point {
  cursor: help;
  transition: r 120ms ease, fill 120ms ease;
}

.cat-chart-point:hover,
.cat-chart-point:focus {
  r: 7;
  fill: #fff1b8;
}

.cat-chart-tooltip {
  position: absolute;
  z-index: 5;
  width: max-content;
  max-width: 230px;
  padding: .55rem .7rem;
  transform: translate(-50%, calc(-100% - 12px));
  border: 1px solid #e1b64d;
  border-radius: 4px;
  background: #132f3b;
  box-shadow: 0 8px 22px rgb(9 28 36 / 24%);
  color: #fff;
  font-size: .82rem;
  font-weight: 700;
  pointer-events: none;
}

.cat-chart-line--comparison {
  stroke: #24728e;
  stroke-dasharray: 10 5;
}

.cat-chart-line--historical {
  stroke-dasharray: 3 7;
  stroke-width: 3;
}

.cat-chart-point--comparison {
  fill: #e8f6fa;
  stroke: #15556d;
}

.cat-chart-point--historical {
  stroke-width: 2.5;
}

.cat-chart-point--estimated {
  fill: #fffdf8;
  stroke-dasharray: 2 2;
}

/* Tamaño pedido explicitamente, SOLO escritorio: en movil se queda en
   .9rem (ver regla base .cat-accordion summary mas arriba). */
@media (min-width: 901px) {
  .cat-accordion summary { font-size: 1.3rem; }
  .cat-accordion summary:has(.cat-accordion__badge) {
    flex-wrap: nowrap;
  }
  .cat-accordion summary:has(.cat-accordion__badge) > span:first-child {
    flex-basis: auto;
  }
}

/* ---- open-context.css ---- */
.cat-open-context,.cat-yac-bic,.cat-study-context,.cat-map-catalogue,.cat-map-accessible,.cat-data-path,.cat-data-register,.cat-data-examples,aside.cat-data-note{margin-top:2rem;padding:clamp(1.2rem,3vw,2.2rem);border:1px solid var(--cat-line);background:rgba(255,253,248,.75)}
.cat-open-context .cat-section__head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);gap:2rem;align-items:end}.cat-open-context .cat-section__head>p{color:var(--cat-ink-soft)}
.cat-open-context__summary{display:flex;flex-wrap:wrap;gap:.65rem;margin:1.2rem 0}.cat-open-context__summary>span{padding:.65rem .85rem;border-left:3px solid var(--cat-gold);background:#f5eee1}.cat-open-context__summary strong{font:var(--cat2-text-4) var(--cat-serif);color:var(--cat-red)}
.cat-open-context__bics article,.cat-study-context article,.cat-map-bics article{display:grid;grid-template-columns:minmax(180px,32%) 1fr;min-height:210px;border:1px solid var(--cat-line);background:var(--cat-surface)}.cat-open-context__bics img,.cat-study-context img,.cat-map-bics img{width:100%;height:100%;object-fit:cover}.cat-open-context__bics article>div,.cat-study-context article>div,.cat-map-bics article>div{padding:1.25rem}.cat-open-context__links{display:flex;flex-wrap:wrap;gap:1rem}
.cat-open-context__accordion,.cat-map-places,.cat-data-register details{margin-top:1rem;border:1px solid var(--cat-line);background:var(--cat-surface)}.cat-open-context__accordion summary,.cat-map-places summary,.cat-data-register summary{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.2rem;border-bottom:3px solid var(--cat-gold);background:var(--cat-blue-deep);color:#fff;cursor:pointer}.cat-open-context__accordion summary small,.cat-data-register summary small{display:block;color:#f1cb6c;text-transform:uppercase;letter-spacing:.08em}.cat-open-context__accordion summary strong,.cat-data-register summary strong{display:block;font:1.25rem var(--cat-serif)}.cat-open-context__accordion summary i,.cat-map-places summary i,.cat-data-register summary i{font-style:normal;color:#f1cb6c}.cat-open-context__accordion[open] summary i,.cat-map-places[open] summary i,.cat-data-register details[open] summary i{transform:rotate(45deg)}
.cat-open-context__accordion ol,.cat-bic-detail__history ol{list-style:none;margin:0;padding:1rem 1.2rem}.cat-open-context__accordion li,.cat-bic-detail__history li{display:grid;grid-template-columns:120px 1fr;gap:1rem;padding:.9rem 0;border-bottom:1px solid var(--cat-line)}.cat-open-context__accordion p{margin:.25rem 0}.cat-open-context__sites,.cat-open-context__studies{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;padding:1rem}.cat-open-context__sites a,.cat-open-context__studies a,.cat-bic-detail__relations a{display:flex;flex-direction:column;gap:.25rem;padding:1rem;border:1px solid var(--cat-line);background:#fff}.cat-text-link{display:inline-block;margin:0 1rem 1rem}.cat-open-context__studies{padding:1rem 0}.cat-open-context__studies>.cat-kicker{grid-column:1/-1}
.cat-yac-bic{display:grid;grid-template-columns:minmax(260px,38%) 1fr;gap:2rem;border-top:4px solid var(--cat-red)}.cat-yac-bic figure{margin:0}.cat-yac-bic img{width:100%;max-height:320px;object-fit:cover}.cat-yac-bic figcaption{font-size:.78rem;color:var(--cat-ink-soft)}.cat-yac-bic dl{display:flex;gap:2rem}.cat-yac-bic dt{font-size:.78rem;text-transform:uppercase}.cat-yac-bic dd{margin:0;font-weight:700}
.cat-study-context>header{max-width:760px}.cat-study-context>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.cat-study-context article{grid-template-columns:minmax(130px,28%) 1fr}.cat-study-context article:not(:has(img)){grid-template-columns:1fr}.cat-study-context small,.cat-map-bics small{color:var(--cat-red);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.cat-bic-detail__hero{display:grid;grid-template-columns:1.2fr .8fr;min-height:390px;background:var(--cat-blue-deep);color:#fff}.cat-bic-detail__hero>div{padding:clamp(2rem,5vw,4rem)}.cat-bic-detail__hero h1{color:#fff;font:clamp(2rem,4vw,3.6rem)/1.05 var(--cat-serif)}.cat-bic-detail__hero figure{margin:0}.cat-bic-detail__hero img{width:100%;height:100%;max-height:450px;object-fit:cover}.cat-bic-detail__hero figcaption{padding:.6rem 1rem;background:#fff;color:var(--cat-ink);font-size:.75rem}.cat-bic-detail__layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(270px,.5fr);gap:2rem;margin-top:2rem}.cat-bic-detail__layout main,.cat-bic-detail__layout aside>section{padding:clamp(1.2rem,3vw,2rem);border:1px solid var(--cat-line);background:var(--cat-surface)}.cat-bic-detail__relations{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}.cat-bic-detail__history{margin-top:2rem}
.cat-timeline-filter{display:flex;align-items:end;flex-wrap:wrap;gap:.7rem;margin:1rem 0 2rem;padding:1rem;border:1px solid var(--cat-line);background:var(--cat-surface)}.cat-timeline-filter label{font-weight:700}.cat-timeline-filter select,.cat-timeline-filter button{min-height:44px;padding:.55rem .8rem;border:1px solid var(--cat-line);background:#fff}.cat-timeline-filter button{background:var(--cat-blue-deep);color:#fff;font-weight:700}
.cat-map-catalogue>header,.cat-data-register>header,.cat-data-examples>header{max-width:800px}.cat-map-bics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.cat-map-places>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;padding:1rem}.cat-map-places a{display:flex;justify-content:space-between;padding:.8rem;border-bottom:1px solid var(--cat-line)}.cat-map-accessible>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}.cat-map-accessible>div>a{display:flex;flex-direction:column;padding:1rem;border:1px solid var(--cat-line);background:#fff}.cat-map-hidden-feed{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
/* .cat-data-hero tenia su propio grid/padding/fondo/tamano de h1 de antes
   de unirse al sistema .cat-hero (2026-08-14). Este archivo carga despues
   de catalogo.css, asi que esas reglas ganaban siempre los empates:
   padding 32px uniforme en vez de 56/21.6/32, interlineado de h1 distinto.
   Confirmado en vivo con getComputedStyle. Se quitan aqui las propiedades
   que pisaban al sistema unificado; .cat-data-hero>a conserva su estilo
   por si algun dia se usa un enlace directo dentro de la cabecera. */
.cat-data-hero p{max-width:760px}.cat-data-hero>a{padding:1rem 1.2rem;border:1px solid #f1cb6c;color:#fff}.cat-data-path ol{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;list-style:none;padding:0}.cat-data-path li{padding:1rem;border-top:4px solid var(--cat-gold);background:#fff}.cat-data-path li+li{border-left:1px solid var(--cat-line)}.cat-data-path li strong,.cat-data-path li span{display:block}.cat-data-path li span{margin-top:.4rem;color:var(--cat-ink-soft)}.cat-data-register details>div{display:grid;grid-template-columns:.9fr 1.1fr;gap:2rem;padding:1.2rem}.cat-data-register dl{margin:0}.cat-data-register dl>div{padding:.5rem 0;border-bottom:1px solid var(--cat-line)}.cat-data-register dt{font-size:.75rem;text-transform:uppercase;color:var(--cat-red)}.cat-data-register dd{margin:.2rem 0}.cat-data-examples>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.cat-data-examples a{display:grid;grid-template-columns:120px 1fr;border:1px solid var(--cat-line);background:#fff}.cat-data-examples img{width:120px;height:120px;object-fit:cover}.cat-data-examples span{display:flex;flex-direction:column;justify-content:center;padding:.8rem}.cat-data-examples small{color:var(--cat-red)}.cat-data-examples i{font-style:normal}aside.cat-data-note{border-left:5px solid var(--cat-gold)}
@media(max-width:900px){.cat-open-context .cat-section__head,.cat-bic-detail__hero,.cat-bic-detail__layout,.cat-data-hero{grid-template-columns:1fr}.cat-study-context>div,.cat-map-bics,.cat-data-examples>div{grid-template-columns:1fr}.cat-open-context__sites,.cat-open-context__studies,.cat-bic-detail__relations,.cat-map-places>div,.cat-map-accessible>div{grid-template-columns:repeat(2,minmax(0,1fr))}.cat-data-path ol{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.cat-open-context__bics article,.cat-study-context article,.cat-map-bics article,.cat-yac-bic{grid-template-columns:1fr}.cat-open-context__bics img,.cat-study-context img,.cat-map-bics img{max-height:240px}.cat-open-context__sites,.cat-open-context__studies,.cat-bic-detail__relations,.cat-map-places>div,.cat-map-accessible>div,.cat-data-path ol,.cat-data-examples>div,.cat-data-register details>div{grid-template-columns:1fr}.cat-open-context__accordion li,.cat-bic-detail__history li{grid-template-columns:1fr}.cat-data-examples a{grid-template-columns:90px 1fr}.cat-data-examples img{width:90px;height:100%}.cat-yac-bic dl{display:block}}
@media(prefers-reduced-motion:reduce){.cat-open-context__accordion summary i,.cat-map-places summary i,.cat-data-register summary i{transition:none}}
.cat-open-context__sites a{min-height:8.75rem;border-top:3px solid var(--cat-gold);box-shadow:0 3px 0 rgba(20,63,77,.06);transition:transform .18s ease,box-shadow .18s ease}.cat-open-context__sites a small{color:var(--cat-red);font-weight:700;text-transform:uppercase;letter-spacing:.04em}.cat-open-context__sites a strong{font:var(--cat2-text-2) var(--cat-serif);color:var(--cat-blue-deep)}.cat-open-context__sites a span{margin-top:auto;color:var(--cat-red);font-weight:700}.cat-open-context__sites a:hover{transform:translateY(-2px);box-shadow:0 7px 0 rgba(20,63,77,.1)}

/* Ficha territorial: jerarquía editorial y enlaces de acción. */
.cat-open-context {
  padding: 0;
  overflow: hidden;
  background: #fbf8f0;
}

.cat-open-context__hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(18rem, .65fr);
  gap: 2rem;
  align-items: end;
  padding: clamp(1.4rem, 4vw, 2.5rem);
  background: linear-gradient(110deg, #fffdf8 0 70%, #f4ead2 70%);
}

.cat-open-context__hero h2 { max-width: 22ch; margin: .25rem 0 0; color: #123e4c; font-size: clamp(2rem, 4vw, 3.35rem); }
.cat-open-context__hero > p { max-width: 55ch; margin: 0; color: #44555d; }
.cat-open-context__summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0; padding: 1px 0; background: #d8cdbb; }
.cat-open-context__summary a,
.cat-open-context__summary > .cat-open-context__summary-item { display: grid; grid-template-columns: auto 1fr; gap: .6rem; align-items: center; min-height: 4.6rem; margin: 0; padding: .8rem 1rem; background: #fffdf8; color: #173f4d; text-decoration: none; }
.cat-open-context__summary strong { color: #9f2234; font: var(--cat2-text-4) var(--cat-serif); }
.cat-open-context__summary span { line-height: 1.15; }
.cat-open-context__summary .cat-open-context__summary--featured { background: #173f4d; color: #fff; }
.cat-open-context__summary .cat-open-context__summary--featured strong { color: #f2c45d; }
.cat-open-context__summary a > span,
.cat-open-context__summary > .cat-open-context__summary-item > span { margin: 0; padding: 0; border: 0; background: transparent; color: inherit; }

.cat-open-context__block { padding: clamp(1.2rem, 3vw, 2rem); border-top: 1px solid #d8cdbb; }
.cat-open-context__archaeology { background: #f5eee1; }
.cat-open-context__archaeology-body { padding: 1rem 1.2rem 1.25rem; }
.cat-open-context__archaeology-body > p { margin: 0 0 1rem; color: #44555d; }
.cat-open-context__block-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, .55fr); gap: 1.5rem; align-items: end; margin-bottom: 1.1rem; }
.cat-open-context__block-head h3 { margin: .2rem 0 0; color: #173f4d; font: clamp(1.55rem, 3vw, 2.35rem) var(--cat-serif); }
.cat-open-context__block-head > p { margin: 0; color: #4e5e64; }

.cat-open-context .cat-open-context__sites { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; padding: 0; }
/* Colores propios -> tokens del sitio, mismo lenguaje que cat-card
   (filete dorado arriba, superficie clara). Estructura ya era muy
   cercana a cat-card; se homogeneiza paleta sin tocar el marcado. */
.cat-open-context .cat-site-card { display: grid; grid-template-rows: auto auto 1fr auto; gap: .42rem; min-height: 11rem; padding: 1rem; border: 1px solid var(--cat-line); border-top: 4px solid var(--cat-gold); background: var(--cat-surface); color: var(--cat-blue-deep); text-decoration: none; box-shadow: none; transition: transform .18s ease, box-shadow .18s ease; }
.cat-open-context .cat-site-card:hover { transform: translateY(-2px); box-shadow: 0 7px 18px rgb(18 46 59 / 16%); }
.cat-open-context .cat-site-card__period { justify-self: start; margin: 0; padding: .22rem .42rem; background: #f7e6df; color: var(--cat-red-deep); font-size: .76rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.cat-open-context .cat-site-card strong { color: var(--cat-blue-deep); font: var(--cat2-text-2) var(--cat-serif); }
.cat-open-context .cat-site-card__meta { margin: 0; color: var(--cat-ink-soft); font-size: .8rem; font-weight: 650; }
.cat-open-context .cat-site-card__action { margin: .25rem 0 0; color: var(--cat-red-deep); font-weight: 800; }

.cat-button-link { display: inline-flex; align-items: center; justify-content: center; min-height: 2.75rem; margin-top: 1rem; padding: .55rem .85rem; border: 1px solid #173f4d; background: #173f4d; color: #fff !important; font-weight: 800; line-height: 1.2; text-decoration: none !important; }
.cat-button-link--secondary { border-color: #bda98c; background: #fffdf8; color: #173f4d !important; }
.cat-button-link:hover { background: #9f2234; border-color: #9f2234; color: #fff !important; }
.cat-open-context__more { margin: 0 1.2rem 1.2rem; }

.cat-open-context__bics { display: grid; gap: 1rem; }
.cat-open-context__links { gap: .55rem; margin-bottom: 0; }
.cat-open-context__accordion { margin: 1rem clamp(1.2rem, 3vw, 2rem); }
.cat-open-context__accordion a:not(.cat-button-link) { text-underline-offset: .18em; }
.cat-open-context__related { padding: 1rem 1.2rem; }
.cat-open-context__related .cat-button-link { margin: .25rem .4rem .25rem 0; }

.cat-open-context__studies { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; padding: 0; }
.cat-open-context__studies a { display: grid; gap: .55rem; min-height: 10rem; padding: 1rem 1.1rem; border: 1px solid #d6c8b2; border-left: 4px solid #173f4d; background: #fffdf8; color: #173f4d; text-decoration: none; }
.cat-open-context__studies a strong { font: var(--cat2-text-3) var(--cat-serif); }
.cat-open-context__studies a span { color: #4e5e64; }

/* ---------------------------------------------------------------- economia */

/* El bloque entero es un <details>: en una ficha con seis secciones más,
   "Empresas y negocios" solo debe ocupar sitio cuando alguien lo abre. El
   <summary> hace de cabecera siempre visible, con el recuento total para que
   colapsado siga diciendo algo. */
.cat-economia { margin: 2.2rem 0; border-radius: 14px; overflow: hidden; background: #fffdf8; box-shadow: 0 10px 30px rgb(29 74 53 / 12%); }

/* La cabecera de este bloque es un <summary> dentro de #main-content, y
   ficha-lugar.css fuerza ahi un unico estilo de acordeon para toda la ficha
   (fondo transparente, texto marino, "+"/"-" via ::after) con !important --
   a proposito, para que ningun bloque desentone. No se pelea contra eso: el
   color distintivo va en el texto (mismo verde que ya usan los subgrupos de
   abajo, ya probado con buen contraste sobre el fondo #fffdf8 que impone esa
   regla) y en la insignia de recuento, que si es libre de estilar porque no
   es hijo directo de summary. */
/* .cat-economia-banner migrado a .cat-record-banner--comercio
   (catalogo-componentes.css, capa `componentes`, Fase 4 del plan de
   theme) -- fusionado con .cat-servicios__banner, que era la misma
   estructura con otro nombre y otro color. */
.cat-economia__body { padding-top: .2rem; }
.cat-economia__intro-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1rem; margin: 1.2rem clamp(1.2rem, 3vw, 2rem) 1.3rem; }
.cat-economia__intro { flex: 1 1 20rem; margin: 0; color: #4e5e64; }

/* Acordeon por bloque (Comercio / Hosteleria y turismo), cerrado por
   defecto: el caso real es Guijuelo, con 94 comercios y 65 negocios de
   turismo, ilegible como cuadricula plana sin colapsar. */
.cat-economia__group {
  margin: 0 clamp(1.2rem, 3vw, 2rem) 1.2rem;
  border: 1px solid #dbe6de;
  border-radius: 10px;
  background: #fff;
}
/* Ahora es un .cat-accordion real: el marco (border/radius de arriba) se
   conserva, pero la cabecera (padding, tipografia, icono +/-) la fija
   .cat-accordion__head/summary del inventario, no esta regla -- se
   retiran las reglas que apuntaban a <h4>/<i> propios, ya no existen en
   el marcado (el summary ahora es <span>texto</span><span
   class="cat-accordion__badge">N</span><span aria-hidden>+</span>). */
.cat-economia__group > summary:focus-visible { outline: 3px solid #1d4a35; outline-offset: -3px; }
.cat-economia__group-body { padding: 0 1.1rem 1.1rem; }

/* Subgrupos por tipologia (solo aparecen cuando un sector supera 10
   negocios: p.ej. "Carnicerías" en Guijuelo). */
.cat-economia__subgroup { margin: 0 0 .75rem; border: 1px solid #eef1ec; border-radius: 8px; background: #fbfdfc; }
.cat-economia__subgroup:last-child { margin-bottom: 0; }
.cat-economia__subgroup > summary {
  display: flex;
  align-items: center;
  gap: .6rem;
  min-height: 44px;
  padding: .65rem .9rem;
  cursor: pointer;
  list-style: none;
  color: #1d4a35;
  font-weight: 700;
}
.cat-economia__subgroup > summary::-webkit-details-marker { display: none; }
.cat-economia__subgroup > summary > span:first-child { flex: 1; }
/* Mismo bug de "numeros pequeños" que cat-accordion__badge, aqui en el
   nivel anidado -- pastilla mas pequeña y mas apagada que la del nivel 1
   (gris, no navy), a proposito: si pesara igual que el contador de
   arriba no se distinguiria cual es el contenedor y cual el contenido,
   tal y como especifica el catalogo de componentes aprobado para
   acordeones anidados. */
.cat-economia__subgroup-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  height: 1.5rem;
  padding: 0 .4rem;
  border-radius: 999px;
  background: #6b5c46;
  color: #fff;
  font-weight: 700;
  font-size: .78rem;
}
.cat-economia__subgroup > summary i { font-style: normal; font-size: 1.1rem; transition: transform .15s ease; }
.cat-economia__subgroup[open] > summary i { transform: rotate(45deg); }
.cat-economia__subgroup > summary:focus-visible { outline: 3px solid #1d4a35; outline-offset: -3px; }
.cat-economia__subgroup .cat-economia__cards { padding: 0 .9rem .9rem; }

.cat-economia__cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(15.5rem, 100%), 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; min-width: 0; }

/* .cat-economia-card migrada a .cat-card (pieza real del catalogo
   aprobado) -- fragmento viejo retirado aqui, fragmento nuevo en
   catalogo-componentes.css, capa `componentes`, mismo commit. */

.cat-economia__note { margin: 0 clamp(1.2rem, 3vw, 2rem) 1.4rem; }
.cat-economia__note--highlight { padding: .8rem 1.1rem; background: #eef4f2; border-left: 4px solid #1d4a35; border-radius: 0 8px 8px 0; color: #1d4a35; font-size: .88rem; }

@media (prefers-reduced-motion: reduce) {
  .cat-card,
  .cat-accordion summary span:last-child {
    transition: none;
  }
}

@media (max-width: 560px) {

  /* Cinturon de seguridad independiente del calculo de auto-fill/minmax:
     una sola columna a ancho completo, sin depender de que el navegador
     resuelva bien el caso limite de un contenedor mas estrecho que el
     minmax() (visto en pantalla real, 23-ago-2026). */
  .cat-economia { margin-left: 0; margin-right: 0; overflow-x: hidden; }
  .cat-economia__group,
  .cat-economia__intro,
  .cat-economia__note { margin-left: .75rem; margin-right: .75rem; }
  .cat-economia__group-body { padding-left: .6rem; padding-right: .6rem; }
  .cat-economia__subgroup .cat-economia__cards { padding-left: .4rem; padding-right: .4rem; }
  .cat-economia__cards { grid-template-columns: 1fr; }
}
.cat-open-context__studies a b { align-self: end; color: #86172a; }

.cat-open-context a:focus-visible { outline: 3px solid #a1172d; outline-offset: 3px; }

/* Bloques de evidencias en los estudios: se alejan de la caja administrativa
   y adoptan la misma lectura editorial que el resto de la maqueta. */
.cat-study-context {
  position: relative;
  overflow: hidden;
  margin-top: clamp(2.5rem, 6vw, 4.5rem);
  padding: clamp(1.45rem, 4vw, 2.8rem);
  border: 1px solid #d7c7ae;
  border-top: 5px solid #173f4d;
  background:
    linear-gradient(125deg, rgb(255 253 248 / 98%) 0 68%, rgb(243 232 207 / 85%) 68% 100%);
  box-shadow: 0 16px 34px rgb(22 48 59 / 8%);
}
.cat-study-context::before {
  position: absolute;
  top: 0;
  right: clamp(1.2rem, 4vw, 3rem);
  width: 4.4rem;
  height: 5px;
  background: #b9822d;
  content: "";
}
.cat-study-context > header { max-width: none; margin-bottom: 1.5rem; }
.cat-study-context > header h2 { max-width: 24ch; margin: .2rem 0 .55rem; color: #173f4d; font: clamp(2rem, 4.2vw, 3.3rem)/1.02 var(--cat-serif); }
.cat-study-context > header > p:last-child { max-width: 62ch; margin: 0; color: #526168; font-size: .95rem; line-height: 1.6; }
.cat-study-context > div { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; }
.cat-study-context .cat-study-context__card {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  min-height: 15.5rem;
  overflow: hidden;
  border: 1px solid #d8c9b3;
  border-top: 4px solid #b9822d;
  background: #fffdf8;
  box-shadow: 0 7px 17px rgb(23 63 77 / 7%);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.cat-study-context .cat-study-context__card::after { position: absolute; right: 0; bottom: 0; width: 42%; height: 3px; background: #173f4d; content: ""; }
.cat-study-context .cat-study-context__card:hover { border-color: #ad8a52; box-shadow: 0 14px 25px rgb(23 63 77 / 14%); transform: translateY(-3px); }
.cat-study-context .cat-study-context__card > div { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 1.35rem; }
.cat-study-context .cat-study-context__card > img { width: 100%; height: 180px; object-fit: cover; }
.cat-study-context .cat-study-context__card small { display: inline-flex; align-items: center; min-height: 1.7rem; margin: 0 0 .8rem; padding: .22rem .5rem; background: #f8e9dc; color: #86172a; font-size: .67rem; font-weight: 850; letter-spacing: .075em; line-height: 1.2; text-transform: uppercase; }
.cat-study-context .cat-study-context__card h3 { margin: 0 0 .55rem; color: #173f4d; font: var(--cat2-text-3)/1.1 var(--cat-serif); }
.cat-study-context .cat-study-context__card p { margin: 0; color: #4d5c63; font-size: .9rem; line-height: 1.55; }
.cat-study-context .cat-study-context__action { display: inline-flex; gap: .65rem; align-items: center; min-height: 2.55rem; margin-top: auto; padding-top: 1rem; color: #86172a; font-size: .84rem; font-weight: 850; line-height: 1.25; text-decoration: none; }
.cat-study-context .cat-study-context__action span { border-bottom: 1px solid currentColor; }
.cat-study-context .cat-study-context__action i { display: grid; width: 1.65rem; height: 1.65rem; place-items: center; border: 1px solid currentColor; border-radius: 50%; font-size: 1rem; font-style: normal; transition: transform .18s ease, background .18s ease, color .18s ease; }
.cat-study-context .cat-study-context__action:hover, .cat-study-context .cat-study-context__action:focus-visible { color: #173f4d; }
.cat-study-context .cat-study-context__action:hover i, .cat-study-context .cat-study-context__action:focus-visible i { background: #173f4d; color: #fff; transform: translateX(3px); }

/* La misma familia se extiende a las fichas de contexto territorial, mapas y
   datos abiertos. Son piezas de consulta, no tablas administrativas. */
.cat-open-context__bics article,
.cat-map-bics article {
  overflow: hidden;
  border: 1px solid #d8c9b3;
  border-top: 4px solid #b9822d;
  background: #fffdf8;
  box-shadow: 0 7px 17px rgb(23 63 77 / 7%);
  transition: transform .18s ease, box-shadow .18s ease;
}
.cat-open-context__bics article:hover,
.cat-map-bics article:hover { box-shadow: 0 14px 25px rgb(23 63 77 / 14%); transform: translateY(-3px); }
.cat-open-context__bics article > div,
.cat-map-bics article > div { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 1.35rem; }
.cat-open-context__bics article h3,
.cat-map-bics article h3 { margin: .15rem 0 .6rem; color: #173f4d; font: var(--cat2-text-3)/1.1 var(--cat-serif); }
.cat-open-context__bics article > div > p:not(.cat-kicker):not(.cat-open-context__links),
.cat-map-bics article > div > p:not(.cat-kicker) { color: #4d5c63; font-size: .9rem; line-height: 1.55; }
.cat-open-context__bics article .cat-open-context__links { margin: auto 0 0; padding-top: .75rem; }

/* Segunda regla que compite con la de mas arriba para el mismo
   .cat-site-card (misma especificidad, gana por venir despues) --
   colores propios sustituidos por los mismos tokens, para que ambas
   coincidan en vez de que esta pise en silencio a la de arriba. */
.cat-open-context .cat-site-card,
.cat-open-context__studies a,
.cat-map-accessible > div > a,
.cat-data-examples a {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--cat-line);
  border-top: 4px solid var(--cat-gold);
  background: var(--cat-surface);
  box-shadow: 0 6px 15px rgb(18 46 59 / 7%);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.cat-open-context .cat-site-card:hover,
.cat-open-context__studies a:hover,
.cat-map-accessible > div > a:hover,
.cat-data-examples a:hover { border-color: var(--cat-gold); box-shadow: 0 13px 24px rgb(18 46 59 / 14%); transform: translateY(-3px); }
.cat-open-context .cat-site-card::after,
.cat-open-context__studies a::after,
.cat-map-accessible > div > a::after,
.cat-data-examples a::after { position: absolute; right: 0; bottom: 0; width: 38%; height: 3px; background: #173f4d; content: ""; }
.cat-open-context__studies a { min-height: 11rem; gap: .65rem; padding: 1.15rem 1.2rem; border-left-width: 1px; }
.cat-open-context__studies a strong { color: #173f4d; font: var(--cat2-text-3)/1.1 var(--cat-serif); }
.cat-open-context__studies a b { display: inline-flex; gap: .55rem; align-items: center; margin-top: auto; color: #86172a; font-size: .84rem; }
.cat-open-context__studies a b::after { display: grid; width: 1.6rem; height: 1.6rem; place-items: center; border: 1px solid currentColor; border-radius: 50%; content: "→"; }
.cat-open-context__studies a:hover b::after { background: #173f4d; color: #fff; }
.cat-map-accessible > div > a { min-height: 9rem; padding: 1.15rem; color: #173f4d; text-decoration: none; }
.cat-map-accessible > div > a strong { color: #173f4d; font: var(--cat2-text-2)/1.15 var(--cat-serif); }
.cat-data-examples a { min-height: 8.5rem; color: #173f4d; text-decoration: none; }
.cat-data-examples a span { gap: .3rem; padding: 1rem; }
.cat-data-examples a strong { color: #173f4d; font: var(--cat2-text-2)/1.12 var(--cat-serif); }
.cat-data-examples a i { margin-top: auto; color: #86172a; font-size: .82rem; font-weight: 800; }

@media(max-width:900px) {
  .cat-open-context__hero,
  .cat-open-context__block-head { grid-template-columns: 1fr; }
  .cat-open-context__summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cat-open-context .cat-open-context__sites { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cat-study-context { background: #fffdf8; }
  .cat-open-context__bics article,
  .cat-map-bics article { grid-template-columns: 1fr; }
}

@media(max-width:620px) {
  .cat-open-context__summary,
  .cat-open-context .cat-open-context__sites,
  .cat-open-context__studies { grid-template-columns: 1fr; }
  .cat-open-context__hero { background: #fffdf8; }
  .cat-study-context { padding: 1.2rem; }
  .cat-study-context > header h2 { font-size: clamp(1.85rem, 9vw, 2.35rem); }
  .cat-study-context .cat-study-context__card { min-height: 0; }
  .cat-open-context__bics article > img,
  .cat-map-bics article > img { height: auto; max-height: 240px; }
}

@media(prefers-reduced-motion:reduce) {
  .cat-open-context .cat-site-card { transition: none; }
  .cat-study-context .cat-study-context__card,
  .cat-study-context .cat-study-context__action i,
  .cat-open-context__bics article,
  .cat-map-bics article,
  .cat-open-context .cat-site-card,
  .cat-open-context__studies a,
  .cat-map-accessible > div > a,
  .cat-data-examples a { transition: none; }
}
/* Addenda 2026-08-14 (misma jornada, tras el rebuild anterior): color propio
   #f1cb6c distinto del estándar #f0c76c de ".cat-hero .cat-kicker"
   (catalogo.css línea 8223). Detectado en vivo en datos-abiertos, mismo
   patrón que el ya corregido en que-es-arca.css. Se quita para que el
   kicker de esta página también sea igual al resto. */
/* El h1 usa line-height .95 para el efecto editorial; sin margen inferior los
   descendentes pisaban el primer parrafo (detectado 2026-08-12). */
.cat-data-hero h1{margin:.15rem 0 1.1rem}

/* Bug real señalado en captura y confirmado en el catalogo de componentes
   aprobado (https://claude.ai/code/artifact/b98b7759-...): sin marco
   propio, la caja que se veia era la del contenedor generico de la
   pagina, no la pieza -- se le da el mismo tratamiento que el resto de
   fichas de su familia (fondo degradado, filete dorado arriba, sombra,
   radio), y se quita el borde/gap duplicado del <dl> interno (ya no hace
   falta, el marco lo pone la seccion). */
.cat-data-kpis{
  margin-top:2rem;
  background:linear-gradient(180deg,#fffdf8,#f7f2e6);
  border:1px solid var(--cat-line);
  border-top:3px solid var(--cat-gold);
  border-radius:8px;
  box-shadow:0 2px 8px rgb(21 37 46 / 7%);
  overflow:hidden;
}
.cat-data-kpis dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.cat-data-kpis div{padding:1.1rem 1.25rem;border-left:1px solid var(--cat-line)}
.cat-data-kpis div:first-child{border-left:none}
.cat-data-kpis dt{font:2.1rem var(--cat-serif);color:var(--cat-red);line-height:1}
.cat-data-kpis dd{margin:.4rem 0 0;color:var(--cat-ink-soft);font-size:.85rem;line-height:1.35}
@media(max-width:640px){
  .cat-data-kpis dl{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cat-data-kpis div:nth-child(n+3){border-top:1px solid var(--cat-line)}
}

/* Las etiquetas de una cabecera oscura usan siempre el color accesible del tema.
   ".cat-featured-index__hero" (destacados) se quitó de aquí el 2026-08-14:
   desde que esa cabecera lleva también la clase "cat-hero", el color de su
   kicker lo debe fijar ".cat-hero .cat-kicker" (#f0c76c, catalogo.css línea
   8223), no este #ffd66d suelto que solo pisaba en esa página. ".cat-bic-detail__hero"
   sigue siendo un componente aparte, no unificado, y conserva su color. */
.cat-bic-detail__hero .cat-kicker{color:#ffd66d;text-shadow:0 2px 10px rgb(0 0 0 / 55%)}

.cat-heritage-record{margin-top:2rem;border:1px solid var(--cat-line);border-top:5px solid var(--cat-red);background:#fffdf8}
.cat-heritage-record__head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:2rem;align-items:end;padding:clamp(1.4rem,3vw,2.4rem);background:#f5efe5}
.cat-heritage-record__head h2{max-width:760px;margin:.2rem 0 0;font:clamp(2rem,4vw,3.25rem)/1.02 var(--cat-serif);color:var(--cat-blue-deep)}
.cat-heritage-record__head>p{margin:0;color:var(--cat-ink-soft);line-height:1.65}
.cat-heritage-record__identity{display:grid;grid-template-columns:minmax(240px,.72fr) minmax(0,1.28fr);border-top:1px solid var(--cat-line);border-bottom:1px solid var(--cat-line)}
.cat-heritage-record__identity>div{display:flex;flex-direction:column;justify-content:center;gap:.35rem;padding:1.5rem;background:var(--cat-blue-deep);color:#fff}
.cat-heritage-record__identity>div small{color:#ffd66d;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.cat-heritage-record__identity>div strong{font:var(--cat2-text-4)/1.12 var(--cat-serif)}
.cat-heritage-record__identity>div span{font-size:.86rem;color:#e9edf0}
.cat-heritage-record__identity dl,.cat-heritage-record__support dl,.cat-heritage-record__inventory dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0}
.cat-heritage-record__identity dl>div,.cat-heritage-record__support dl>div,.cat-heritage-record__inventory dl>div{padding:1rem;border-left:1px solid var(--cat-line);border-bottom:1px solid var(--cat-line)}
.cat-heritage-record dt{color:var(--cat-red-deep);font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.cat-heritage-record dd{margin:.25rem 0 0;font-weight:700}
.cat-heritage-record__description{max-width:940px;padding:clamp(1.5rem,4vw,3rem)}
.cat-heritage-record__description>p:not(.cat-kicker):not(.cat-source-note){font:1.04rem/1.78 var(--cat-serif)}
.cat-source-note{margin-top:1.4rem;padding:1rem;border-left:4px solid var(--cat-gold);background:#f5efe5;color:var(--cat-ink-soft);font-size:.86rem}
.cat-heritage-record__support{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--cat-line)}
.cat-heritage-record__support>section{padding:clamp(1.3rem,3vw,2rem)}
.cat-heritage-record__support>section+section{border-left:1px solid var(--cat-line)}
.cat-heritage-record__support ul{list-style:none;margin:0;padding:0}
.cat-heritage-record__support li{display:flex;flex-direction:column;gap:.2rem;padding:.75rem 0;border-bottom:1px solid var(--cat-line)}
.cat-heritage-record__support li small{color:var(--cat-red-deep);font-weight:800;text-transform:uppercase}
.cat-heritage-record__inventory{margin:0 1.5rem 1.5rem;padding:clamp(1.2rem,3vw,2rem);border:1px solid var(--cat-line);background:#f5f3ec}
.cat-heritage-record__inventory h3{margin:.2rem 0 .5rem;font:var(--cat2-text-4) var(--cat-serif);color:var(--cat-blue-deep)}
.cat-heritage-record__inventory-text{margin-top:1rem;padding:1.15rem;background:#fff}
.cat-heritage-record__trace{padding:1rem 1.5rem;background:var(--cat-blue-deep);color:#fff;font-size:.86rem}
.cat-bic-detail__relations-section,.cat-bic-detail__history{margin-top:2rem;padding:clamp(1.2rem,3vw,2rem);border:1px solid var(--cat-line);background:var(--cat-surface)}
.cat-canonical-results{margin:1.5rem 0 2.5rem;padding:clamp(1.2rem,3vw,2rem);border:1px solid var(--cat-line);border-top:5px solid var(--cat-gold);background:#f5efe5}
.cat-canonical-results>.cat-result-group__head{align-items:end}
.cat-canonical-results>.cat-result-group__head h2{margin:.2rem 0;font:var(--cat2-text-4) var(--cat-serif);color:var(--cat-blue-deep)}
.cat-canonical-results>div:last-child{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}
.cat-canonical-results a{display:flex;flex-direction:column;gap:.35rem;padding:1.1rem;border:1px solid var(--cat-line);background:#fff;color:var(--cat-ink);text-decoration:none}
.cat-canonical-results a:hover,.cat-canonical-results a:focus-visible{border-color:var(--cat-red);box-shadow:0 8px 22px rgb(30 43 48 / 10%)}
.cat-canonical-results small{color:var(--cat-red-deep);font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.cat-canonical-results strong{font:var(--cat2-text-3) var(--cat-serif);color:var(--cat-blue-deep)}
.cat-canonical-results span,.cat-canonical-results p{color:var(--cat-ink-soft);font-size:.86rem}
.cat-canonical-results p{margin:.3rem 0}
.cat-canonical-results em{margin-top:auto;color:var(--cat-red-deep);font-style:normal;font-weight:800}

@media(max-width:760px){
  .cat-heritage-record__head,.cat-heritage-record__identity,.cat-heritage-record__support{grid-template-columns:1fr}
  .cat-heritage-record__support>section+section{border-left:0;border-top:1px solid var(--cat-line)}
  .cat-heritage-record__identity dl,.cat-heritage-record__support dl,.cat-heritage-record__inventory dl{grid-template-columns:1fr}
  .cat-heritage-record__inventory{margin:0 1rem 1rem}
  .cat-canonical-results>div:last-child{grid-template-columns:1fr}
}

/* Cierre visual de Datos abiertos: el bloque oscuro no puede heredar un
   encabezado azul oscuro y las fichas BIC sin imagen conservan la misma
   anchura y jerarquía que las que sí tienen miniatura. */
.cat-territory-reading-hero h2{max-width:14ch;margin:.2rem 0 .8rem;color:#fff;font:clamp(2.8rem,6vw,5.7rem)/.96 var(--cat-serif)}
.cat-data-examples a{grid-template-columns:120px minmax(0,1fr);min-height:12.5rem;color:#173f4d;text-decoration:none}
/* Mismo patron que .cat-feature-card__fallback (texto grande sobre panel
   oscuro, no un icono): la ficha sin miniatura debe leerse como parte de la
   misma familia de tarjetas del tema, no como una caja generica aparte.
   Colores solidos (no degradado+opacidad) para que el contraste quede
   garantizado sin tener que calcular una mezcla. */
.cat-data-examples__fallback{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;width:100%;height:100%;min-height:12.5rem;background:var(--cat-blue-deep);color:#fff;font-family:var(--cat-serif);font-size:2.4rem;font-style:italic;line-height:1}
.cat-data-examples__fallback-caption{color:#f1cb6c;font-family:inherit;font-size:.72rem;font-style:normal;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.cat-data-examples span{align-items:flex-start;gap:.42rem;padding:1.15rem}
.cat-data-examples small{color:#9f2234;font-size:.74rem;font-weight:800;line-height:1.35}
.cat-data-examples strong{max-width:18ch;color:#173f4d;font:var(--cat2-text-3)/1.1 var(--cat-serif)}
.cat-data-examples i{margin-top:auto;color:#86172a;font-weight:800}
.cat-data-examples a:hover,.cat-data-examples a:focus-visible{border-color:#9f2234;background:#f8efe4;box-shadow:0 8px 20px rgb(20 63 77 / 10%);outline:none}
@media(max-width:620px){.cat-data-examples a{grid-template-columns:90px minmax(0,1fr);min-height:0}.cat-data-examples__fallback{min-height:6.5rem;font-size:1.6rem}.cat-data-examples strong{max-width:none}}

/* Servicios ----------------------------------------------------------------
   Bloque hermano de "Empresas y negocios": mismo esqueleto de <details>
   anidados para que la ficha no se alargue, pero en el azul editorial del
   catálogo y no en el verde de economía, porque son dos capas de dato
   distintas. El gobierno municipal (alcalde y serie electoral) ya no vive
   aquí: se muestra arriba, junto a los demás datos básicos del pueblo (ver
   cat-place-facts__gobierno-detalle en ficha-lugar.css). Todos los pares de
   color usados aquí superan 4.5:1 sobre su fondo (el banner, blanco sobre
   #244e63, está en 8,9:1) y ningún estado depende sólo del color. */
.cat-servicios { margin: 2.2rem 0; border-radius: 14px; overflow: hidden; background: #fffdf8; box-shadow: 0 10px 30px rgb(21 37 46 / 12%); }

/* .cat-servicios__banner migrado a .cat-record-banner--servicios
   (catalogo-componentes.css, capa `componentes`, Fase 4 del plan de
   theme) -- fusionado con .cat-economia-banner. */
.cat-servicios__body { padding-top: .2rem; }
.cat-servicios__intro-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1rem; margin: 1.2rem clamp(1.2rem, 3vw, 2rem) 1rem; }
.cat-servicios__intro { flex: 1 1 20rem; margin: 0; color: #40535d; }

.cat-servicios__aviso { margin: 0 clamp(1.2rem, 3vw, 2rem) 1rem; padding: .8rem 1.1rem; border-left: 4px solid #244e63; border-radius: 0 8px 8px 0; background: #eef2f5; color: #173746; font-size: .9rem; }

.cat-servicios__resumen { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(9rem, 100%), 1fr)); gap: .7rem; margin: 0 clamp(1.2rem, 3vw, 2rem) 1.2rem; padding: 0; list-style: none; }
.cat-servicios__resumen li { display: grid; gap: .15rem; padding: .75rem .9rem; border-radius: 10px; background: #eef2f5; }
.cat-servicios__resumen strong { color: #173746; font: var(--cat2-text-3) var(--cat-serif); }
.cat-servicios__resumen span { color: #40535d; font-size: .82rem; }

.cat-servicios__adscripcion { margin: 0 clamp(1.2rem, 3vw, 2rem) 1.2rem; color: #40535d; font-size: .9rem; }

.cat-servicios__groups { display: grid; gap: .8rem; margin: 0 clamp(1.2rem, 3vw, 2rem) 1rem; }
.cat-servicios__group { margin: 0; border: 1px solid #e8e1d3; border-radius: 12px; background: #fff; }
.cat-servicios__group > summary { display: flex; align-items: center; gap: .8rem; min-height: 2.75rem; padding: .85rem 1.1rem; cursor: pointer; list-style: none; }
.cat-servicios__group > summary::-webkit-details-marker { display: none; }
.cat-servicios__group > summary:focus-visible { outline: 3px solid #244e63; outline-offset: -3px; }
/* .cat-servicios__group ahora es un .cat-accordion real: cabecera
   (texto, badge, +/-) la fija el inventario, no reglas propias -- se
   retiran __group-title/h4/__group-count/__group-caret, ya no existen
   en el marcado. */
.cat-servicios__group-body { padding: 0 1.1rem 1rem; }

.cat-servicios__lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(16rem, 100%), 1fr)); gap: .8rem; margin: 0 0 .8rem; padding: 0; list-style: none; }
/* Mismo lenguaje visual que .cat-card (filete dorado, radio, degradado):
   no se renombra a .cat-card porque esta pieza no es un enlace completo
   (el telefono es una accion secundaria dentro, no toda la tarjeta), asi
   que la estructura __link no encaja -- pero el aspecto es el mismo. */
.cat-servicios__item { display: grid; gap: .2rem; min-width: 0; padding: .8rem .9rem; border: 1px solid var(--cat-line); border-top: 3px solid var(--cat-gold); border-radius: 8px; background: linear-gradient(180deg, var(--cat-surface), #f7f2e6); box-shadow: 0 2px 8px rgb(21 37 46 / 7%); overflow-wrap: anywhere; }
.cat-servicios__item strong { color: #15252e; font-size: .98rem; }
.cat-servicios__item-tipo { color: #244e63; font-weight: 700; font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; }
.cat-servicios__item-detalle { color: #40535d; font-size: .84rem; }
/* 2,75rem = 44 px: objetivo táctil mínimo, que en móvil estos enlaces de
   teléfono y los propios acordeones se quedaban en 22 px de alto. */
.cat-servicios__item-tel { display: inline-flex; align-items: center; justify-self: start; min-height: 2.75rem; color: #244e63; font-size: .84rem; font-weight: 700; }
.cat-servicios__item-tel:focus-visible { outline: 3px solid #244e63; outline-offset: 2px; }

.cat-servicios__fuente { margin: 0; font-size: .78rem; }
.cat-servicios__ausencias { margin: 1rem clamp(1.2rem, 3vw, 2rem) 1.4rem; padding: .85rem 1.1rem; border-left: 4px solid #8e242b; border-radius: 0 8px 8px 0; background: #f7eeee; color: #6f171d; font-size: .88rem; }

/* Tarjeta de gobierno municipal, ahora en la cabecera de la ficha (ver
   detalle_ficha.html, dentro de .cat-place-facts). Comparte la lista de la
   serie electoral con el bloque de servicios de arriba, de ahí que
   .cat-servicios__serie-* siga viviendo en este fichero. */
.cat-place-facts__partido { color: #40535d; font-weight: 500; }
.cat-place-facts__gobierno-detalle { margin: .6rem 0 0; padding-top: .6rem; border-top: 1px solid #e8e1d3; color: #40535d; font-size: .88rem; }
.cat-place-facts__gobierno-detalle > p { margin: 0 0 .4rem; }
.cat-place-facts__serie summary { min-height: 2.75rem; display: flex; align-items: center; }
.cat-servicios__serie-lista { display: grid; gap: .35rem; margin: .5rem 0 .8rem; padding: 0; list-style: none; }
.cat-servicios__serie-lista li { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem; padding: .35rem .55rem; border-radius: 8px; background: #f4f1ea; }
.cat-servicios__serie-anio { min-width: 3rem; color: #40535d; font-size: .82rem; }
.cat-servicios__serie-partido { color: #173746; font-weight: 700; font-size: .92rem; }
.cat-servicios__serie-dato { color: #40535d; font-size: .8rem; }

@media (max-width: 40rem) {
  .cat-servicios__intro-row { flex-direction: column; align-items: stretch; }
  /* flex: 1 1 20rem (arriba) fija un minimo de 20rem en el eje principal --
     con la fila horizontal eso es un ANCHO minimo razonable, pero al pasar
     a flex-direction:column el eje principal pasa a ser vertical, y ese
     mismo 20rem se convierte en una ALTURA minima: el parrafo quedaba con
     ~320px de alto pese a tener 3 lineas de texto, dejando un hueco enorme
     antes del enlace "Consulta datos abiertos" (visto en produccion,
     ficha/193 y cualquier ficha de lugar con acordeon de Servicios, es un
     parcial compartido). auto deja que la altura la marque el contenido,
     igual que en desktop marca el ancho el propio flex-basis de 20rem. */
  .cat-servicios__intro { flex-basis: auto; }
  .cat-servicios__serie-lista li { gap: .25rem; }
}

/* ---- share.css ---- */
/* Barra de compartir integrada en el flujo de la página, justo antes del
   pie de página (footer), en todas las páginas. No es un elemento flotante:
   no tapa el contenido ni se confunde con el botón de volver arriba. */
/* Bug real señalado y confirmado en el catalogo de componentes aprobado
   (https://claude.ai/code/artifact/b98b7759-...): pedia variables
   "--color-" y "--text-" que nunca existieron en el catalogo publico
   (son nombres del sistema del panel interno, arca-tokens.css) -- asi
   que siempre caia al valor de reserva, un azul generico ajeno a la
   identidad navy/dorado del sitio. Se apunta a los tokens reales que
   creo la Fase 2 (catalogo-tokens.css, prefijo --cat2-), con el mismo
   valor de reserva que ya tenia por si alguna pagina no los carga. */
.cat-share-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  padding: 0.6rem 1.5rem;
  background: var(--cat2-color-surface-alt, #eef2f8);
  border-top: 1px solid var(--cat2-color-border, #d0d9e8);
}

.cat-share-bar__label {
  font-size: var(--cat2-text-00, 0.8125rem);
  color: var(--cat2-color-text-secondary, #4a5f7a);
  font-weight: 600;
}

.cat-share-bar__links {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.cat-share-bar__links a,
.cat-share-bar__links button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  border: none;
  background: var(--cat2-color-surface, #fff);
  color: var(--cat2-color-text-secondary, #4a5f7a);
  cursor: pointer;
  text-decoration: none;
}

.cat-share-bar__links a svg,
.cat-share-bar__links button svg {
  width: 1.05rem;
  height: 1.05rem;
  fill: currentColor;
}

.cat-share-bar__links a:hover,
.cat-share-bar__links a:focus-visible,
.cat-share-bar__links button:hover,
.cat-share-bar__links button:focus-visible {
  background: var(--cat2-color-accent, #2b4c7e);
  color: var(--cat2-color-text-inverse, #fff);
}

@media (max-width: 640px) {
  .cat-share-bar {
    padding: 0.5rem 1rem;
    gap: 0.5rem;
  }

  .cat-share-bar__label {
    width: 100%;
    font-size: var(--cat2-text-000, 0.75rem);
  }
}
