/* ═══════════════════════════════════════════════════════════
   CV PERFIL — variante de duas colunas.

   Carrega DEPOIS de cv.css e reaproveita dele tudo que não é
   layout: a barra de ações, o menu de download, a folha `.page`,
   o marcador lime de `.cv-list` e o bloco de impressão. Aqui vive
   só o que muda: a grade, o cabeçalho com monograma e os chips
   de habilidade.

   Duas advertências que valem para todo este arquivo:

   1. NENHUM `position`, `float` ou `transform` em conteúdo de
      texto. Elemento posicionado é pintado numa camada posterior
      e o Chrome grava o PDF na ordem de PINTURA — o texto sai
      fora de ordem na extração. Grade e flex não criam camada.
      (Ver TROUBLESHOOTING.md, "position: relative no <li>".)

   2. Esta versão é de DUAS COLUNAS, e por isso não é o documento
      de triagem automática: o parser lê a lateral fora de ordem.
      O documento de ATS continua sendo o /cv, de uma coluna, e é
      para o DOCX dele que o menu de download aponta.
   ═══════════════════════════════════════════════════════════ */

/* Folha um pouco mais apertada que a do /cv: a grade de duas colunas
   precisa da largura, e o layout de origem tem margem menor. */
.cvp { padding: 14mm 13mm; }

/* ── Cabeçalho ─────────────────────────────────────────── */

.cvp-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-5);
  margin-bottom: var(--space-5);
}

.cvp-head-id { min-width: 0; }

/* Caixa alta por CSS, e não digitada: o texto no HTML continua
   "Lucas Brás", que é o que fica no <title>, no OG e em qualquer
   cópia manual da página. */
.cvp-name {
  margin: 0;
  font-size: 24pt;
  font-weight: 600;
  line-height: 1.04;
  letter-spacing: var(--track-1);
  text-transform: uppercase;
}

.cvp-role {
  margin: 5px 0 0;
  font-size: 11.4pt;
  font-weight: 500;
  letter-spacing: var(--track-3);
  color: var(--c-accent-ink);
}

.cvp-role .sep { color: var(--c-ink-3); font-weight: 400; }

.cvp-contact {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin: var(--space-3) 0 0;
  padding: 0;
  font-size: 8.8pt;
  color: var(--c-ink-2);
}

.cvp-contact li {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.cvp-ic {
  width: 11px;
  height: 11px;
  flex: none;
  color: var(--c-accent-ink);
}

/* Monograma. Lime de preenchimento com tinta por cima — o token de
   acento não serve como cor de texto, só como fundo. */
.cvp-marca {
  display: grid;
  place-items: center;
  flex: none;
  width: 62px;
  height: 62px;
  margin: 0;
  border-radius: 50%;
  background: var(--c-accent);
  color: var(--c-ink);
  font-size: 15pt;
  font-weight: 600;
  letter-spacing: var(--track-3);
}

/* ── Grade ─────────────────────────────────────────────── */

/* minmax(0, …) nos dois tracks: sem isso o track de grid tem tamanho
   mínimo automático e uma palavra longa (um e-mail, uma URL) empurra
   a coluna para fora em vez de quebrar. */
.cvp-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.46fr) minmax(0, 1fr);
  gap: var(--space-5);
  align-items: start;
}

.cvp-main, .cvp-aside { min-width: 0; }

/* ── Seção ─────────────────────────────────────────────── */

.cvp-sec { margin-bottom: var(--space-5); }
.cvp-sec:last-child { margin-bottom: 0; }

.cvp-sec-title {
  margin: 0 0 var(--space-3);
  padding-bottom: 6px;
  border-bottom: 1px solid var(--c-ink);
  font-family: var(--type-mono);
  font-size: 9pt;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: var(--track-label);
  color: var(--c-ink);
}

/* ── Cargo ─────────────────────────────────────────────── */

.cvp-job {
  break-inside: avoid;
  page-break-inside: avoid;
  margin-bottom: var(--space-4);
}

.cvp-job:last-child { margin-bottom: 0; }

/* Pontilhado entre cargos, como no layout de origem. Só ENTRE eles:
   sem regra acima do primeiro nem abaixo do último. */
.cvp-job + .cvp-job {
  padding-top: var(--space-4);
  border-top: 1px dotted var(--c-rule-strong);
}

