/* Páginas públicas de las leyes (fase 6, SEO): /leyes/, /ley-…/ y /ley-…/articulo-N.
   Las pinta el Worker (src/seo/) sin JavaScript. Reutilizan base, navegación y temario.css; aquí solo
   va lo propio: migas, el ancho de lectura sin índice lateral, la tarjeta del test y el índice abierto.
   Solo la cargan estas páginas (public/assets/paginas/ley.html): no pesa en la app. */

.ley { max-width: 920px; }
.ley-pagina .publico { padding-top: var(--esp-5); }

/* Migas: «Inicio › Leyes › Ley 31/1995 › Artículo 15» */
.ley-migas { margin-bottom: var(--esp-5); font-size: var(--tam-s); }
.ley-migas ol { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 0; margin: 0; padding: 0; list-style: none; }
.ley-migas li { display: inline-flex; align-items: center; min-width: 0; color: var(--tenue); }
.ley-migas li + li::before { content: '›'; margin: 0 8px; color: var(--linea-fuerte); }
.ley-migas a { display: inline-flex; align-items: center; min-height: 32px; color: var(--texto); font-weight: 600; }
.ley-migas [aria-current] { color: var(--tinta-2); font-weight: 600; }

/* Artículo: una sola columna centrada (la app pone aquí el índice al lado). */
.ley-lectura.tm[data-vista="lectura"] { grid-template-columns: minmax(0, 1fr); grid-template-areas: "hoja"; }
.ley-cabecera__ley { display: block; margin-bottom: var(--esp-2); color: var(--marino); font: 700 var(--tam-s)/1.3 var(--letra); letter-spacing: .04em; text-transform: uppercase; }
.ley-vigencia { max-width: 34em; margin: var(--esp-4) 0 var(--esp-6); padding-bottom: var(--esp-5); border-bottom: 1px solid var(--linea-suave);
  color: var(--tenue); font: 500 var(--tam-s)/1.5 var(--letra); }
.ley-vigencia + .tm-texto { margin-top: 0; }

/* «¿Te lo sabes?»: el paso a la app, sin respuestas. */
.ley-test { gap: var(--esp-3); }
.ley-test__titulo { color: var(--tinta); font: 600 var(--tam-xl)/1.25 var(--letra-serif); }
.ley-test p { max-width: 58ch; color: var(--texto); line-height: 1.55; }
.ley-test__acciones { margin-top: var(--esp-1); }

.ley-volver { margin-top: var(--esp-6); }
.ley-volver a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 650; }

/* Índice de la ley: abierto entero (todo enlazado, sin desplegables). */
.ley-antetitulo { margin-bottom: var(--esp-3); color: var(--marino); font: 700 var(--tam-s)/1.3 var(--letra); letter-spacing: .04em; text-transform: uppercase; }
.ley-portada .tm-portada__detalle { max-width: var(--medida); }
.ley-indice { display: grid; gap: var(--esp-4); margin-top: var(--esp-8); }
.ley-indice__titulo { color: var(--tinta); font: 600 var(--tam-2xl)/1.2 var(--letra-serif); letter-spacing: -.01em; }
.ley-sec__titulo { display: grid; gap: 2px; padding: var(--esp-5) var(--esp-5) var(--esp-2); }
.ley-sec .tm-sub { padding-top: 0; }

.ley-vacio { text-align: left; align-items: flex-start; }

/* ── Fase 9: lo que añade la página del artículo ─────────────────────────────────────────── */
/* Los botones de estas páginas pueden partir línea (textos largos a 320 px). */
.ley .boton { white-space: normal; text-align: center; }

/* «En pocas palabras»: la respuesta corta antes del texto, y la ficha en una fila de cifras. */
.ley-resumen { max-width: 34em; margin: 0 0 var(--esp-7); }
.ley-resumen__titulo, .ley-texto__titulo, .ley-cifras__titulo {
  margin-bottom: var(--esp-2); color: var(--marino); font: 700 var(--tam-s)/1.3 var(--letra); letter-spacing: .04em; text-transform: uppercase;
}
.ley-resumen__texto { color: var(--tinta-2); font: 400 1.0625em/1.6 var(--letra-ley); text-wrap: pretty; }
.ley-ficha { display: grid; grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr)); gap: var(--esp-3) var(--esp-4); margin: var(--esp-5) 0 0;
  padding-top: var(--esp-4); border-top: 1px solid var(--linea-suave); font-family: var(--letra); }
