/* Hallmark · páginas internas — hereda tokens.css y styles.css (tema v5 "moderno cálido 2026")
 * Todo color y fuente referencia tokens. Ningún valor suelto */

/* ============ encabezado de página interna ============ */
.encabezado { padding-block: var(--space-xl) var(--space-lg); }
.encabezado h1 { font-size: var(--text-3xl); max-width: 20ch; }
.encabezado > p { margin: var(--space-sm) 0 0; color: var(--color-muted); font-size: var(--text-md); max-width: 60ch; }
.miga { display: flex; flex-wrap: wrap; gap: var(--space-xs); list-style: none; padding: 0; margin: 0 0 var(--space-md); font-size: var(--text-xs); color: var(--color-muted); }
.miga li::after { content: "›"; margin-inline-start: var(--space-xs); color: var(--color-neutral); }
.miga li:last-child::after { content: ""; }
.miga a { text-decoration: none; font-weight: 600; white-space: nowrap; }

/* ============ Conóceme ============ */
.bio-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-xl); align-items: start; }
.bio-grid > * { min-width: 0; }
.bio__retrato img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--radius-lg); }
.bio__ficha { margin-top: var(--space-md); background: var(--color-paper-2); border-radius: var(--radius-md); padding: var(--space-lg); }
.bio__ficha dl { display: grid; gap: var(--space-sm); margin: 0; }
.bio__ficha dt { font-size: var(--text-xs); font-weight: 700; color: var(--color-accent); }
.bio__ficha dd { margin: var(--space-3xs) 0 0; font-size: var(--text-sm); color: var(--color-ink-2); }
.bio__texto p { font-size: var(--text-md); }
.bio__texto p:first-of-type { font-size: var(--text-lg); color: var(--color-ink); }

.valores { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-md); margin-top: var(--space-xl); }
.valor { min-width: 0; background: var(--color-paper-2); border-radius: var(--radius-lg); padding: var(--space-lg); }
.valor h3 { font-size: var(--text-md); margin-bottom: var(--space-2xs); }
.valor p { margin: 0; font-size: var(--text-sm); color: var(--color-ink-2); }
.valor__num { font-family: var(--font-display); font-weight: 800; font-size: var(--text-lg); color: var(--color-accent); display: block; line-height: 1; margin-bottom: var(--space-xs); }

/* ============ Gestión parlamentaria ============ */
.comisiones { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md); }
.comision { min-width: 0; border-radius: var(--radius-lg); padding: var(--space-lg); background: var(--color-paper-2); }
.comision--actual { background: linear-gradient(145deg, var(--color-accent) 0%, var(--color-accent-2) 100%); color: var(--color-accent-ink); }
.comision--actual h3, .comision--actual p, .comision--actual .comision__periodo { color: var(--color-accent-ink); }
.comision__periodo { font-size: var(--text-xs); font-weight: 700; color: var(--color-accent); letter-spacing: 0.04em; }
.comision h3 { font-size: var(--text-lg); margin-block: var(--space-2xs) var(--space-xs); }
.comision p { margin: 0; font-size: var(--text-sm); color: var(--color-ink-2); }
.comision ul { margin: var(--space-sm) 0 0; padding-left: 1.1rem; font-size: var(--text-sm); color: var(--color-ink-2); }
.comision--actual ul { color: var(--color-accent-ink); }

.ficha-contacto { background: var(--color-paper-2); border-radius: var(--radius-lg); padding: var(--space-lg); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-lg); }
.ficha-contacto > div { min-width: 0; }
.ficha-contacto dt { font-size: var(--text-xs); font-weight: 700; color: var(--color-accent); margin-bottom: var(--space-3xs); }
.ficha-contacto dd { margin: 0; font-size: var(--text-sm); color: var(--color-ink-2); overflow-wrap: anywhere; }

/* estado vacío honesto — lo llena el panel de administración */
.vacio {
  border: 2px dashed var(--color-rule); border-radius: var(--radius-lg);
  padding: var(--space-xl); text-align: center; background: var(--color-paper);
}
.vacio h3 { font-size: var(--text-md); margin-bottom: var(--space-xs); }
.vacio p { margin: 0 auto; font-size: var(--text-sm); color: var(--color-muted); max-width: 52ch; }

