/* Pagina Contato. Prefixo contato-. Usa os tokens de site.css. */

/* ---------- Abertura + formulario ---------- */
.contato-top { padding-top: var(--section-y-tight); }
.contato-top__head { max-width: 52rem; margin-bottom: var(--space-7); }
.contato-top__head .lead { margin-top: var(--space-4); }

.contato-top__grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: var(--space-6);
  align-items: start;
}

.contato-form-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: clamp(1.25rem, 3vw, 2.5rem);
  scroll-margin-top: calc(var(--nav-h) + var(--space-5));
}
.contato-form-card__title { color: var(--navy-900); }
.contato-form-card__note { margin-top: var(--space-2); font-size: 0.9375rem; color: var(--ink-500); }
.contato-form-card__note .req { color: var(--danger); font-weight: 600; }

.contato-form { margin-top: var(--space-6); }
.contato-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-5) var(--space-5);
  align-items: start;
}
/* o grid cuida do espaco entre campos */
.contato-form__grid .field + .field { margin-top: 0; }
.contato-form__full { grid-column: 1 / -1; }

.contato-form__footer {
  margin-top: var(--space-6);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3) var(--space-4);
}
.contato-form__status { font-size: 0.9375rem; color: var(--ink-700); min-height: 1.5em; }
.contato-form__footer .btn[disabled] { opacity: 0.7; cursor: not-allowed; }
.contato-form__footer .btn[disabled]:hover { background: var(--orange-600); }

/* erro: icone + texto, nunca so cor */
.contato-form .field__error { display: none; }
.contato-form .field.has-error .field__error { display: flex; gap: 0.375rem; align-items: flex-start; }
.contato-form .field.has-error .field__error::before {
  content: "";
  flex: 0 0 1em;
  height: 1em;
  margin-top: 0.2em;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M128 24a104 104 0 10104 104A104.11 104.11 0 00128 24zm-8 56a8 8 0 0116 0v56a8 8 0 01-16 0zm8 104a12 12 0 1112-12 12 12 0 01-12 12z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M128 24a104 104 0 10104 104A104.11 104.11 0 00128 24zm-8 56a8 8 0 0116 0v56a8 8 0 01-16 0zm8 104a12 12 0 1112-12 12 12 0 01-12 12z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.contato-form .field.has-error .input,
.contato-form .field.has-error .textarea,
.contato-form .field.has-error .select { border-width: 2px; }

.contato-spin { animation: contato-spin 0.9s linear infinite; }
@keyframes contato-spin { to { transform: rotate(360deg); } }

/* ---------- Painel de informacoes ---------- */
.contato-info {
  background: var(--navy-900);
  color: #C9D3E6;
  border-radius: var(--radius);
  padding: clamp(1.25rem, 3vw, 2.25rem);
}
.contato-info h2 { color: #fff; }
.contato-info a { color: #fff; text-underline-offset: 3px; }
.contato-info a:hover { color: #C9D3E6; }
.contato-info :focus-visible { outline-color: #fff; }

.contato-info__list { margin-top: var(--space-5); }
.contato-info__row { padding-block: var(--space-4); border-top: 1px solid rgb(255 255 255 / 0.16); }
.contato-info__row dt {
  display: flex; align-items: center; gap: var(--space-2);
  font-size: 0.875rem; font-weight: 500; color: #AFC0DD;
}
.contato-info__row dt i { font-size: 1.25rem; color: #fff; }
.contato-info__row dd { margin: var(--space-2) 0 0 calc(1.25rem + var(--space-2)); color: #fff; font-size: 1.0625rem; line-height: 1.5; }
.contato-info__row dd a { display: inline-block; padding-block: 0.25rem; }

.contato-info__social { border-top: 1px solid rgb(255 255 255 / 0.16); padding-top: var(--space-5); }
.contato-info__social-title { font-size: 1.0625rem; font-weight: 600; color: #fff; letter-spacing: 0; }
.contato-info__social p { margin-top: var(--space-2); font-size: 0.9375rem; }
.contato-info__social-list { margin-top: var(--space-4); display: flex; flex-wrap: wrap; gap: var(--space-2); list-style: none; padding: 0; }
.contato-info__social-list a {
  display: inline-flex; align-items: center; gap: 0.5rem;
  min-height: 44px; padding: 0 1rem;
  border: 1.5px solid rgb(255 255 255 / 0.45);
  border-radius: var(--radius-pill);
  text-decoration: none; font-weight: 500; font-size: 0.9375rem;
  transition: background-color var(--dur) ease, color var(--dur) ease, border-color var(--dur) ease;
}
.contato-info__social-list a:hover { background: #fff; color: var(--navy-900); border-color: #fff; }
.contato-info__social-list i { font-size: 1.25rem; }

/* ---------- Outros canais ---------- */
.contato-canais {
  list-style: none; padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 var(--space-8);
}
.contato-canal {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-5);
  padding-block: var(--space-6);
  border-top: 1px solid var(--line);
}
.contato-canal__icon {
  width: 3rem; height: 3rem;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--radius);
  background: var(--info-bg);
  color: var(--navy-700);
  font-size: 1.5rem;
}
.contato-canal__body > * + * { margin-top: var(--space-2); }
.contato-canal__body p { color: var(--ink-700); max-width: 40ch; }
.contato-canal__body .btn { margin-top: var(--space-4); }

/* ---------- FAQ ---------- */
.contato-faq {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: var(--space-6) var(--space-8);
  align-items: start;
}
.contato-faq__head > * + * { margin-top: var(--space-4); }
.contato-faq__head { position: sticky; top: calc(var(--nav-h) + var(--space-6)); }
.contato-faq .accordion__panel { max-width: none; }

/* ---------- Mapa ---------- */
.contato-map {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--surface);
}
.contato-map__frame { height: 450px; background: var(--paper); }
.contato-map__frame iframe { display: block; width: 100%; height: 100%; border: 0; }
.contato-map__bar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: var(--space-4) var(--space-6);
  padding: var(--space-5);
  border-top: 1px solid var(--line);
}
.contato-map__address { display: flex; gap: var(--space-3); align-items: flex-start; }
.contato-map__address > i { font-size: 1.5rem; color: var(--orange-600); margin-top: 0.1em; }
.contato-map__address address { font-style: normal; display: grid; gap: 0.125rem; color: var(--ink-700); }
.contato-map__address strong { color: var(--navy-900); }
.contato-map__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }

/* ---------- Responsivo ---------- */
@media (max-width: 860px) {
  .contato-top__grid,
  .contato-faq,
  .contato-canais { grid-template-columns: minmax(0, 1fr); }
  .contato-faq__head { position: static; }
  .contato-canais { gap: 0; }
  .contato-map__frame { height: 340px; }
}
@media (max-width: 600px) {
  .contato-form__grid { grid-template-columns: minmax(0, 1fr); }
  .contato-form__footer .btn { width: 100%; }
  .contato-map__actions .btn { flex: 1 1 100%; }
  .contato-canal { gap: var(--space-4); }
}

@media (prefers-reduced-motion: reduce) {
  .contato-spin { animation: none; }
}