/* Páginas de recursos: cómo citar, preguntas frecuentes y conversor. */

.cita {
  border-left: 4px solid var(--acento);
  padding-left: 0.9rem;
  color: var(--tinta);
}
.bibtex {
  background: #0e1b26;
  color: #cde7dc;
  border-radius: 10px;
  padding: 0.9rem 1.1rem;
  overflow-x: auto;
  font-size: 0.82rem;
  line-height: 1.55;
}
.bibtex code { background: none; padding: 0; color: inherit; }

.faq details { margin-bottom: 0.9rem; }
.faq summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--acento-oscuro);
  font-size: 1.02rem;
}
.faq summary:hover { color: var(--acento); }
.faq details[open] summary { margin-bottom: 0.4rem; }
.faq details p { margin: 0.3rem 0 0; }

.conversor { max-width: 44rem; }
.fila-conversor {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 0 0.9rem;
  align-items: end;
}
.fila-conversor > div { min-width: 0; }
.boton-intercambio {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2.6rem;
  width: 2.6rem;
  padding: 0;
  margin-top: 0;
  margin-bottom: 0.75rem;
  border: none;
  border-radius: 50%;
  background: var(--acento);
  color: #fff;
  cursor: pointer;
  box-shadow: 0 1px 3px rgb(0 0 0 / 0.25);
}
.boton-intercambio svg { flex: none; }
.boton-intercambio:hover { background: var(--acento-oscuro); }
.conv-resultado {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--acento-oscuro);
  font-variant-numeric: tabular-nums;
}
@media (max-width: 40rem) {
  .fila-conversor { grid-template-columns: 1fr; }
  .boton-intercambio { justify-self: center; margin: 0.2rem 0; }
}

.titulo-marca { vertical-align: -0.35rem; margin-right: 0.2rem; }

/* Artículos divulgativos y páginas de recursos: cada bloque es una sección
 * que ocupa el ancho de la página y alterna el fondo con la anterior (el
 * verde claro de --fondo-seccion cumple los contrastes AA). */
main > .tarjeta:nth-child(even of .tarjeta) {
  background: var(--fondo-seccion);
  border-color: var(--borde-seccion);
}
.articulo h2 {
  margin-top: 0;
  font-size: 1.25rem;
  color: var(--acento-oscuro);
}
.articulo h3 {
  margin: 1.4rem 0 0.3rem;
  font-size: 1.02rem;
  color: var(--acento-oscuro);
}
.articulo p:last-child { margin-bottom: 0; }
.articulo ol li, .articulo ul li { margin-bottom: 0.4rem; }

/* Entradilla de las páginas legales: el encuadre normativo antes del detalle. */
.entradilla {
  margin: 0 0 1.1rem;
  color: var(--texto-suave, #4a5b68);
}

/* Bloques de código de la guía de la API: mismo tratamiento que el BibTeX. */
.bloque-codigo {
  background: #0e1b26;
  color: #cde7dc;
  border-radius: 10px;
  padding: 0.9rem 1.1rem;
  overflow-x: auto;
  font-size: 0.82rem;
  line-height: 1.55;
}
.bloque-codigo code { background: none; padding: 0; color: inherit; }

/* Glosario: lista de definiciones. */
.glosario dt {
  font-weight: 700;
  color: var(--acento-oscuro);
  margin-top: 0.9rem;
}
.glosario dt:first-child { margin-top: 0; }
.glosario dd { margin: 0.25rem 0 0 0; }

.tabla-crs { border-collapse: collapse; width: 100%; }
.tabla-crs th, .tabla-crs td {
  text-align: left;
  padding: 0.45rem 0.7rem;
  border-bottom: 1px solid var(--borde);
}
.tabla-crs th { color: var(--tinta-suave); font-size: 0.85rem; }