/* ------------------------------------------------------------------
   Modelos de currículo.
   Todos usam medidas em milímetros e fontes instaladas por padrão —
   é o que garante impressão fiel e leitura correta por sistemas ATS.
------------------------------------------------------------------ */

.cv {
  --cv-accent: #315EE8;
  --cv-accent-soft: #EEF2FE;
  --cv-ink: #1F2937;
  --cv-muted: #5B6472;
  --cv-line: #E5E7EB;
  --cv-pad: 15mm;

  width: 210mm;
  min-height: 297mm;
  margin: 0 auto;
  padding: var(--cv-pad);
  background: #fff;
  color: var(--cv-ink);
  font-family: var(--font-cv-sans);
  font-size: 10.5pt;
  line-height: 1.45;
  box-shadow: 0 4px 24px rgba(16, 24, 40, 0.12);
  box-sizing: border-box;
  overflow-wrap: break-word;
}

.cv * { box-sizing: border-box; }
.cv p { margin: 0 0 2mm; }
.cv ul { margin: 0; padding-left: 4.5mm; }
.cv li { margin-bottom: 1mm; }
.cv a { color: inherit; text-decoration: none; }

.cv-name { font-size: 20pt; font-weight: 700; letter-spacing: -0.01em; margin: 0; }
.cv-headline { font-size: 11pt; color: var(--cv-accent); font-weight: 600; margin: 1mm 0 0; }
.cv-contact { font-size: 9pt; color: var(--cv-muted); }
.cv-contact-item { display: inline-flex; align-items: center; gap: 1.5mm; }
.cv-contact-inline .cv-contact-item + .cv-contact-item::before {
  content: '•'; margin-right: 1.5mm; color: var(--cv-line);
}