.cvp-job-title {
  margin: 0;
  font-size: 11pt;
  font-weight: 600;
  letter-spacing: var(--track-3);
}

.cvp-job-org {
  margin: 2px 0 0;
  font-size: 9.6pt;
  font-weight: 500;
  color: var(--c-accent-ink);
}

.cvp-job-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 12px;
  margin: 5px 0 7px;
  font-family: var(--type-mono);
  font-size: 7.4pt;
  font-weight: 500;
  letter-spacing: var(--track-label);
  color: var(--c-ink-3);
}

.cvp-job-meta span { display: inline-flex; align-items: center; gap: 5px; }
.cvp-job-meta .cvp-ic { width: 10px; height: 10px; color: var(--c-ink-3); }

.cvp-job-lead {
  margin: 0 0 6px;
  font-size: 9.4pt;
  color: var(--c-ink-2);
}

.cvp-job-lead:last-child { margin-bottom: 0; }

/* Reaproveita o marcador lime e o recuo pendurado de .cv-list;
   aqui só a densidade muda, porque a coluna é mais estreita. */
.cvp-list { font-size: 9.4pt; }
.cvp-list li { margin-bottom: 5px; }

/* ── Lateral ───────────────────────────────────────────── */

.cvp-resumo {
  margin: 0;
  font-size: 9.4pt;
  line-height: 1.55;
  color: var(--c-ink);
}

.cvp-edu-name {
  margin: 0;
  font-size: 10pt;
  font-weight: 600;
  letter-spacing: var(--track-body);
}

.cvp-edu-org {
  margin: 2px 0 0;
  font-size: 9.2pt;
  font-weight: 500;
  color: var(--c-accent-ink);
}

.cvp-skill { margin-bottom: var(--space-4); }
.cvp-skill:last-child { margin-bottom: 0; }

.cvp-skill-label {
  margin: 0 0 var(--space-2);
  font-family: var(--type-mono);
  font-size: 7.4pt;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: var(--track-label);
  color: var(--c-accent-ink);
}

.cvp-chips {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1) var(--space-2);
  margin: 0;
  padding: 0;
}

.cvp-chips li {
  padding: 2px 5px 3px;
  border-bottom: 1px solid var(--c-rule-strong);
  font-size: 9pt;
  font-weight: 500;
  color: var(--c-ink);
}

/* ── Impressão ─────────────────────────────────────────── */

@media print {
  /* O corte é explícito: uma folha por <article class="page cvp">.
     Grade de duas colunas não flui entre páginas de forma previsível,
     e esta variante existe para reproduzir um layout dado. */
  .cvp + .cvp { break-before: page; page-break-before: always; }

  /* cv.css zera o padding de .page na impressão e passa a margem para
     o @page. Aqui o mesmo vale — a régua da folha é o @page. */
  .cvp { padding: 0; }

  .cvp-name       { font-size: 21pt; }
  .cvp-role       { font-size: 10.6pt; }
  .cvp-marca      { width: 54px; height: 54px; font-size: 13pt; }
  .cvp-head       { margin-bottom: 16px; }
  .cvp-grid       { gap: 22px; }
  .cvp-sec        { margin-bottom: 16px; }
  .cvp-sec-title  { margin-bottom: 10px; padding-bottom: 4px; font-size: 8.4pt; }
  .cvp-sec-title  { break-after: avoid; page-break-after: avoid; }
  .cvp-job        { margin-bottom: 12px; }
  .cvp-job + .cvp-job { padding-top: 12px; }
  .cvp-job-title  { font-size: 10.2pt; }
  .cvp-job-org    { font-size: 9pt; }
  .cvp-job-lead,
  .cvp-resumo,
  .cvp-list       { font-size: 8.8pt; }
  .cvp-list li    { margin-bottom: 3px; }
  .cvp-chips li   { font-size: 8.4pt; }
}

/* ── Tela estreita ─────────────────────────────────────── */

@media screen and (max-width: 720px) {
  .cvp { padding: var(--space-5) var(--space-4); }

  /* Uma coluna: a lateral desce inteira para depois da experiência,
     que é a mesma ordem em que o texto é lido no PDF. */
  .cvp-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }

  .cvp-head { gap: var(--space-4); }
  .cvp-name { font-size: 20pt; }
  .cvp-marca { width: 48px; height: 48px; font-size: 12pt; }
}