/* curriculo.css · #curriculo. Para recrutador: quase sem enfeite, lê de relance, imprime bem.

   - Cabeça presa à esquerda no computador (título, disponibilidade, LinkedIn/GitHub/ORCID e o PDF,
     que o main.js só mostra se o conteudo.js tiver o caminho).
   - Experiência num bloco fosco; Formação, Publicação e Competências juntas num segundo bloco,
     separadas por fios, com a mesma coluna de rótulo (tabela de duas colunas: categoria → lista).
   - Linha do tempo: o fio (::before, escala em --linha-progresso) se desenha com a rolagem e cada
     cargo acende quando o fio chega nele (curriculo.js põe .linha-tempo--viva e .cargo--aceso).
     Sem JS, sem movimento ou na impressão: fio inteiro e todos acesos (é o padrão). */

.curriculo__grade { display: grid; gap: 40px; }

.curriculo__titulo { font-size: var(--t-h2); line-height: 1.02; letter-spacing: -.035em; }
.curriculo__estado {
  display: flex; align-items: center; gap: .65em;
  margin-top: 18px;
  font-size: 1rem;
}
.curriculo__ponto {
  flex: none;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--gelo);
  box-shadow: 0 0 0 4px rgb(255 255 255 / .1);
}
.curriculo__acoes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }

.curriculo__corpo { display: grid; gap: 14px; }

/* ---------- Blocos ---------- */
.cv-bloco,
.cv-grupo {
  --cv-pad-y: 28px;
  --cv-pad-x: 22px;
  border-radius: var(--raio-painel);
  background: var(--fosco);
  box-shadow: inset 0 0 0 1px var(--fio), inset 0 1px 0 rgb(255 255 255 / .05);
}
.cv-bloco { padding: var(--cv-pad-y) var(--cv-pad-x); }
.cv-bloco__titulo { font-size: var(--t-h3); line-height: 1.2; letter-spacing: -.02em; margin-bottom: 22px; }

/* Formação, Publicação e Competências: um bloco só, separadas por fios na largura do texto */
.cv-grupo { padding-block: 6px; }
.cv-grupo .cv-bloco { border-radius: 0; background: none; box-shadow: none; padding-block: 26px; }
.cv-grupo .cv-bloco + .cv-bloco {
  background: linear-gradient(var(--fio), var(--fio)) 50% 0 / calc(100% - 2 * var(--cv-pad-x)) 1px no-repeat;
}

/* ---------- Linha do tempo ---------- */
.linha-tempo {
  --linha-progresso: 1;
  position: relative;
  display: grid; gap: 34px;
  margin: 0; padding: 0 0 0 30px;
  list-style: none;
}
.linha-tempo::after,                 /* trilho: o caminho todo, bem fraco */
.linha-tempo::before {               /* o fio que se desenha */
  content: "";
  position: absolute; left: 4px; top: 10px; bottom: 10px;
  width: 1px;
}
.linha-tempo::after { background: rgb(255 255 255 / .08); }
.linha-tempo::before {
  z-index: 1;
  background: linear-gradient(rgb(255 255 255 / .55), rgb(255 255 255 / .22));
  transform-origin: top;
  transform: scaleY(var(--linha-progresso));
}
.cargo { position: relative; }
.cargo::before {                    /* o ponto do cargo (aceso por padrão) */
  content: "";
  position: absolute; z-index: 2; left: -30px; top: 6px;
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--gelo);
  box-shadow: 0 0 0 4px rgb(255 255 255 / .08), 0 0 14px rgb(255 255 255 / .45);
  transition: background-color .5s var(--expo), box-shadow .5s var(--expo), transform .6s var(--expo);
}
.cargo > * { transition: opacity .6s var(--expo); }
.cargo__quando {
  display: flex; flex-wrap: wrap; gap: 4px 12px;
  font-size: var(--t-pequeno); color: var(--nevoa);
  font-variant-numeric: tabular-nums;
}
.cargo__quando span + span { padding-left: 12px; box-shadow: inset 1px 0 0 var(--fio-forte); }
.cargo__titulo { margin-top: 8px; font-size: 1.25rem; line-height: 1.25; letter-spacing: -.02em; }
.cargo__onde { margin-top: 2px; }
.cargo__via { color: var(--nevoa); }
.cargo__texto { margin-top: 12px; color: var(--nevoa); font-size: 1rem; max-width: var(--medida); }

/* com movimento: o cargo ainda não alcançado fica apagado (texto continua legível) */
.linha-tempo--viva .cargo:not(.cargo--aceso)::before {
  background: var(--fosco);
  box-shadow: inset 0 0 0 1.5px rgb(255 255 255 / .4);
  transform: scale(.85);
}
.linha-tempo--viva .cargo:not(.cargo--aceso) > * { opacity: .72; }