.cv-section { margin-top: 6mm; page-break-inside: auto; }
.cv-section-title {
  font-size: 9.5pt; font-weight: 700; text-transform: uppercase; letter-spacing: 0.09em;
  color: var(--cv-accent); margin: 0 0 2.5mm;
}
.cv-entry { margin-bottom: 4mm; page-break-inside: avoid; }
.cv-entry:last-child { margin-bottom: 0; }
.cv-entry-head { display: flex; justify-content: space-between; gap: 4mm; align-items: baseline; }
.cv-entry-title { font-weight: 700; font-size: 10.5pt; }
.cv-entry-org { color: var(--cv-muted); font-size: 10pt; }
.cv-entry-date { font-size: 9pt; color: var(--cv-muted); white-space: nowrap; }
.cv-entry-body { margin-top: 1mm; }
.cv-empty { color: #9CA3AF; font-style: italic; }

.cv-tags { display: flex; flex-wrap: wrap; gap: 1.5mm; }
.cv-tag { font-size: 9pt; padding: 0.8mm 2.5mm; border-radius: 3mm; background: var(--cv-accent-soft); color: var(--cv-accent); }
.cv-lang { display: flex; justify-content: space-between; gap: 3mm; font-size: 9.5pt; padding: 0.8mm 0; }
.cv-lang span:last-child { color: var(--cv-muted); }

.cv-photo {
  width: 28mm; height: 28mm; border-radius: 50%; object-fit: cover; flex: none;
  border: 0.6mm solid #fff;
}

.cv-icon { width: 3.4mm; height: 3.4mm; flex: none; vertical-align: -0.4mm; }

/* ============ 1. Minimalista — branco e azul ============ */
.cv--minimalista { --cv-pad: 16mm; }
.cv--minimalista .cv-head { border-bottom: 0.8mm solid var(--cv-accent); padding-bottom: 4mm; }
.cv--minimalista .cv-head-row { display: flex; gap: 5mm; align-items: center; }
.cv--minimalista .cv-photo { border-color: var(--cv-accent-soft); }
.cv--minimalista .cv-contact { margin-top: 2.5mm; }
.cv--minimalista .cv-section-title {
  border-bottom: 0.3mm solid var(--cv-line); padding-bottom: 1.5mm;
}

/* ============ 2. Corporativo — barra lateral com ícones ============ */
.cv--corporativo {
  --cv-side: 66mm;
  padding: 0;
  display: flex;
  /* O gradiente pinta a coluna lateral e se mantém em páginas seguintes. */
  background: linear-gradient(to right, #F3F6FE 0 var(--cv-side), #fff var(--cv-side) 100%);
}
.cv--corporativo .cv-aside {
  width: var(--cv-side); flex: none; padding: 12mm 7mm; color: var(--cv-ink);
}
.cv--corporativo .cv-main { flex: 1; padding: 12mm 12mm 12mm 8mm; min-width: 0; }
.cv--corporativo .cv-photo { width: 34mm; height: 34mm; margin: 0 auto 4mm; border-color: #fff; }
.cv--corporativo .cv-aside .cv-name { font-size: 15pt; text-align: center; }
.cv--corporativo .cv-aside .cv-headline { text-align: center; font-size: 9.5pt; }
.cv--corporativo .cv-aside .cv-section-title { font-size: 8.5pt; margin-top: 6mm; }
.cv--corporativo .cv-contact { display: grid; gap: 1.8mm; font-size: 8.5pt; word-break: break-word; }
.cv--corporativo .cv-contact-item { align-items: flex-start; }
.cv--corporativo .cv-icon { color: var(--cv-accent); margin-top: 0.6mm; }
.cv--corporativo .cv-main .cv-section:first-child { margin-top: 0; }
.cv--corporativo .cv-tag { background: #fff; border: 0.2mm solid var(--cv-line); }

/* ============ 3. Elegante — cabeçalho colorido ============ */
.cv--elegante { padding: 0; font-family: var(--font-cv-serif); }
.cv--elegante .cv-head {
  background: var(--cv-accent); color: #fff; padding: 14mm 15mm 11mm;
  display: flex; gap: 6mm; align-items: center;
}
.cv--elegante .cv-name { font-size: 23pt; letter-spacing: 0.01em; }
.cv--elegante .cv-headline { color: rgba(255, 255, 255, 0.88); font-weight: 400; font-size: 11.5pt; font-style: italic; }
.cv--elegante .cv-contact { color: rgba(255, 255, 255, 0.92); margin-top: 3mm; }
.cv--elegante .cv-contact-inline .cv-contact-item + .cv-contact-item::before { color: rgba(255, 255, 255, 0.5); }
.cv--elegante .cv-body { padding: 10mm 15mm 15mm; }
.cv--elegante .cv-section-title {
  font-family: var(--font-cv-sans); color: var(--cv-ink);
  display: flex; align-items: center; gap: 3mm;
}
.cv--elegante .cv-section-title::after { content: ''; flex: 1; height: 0.3mm; background: var(--cv-accent); opacity: 0.35; }
.cv--elegante .cv-entry-date { font-family: var(--font-cv-sans); }
.cv--elegante .cv-tag { border-radius: 1mm; }

/* ============ 4. Moderno — duas colunas ============ */
.cv--moderno { --cv-pad: 14mm; }
.cv--moderno .cv-head { display: flex; gap: 5mm; align-items: center; padding-bottom: 5mm; }
.cv--moderno .cv-head-bar { width: 1.6mm; align-self: stretch; background: var(--cv-accent); border-radius: 1mm; }
.cv--moderno .cv-name { font-size: 22pt; }
.cv--moderno .cv-headline { color: var(--cv-muted); font-weight: 500; }
.cv--moderno .cv-columns {
  display: grid; grid-template-columns: 1.75fr 1fr; gap: 9mm;
  border-top: 0.3mm solid var(--cv-line); padding-top: 5mm;
}
.cv--moderno .cv-col-side .cv-section:first-child { margin-top: 0; }
.cv--moderno .cv-col-main .cv-section:first-child { margin-top: 0; }
.cv--moderno .cv-section-title { color: var(--cv-ink); position: relative; padding-left: 4mm; }
.cv--moderno .cv-section-title::before {
  content: ''; position: absolute; left: 0; top: 1mm; width: 2mm; height: 2mm;
  background: var(--cv-accent); border-radius: 0.5mm;
}
.cv--moderno .cv-entry-head { flex-direction: column; gap: 0; }
.cv--moderno .cv-entry-date { font-size: 8.5pt; letter-spacing: 0.03em; text-transform: uppercase; }
.cv--moderno .cv-contact { display: grid; gap: 1.5mm; font-size: 9pt; }

/* ============ Impressão ============ */
/* Na tela o currículo é uma folha A4 com margem interna, para a pré-visualização
   parecer papel. Na impressão a margem passa a ser do @page: `padding` só vale
   uma vez no elemento inteiro, então da segunda página em diante o texto colava
   na borda do papel. Com @page, toda página recebe a mesma margem. */
@page { size: A4; margin: 15mm; }

@media print {
  html, body { background: #fff; margin: 0; padding: 0; }
  .cv {
    width: auto; min-height: 0; height: auto;
    margin: 0; padding: 0; box-shadow: none;
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
  /* A barra lateral já tem respiro próprio; somar a margem do @page a afastaria
     demais do texto. */
  .cv.is-corporativo .cv-side { padding: 0 6mm 0 0; }
  .cv.is-corporativo .cv-main { padding: 0 0 0 8mm; }

  .cv-entry, .cv-lang, .cv-tag { page-break-inside: avoid; break-inside: avoid; }
  .cv-section-title { page-break-after: avoid; break-after: avoid; }
  .cv-section { break-inside: auto; }
  .no-print { display: none !important; }
}

/* ==================================================================
   Clássico — rótulo à esquerda, conteúdo à direita, datas em coluna.
   ================================================================== */

.cv--classico { padding: 0; }

.cv--classico .cv-cl-head { margin-bottom: 22px; }
/* Contatos acima da faixa, como no modelo de referência. */
.cv--classico .cv-cl-contacts {
  display: flex; flex-wrap: wrap; gap: 6px 26px;
  padding: 16px 32px 14px;
  background: color-mix(in srgb, var(--cv-accent) 8%, #fff);
  font-size: 10.5pt;
}
/* Faixa colorida com o nome. A foto AVANÇA sobre ela (margin negativa) —
   é o que dá o encaixe do modelo, com o retrato cruzando a barra. */
.cv--classico .cv-cl-banner {
  display: flex; align-items: center; gap: 20px;
  background: var(--cv-accent); color: #fff;
  padding: 14px 32px; min-height: 62px;
}
.cv--classico .cv-photo {
  width: 104px; height: 104px; flex: none;
  margin: -34px 0; border: 4px solid #fff; border-radius: 50%;
}
.cv--classico .cv-cl-name {
  margin: 0; font-size: 24pt; font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase; color: #fff;
}
.cv--classico .cv-cl-headline {
  margin: 10px 32px 0; font-size: 11pt; color: var(--cv-muted);
}

/* Linha de seção: rótulo fixo à esquerda. */
.cv--classico .cv-cl-row {
  display: grid; grid-template-columns: 124px 1fr; gap: 18px;
  padding: 16px 32px; border-top: 2px solid color-mix(in srgb, var(--cv-accent) 20%, #fff);
}
.cv--classico .cv-cl-row:first-of-type { border-top: 0; }
.cv--classico .cv-cl-label {
  font-size: 11pt; font-weight: 700; line-height: 1.25;
  text-transform: uppercase; color: var(--cv-accent);
}
.cv--classico .cv-cl-content p { margin: 0; }

/* Entrada com a data em coluna própria. */
.cv--classico .cv-cl-entry {
  /* 118px cabe "01/2021 - Atual" em uma linha só. Com menos, a data quebrava em
     duas e o bloco da esquerda ficava mais alto que o cargo à direita. */
  display: grid; grid-template-columns: 118px 1fr; gap: 14px;
  margin-bottom: 14px;
}
.cv--classico .cv-cl-entry:last-child { margin-bottom: 0; }
.cv--classico .cv-cl-when {
  font-size: 9.5pt; color: var(--cv-muted); padding-top: 1px;
  white-space: nowrap;
}
.cv--classico .cv-cl-entry-head {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px;
}
/* Selo de duração ("5 anos e 7 meses"). */
.cv--classico .cv-cl-badge {
  flex: none; font-size: 8pt; font-weight: 600;
  padding: 2px 8px; border-radius: 10px;
  background: color-mix(in srgb, var(--cv-accent) 14%, #fff);
  color: var(--cv-accent);
}

/* Atividades em tópicos. */
.cv .cv-bullets { margin: 6px 0 0; padding-left: 16px; }
.cv .cv-bullets li { margin-bottom: 3px; line-height: 1.45; }
/* Habilidades em duas colunas: a lista costuma ser longa e em coluna única
   empurraria o currículo para uma segunda página sem necessidade. */
.cv--classico .cv-cl-skills { columns: 2; column-gap: 28px; }
.cv--classico .cv-cl-skills li { break-inside: avoid; }

@media print {
  .cv--classico .cv-cl-entry { break-inside: avoid; }
}