/* Páginas legales: misma tipografía y colores que la carta, en versión lectura. */
@font-face { font-family: "Bricolage"; src: url("/fonts/bricolage-latin.woff2") format("woff2"); font-weight: 200 800; font-stretch: 75% 100%; font-display: swap; }
:root {
  --primario: #0f5c66;
  --tinta: color-mix(in oklab, var(--primario) 16%, #16171a);
  --tinta-2: color-mix(in oklab, var(--tinta) 64%, #ffffff);
  --fondo: color-mix(in oklab, var(--primario) 3%, #f7f8f7);
  --linea: color-mix(in oklab, var(--tinta) 11%, #ffffff);
}
* { box-sizing: border-box; }
html { background: var(--fondo); }
body { margin: 0; background: var(--fondo); color: var(--tinta); font: 1.05rem/1.65 "Bricolage", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
.legal-cabecera { max-width: 760px; margin: 0 auto; padding: 22px 20px 0; }
.legal-volver { display: inline-flex; align-items: center; gap: 6px; color: var(--primario); font-weight: 650; text-decoration: none; }
.legal-volver svg { width: 20px; height: 20px; }
.legal { max-width: 760px; margin: 0 auto; padding: 24px 20px 80px; }
.legal h1 { font-size: clamp(2.6rem, 11vw, 4rem); font-stretch: 75%; font-weight: 780; line-height: .95; letter-spacing: -0.01em; margin: 18px 0 28px; }
.legal h2 { font-size: 1.25rem; font-weight: 700; margin: 2.2em 0 .5em; }
.legal p { margin: 0 0 1em; max-width: 68ch; }
.legal a { color: var(--primario); }
.legal-datos { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--linea); }
.legal-datos li { display: grid; grid-template-columns: 160px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--linea); }
.legal-datos span { color: var(--tinta-2); font-size: .95rem; }
.tabla { overflow-x: auto; margin: 0 0 1em; }
.legal table { width: 100%; border-collapse: collapse; font-size: .95rem; min-width: 520px; }
.legal th, .legal td { text-align: left; padding: 10px 12px 10px 0; border-bottom: 1px solid var(--linea); vertical-align: top; }
.legal th { font-weight: 650; }
.legal-boton { font: inherit; font-weight: 650; padding: 12px 20px; border-radius: 999px; border: 1.5px solid var(--linea); background: #fff; color: var(--tinta); cursor: pointer; }
.legal-fecha { margin-top: 3em; color: var(--tinta-2); font-size: .92rem; }
@media (max-width: 520px) { .legal-datos li { grid-template-columns: 1fr; gap: 0; } }