/* Pagina publica de contato (public/contato.html) — reaproveita tokens --lp-* de brand.css e
   a mesma estrutura de header/footer/.lp-section de home.html; so os estilos proprios do
   formulario ficam aqui. */

.lp-contact-section {
  text-align: left;
  max-width: 960px;
}

.lp-contact-section .lp-eyebrow {
  display: inline-block;
}

.lp-contact-intro {
  max-width: 60ch;
  color: var(--lp-texto-corpo);
}

.lp-contact-grid {
  display: grid;
  grid-template-columns: minmax(0, 280px) minmax(0, 1fr);
  gap: 32px;
  margin-top: 40px;
  align-items: start;
}

.lp-contact-details {
  display: grid;
  gap: 16px;
}

.lp-contact-action {
  display: grid;
  gap: 4px;
  padding: 18px;
  border: 1px solid var(--lp-borda);
  border-radius: var(--lp-raio-card);
  background: var(--lp-branco);
  box-shadow: var(--lp-sombra-suave);
  text-decoration: none;
  color: inherit;
}

.lp-contact-action strong {
  font-family: var(--lp-font-titulo);
  color: var(--lp-texto);
}

.lp-contact-action span {
  color: var(--lp-texto-corpo);
  font-size: 14px;
}

.lp-contact-form {
  display: grid;
  gap: 16px;
  padding: 28px;
  border: 1px solid var(--lp-borda);
  border-radius: var(--lp-raio-card);
  background: var(--lp-branco);
  box-shadow: var(--lp-sombra-media);
}

.lp-contact-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.lp-contact-form label {
  display: grid;
  gap: 6px;
  font-family: var(--lp-font-titulo);
  font-weight: 600;
  font-size: 14px;
  color: var(--lp-texto);
}

.lp-contact-form input,
.lp-contact-form textarea {
  font-family: var(--lp-font-corpo);
  font-size: 15px;
  padding: 12px 14px;
  border: 1px solid var(--lp-borda);
  border-radius: 12px;
  background: var(--lp-nevoa);
  color: var(--lp-texto);
}

.lp-contact-form input:focus,
.lp-contact-form textarea:focus {
  outline: none;
  border-color: var(--lp-roxo);
  box-shadow: 0 0 0 3px rgba(108, 51, 162, .14);
}

.lp-contact-form textarea {
  min-height: 140px;
  resize: vertical;
}

.lp-contact-form button {
  justify-self: start;
}

.lp-honeypot {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.lp-contact-feedback {
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
}

.lp-contact-feedback.success {
  background: #e8f7ee;
  color: #1c7a45;
}

.lp-contact-feedback.error {
  background: #fdeceb;
  color: #b3261e;
}

.lp-contact-feedback.hidden {
  display: none;
}

@media (max-width: 760px) {
  .lp-contact-grid {
    grid-template-columns: 1fr;
  }

  .lp-contact-form-grid {
    grid-template-columns: 1fr;
  }
}