/* lista de noticias / entradas */
.entradas { display: grid; gap: var(--space-md); }
.entrada {
  display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: var(--space-lg);
  background: var(--color-paper-2); border-radius: var(--radius-lg); overflow: hidden;
  transition: box-shadow var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out);
}
.entrada:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.entrada img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.entrada__cuerpo { padding: var(--space-lg) var(--space-lg) var(--space-lg) 0; display: flex; flex-direction: column; gap: var(--space-xs); justify-content: center; min-width: 0; }
.entrada__meta { font-size: var(--text-xs); font-weight: 700; color: var(--color-accent); }
.entrada h3 { font-size: var(--text-lg); }
.entrada p { margin: 0; font-size: var(--text-sm); color: var(--color-ink-2); }

/* ============ entrada ancha (texto + carrusel) ============ */
.entrada-ancha {
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-xl);
  align-items: center; background: var(--color-paper-2); border-radius: var(--radius-lg);
  padding: var(--space-xl); margin-top: var(--space-md);
}
.entrada-ancha + .entrada-ancha { margin-top: var(--space-lg); }
.entrada-ancha__texto { min-width: 0; }
.entrada-ancha h3 { font-size: var(--text-xl); margin-block: var(--space-2xs) var(--space-sm); }
.entrada-ancha p { font-size: var(--text-sm); color: var(--color-ink-2); }
/* Alterna el lado de la foto para que la página no lea como una lista */
.entrada-ancha--invertida { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.entrada-ancha--invertida .entrada-ancha__texto { order: 2; }
.entrada-ancha--invertida .mini-carrusel { order: 1; }

/* ============ foto de la trayectoria ============ */
.trayectoria__foto { margin-bottom: var(--space-xl); }
.trayectoria__foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; object-position: 50% 30%; border-radius: var(--radius-lg); }
.trayectoria__foto figcaption { margin-top: var(--space-sm); font-size: var(--text-sm); color: var(--color-muted); }

/* ============ enlaces externos ============ */
.enlace-externo { font-weight: 700; text-decoration-color: var(--color-accent); white-space: nowrap; }
.enlace-externo span { color: var(--color-accent); }

/* ============ informe destacado ============ */
.informe--nuevo { background: var(--color-accent-soft); border: 2px solid var(--color-accent); }
.informe__etiqueta {
  display: inline-block; align-self: flex-start; padding: 0.2rem 0.65rem; margin-bottom: var(--space-2xs);
  border-radius: var(--radius-pill); background: var(--color-accent); color: var(--color-accent-ink);
  font-size: var(--text-xs); font-weight: 700;
}

/* ============ galería multimedia con pestañas ============ */
.filtros { display: flex; flex-wrap: wrap; gap: var(--space-xs); margin-bottom: var(--space-lg); }
.filtros button {
  display: inline-flex; align-items: center; gap: var(--space-xs); min-height: 44px;
  padding-inline: var(--space-lg); border-radius: var(--radius-pill); cursor: pointer;
  border: 2px solid var(--color-rule); background: var(--color-paper); color: var(--color-ink);
  font-family: var(--font-body); font-size: var(--text-sm); font-weight: 700; white-space: nowrap;
  transition: background-color var(--dur-micro) var(--ease-out), border-color var(--dur-micro) var(--ease-out), color var(--dur-micro) var(--ease-out);
}
.filtros button:hover { border-color: var(--color-ink); }
.filtros button[aria-pressed="true"] { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-accent-ink); }
.filtros span { font-variant-numeric: tabular-nums; opacity: 0.7; }

/* Filtro por municipio: los que no tienen gestiones quedan inactivos */
.filtros--municipios { margin-bottom: var(--space-sm); }
.filtros--municipios button span {
  min-width: 20px; padding-inline: 5px; border-radius: var(--radius-pill);
  background: var(--color-accent-soft); color: var(--color-accent-deep);
  font-size: var(--text-2xs); font-variant-numeric: tabular-nums; opacity: 1;
}
.filtros--municipios button[aria-pressed="true"] span { background: var(--color-accent-ink); color: var(--color-accent); }
.filtros--municipios button:disabled { opacity: 0.45; cursor: not-allowed; }
.filtros--municipios button:disabled:hover { border-color: var(--color-rule); }
.filtros--municipios button:disabled span { background: var(--color-paper-2); color: var(--color-muted); }

.filtros__aviso { margin: 0 0 var(--space-lg); font-size: var(--text-sm); font-weight: 700; color: var(--color-muted); min-height: 1lh; }

