/* WaveOps · composição da página Contato no novo visual. Abertura, cartão, controles e colunas
   numeradas vêm de components.css. O cartão opaco recupera a hierarquia de texto do escuro. */
.wo-contato-grade {
  align-items: start;
}

.wo-contato-grade > * {
  min-width: 0;
}

.wo-contato-grade .wo-h1 {
  text-wrap: wrap;
}

.wo-contato-garantias {
  display: flex;
  flex-direction: column;
  gap: var(--wo-espaco-2);
  margin-top: var(--wo-espaco-4);
}

.wo-contato-garantias li {
  display: flex;
  align-items: baseline;
  gap: var(--wo-espaco-1);
  color: var(--wo-texto-2);
  font-size: var(--wo-texto-corpo);
}

.wo-contato-garantias svg {
  width: var(--wo-espaco-2);
  height: var(--wo-espaco-2);
  flex-shrink: 0;
  color: var(--wo-acento-texto);
}

/* ---------- Canais de contato direto ---------- */
.wo-contato-canais {
  margin-top: var(--wo-espaco-5);
  border-top: var(--wo-linha-forte) solid var(--wo-texto);
}

.wo-contato-canal {
  display: flex;
  align-items: center;
  gap: var(--wo-espaco-2);
  min-height: var(--wo-alvo);
  padding: var(--wo-espaco-3) 0;
  border-bottom: var(--wo-linha-fina) solid var(--wo-borda);
  color: var(--wo-texto);
  text-decoration: none;
}

.wo-contato-canal:hover {
  color: var(--wo-texto);
}

.wo-contato-canal__icone {
  display: grid;
  place-items: center;
  width: var(--wo-espaco-3);
  height: var(--wo-espaco-3);
  flex-shrink: 0;
}

.wo-contato-canal__icone svg {
  width: var(--wo-espaco-3);
  height: var(--wo-espaco-3);
}

.wo-contato-canal__texto {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
}

.wo-contato-canal__titulo {
  font-size: var(--wo-texto-pequeno);
  font-weight: 500;
  line-height: 1.43;
}

.wo-contato-canal__detalhe {
  color: var(--wo-texto-3);
  margin-top: var(--wo-espaco-1);
  font-size: var(--wo-texto-pequeno);
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.wo-contato-canal__seta {
  width: var(--wo-espaco-2);
  height: var(--wo-espaco-2);
  flex-shrink: 0;
  color: var(--wo-texto-3);
  transition: color var(--wo-transicao), transform var(--wo-transicao);
}

.wo-contato-canal:hover .wo-contato-canal__seta {
  color: var(--wo-acento-texto);
  transform: translateX(var(--wo-linha-forte));
}

/* ---------- Cartão do formulário ---------- */
.wo-contato-cartao {
  --wo-texto-2: var(--wo-clara-2);
  --wo-texto-3: var(--wo-clara-3);
}

.wo-contato-cartao :is(.wo-form__titulo, .wo-confirmacao__titulo) {
  font-family: var(--wo-fonte-titulo);
  font-size: var(--wo-h3-cartao);
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.55;
}

.wo-contato-cartao .wo-form__intro {
  font-size: var(--wo-texto-pequeno);
  line-height: 1.45;
}

.wo-contato-cartao .wo-confirmacao__texto {
  font-size: var(--wo-texto-corpo);
  line-height: 1.625;
}

/* ---------- Depois do envio ---------- */
.wo-contato-depois__cabeca {
  max-width: var(--wo-conteiner);
}

.wo-contato-depois__titulo {
  margin-top: var(--wo-espaco-3);
}

@media (min-width: 1024px) {
  .wo-contato-grade {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 639px) {
  .wo-contato-cartao {
    padding: var(--wo-espaco-3);
  }

  .wo-contato-cartao .wo-opcoes-canal__grade {
    grid-template-columns: minmax(0, 1fr);
  }
}
