/* ════════════════════════════════════════════════════════════════════
   ESTRUCTURA · Cuentavatios
   Lo que se repite en TODAS las páginas: contenedores, cabecera, pie y
   la prosa de las páginas de texto largo (legales, blog).

   Color, tipografía, espaciado y componentes vienen de tokens.css y NO
   se redefinen aquí. Este archivo solo coloca.

   ⚠️ Fuente única de la cabecera y el pie. Si una página los vuelve a
   escribir en su <style>, se desincronizan: son 18 páginas.
   ════════════════════════════════════════════════════════════════════ */

/* ── Contenedores ─────────────────────────────────────────────────── */
.cv-ancho{ max-width:var(--cv-ancho-ancho); margin:0 auto; padding:0 var(--cv-e5) }
.cv-wrap{ max-width:var(--cv-ancho-ancho); margin:0 auto; padding:0 var(--cv-e5) }
/* La columna de lectura se alinea con el borde izquierdo del contenedor,
   no se centra por su cuenta: si no, los H2 arrancan en verticales
   distintas según su longitud.                                        */
.cv-wrap > section, .cv-wrap > hr{ max-width:var(--cv-ancho-texto) }

/* ── Cabecera ─────────────────────────────────────────────────────── */
.cv-cab{ border-bottom:var(--cv-trazo) solid var(--cv-tinta); background:var(--cv-papel) }
.cv-cab-in{ display:flex; align-items:center; justify-content:space-between; gap:var(--cv-e5);
  padding:var(--cv-e4) 0; flex-wrap:wrap }
.cv-marca{ display:flex; align-items:center; gap:var(--cv-e3); text-decoration:none; color:var(--cv-tinta) }
.cv-marca b{ font-family:var(--cv-display); font-weight:700; font-size:1.3rem;
  letter-spacing:var(--cv-track-display) }
.cv-nav{ display:flex; gap:var(--cv-e5); font-family:var(--cv-display); font-weight:600;
  font-size:var(--cv-t-sm); flex-wrap:wrap }
.cv-nav a{ color:var(--cv-tinta); text-decoration:none; border-bottom:2px solid transparent }
.cv-nav a:hover{ border-bottom-color:var(--cv-accion); color:var(--cv-accion) }

/* ── Pie ──────────────────────────────────────────────────────────── */
.cv-pie{ border-top:var(--cv-trazo) solid var(--cv-tinta); background:var(--cv-papel);
  margin-top:var(--cv-e9); padding:var(--cv-e7) 0 var(--cv-e8); font-size:var(--cv-t-sm) }
.cv-pie a{ color:var(--cv-accion) }
.cv-revision{ font-family:var(--cv-dato); font-size:var(--cv-t-xs); color:var(--cv-tinta-3);
  margin-top:var(--cv-e4) }

/* ── Separador de sección ─────────────────────────────────────────── */
.cv-hr{ border:0; border-top:var(--cv-trazo) solid var(--cv-tinta); margin:var(--cv-e8) 0 0 }
.cv-sec{ padding:var(--cv-e8) 0 0 }
.cv-sec h2{ margin:0 0 var(--cv-e4) }
.cv-respuesta{ font-size:var(--cv-t-lg); margin:0 0 var(--cv-e5) }

/* ── Páginas de texto largo (legales, blog) ───────────────────────── */
/* Encabezado sobrio: sin hero ni ilustración. Estas páginas se leen
   cuando alguien duda, no se venden.                                  */
.cv-portada{ background:var(--cv-papel); border-bottom:var(--cv-trazo) solid var(--cv-tinta);
  padding:var(--cv-e7) 0 var(--cv-e6) }
.cv-portada .cv-etiqueta{ display:block; margin-bottom:var(--cv-e3) }
.cv-portada h1{ margin:0 0 var(--cv-e4); max-width:22ch }
.cv-portada p{ font-size:var(--cv-t-lg); color:var(--cv-tinta-2); margin:0;
  max-width:var(--cv-ancho-texto) }