.sin-gestiones {
  border: 2px dashed var(--color-rule); border-radius: var(--radius-lg);
  padding: var(--space-xl); text-align: center; background: var(--color-paper); margin-bottom: var(--space-lg);
}
.sin-gestiones h3 { font-size: var(--text-md); margin-bottom: var(--space-xs); }
.sin-gestiones p { margin: 0 auto; font-size: var(--text-sm); color: var(--color-muted); max-width: 52ch; }

.entrada-ancha[hidden] { display: none; }
.entrada-ancha { scroll-margin-top: 5.5rem; }

.piezas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-md); }
.pieza { min-width: 0; }
.pieza[hidden] { display: none; }
.pieza button {
  width: 100%; padding: 0; border: 0; background: none; cursor: pointer; display: block;
  border-radius: var(--radius-lg); overflow: hidden; position: relative; line-height: 0;
  transition: transform var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out);
}
.pieza button:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.pieza img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.pieza__play {
  position: absolute; inset: 0; display: grid; place-items: center;
  background: linear-gradient(to top, var(--scrim-mid), var(--scrim-none) 60%);
}
.pieza__play span {
  width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center;
  background: var(--color-accent); color: var(--color-accent-ink); font-size: 22px; padding-left: 4px;
  box-shadow: var(--shadow-md);
}
.pieza__dur {
  position: absolute; inset-block-end: var(--space-xs); inset-inline-end: var(--space-xs);
  padding: 0.15rem 0.5rem; border-radius: var(--radius-sm);
  background: var(--scrim-strong); color: var(--color-accent-ink);
  font-size: var(--text-xs); font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.6;
}
.pieza__pie { margin: var(--space-xs) 0 0; font-size: var(--text-sm); color: var(--color-ink-2); line-height: 1.4; }

.visor video { width: 100%; max-height: 78svh; background: var(--color-ink); display: block; }

/* ============ carrusel dentro de una entrada ============ */
.mini-carrusel { position: relative; border-radius: var(--radius-lg); overflow: hidden; background: var(--color-paper-3); }
.mini-carrusel__pista { position: relative; aspect-ratio: 3 / 2; }
.mini-carrusel figure { position: absolute; inset: 0; margin: 0; opacity: 0; transition: opacity var(--dur-long) var(--ease-in-out); }
.mini-carrusel figure[data-activa="true"] { opacity: 1; }
.mini-carrusel img { width: 100%; height: 100%; object-fit: cover; }
.mini-carrusel figcaption {
  position: absolute; inset-inline: 0; inset-block-end: 0;
  padding: var(--space-lg) var(--space-md) var(--space-md);
  background: linear-gradient(to top, var(--scrim-strong), var(--scrim-none));
  color: var(--color-accent-ink); font-size: var(--text-sm); font-weight: 600;
}
.mini-carrusel__mandos {
  position: absolute; inset-block-start: var(--space-sm); inset-inline-end: var(--space-sm);
  display: flex; gap: var(--space-2xs); padding: var(--space-3xs);
  background: var(--glass); backdrop-filter: blur(10px); border-radius: var(--radius-pill);
}
.mini-carrusel__btn {
  width: 40px; height: 40px; display: grid; place-items: center; cursor: pointer;
  border: 0; background: none; border-radius: 50%; color: var(--color-ink);
  font-size: var(--text-md); font-weight: 700; line-height: 1;
  transition: background-color var(--dur-micro) var(--ease-out);
}
.mini-carrusel__btn:hover { background: var(--color-accent-soft); color: var(--color-accent-deep); }
.mini-carrusel__btn:disabled { opacity: 0.55; cursor: not-allowed; }
.mini-carrusel__cuenta {
  position: absolute; inset-block-end: var(--space-sm); inset-inline-end: var(--space-sm);
  padding: 0.25rem 0.7rem; border-radius: var(--radius-pill);
  background: var(--glass); backdrop-filter: blur(10px);
  font-size: var(--text-xs); font-weight: 700; font-variant-numeric: tabular-nums; color: var(--color-ink);
}
.mini-carrusel__tiras { display: flex; gap: var(--space-2xs); padding: var(--space-2xs); background: var(--color-paper-2); overflow-x: auto; }
.mini-carrusel__tiras button { flex: none; padding: 0; border: 2px solid transparent; background: none; border-radius: var(--radius-sm); cursor: pointer; overflow: hidden; line-height: 0; }
.mini-carrusel__tiras img { width: 84px; height: 56px; object-fit: cover; }
.mini-carrusel__tiras button[aria-selected="true"] { border-color: var(--color-accent); }

