/* ============================================
   深圳腾骏达科技 - 联系我们页样式
   ============================================ */

.contact-wrapper { padding: 2.5rem 0; }

/* 主体大框 */
.contact-main-box {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  margin-bottom: 2.5rem;
}

/* 左侧联系方式 */
.contact-info {
  background: white;
  border-radius: 20px;
  padding: 2.5rem;
  box-shadow: 0 8px 30px rgba(0,0,0,0.04);
}
.contact-info h2 {
  font-size: 1.6rem; font-weight: 700; color: #003D7A; margin-bottom: 0.3rem;
}
.section-desc {
  font-size: 0.9rem; color: #9ca3af; margin-bottom: 1.5rem;
  padding-bottom: 1.2rem; border-bottom: 2px solid #f3f4f6;
}

/* 信息卡片网格 */
.info-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.info-card {
  display: flex; gap: 0.8rem; align-items: flex-start;
  padding: 1rem; background: #f9fafb; border-radius: 12px; transition: 0.2s;
}
.info-card:hover { background: #f0f4ff; }
.info-icon {
  font-size: 1.5rem; flex-shrink: 0; width: 42px; height: 42px;
  display: flex; align-items: center; justify-content: center;
  background: white; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.info-text { display: flex; flex-direction: column; }
.info-text strong { font-size: 0.8rem; color: #6b7280; margin-bottom: 0.15rem; }
.info-text span { font-size: 0.95rem; font-weight: 600; color: #003D7A; }
.info-text small { font-size: 0.75rem; color: #9ca3af; margin-top: 0.1rem; }

/* 二维码区域 - 两个码居中一行 */
.qr-section-contact {
  display: flex;
  justify-content: center;
  gap: 2rem;
  margin-top: 1.5rem;
}
.qr-item {
  text-align: center;
  overflow: visible; /* 允许放大后不裁剪 */
}
.qr-img {
  width: 90px;
  height: 90px;
  border-radius: 12px;
  object-fit: cover;
  border: 1px solid #e5e7eb;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: pointer;
}
.qr-img:hover {
  transform: scale(1.3);
  box-shadow: 0 8px 20px rgba(0,0,0,0.15);
  z-index: 10;
  position: relative;
}
.qr-item span {
  display: block;
  font-size: 0.8rem;
  color: #6b7280;
  margin-top: 0.4rem;
}

/* 右侧在线留言 */
.contact-form {
  background: white;
  border-radius: 20px;
  padding: 2.5rem;
  box-shadow: 0 8px 30px rgba(0,0,0,0.04);
}
.contact-form h2 { font-size: 1.6rem; font-weight: 700; color: #003D7A; margin-bottom: 0.3rem; }

/* 表单 */
.message-form { display: flex; flex-direction: column; gap: 1rem; margin-top: 1rem; }
.form-group { margin-bottom: 0; }
.form-group label { display: block; font-size: 0.85rem; font-weight: 500; color: #374151; margin-bottom: 0.35rem; }
.required { color: #e63946; }
.form-group input,
.form-group textarea {
  width: 100%; padding: 0.75rem 1rem; border: 1.5px solid #e5e7eb;
  border-radius: 10px; font-size: 0.9rem; font-family: inherit; color: #1f2937;
  transition: 0.2s; outline: none; background: #f9fafb;
}
.form-group input:focus,
.form-group textarea:focus { border-color: #003D7A; background: white; box-shadow: 0 0 0 3px rgba(0,61,122,0.06); }
.form-group input::placeholder,
.form-group textarea::placeholder { color: #cbd5e1; }
.submit-btn { width: 100%; padding: 0.85rem; font-size: 1rem; margin-top: 0.5rem; }

/* 服务承诺 */
.contact-promise {
  background: linear-gradient(135deg, #003D7A, #0055a5);
  border-radius: 20px; padding: 2.5rem; color: white;
}
.contact-promise h3 { font-size: 1.4rem; font-weight: 700; text-align: center; margin-bottom: 1.8rem; }
.promise-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.promise-item { text-align: center; }
.promise-icon { font-size: 2rem; margin-bottom: 0.5rem; }
.promise-item h4 { font-size: 1rem; margin-bottom: 0.25rem; }
.promise-item p { font-size: 0.85rem; opacity: 0.85; }

/* 响应式 */
@media (max-width: 992px) {
  .contact-main-box { grid-template-columns: 1fr; }
  .promise-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .info-cards { grid-template-columns: 1fr; }
  .qr-section-contact { gap: 1rem; }
}