/* ============================================================
   CONTATO / FORM
   ============================================================ */
.contact-layout { display:grid; gap: clamp(2rem,5vw,4rem); grid-template-columns: 1fr 1.1fr; align-items:start; }
@media (max-width:900px){ .contact-layout { grid-template-columns:1fr; } }
.contact-info li { display:flex; gap:1rem; padding:1.1rem 0; border-bottom:1px solid var(--line); align-items:flex-start; }
.contact-info li:first-child { padding-top:0; }
.contact-info__ico { width:44px;height:44px;border-radius:12px;background:var(--blue-50);color:var(--blue-600);display:grid;place-items:center; flex:none; }
.contact-info__ico svg { width:22px;height:22px; }
.contact-info b { display:block; font-family:var(--font-body); color:var(--ink); }
.contact-info span, .contact-info a { color:var(--muted); font-size:.95rem; }
.contact-info a:hover { color: var(--blue-700); }
.contact-info div span { display:block; }
.contact-info__directions {
  display:inline-flex; align-items:center; gap:.35rem; margin-top:.45rem;
  color:var(--blue-600) !important; font-weight:600; font-size:.88rem;
}
.contact-info__directions svg { width:15px;height:15px; }
.contact-info__directions:hover { color:var(--blue-700) !important; }

.contact-map { position:relative; margin-top: clamp(2.6rem,5vw,4rem); }
.contact-map__frame-wrap {
  border-radius: var(--radius-lg); overflow:hidden; border:1px solid var(--line); box-shadow: var(--shadow-md);
}
.contact-map__frame { display:block; width:100%; height:460px; border:0; }
.contact-map__cta { position:absolute; left:1.4rem; bottom:1.4rem; }
@media (max-width:560px){
  .contact-map__frame { height:440px; }
  .contact-map__cta { position:static; width:100%; justify-content:center; margin-top:1rem; }
}
.form-card { background:#fff; border:1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(1.6rem,4vw,2.6rem); box-shadow: var(--shadow-md); }
.field { margin-bottom:1.1rem; }
.field label { display:block; font-size:.82rem; font-weight:600; color:var(--slate-700); margin-bottom:.4rem; font-family:var(--font-body); }
.field label .req { color: var(--blue-600); }
.field input, .field textarea, .field select {
  width:100%; padding:.85rem 1rem; border:1.5px solid var(--slate-200); border-radius:10px;
  font: inherit; color: var(--ink); background:#fff; transition: border-color .25s, box-shadow .25s;
}
.field input:focus, .field textarea:focus, .field select:focus {
  outline:none; border-color: var(--blue-600); box-shadow: 0 0 0 4px var(--blue-50);
}
.field textarea { resize:vertical; min-height:120px; }
.field-row { display:grid; gap:1.1rem; grid-template-columns:1fr 1fr; }
@media (max-width:520px){ .field-row { grid-template-columns:1fr; } }
.form-note { font-size:.8rem; color:var(--muted); margin-top:.8rem; display:flex; gap:.5rem; align-items:flex-start; }
.form-note svg { width:16px;height:16px;color:var(--blue-500); flex:none; margin-top:2px; }
.form-success { display:none; text-align:center; padding:2rem 1rem; }
.form-success.is-visible { display:block; }
.form-success svg { width:64px;height:64px;color:var(--blue-600); margin:0 auto 1rem; }

@media (max-width: 640px) {
  /* font-size >= 16px evita o zoom automático do iOS ao focar o campo;
     padding maior melhora a área de toque em telas pequenas. */
  .field input, .field textarea, .field select {
    padding: 1rem 1.1rem; border-radius: 12px; font-size: 16px;
  }
  .field label { font-size: .88rem; margin-bottom: .5rem; }
  .field { margin-bottom: 1.3rem; }
  .form-card { padding: 1.5rem 1.2rem; }
}

/* utilities */
.text-center { text-align:center; }
.mt-2 { margin-top: 2rem; }
.mono { font-family: var(--font-mono); }
.grid-2 { display:grid; gap: var(--gutter); grid-template-columns: 1fr 1fr; }
@media (max-width: 760px){ .grid-2 { grid-template-columns: 1fr; } }


/* ============================================================
   FORMULÁRIO DE QUALIFICAÇÃO (qz)
   Único formulário do site. Visual de conversa: balão de
   pergunta, opção escolhida no verde claro do aplicativo e
   envio no verde da marca.
   ============================================================ */
.qz__top { display:flex; align-items:center; gap:.8rem; padding-bottom:1rem; border-bottom:1px solid var(--line); margin-bottom:1.2rem; }
.qz__av { width:42px; height:42px; border-radius:50%; background:#25D366; display:grid; place-items:center; flex:none; }
.qz__av img { width:24px; height:24px; }
.qz__top b { display:block; font-size:var(--step-0); }
.qz__top span { font-family:var(--font-mono); font-size:.7rem; letter-spacing:.05em; color:var(--muted); }

.qz__bar { height:4px; border-radius:100px; background:var(--line); overflow:hidden; margin-bottom:1.6rem; }
.qz__bar i { display:block; height:100%; width:33.33%; background:#25D366; transition:width .3s var(--ease); }

.qz__step { display:none; border:0; padding:0; margin:0; }
.qz__step.is-on { display:block; }
.qz__ask {
  display:inline-block; padding:.7rem 1rem; margin-bottom:1.1rem;
  background:var(--blue-50, #eef3ff); border-radius:14px 14px 14px 4px;
  font-size:var(--step-0); font-weight:600; color:var(--ink);
}
.qz__opts { display:grid; gap:.6rem; }
.qz__opt {
  text-align:left; padding:.85rem 1rem; min-height:44px;
  border:1px solid var(--line); border-radius:12px; background:#fff;
  font-size:var(--step-0); color:var(--ink); cursor:pointer;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.qz__opt:hover { border-color:#25D366; transform:translateX(2px); }
.qz__opt.is-picked { background:#DCF8C6; border-color:#25D366; font-weight:600; }

.qz__fields { display:grid; gap:1rem; }
.qz__erro { color:#b01917; font-size:var(--step--1); margin-top:.8rem; min-height:1.2em; }
.qz__send { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-top:1.2rem; }
.qz__go {
  --btn-bg:#25D366; --btn-fg:#052E22;
  border:1px solid #12A150; font-weight:700;
  display:inline-flex; align-items:center; gap:.55rem; min-height:44px;
}
.qz__go img { width:1.15em; height:1.15em; }
.qz__back {
  background:none; border:0; padding:.5rem 0; min-height:44px;
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--muted); cursor:pointer;
}
.qz__back:hover { color:var(--ink); }

@media (prefers-reduced-motion: reduce) {
  .qz__opt, .qz__bar i { transition:none; }
}