/* ============ ley sancionada ============ */
.ley { background: var(--color-paper-2); border-radius: var(--radius-xl); padding: var(--space-xl); }
.ley__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-xl); align-items: start; }
.ley__col { min-width: 0; }
.ley__numero {
  display: inline-block; font-family: var(--font-display); font-weight: 800;
  font-size: var(--text-2xl); line-height: 1; letter-spacing: -0.03em;
  color: var(--color-accent-ink); background: var(--color-accent);
  padding: var(--space-xs) var(--space-md); border-radius: var(--radius-md);
}
.ley__fecha { display: block; margin-top: var(--space-sm); font-size: var(--text-xs); font-weight: 700; color: var(--color-muted); }
.ley h3 { font-size: var(--text-2xl); margin-top: var(--space-2xs); }
.ley__sumario { margin: var(--space-sm) 0 var(--space-lg); font-size: var(--text-md); color: var(--color-ink-2); border-left: 3px solid var(--color-accent); padding-left: var(--space-md); }
.ley__cuerpo p { font-size: var(--text-sm); color: var(--color-ink-2); }
.ley__cuerpo strong { color: var(--color-ink); }
.ley__foto { min-width: 0; }
.ley__foto img { width: 100%; border-radius: var(--radius-lg); }
.ley__foto figcaption { margin-top: var(--space-sm); font-size: var(--text-xs); font-style: italic; color: var(--color-muted); }
.ley__galeria { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-lg); margin-top: var(--space-xl); border-top: 1px solid var(--color-rule); padding-top: var(--space-xl); scroll-margin-top: 6rem; }
.ley__galeria figure { min-width: 0; }
.ley__galeria img { width: 100%; border-radius: var(--radius-md); background: var(--color-paper); }
.ley__galeria figcaption { margin-top: var(--space-xs); font-size: var(--text-xs); color: var(--color-muted); }

/* ============ galería ============ */
.galeria { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-sm); }
.galeria button {
  padding: 0; border: 0; background: none; cursor: pointer; border-radius: var(--radius-md);
  overflow: hidden; display: block; min-width: 0;
  transition: transform var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out);
}
.galeria button:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.galeria img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

.visor { border: 0; padding: 0; background: none; max-width: 100%; max-height: 100%; width: min(96vw, 68rem); }
.visor::backdrop { background: oklch(16% 0.02 27 / 0.88); backdrop-filter: blur(4px); }
.visor__caja { position: relative; border-radius: var(--radius-lg); overflow: hidden; background: var(--color-ink); }
.visor img { width: 100%; height: auto; max-height: 78svh; object-fit: contain; }
.visor__pie {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-md);
  padding: var(--space-sm) var(--space-md); background: var(--color-paper); flex-wrap: wrap;
}
.visor__texto { margin: 0; font-size: var(--text-sm); color: var(--color-ink-2); }
.visor__mandos { display: flex; gap: var(--space-xs); }
.visor__btn {
  min-width: 44px; min-height: 44px; display: grid; place-items: center; cursor: pointer;
  border: 2px solid var(--color-rule); border-radius: var(--radius-pill); background: var(--color-paper);
  color: var(--color-ink); font-size: var(--text-md); font-weight: 700; line-height: 1;
  transition: background-color var(--dur-micro) var(--ease-out), border-color var(--dur-micro) var(--ease-out);
}
.visor__btn:hover { background: var(--color-accent-soft); border-color: var(--color-accent); color: var(--color-accent-deep); }
.visor__btn:disabled { opacity: 0.55; cursor: not-allowed; }

