/* ═══════════════════════════════════════════════════════════════════════════
   ESTILO EXCLUSIVO DA PÁGINA CONTACT (o CV)

   Esta página é a única escura do site e tem a sua própria tipografia.
   Está tal e qual o cv-contacto-codeblock.html.

   O resto do site é claro e está no assets/estilo.css — os dois não se
   tocam, por isso podes mexer num sem afetar o outro.
   ═══════════════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@300;400;500&family=DM+Mono:wght@400&display=swap');

.cv {
  /* ---- Cores ---- */
  --cv-fundo: #0a0a0a;
  --cv-tinta: #f1f0ec;
  --cv-cinza: #86857f;
  --cv-linha: rgba(255, 255, 255, 0.14);  /* linhas finas dentro das listas */
  --cv-linha-forte: #f1f0ec;              /* linha branca que separa as seções */

  /* ---- Medidas ---- */
  --cv-coluna: 200px;   /* largura da coluna dos rótulos à esquerda */
  --cv-intervalo: 56px; /* espaço entre a coluna da esquerda e o conteúdo */
  --cv-margem: 56px;    /* margem lateral */

  /* ---- Tipografia ---- */
  --cv-fonte: 'Hanken Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --cv-mono: 'DM Mono', ui-monospace, Menlo, monospace;

  box-sizing: border-box;
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 var(--cv-margem);
  background: var(--cv-fundo);
  color: var(--cv-tinta);
  font-family: var(--cv-fonte);
  font-weight: 300;
  line-height: 1.5;
  text-align: left;
  /* Anula o aperto entre letras do resto do site: o CV usa o espacamento normal */
  letter-spacing: normal;
}

.cv *,
.cv *::before,
.cv *::after { box-sizing: border-box; }

/* Anula estilos de link do tema do Squarespace */
.cv a,
.cv a:hover,
.cv a:visited {
  color: inherit !important;
  text-decoration: none !important;
  background-image: none !important;
  border: 0;
  transition: opacity 0.2s ease;
}
.cv a:hover { opacity: 0.6; }

.cv h1,
.cv h2 {
  margin: 0;
  font-family: var(--cv-fonte) !important;
  font-weight: 300;
  color: inherit;
  text-transform: none;
}

.cv p { margin: 0; }

/* ---------- Nome ---------- */
.cv-topo { padding: 104px 0 112px; }

.cv-nome {
  font-size: clamp(52px, 8.5vw, 116px) !important;
  line-height: 0.94 !important;
  letter-spacing: -0.035em;
}

/* ---------- Seções ---------- */
.cv-seccao { padding-bottom: 128px; }

/* A linha branca a toda a largura é o que separa as seções */
.cv-seccao-cabeca {
  border-top: 1px solid var(--cv-linha-forte);
  padding-top: 36px;
  margin-bottom: 64px;
}

.cv-seccao-cabeca h2 {
  font-size: 20px !important;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

/* Duas colunas: rótulo à esquerda, conteúdo à direita */
.cv-bloco {
  display: flex;
  flex-wrap: wrap;
  gap: 20px var(--cv-intervalo);
  margin-bottom: 88px;
}
.cv-bloco:last-child { margin-bottom: 0; }

.cv-rotulo {
  flex: 0 0 var(--cv-coluna);
  font-family: var(--cv-mono);
  font-size: 15px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cv-cinza);
}

.cv-grupo {
  flex: 0 0 var(--cv-coluna);
  font-family: var(--cv-mono);
  font-size: 34px;
  line-height: 1.1;
  text-transform: uppercase;
  color: var(--cv-cinza);
}

.cv-lista { flex: 1 1 640px; min-width: 0; }

/* ---------- Contacto ---------- */
.cv-contacto { padding-left: calc(var(--cv-coluna) + var(--cv-intervalo)); }

.cv-email {
  display: inline-block;
  font-size: clamp(26px, 4vw, 52px);
  line-height: 1.1;
  letter-spacing: -0.025em;
  border-bottom: 1px solid rgba(255, 255, 255, 0.4);
  padding-bottom: 8px;
  word-break: break-word;
}

.cv-contacto-linhas {
  margin-top: 56px;
  display: flex;
  flex-wrap: wrap;
  gap: 32px 56px;
}
.cv-contacto-linhas > div { flex: 1 1 160px; }
.cv-contacto-linhas a { font-size: 18px; }

.cv-etiqueta {
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cv-cinza);
  margin-bottom: 8px;
}

/* ---------- Linhas das listas ---------- */
.cv-linha {
  border-top: 1px solid var(--cv-linha);
  padding: 20px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 32px;
}
.cv-ultima { border-bottom: 1px solid var(--cv-linha); }

.cv-principal {
  flex: 1 1 320px;
  font-size: 22px;
  line-height: 1.3;
}

.cv-sub {
  display: block;
  margin-top: 4px;
  font-size: 15px;
  color: var(--cv-cinza);
}

.cv-data {
  flex: 0 0 200px;
  min-height: 20px;        /* mantém a altura quando está por preencher */
  font-family: var(--cv-mono);
  font-size: 12px;
  line-height: 1.7;
  color: var(--cv-cinza);
}

/* ---------- Soft-skills + software ---------- */
.cv-competencias {
  flex: 1 1 640px;
  min-width: 0;
  border-top: 1px solid var(--cv-linha);
  border-bottom: 1px solid var(--cv-linha);
  padding: 20px 0;
  font-size: 22px;
  line-height: 1.5;
}
.cv-competencias p + p { margin-top: 14px; }

/* ---------- Projetos ---------- */
.cv-projeto {
  padding: 16px 0;
  font-size: 17px;
  line-height: 1.5;
  gap: 4px 32px;
}
.cv-nome-projeto { flex: 2 1 280px; }
.cv-com  { flex: 2 1 200px; color: var(--cv-cinza); }
.cv-fase { flex: 1 1 160px; min-height: 26px; color: var(--cv-cinza); }

/* ---------- Rodapé ---------- */
.cv-rodape {
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  padding: 24px 0 56px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  font-family: var(--cv-mono);
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--cv-cinza);
}

/* ---------- Telemóvel e tablet ---------- */
@media (max-width: 900px) {
  .cv { --cv-margem: 24px; }

  .cv-topo { padding: 48px 0 56px; }
  .cv-seccao { padding-bottom: 72px; }
  .cv-seccao-cabeca { margin-bottom: 40px; }

  /* A coluna da esquerda passa a ficar por cima do conteúdo */
  .cv-rotulo,
  .cv-grupo { flex-basis: 100%; }
  .cv-grupo { font-size: 26px; }
  .cv-grupo br { display: none; }

  .cv-contacto { padding-left: 0; }
  .cv-bloco { margin-bottom: 56px; }

  .cv-principal { font-size: 19px; }
  .cv-data { flex-basis: 100%; }
  .cv-competencias { font-size: 18px; }
}