/* Índice de la página, para no obligar a leerla entera */
.cv-indice{ border:var(--cv-trazo) solid var(--cv-tinta); background:var(--cv-papel);
  box-shadow:var(--cv-sombra-corta); padding:var(--cv-e5); margin:var(--cv-e7) 0 0 }
.cv-indice ol{ margin:0; padding-left:1.3em; font-size:var(--cv-t-sm); columns:2; column-gap:var(--cv-e6) }
.cv-indice li{ margin-bottom:var(--cv-e2); break-inside:avoid }
.cv-indice a{ color:var(--cv-accion) }

/* Tabla de datos. Se lee en móvil desplazándola, no encogiéndola:
   una tabla de plazos con la letra reducida deja de cumplir su función. */
.cv-tabla-caja{ overflow-x:auto; margin:var(--cv-e5) 0;
  border:var(--cv-trazo) solid var(--cv-tinta); box-shadow:var(--cv-sombra-corta) }
.cv-tabla{ border-collapse:collapse; width:100%; min-width:460px; background:var(--cv-papel);
  font-size:var(--cv-t-sm) }
/* Segunda línea de una celda: el detalle que no merece columna propia.
   Una cuarta columna en 66ch deja las cinco filas ilegibles.            */
.cv-tabla .cv-que{ display:block; margin-top:var(--cv-e2); color:var(--cv-tinta-2) }
.cv-tabla th, .cv-tabla td{ text-align:left; vertical-align:top;
  padding:var(--cv-e3) var(--cv-e4); border-bottom:1px solid var(--cv-tinta-3) }
.cv-tabla th{ font-family:var(--cv-display); font-weight:700; font-size:var(--cv-t-xs);
  text-transform:uppercase; letter-spacing:var(--cv-track-etiqueta);
  border-bottom:var(--cv-trazo) solid var(--cv-tinta) }
.cv-tabla tr:last-child td{ border-bottom:0 }
/* Los plazos en monoespaciada, para que se comparen en columna. Sin
   `nowrap`: aquí hay plazos que son una frase, no un número, y forzarlos
   a una línea saca la tabla del ancho de lectura.                       */
.cv-tabla .cv-plazo{ font-family:var(--cv-dato); font-size:var(--cv-t-xs); line-height:1.5 }

/* Lista de derechos y similares: etiqueta en negrita + explicación */
.cv-defs{ list-style:none; margin:var(--cv-e5) 0; padding:0 }
.cv-defs li{ margin-bottom:var(--cv-e4); padding-left:var(--cv-e5);
  border-left:var(--cv-trazo) solid var(--cv-tinta) }
.cv-defs b{ font-family:var(--cv-display); display:block; margin-bottom:2px }

/* Ficha de datos identificativos (art. 10 LSSI) */
.cv-ficha{ border:var(--cv-trazo) solid var(--cv-tinta); background:var(--cv-papel);
  box-shadow:var(--cv-sombra-corta); padding:var(--cv-e5); margin:var(--cv-e5) 0;
  font-size:var(--cv-t-sm) }
.cv-ficha dl{ display:grid; grid-template-columns:auto 1fr; gap:var(--cv-e2) var(--cv-e5); margin:0 }
.cv-ficha dt{ font-family:var(--cv-dato); font-size:var(--cv-t-xs); text-transform:uppercase;
  letter-spacing:var(--cv-track-etiqueta); color:var(--cv-tinta-3); padding-top:.25em }
.cv-ficha dd{ margin:0 }

/* Hueco pendiente de un dato real. Visible a propósito: un marcador
   discreto acaba publicado.                                           */
/* Sin `nowrap`: a 360 px un marcador de dos palabras saca la página
   entera de su ancho, y el desbordamiento se achaca al contenedor.      */
.cv-falta{ font-family:var(--cv-dato); font-size:var(--cv-t-xs); background:var(--cv-aviso-suave);
  color:var(--cv-aviso); border:1px dashed var(--cv-aviso); padding:1px 6px }

@media (max-width:820px){
  .cv-indice ol{ columns:1 }
  .cv-ficha dl{ grid-template-columns:1fr; gap:var(--cv-e1) }
  .cv-ficha dd{ margin-bottom:var(--cv-e3) }
}