/* Política de privacidad.
   Un documento legal que la gente tiene que poder leer de verdad: medida de
   línea corta, jerarquía clara y las tablas con scroll propio para que en el
   móvil no desborden la página. */

.pv-hero {
    padding-bottom: 8px;
}

/* La cabecera comparte la medida del cuerpo: si el título arranca en un borde
   y el texto en otro, la página se lee como dos documentos pegados. */
.pv-hero .px-wrap {
    max-width: 780px;
}

.pv-meta {
    margin-top: 18px;
    color: var(--text-secondary);
    font-size: 0.875rem;
}

.pv-cuerpo {
    padding-top: 24px;
}

/* Medida de lectura: un párrafo legal a todo el ancho no se lee, se escanea. */
.pv-wrap {
    max-width: 780px;
}

.pv-indice {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--bg-card);
    padding: 20px 24px;
    margin-bottom: 40px;
}

/* Sigue siendo <ol> por semántica, pero sin su numeración: el número ya va en
   el texto del enlace, y con las dos salía "1. 1. Quién trata tus datos". */
.pv-indice ol {
    margin: 0;
    padding-left: 0;
    list-style: none;
    columns: 2;
    column-gap: 32px;
}

.pv-indice li {
    margin: 4px 0;
    break-inside: avoid;
}

.pv-indice a {
    color: var(--text-secondary);
    font-size: 0.9375rem;
    text-decoration: none;
}

.pv-indice a:hover {
    color: var(--accent-primary);
    text-decoration: underline;
}

.pv-bloque {
    margin-bottom: 44px;
    scroll-margin-top: 90px;   /* la barra fija no tapa el título al saltar */
}

.pv-bloque h2 {
    margin-bottom: 14px;
}

.pv-bloque p {
    color: var(--text-secondary);
    line-height: 1.75;
    margin-bottom: 14px;
}

.pv-bloque a {
    color: var(--accent-primary);
}

.pv-lista {
    margin: 0 0 14px;
    padding-left: 22px;
    color: var(--text-secondary);
    line-height: 1.75;
}

.pv-lista li {
    margin-bottom: 10px;
}

.pv-lista strong {
    color: var(--text-primary);
}

/* El bloque de IA es el que más gente va a leer: se distingue sin gritar. */
.pv-destacado {
    border-left: 3px solid var(--accent-primary);
    padding: 4px 0 4px 24px;
}

.pv-nota {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 16px 18px;
    font-size: 0.9375rem;
}

/* Las tablas se desbordan en móvil si no scrollean por su cuenta. */
.pv-tabla-scroll {
    overflow-x: auto;
    margin: 18px 0;
    border: 1px solid var(--border);
    border-radius: var(--radius);
}

.pv-tabla {
    width: 100%;
    min-width: 520px;
    border-collapse: collapse;
    font-size: 0.9375rem;
}

.pv-tabla th,
.pv-tabla td {
    text-align: left;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border);
    color: var(--text-secondary);
    line-height: 1.6;
    vertical-align: top;
}

.pv-tabla th {
    color: var(--text-primary);
    font-weight: 600;
    background: var(--bg-card);
    white-space: nowrap;
}

.pv-tabla tr:last-child td {
    border-bottom: none;
}

/* Plazos de respuesta: son lo que más se consulta de toda la página. */
.pv-plazos {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 20px 0 10px;
}

.pv-plazos > div {
    flex: 1 1 200px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--bg-card);
    padding: 16px 18px;
    color: var(--text-secondary);
    font-size: 0.9375rem;
    line-height: 1.5;
}

.pv-plazo {
    display: block;
    color: var(--accent-primary);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 2px;
}

.pv-cierre {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
}

@media (max-width: 640px) {
    .pv-indice ol {
        columns: 1;
    }

    .pv-destacado {
        padding-left: 16px;
    }
}
