/* ══════════════════════════════════════════════════════════════════════════
   PRIMERO UNT · trayectorias

   Los dos CV llegaron con su propio sistema visual (papel crudo, tinta gris
   azulada, acento rojo, Archivo + Source Serif). Acá se les cambia la piel al
   sistema de la campaña sin tocar su estructura: siguen siendo el mismo
   documento —cabecera, ficha, cotas, bandas numeradas, línea de tiempo y
   cierre—, con la paleta y la tipografía del sitio.

   Este archivo va DESPUÉS del <style> propio de cada CV: sólo corrige lo que
   choca con el manual. Las variables ya vienen sustituidas en el HTML.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Tipografía ────────────────────────────────────────────────────────────
   El manual pide una sola familia y reserva las mayúsculas para el logotipo y
   las etiquetas. Los títulos venían en 800 y en altas: pasan a 600 y a altas
   y bajas, que además hace más legible un nombre propio. */

h1, .band-head h2, .close blockquote {
  font-weight: 600;
  text-transform: none;
  letter-spacing: -.035em;
}
h1 { line-height: .95; }
h1 .thin { font-weight: 400; letter-spacing: .02em; }

.dim strong, .estudios h3, .origen h3, .cargos b,
.lvl-body h3, .ev h3, .area li { font-weight: 500; }

/* ── Fondo ─────────────────────────────────────────────────────────────────
   La grilla de plano técnico se conserva —es la idea del documento— pero
   dibujada con el gris del sistema y más tenue. */

body {
  background-image:
    linear-gradient(to right, rgba(11, 36, 80, .05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(11, 36, 80, .05) 1px, transparent 1px);
}

/* ── Marcadores ────────────────────────────────────────────────────────────
   Los rombos del timeline se enderezan: el sistema es de ángulos rectos y sin
   inclinaciones. Siguen marcando el hito, ahora como cuadrado. */

.lvl-body::before, .ev::before { transform: none; }

/* ── Categorías de la línea de tiempo ──────────────────────────────────────
   Formación, gestión y docencia se distinguían por color, uno de ellos rojo.
   Se reemplazan por tres azules del sistema, que se siguen leyendo separados
   entre sí y sobre el papel. */

.f .tag { color: var(--az-hecho); }
.f::before { border-color: var(--az-hecho); background: var(--az-hecho); }
.g .tag { color: var(--enlace); }
.g::before { border-color: var(--enlace); background: var(--enlace); }
.d .tag { color: var(--azul-primero); }
.d::before { border-color: var(--azul-primero); background: var(--azul-primero); }

/* ── Barras de gestión ─────────────────────────────────────────────────────
   Mismo criterio que el cronograma del sitio: lo cumplido en azul, lo que
   está en curso en celeste. */

.bar { background: var(--az-hecho); opacity: 1; }
.lvl.now .bar { border-top-color: var(--celeste-avance); }
.lvl.now .lvl-body::before { background: var(--celeste-avance); border-color: var(--celeste-avance); }
.lvl.now .dur { color: var(--enlace); }

/* ── Detalles ──────────────────────────────────────────────────────────────
   El acento de las cotas y la itálica del lead pasan al azul del sistema.
   El manual no usa itálicas, así que el énfasis se resuelve con color. */

.lead em { font-style: normal; color: var(--enlace); }
.close blockquote span { color: var(--enlace); }
.area { border-top-color: var(--az-hecho); }
.area h3 { color: var(--az-hecho); }
.prod { border-left-color: var(--az-hecho); }
.prod b { color: var(--az-hecho); }

/* ── Enganche con el sitio ─────────────────────────────────────────────────
   La cabecera y el pie de la campaña envuelven al documento. El masthead y el
   footer propios del CV se conservan tal cual: son parte de su contenido. */

.cabecera + .masthead { border-top: 0; }
.cv-volver {
  display: inline-flex; align-items: center; gap: .6rem;
  margin-top: clamp(1.5rem, 3vw, 2rem);
  font-family: var(--mono); font-size: .6875rem;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--enlace);
}
.cv-volver:hover { color: var(--azul-primero); }

/* El pie del sitio trae su propio fondo azul: se despega del papel del CV. */
.pie { margin-top: 0; }