/* ===========================================================================
   IMPRESION

   Se carga con media="print", asi que no estorba al pintar la pantalla.

   Manda el CV: es la unica pagina que alguien va a querer imprimir o guardar
   como PDF de verdad. Sin esto saldria el espacio de trabajo entero —la barra,
   el rail de iconos, el boton de descarga— alrededor de la hoja, y encima
   cortado, porque el CV vive dentro de un panel con desplazamiento propio.

   Lo demas lleva unas reglas minimas para que, si alguien imprime una ficha de
   proyecto, salga el texto y no la interfaz.
   =========================================================================== */

@page {
    margin: 14mm 15mm;
}

/* En papel siempre se imprime en claro. Si quien imprime tiene el sistema en
   oscuro, sus variables siguen puestas: el navegador pondria el fondo blanco
   por su cuenta y el texto, que es casi blanco, desapareceria. Asi que aqui se
   vuelven a fijar las de modo claro. */
:root {
    --tinta: #17171a;
    --acento: #cc3519;
    --superficie: #ffffff;
    --superficie-suave: #ffffff;
    --superficie-imagen: #f2f2f0;
    --mesa: #ffffff;
    --texto-fuerte: #2b2b31;
    --texto: #3f3f47;
    --texto-medio: #4a4a52;
    --texto-suave: #4a4a52;
    --texto-tenue: #77777f;
    --borde-suave: rgba(23, 23, 26, 0.14);
    --borde: rgba(23, 23, 26, 0.18);
    --borde-fuerte: rgba(23, 23, 26, 0.28);
    --borde-marcado: rgba(23, 23, 26, 0.4);
    --fondo-campo: transparent;
    --sombra-hoja: none;
    --sombra-lamina: 0 0 0 1px rgba(23, 23, 26, 0.18);
    --sombra-lamina-alta: 0 0 0 1px rgba(23, 23, 26, 0.18);
    --linea-interior: inset 0 0 0 1px rgba(23, 23, 26, 0.18);
}

html,
body {
    height: auto;
    background: #ffffff;
    color: var(--tinta);
}

/* --- Fuera el espacio de trabajo ------------------------------------------ */

.barra,
.rail,
.salto-al-contenido,
.colecciones,
.filtros,
.lista,
.volver-a-lista,
.llamada,
.cv-barra,
.cv-descarga,
.paleta,
.visor,
.bienvenida-pie,
.figura-marco::after {
    display: none !important;
}

/* Los contenedores que en pantalla tienen su propio desplazamiento: en papel
   no hay ventana, hay paginas, asi que tienen que poder crecer. */
.marco,
.cuerpo,
.vista,
.proyectos,
.caso,
.cv,
.cv-lienzo,
.bienvenida-cuerpo {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}

/* Nada de entradas ni desvanecidos: en papel solo existe el estado final. */
*,
*::before,
*::after {
    animation: none !important;
    transition: none !important;
}

/* --- La hoja del CV pasa a ser la pagina ---------------------------------- */

.cv-hoja {
    width: auto;
    max-width: none;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
    background: none;
    gap: 22px;
}

.cv-cabecera {
    padding-bottom: 14px;
}

/* En A4 la columna de la derecha se queda muy justa si mantiene los 300px de
   pantalla, y la de la izquierda pierde medida de lectura. */
.cv-cuerpo {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 26px;
}

.cv-columna {
    gap: 20px;
}

.cv-seccion {
    gap: 9px;
}

/* Un puesto o un estudio partido entre dos paginas se lee fatal. */
.cv-puesto,
.cv-estudio,
.cv-tecnica-fila,
.cv-seccion {
    break-inside: avoid;
}

/* Los cuerpos de pantalla son grandes para leer a un metro; en papel se lee a
   treinta centimetros y ademas hay que caber. */
.cv-titulo {
    font-size: 27pt;
}

.cv-oficio {
    font-size: 11pt;
}

.cv-seccion p,
.cv-puesto p {
    font-size: 9.5pt;
    line-height: 1.45;
}

.cv-puesto-nombre {
    font-size: 11pt;
}

.cv-contacto,
.cv-estudios,
.cv-habilidades,
.cv-tecnica-fila {
    font-size: 9pt;
}

.cv-fechas,
.cv-apunte,
.cv-puesto-rol {
    font-size: 8.5pt;
}

.cv-hoja .rotulo {
    font-size: 8pt;
}

/* --- Si se imprime una ficha de proyecto ---------------------------------- */

.caso-interior {
    padding: 0 !important;
    gap: 20px !important;
}

.ficha {
    grid-template-columns: 1fr;
    min-height: 0;
}

.caso-bloque {
    grid-template-columns: 1fr;
    gap: 8px;
    break-inside: avoid;
}

.figura,
.resumen-celda {
    break-inside: avoid;
}

.figuras {
    grid-template-columns: 1fr 1fr;
}

/* La direccion completa detras de cada enlace de fuera: en papel un enlace sin
   su direccion no lleva a ninguna parte. */
.caso a[href^="http"]::after,
.cv a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 8pt;
    color: var(--texto-suave);
    word-break: break-all;
}