.ley-ficha div { min-width: 0; }
.ley-ficha dt { color: var(--tenue); font-size: var(--tam-xs); font-weight: 650; letter-spacing: .02em; }
.ley-ficha dd { margin: 2px 0 0; color: var(--tinta); font: 700 1.125rem/1.25 var(--letra-cond); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ley-texto__titulo { margin-bottom: var(--esp-4); }

/* Plazos y cifras: frases literales con el dato subrayado como con rotulador. */
.ley-cifras { max-width: 34em; margin-top: var(--esp-8); padding-top: var(--esp-6); border-top: 1px solid var(--linea-suave); font-family: var(--letra); }
.ley-cifras__nota { color: var(--tenue); font-size: var(--tam-m); line-height: 1.5; }
.ley-cifras__lista { display: grid; gap: var(--esp-3); margin: var(--esp-4) 0 0; padding: 0; list-style: none; }
.ley-cifras__lista li { display: grid; grid-template-columns: 4.6rem minmax(0, 1fr); gap: var(--esp-3); align-items: baseline; }
.ley-cifras__ap { color: var(--marino); font: 700 var(--tam-m)/1.3 var(--letra-cond); font-variant-numeric: tabular-nums; }
.ley-cifras__texto { grid-column: 2; color: var(--tinta-2); font: 400 1rem/1.55 var(--letra-ley); }
.ley-cifras__texto strong { color: var(--tinta); font-weight: 650; box-shadow: inset 0 -.42em 0 var(--ambar-suave); }

/* Preguntas de muestra: se leen, no se pulsan (sin la respuesta). */
.ley-test__nota { color: var(--tenue); font-size: var(--tam-m); }
.ley-muestra { display: grid; gap: var(--esp-4); margin: 0; padding: 0; list-style: none; }
.ley-preg { display: grid; gap: var(--esp-3); padding: var(--esp-4) var(--esp-5) var(--esp-5); border: 1px solid var(--crema-2); border-radius: var(--radio-16); background: var(--superficie); }
.ley-preg__meta { display: flex; flex-wrap: wrap; gap: 6px; }
.ley-test .ley-preg__enunciado { max-width: none; color: var(--tinta); font: 600 var(--tam-l)/1.4 var(--letra); }
.ley-preg__opciones { display: grid; gap: var(--esp-2); margin: 0; padding: 0; list-style: none; }
.ley-preg__opciones li { display: flex; align-items: flex-start; gap: var(--esp-3); color: var(--tinta-2); line-height: 1.45; }
.ley-preg__letra { flex: none; display: inline-grid; place-items: center; width: 28px; height: 28px; border: 1.5px solid var(--linea-fuerte); border-radius: 50%;
  color: var(--tinta-2); font: 700 var(--tam-m)/1 var(--letra-cond); }
.ley-preg__opciones li > span:last-child { padding-top: 3px; }
.ley-test .ley-preg__accion { font-size: var(--tam-m); }
.ley-preg__accion a { font-weight: 650; }

/* Artículos relacionados y los de más preguntas del índice: tarjetas pequeñas en rejilla. */
.ley-relacionados, .ley-destacados { margin-top: var(--esp-8); }
.ley-relacionados__titulo, .ley-destacados__titulo { color: var(--tinta); font: 600 var(--tam-2xl)/1.2 var(--letra-serif); letter-spacing: -.01em; }
.ley-relacionados__sub { margin: var(--esp-5) 0 var(--esp-3); color: var(--tenue); font: 700 var(--tam-s)/1.3 var(--letra); letter-spacing: .04em; text-transform: uppercase; }
.ley-destacados__nota { margin: var(--esp-2) 0 var(--esp-4); color: var(--tenue); font-size: var(--tam-m); }
.ley-rel__lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: var(--esp-3); margin: 0; padding: 0; list-style: none; }
.ley-rel { display: grid; align-content: start; gap: 2px; height: 100%; min-height: 64px; padding: var(--esp-3) var(--esp-4);
  border: 1px solid var(--linea); border-radius: var(--radio-12); background: var(--superficie); color: var(--tinta); text-decoration: none;
  transition: border-color var(--mv, .15s), box-shadow var(--mv, .15s); }
.ley-rel:hover { border-color: var(--linea-fuerte); box-shadow: var(--sombra-suave); color: var(--tinta); text-decoration: none; }
.ley-rel__etiqueta { font: 700 1.0625rem/1.25 var(--letra-cond); }
.ley-rel__rubrica { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden;
  color: var(--texto); font: 400 var(--tam-s)/1.4 var(--letra-ley); }
.ley-rel__dato { margin-top: var(--esp-1); color: var(--marino); font-size: var(--tam-s); font-weight: 650; }
.ley-destacados + .ley-indice { margin-top: var(--esp-8); }

/* La oferta, al final: marino suave, precio de nucleo/oferta.mjs. */
.ley-oferta { display: grid; gap: var(--esp-3); margin-top: var(--esp-8); padding: clamp(20px, 4vw, 36px); border: 1px solid var(--marino-borde);
  border-radius: var(--radio-24); background: var(--marino-suave); color: var(--texto); }
.ley-oferta__titulo { color: var(--tinta); font: 600 var(--tam-2xl)/1.2 var(--letra-serif); letter-spacing: -.01em; }
.ley-oferta p, .ley-oferta__lista { max-width: var(--medida); line-height: 1.55; }
.ley-oferta__lista { display: grid; gap: var(--esp-1); margin: 0; padding-left: 1.1em; }
.ley-oferta__lista strong, .ley-oferta__precio strong { color: var(--tinta); }
.ley-oferta__acciones { display: flex; flex-wrap: wrap; gap: var(--esp-3); margin-top: var(--esp-2); }

/* /leyes/: sigla y fecha en cada tarjeta. */
.ley-tarjeta__sigla { color: var(--marino); font: 700 var(--tam-s)/1.3 var(--letra); letter-spacing: .04em; text-transform: uppercase; }
.ley-tarjeta__fecha { color: var(--tenue); font-size: var(--tam-s); }

@media (max-width: 539px) {
  .ley-sec__titulo { padding: var(--esp-4) var(--esp-4) var(--esp-1); }
  .ley-migas { margin-bottom: var(--esp-4); }
  .ley-cifras__lista li { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .ley-cifras__texto { grid-column: 1; }
  .ley-preg { padding: var(--esp-4); }
  .ley-oferta__acciones .boton { flex: 1 1 100%; }
}
@media (prefers-reduced-motion: reduce) { .ley-rel { transition: none; } }
@media print {
  .cabecera-publica, .pie, .ley-migas, .ley-volver, .ley-oferta, .ley-relacionados, .ley-test { display: none !important; }
}