/* ============================================
   CALAMARO — Contato
   ============================================ */

.contato-hero {
  background: linear-gradient(145deg, #EBF6FC 0%, #DDEEF8 50%, #EBF6FC 100%);
  padding: 140px 0 64px;
  text-align: center;
}

.contato-hero__title {
  font-family: var(--font-title);
  font-weight: 900;
  font-size: clamp(2.4rem, 5vw, 4rem);
  text-transform: uppercase;
  color: var(--text);
  margin-bottom: 16px;
  line-height: 1.05;
}

.contato-hero__title .accent { color: var(--blue); }

.contato-hero__sub {
  font-size: 1.1rem;
  color: var(--text-light);
  max-width: 520px;
  margin: 0 auto;
}

/* CANAIS */
.contato-canais { background: var(--white); }

.canais__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.canal__card {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  background: #F5FAFD;
  border: 1px solid #D6EBF5;
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  text-decoration: none;
  transition: var(--transition);
}

.canal__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(26,143,193,0.12);
}

.canal__card--wpp {
  border-color: #B7E5CE;
  background: #F0FBF6;
}

.canal__card--wpp:hover { border-color: #25D366; }

.canal__card--sim { border-color: #C8E6F5; }
.canal__card--sim:hover { border-color: var(--blue); }

.canal__icon {
  width: 52px; height: 52px;
  border-radius: var(--radius-md);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}

.canal__card--wpp .canal__icon { background: #25D366; }
.canal__card--sim .canal__icon { background: var(--blue); }
.canal__card--horario .canal__icon { background: var(--navy); }

.canal__icon i { color: var(--white); font-size: 1.3rem; }

.canal__card h3 {
  font-family: var(--font-title);
  font-weight: 800;
  font-size: 1rem;
  text-transform: uppercase;
  color: var(--text);
  margin-bottom: 6px;
}

.canal__card p {
  font-size: 0.85rem;
  color: var(--text-light);
  line-height: 1.5;
  margin-bottom: 12px;
}

.canal__action {
  font-family: var(--font-title);
  font-weight: 700;
  font-size: 0.85rem;
  text-transform: uppercase;
  color: var(--blue);
  display: flex;
  align-items: center;
  gap: 6px;
}

.canal__card--wpp .canal__action { color: #25D366; }

/* MAIN */
.contato-main { background: #F5FAFD; }

.contato-main__grid {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 48px;
  align-items: start;
}

/* FORMULÁRIO */
.contato-form-wrapper { }

.contato-form {
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.contato-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.contato-form__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.contato-form__field label {
  font-family: var(--font-title);
  font-weight: 700;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-light);
}

.contato-form__field input,
.contato-form__field select,
.contato-form__field textarea {
  width: 100%;
  padding: 13px 16px;
  border: 2px solid var(--gray-line);
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--text);
  background: var(--white);
  transition: border-color 0.2s, box-shadow 0.2s;
  outline: none;
  resize: none;
}

.contato-form__field input:focus,
.contato-form__field select:focus,
.contato-form__field textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(31,183,232,0.15);
}

.contato-form__check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.contato-check-label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  font-size: 0.85rem;
  color: var(--text-light);
  line-height: 1.5;
}

.contato-check-label input[type="checkbox"] {
  width: 16px; height: 16px;
  margin-top: 2px;
  flex-shrink: 0;
  accent-color: var(--blue);
}

.contato-form__success {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  background: #EBF6FC;
  border: 1px solid #C8E6F5;
  border-radius: var(--radius-md);
  padding: 20px;
}

.contato-form__success i {
  color: var(--success);
  font-size: 1.5rem;
  flex-shrink: 0;
}

.contato-form__success strong {
  font-family: var(--font-title);
  font-weight: 800;
  font-size: 0.95rem;
  text-transform: uppercase;
  color: var(--text);
  display: block;
  margin-bottom: 4px;
}

.contato-form__success p {
  font-size: 0.85rem;
  color: var(--text-light);
  margin: 0;
}

/* INFO */
.contato-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: sticky;
  top: 100px;
}

.contato-info__card {
  background: var(--white);
  border: 1px solid #D6EBF5;
  border-radius: var(--radius-lg);
  padding: 20px 22px;
}

.contato-info__card--destaque {
  border-color: var(--blue);
  background: #EBF6FC;
}

.contato-info__header {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.contato-info__header > i {
  font-size: 1.2rem;
  color: var(--blue);
  flex-shrink: 0;
  margin-top: 2px;
}

.contato-info__header h4 {
  font-family: var(--font-title);
  font-weight: 800;
  font-size: 0.88rem;
  text-transform: uppercase;
  color: var(--text);
  margin-bottom: 4px;
}

.contato-info__header p,
.contato-info__header a {
  font-size: 0.88rem;
  color: var(--text-light);
  line-height: 1.5;
  text-decoration: none;
}

.contato-info__header a { color: var(--blue); font-weight: 600; }

.contato-info__wpp {
  background: var(--white);
  border: 1px solid #D6EBF5;
  border-radius: var(--radius-lg);
  padding: 20px 22px;
}

.contato-info__wpp p {
  font-size: 0.85rem;
  color: var(--text-light);
  margin-bottom: 12px;
  text-align: center;
}

/* RESPONSIVO */
@media (max-width: 1024px) {
  .contato-main__grid { grid-template-columns: 1fr; }
  .contato-info { position: static; }
}

@media (max-width: 768px) {
  .contato-hero { padding: 120px 0 48px; }
  .canais__grid { grid-template-columns: 1fr; }
  .contato-form__row { grid-template-columns: 1fr; }
}