/* ---------- Tabelas de duas colunas (rótulo → conteúdo) ---------- */
.formacao { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; }
.formacao__curso { font-weight: 500; }
.formacao__detalhe { color: var(--nevoa); }

.publicacao__titulo { font-size: 1.0625rem; line-height: 1.4; font-weight: 500; max-width: var(--medida); }
.publicacao__detalhe { margin-top: 8px; color: var(--nevoa); font-size: .9375rem; }
.publicacao .link { display: inline-block; margin-top: 12px; font-size: .9375rem; overflow-wrap: anywhere; }

.competencias { margin: 0; }
.competencias > div {
  display: grid; gap: 2px;
  padding: 13px 0;
  border-top: 1px solid var(--fio);
}
.competencias > div:first-child { border-top: 0; padding-top: 0; }
.competencias > div:last-child { padding-bottom: 0; }
.competencias dt { font-weight: 500; }
.competencias dd { margin: 0; color: var(--nevoa); }

@media (max-width: 400px) {
  .curriculo__acoes { gap: 6px; }
  .curriculo__acoes .botao { padding: 0 13px; }
}
@media (min-width: 768px) {
  .cv-bloco, .cv-grupo { --cv-pad-y: 40px; --cv-pad-x: 40px; }
  .cv-grupo { padding-block: 10px; }
  .cv-grupo .cv-bloco { padding-block: 32px; }
  /* coluna de rótulo comum: Formação e Publicação com o título nela; Competências com as categorias */
  .cv-grupo .cv-bloco:not([aria-labelledby="cv-competencias"]) {
    display: grid; grid-template-columns: 200px minmax(0, 1fr); column-gap: 24px; align-items: baseline;
  }
  .cv-grupo .cv-bloco:not([aria-labelledby="cv-competencias"]) > .cv-bloco__titulo { margin-bottom: 0; }
  .competencias > div { grid-template-columns: 200px minmax(0, 1fr); gap: 24px; align-items: baseline; }
}
@media (min-width: 980px) {
  .curriculo__grade { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--vao); align-items: start; }
  .curriculo__cabeca { grid-column: 1 / 5; position: sticky; top: calc(var(--nav-alto) + 24px); }
  .curriculo__corpo { grid-column: 5 / 13; }
}

/* ---------- Movimento reduzido: fio inteiro, todos acesos ---------- */
@media (prefers-reduced-motion: reduce) {
  .linha-tempo { --linha-progresso: 1 !important; }
  .linha-tempo--viva .cargo:not(.cargo--aceso)::before {
    background: var(--gelo);
    box-shadow: 0 0 0 4px rgb(255 255 255 / .08), 0 0 14px rgb(255 255 255 / .45);
    transform: none;
  }
  .linha-tempo--viva .cargo:not(.cargo--aceso) > * { opacity: 1; }
}

/* ---------- Impressão: papel branco, texto preto, tudo à mostra ---------- */
@media print {
  #curriculo { padding-block: 0; color: #000; }
  .curriculo__grade { display: block; }
  .curriculo__cabeca { position: static; margin-bottom: 18px; }
  .curriculo__titulo { font-size: 26pt; }
  .curriculo__ponto { background: #000; box-shadow: none; }
  .curriculo__acoes .botao { min-height: 0; padding: 0; background: none; box-shadow: none; color: #000; font-size: 10pt; }
  .curriculo__acoes .botao::after { content: " (" attr(href) ")"; font-weight: 400; }
  .curriculo__acoes .icone { display: none; }
  .cv-bloco, .cv-grupo, .cv-grupo .cv-bloco {
    padding: 0 0 12px; margin: 0; border-radius: 0; background: none; box-shadow: none;
  }
  .cv-grupo .cv-bloco + .cv-bloco { padding-top: 12px; background: none; border-top: 1px solid #ccc; }
  .cv-grupo .cv-bloco:not([aria-labelledby="cv-competencias"]) { display: block; }
  .cv-grupo .cv-bloco:not([aria-labelledby="cv-competencias"]) > .cv-bloco__titulo { margin-bottom: 8px; }
  .cv-bloco__titulo { font-size: 14pt; margin-bottom: 8px; }
  .linha-tempo { --linha-progresso: 1 !important; gap: 12px; }
  .linha-tempo::before, .linha-tempo::after { background: #bbb; transform: none; }
  .cargo::before, .linha-tempo--viva .cargo:not(.cargo--aceso)::before { background: #000; box-shadow: none; transform: none; }
  .cargo > *, .linha-tempo--viva .cargo:not(.cargo--aceso) > * { opacity: 1; }
  .cargo { break-inside: avoid; }
  .cargo__quando, .cargo__via, .cargo__texto, .formacao__detalhe, .publicacao__detalhe, .competencias dd { color: #333; }
  .formacao li, .competencias > div { border-color: #ddd; }
  .publicacao .link { color: #000; }
}