/* ============ formularios ============ */
.form-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-xl); align-items: start; }
.form-grid > * { min-width: 0; }
.formulario { background: var(--color-paper-2); border-radius: var(--radius-xl); padding: var(--space-xl); }
.campo { display: grid; gap: var(--space-2xs); margin-bottom: var(--space-md); }
.campo label { font-size: var(--text-sm); font-weight: 700; }
.campo .opcional { font-weight: 400; color: var(--color-muted); }
.campo input, .campo select, .campo textarea {
  width: 100%; min-height: 46px; padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--color-rule); border-radius: var(--radius-md);
  background: var(--color-paper); color: var(--color-ink);
  font-family: var(--font-body); font-size: var(--text-base); outline: 2px solid transparent;
  transition: border-color var(--dur-micro) var(--ease-out), background-color var(--dur-micro) var(--ease-out);
}
.campo textarea { min-height: 8rem; resize: vertical; line-height: 1.55; }
.campo input::placeholder, .campo textarea::placeholder { color: var(--color-neutral); }
.campo input:hover, .campo select:hover, .campo textarea:hover { border-color: var(--color-neutral); }
.campo input:focus-visible, .campo select:focus-visible, .campo textarea:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 1px; border-color: var(--color-rule); }
.campo input:disabled, .campo select:disabled, .campo textarea:disabled { opacity: 0.55; cursor: not-allowed; }
.campo input[aria-invalid="true"], .campo textarea[aria-invalid="true"], .campo select[aria-invalid="true"] { border-color: var(--color-accent); background: var(--color-accent-soft); }
.campo__ayuda { font-size: var(--text-xs); color: var(--color-muted); min-height: 1lh; margin: 0; }
.campo__ayuda[data-error="true"] { color: var(--color-accent-deep); font-weight: 700; }
.campo--fila { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md); }

.consentimiento { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-sm); align-items: start; background: var(--color-paper); border-radius: var(--radius-md); padding: var(--space-md); margin-bottom: var(--space-md); }
.consentimiento input { width: 22px; height: 22px; min-height: 22px; accent-color: var(--color-accent); margin-top: 2px; }
.consentimiento label { font-size: var(--text-sm); color: var(--color-ink-2); font-weight: 400; }

.aviso {
  border-radius: var(--radius-md); padding: var(--space-md) var(--space-lg); margin-bottom: var(--space-md);
  background: var(--color-accent-soft); color: var(--color-accent-deep); font-size: var(--text-sm); font-weight: 600;
  display: none;
}
.aviso[data-visible="true"] { display: block; }
.aviso b { display: block; font-size: var(--text-md); margin-bottom: var(--space-3xs); }

.lateral { display: grid; gap: var(--space-md); }
.lateral__caja { background: var(--color-paper-2); border-radius: var(--radius-lg); padding: var(--space-lg); }
.lateral__caja h2 { font-size: var(--text-md); margin-bottom: var(--space-sm); }
.lateral__caja p, .lateral__caja li { font-size: var(--text-sm); color: var(--color-ink-2); }
.lateral__caja ul { margin: 0; padding-left: 1.1rem; display: grid; gap: var(--space-2xs); }
.lateral__caja .btn { margin-top: var(--space-sm); }
.dato { display: grid; gap: var(--space-3xs); margin-bottom: var(--space-md); }
.dato:last-child { margin-bottom: 0; }
.dato dt { font-size: var(--text-xs); font-weight: 700; color: var(--color-accent); }
.dato dd { margin: 0; font-size: var(--text-sm); overflow-wrap: anywhere; }

/* consulta de radicado */
.radicado-form { display: flex; gap: var(--space-sm); flex-wrap: wrap; }
.radicado-form input { flex: 1; min-width: 12rem; }

/* ============ redes ============ */
.redes-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md); }
.red {
  min-width: 0; border-radius: var(--radius-lg); padding: var(--space-lg); background: var(--color-paper-2);
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--space-lg); align-items: center;
  text-decoration: none; border: 2px solid transparent;
  transition: box-shadow var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out);
}
.red:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); color: inherit; }
.red__icono {
  width: 62px; height: 62px; border-radius: var(--radius-md); display: grid; place-items: center;
  background: var(--color-paper); box-shadow: var(--shadow-sm);
}
.red__texto { min-width: 0; }
.red h3 { font-size: var(--text-md); }
.red__cuenta { margin: var(--space-3xs) 0 0; font-size: var(--text-sm); font-weight: 700; color: var(--color-accent-deep); overflow-wrap: anywhere; }
.red__desc { margin: var(--space-2xs) 0 0; font-size: var(--text-sm); color: var(--color-muted); }
.red__flecha { font-size: var(--text-lg); color: var(--color-neutral); transition: transform var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out); }
.red:hover .red__flecha { transform: translateX(4px); color: var(--color-accent); }

