/* ======================================================
   CONTATO PRO — DESIGN MODERNO CIRANDA
====================================================== */

.contato-page{
  background:#f6f8fb;
}

/* GRID */
.ciranda-contact-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:32px;
}

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

/* CARD */
.ciranda-contact-card{
  background:#fff;
  border-radius:14px;
  padding:32px;
  box-shadow:0 12px 30px rgba(0,0,0,.06);
  border:1px solid rgba(0,0,0,.05);
  transition:.25s ease;
}

.ciranda-contact-card:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 40px rgba(0,0,0,.08);
}

/* FORM GRID */
.ciranda-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px 20px;
}

.ciranda-field{
  display:flex;
  flex-direction:column;
  position:relative;
}

.ciranda-field.span-2{
  grid-column:span 2;
}

/* LABEL */
.ciranda-field label{
  font-size:13px;
  font-weight:600;
  color:#39424e;
  margin-bottom:6px;
}

/* INPUTS */
.ciranda-field input,
.ciranda-field select,
.ciranda-field textarea{
  border:1px solid #dfe3ea;
  border-radius:8px;
  padding:12px 14px;
  font-size:15px;
  background:#fff;
  transition:.2s ease;
  outline:none;
}

.ciranda-field textarea{
  min-height:130px;
  resize:vertical;
}

/* HOVER */
.ciranda-field input:hover,
.ciranda-field select:hover,
.ciranda-field textarea:hover{
  border-color:#c7ced8;
}

/* FOCUS */
.ciranda-field input:focus,
.ciranda-field select:focus,
.ciranda-field textarea:focus{
  border-color:#6a7cff;
  box-shadow:0 0 0 3px rgba(106,124,255,.12);
}

/* ERRO */
.ciranda-field.is-invalid input,
.ciranda-field.is-invalid select,
.ciranda-field.is-invalid textarea{
  border-color:#e5484d;
  background:#fff7f7;
}

.ciranda-error{
  font-size:12px;
  color:#e5484d;
  margin-top:5px;
  display:none;
}

.ciranda-field.is-invalid .ciranda-error{
  display:block;
}

/* HELP */
.ciranda-help{
  font-size:11px;
  color:#7c8797;
  margin-top:4px;
}

/* BOTÃO */
.ciranda-btn{
  background:linear-gradient(135deg,#00e4d0 0%, #0e9adf 100%);
  box-shadow:0 10px 22px rgba(14,154,223,.22);
  border:none;
  color:#fff;
  padding:14px 26px;
  border-radius:8px;
  font-weight:600;
  font-size:15px;
  cursor:pointer;
  transition:.25s ease;
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.ciranda-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(106,124,255,.3);
}

/* ALERTAS */
.ciranda-alert{
  padding:14px 18px;
  border-radius:8px;
  margin-bottom:18px;
  font-size:14px;
}

.ciranda-alert.is-success{
  background:#ecfdf3;

  /* ======================================================
   CONTATO PRO — ÍCONES DENTRO DOS INPUTS
====================================================== */

/* estrutura base */
.ciranda-field{
  position:relative;
}

/* cria espaço para o ícone */
.ciranda-field input,
.ciranda-field select{
  padding-left:42px !important;
}

/* textarea sem ícone */
.ciranda-field textarea{
  padding-left:14px !important;
}

/* ícone */
.ciranda-field::before{
  font-family:"Font Awesome 6 Free";
  font-weight:900;
  position:absolute;
  left:14px;
  top:38px;
  font-size:14px;
  color:#9aa4b2;
  pointer-events:none;
  transition:.2s ease;
}

/* cada campo com seu ícone */
.ciranda-field:has(#nome)::before{
  content:"\f007"; /* user */
}

.ciranda-field:has(#assunto)::before{
  content:"\f0e0"; /* envelope */
}

.ciranda-field:has(#whatsapp)::before{
  content:"\f232"; /* whatsapp */
  font-family:"Font Awesome 6 Brands";
  font-weight:400;
}

.ciranda-field:has(#email)::before{
  content:"\f0e0"; /* envelope */
}

.ciranda-field:has(#cidade)::before{
  content:"\f3c5"; /* location-dot */
}

.ciranda-field:has(#polo)::before{
  content:"\f19c"; /* building */
}

/* efeito focus */
.ciranda-field:focus-within::before{
  color:#6a7cff;
  transform:scale(1.1);
}

/* estado erro */
.ciranda-field.is-invalid::before{
  color:#e5484d;
}

  border:1px solid #8ce0b3;
  color:#0e7a42;
}

.ciranda-alert.is-error{
  background:#fff3f3;
  border:1px solid #f1b5b5;
  color:#b42318;
}

/* LADO DIREITO */
.ciranda-contact-side h3{
  margin-bottom:12px;
  font-size:20px;
}

.ciranda-contact-pill{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}

.ciranda-pill{
  background:#f1f4f9;
  border-radius:20px;
  padding:7px 12px;
  font-size:13px;
  display:flex;
  align-items:center;
  gap:6px;
}

/* ===== FORÇA ALINHAR BOTÃO À ESQUERDA ===== */

/* Remove centralização herdada do Designesia/UI Engine */
.form-contato,
.form-contato form{
    text-align:left !important;
}

/* Container do botão */
.form-contato .wpcf7-submit,
.form-contato button,
.form-contato input[type="submit"]{

    display:inline-flex !important;
    align-items:center;
    justify-content:flex-start;

    margin-left:0 !important;
    margin-right:auto !important;
}

/* Se existir wrapper centralizando */
.form-contato p{
    text-align:left !important;
}