/* JM Rutas v3 · creditos.html (generada por _herramientas/creditos.py) · solo CSS.
   En móvil la tabla de 6 columnas pasa a fichas apiladas con etiqueta por dato,
   sin desplazamiento lateral. En escritorio: filetes, columna «Pieza» destacada. */

.creditos-tabla { margin-top: var(--e-l) !important; }
.creditos-tabla table { border-top: 1.5px solid var(--tinta); }
.creditos-tabla tbody tr:hover { background: color-mix(in srgb, var(--tinta) 3%, transparent); }
.creditos-tabla tbody th { font-family: var(--f-display); font-weight: 700; font-stretch: 94%; line-height: 1.25; }
.creditos-tabla td:nth-of-type(2) { font-family: var(--f-display); font-weight: 650; font-stretch: 92%; }
.creditos-tabla td:nth-of-type(4) { font-family: var(--f-display); font-size: .78rem; font-weight: 700; font-stretch: 80%; letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-3); }

@media (max-width: 759px) {
  .creditos-tabla { overflow: visible !important; }
  .creditos-tabla table { min-width: 0; }
  .creditos-tabla thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .creditos-tabla tbody, .creditos-tabla tr { display: block; }
  .creditos-tabla tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .35rem var(--medianil); padding-block: var(--e-s); border-bottom: 1px solid var(--borde); }
  .creditos-tabla th, .creditos-tabla td { display: block; padding: 0; border: 0; max-width: none; }
  .creditos-tabla tbody th { grid-column: 1 / -1; font-size: 1.05rem; }
  .creditos-tabla td:nth-of-type(3) { grid-column: 1 / -1; }
  .creditos-tabla td::before { display: block; font-family: var(--f-display); font-size: .68rem; font-weight: 700; font-stretch: 78%; letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-3); }
  .creditos-tabla td:nth-of-type(1)::before { content: "Lugar"; }
  .creditos-tabla td:nth-of-type(2)::before { content: "Autor"; }
  .creditos-tabla td:nth-of-type(3)::before { content: "Fuente y licencia"; }
  .creditos-tabla td:nth-of-type(4)::before { content: "Tipo"; }
  .creditos-tabla td:nth-of-type(5)::before { content: "Dónde aparece"; }
}