/* cada marca aporta su propio color al pasar por encima */
.red--instagram:hover { border-color: oklch(60% 0.22 350); }
.red--facebook:hover  { border-color: oklch(58% 0.20 260); }
.red--x:hover         { border-color: var(--color-ink); }
.red--tiktok:hover    { border-color: oklch(62% 0.24 15); }

/* ============ logotipos oficiales de las redes ============ */
.logo-red { width: 34px; height: 34px; display: block; }
.logo-red--pie { width: 18px; height: 18px; }

.embed-caja { background: var(--color-paper-2); border-radius: var(--radius-lg); padding: var(--space-lg); }
.embed-caja h2 { font-size: var(--text-lg); margin-bottom: var(--space-xs); }

/* ============ documento legal ============ */
.legal-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--space-xl); align-items: start; }
.legal-grid > * { min-width: 0; }
.legal__indice { position: sticky; top: 5.5rem; background: var(--color-paper-2); border-radius: var(--radius-lg); padding: var(--space-lg); }
.legal__indice h2 { font-size: var(--text-md); margin-bottom: var(--space-sm); }
.legal__indice ol { margin: 0; padding-left: 1.2rem; display: grid; gap: var(--space-2xs); font-size: var(--text-sm); }
.legal__indice a { text-decoration: none; color: var(--color-ink-2); }
.legal__indice a:hover { color: var(--color-accent); }
.legal__texto h2 { font-size: var(--text-xl); margin-block: var(--space-xl) var(--space-sm); scroll-margin-top: 5.5rem; }
.legal__texto h2:first-child { margin-top: 0; }
.legal__texto h3 { font-size: var(--text-md); margin-block: var(--space-lg) var(--space-xs); }
.legal__texto p, .legal__texto li { font-size: var(--text-sm); color: var(--color-ink-2); }
.legal__texto ul, .legal__texto ol { padding-left: 1.2rem; display: grid; gap: var(--space-2xs); margin-bottom: var(--space-md); }
.legal__texto dl { display: grid; gap: var(--space-sm); margin: 0 0 var(--space-md); }
.legal__texto dt { font-weight: 700; font-size: var(--text-sm); }
.legal__texto dd { margin: var(--space-3xs) 0 0; font-size: var(--text-sm); color: var(--color-ink-2); }
.legal__nota { background: var(--color-accent-soft); border-radius: var(--radius-md); padding: var(--space-md) var(--space-lg); font-size: var(--text-sm); color: var(--color-accent-deep); }
.legal__nota p { color: inherit; margin: 0; }

/* ============ responsive ============ */
@media (max-width: 64rem) {
  .bio-grid, .form-grid, .legal-grid, .mapa-grid { grid-template-columns: minmax(0, 1fr); }
  .legal__indice { position: static; }
  .valores, .comisiones, .redes-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ficha-contacto { grid-template-columns: minmax(0, 1fr); gap: var(--space-md); }
  .galeria { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ley__grid, .entrada-ancha, .entrada-ancha--invertida { grid-template-columns: minmax(0, 1fr); }
  /* En una sola columna el texto siempre va primero */
  .entrada-ancha--invertida .entrada-ancha__texto { order: 1; }
  .entrada-ancha--invertida .mini-carrusel { order: 2; }
  .piezas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 40rem) {
  .encabezado h1 { font-size: var(--text-2xl); }
  .valores, .comisiones, .redes-grid { grid-template-columns: minmax(0, 1fr); }
  .galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .entrada { grid-template-columns: minmax(0, 1fr); }
  .entrada__cuerpo { padding: var(--space-md); }
  .entrada img { aspect-ratio: 16 / 9; }
  .formulario { padding: var(--space-lg); border-radius: var(--radius-lg); }
  .campo--fila { grid-template-columns: minmax(0, 1fr); }
  .radicado-form .btn { width: 100%; }
  .visor__pie { justify-content: center; }
  .ley { padding: var(--space-lg); border-radius: var(--radius-lg); }
  .ley__galeria { grid-template-columns: minmax(0, 1fr); }
  .ley h3, .ley__numero { font-size: var(--text-xl); }
  .entrada-ancha { padding: var(--space-lg); }
  .piezas { grid-template-columns: minmax(0, 1fr); gap: var(--space-sm); }
  .filtros button { flex: 1; justify-content: center; padding-inline: var(--space-md); }
  .mini-carrusel__tiras img { width: 68px; height: 46px; }
}
