/* ============================================================
   椽仕设计 联系我们页样式（css/chuanshi-contact.css）
   依赖 chuanshi.css 基础组件（.cs-banner/.cs-container/.cs-section/
   .cs-title/.cs-btn/.cs-info-list）
   ============================================================ */

/* ========== 信息 + 表单两栏（左 58% / 右 42%） ========== */
.cs-contact-grid {
  display: grid;
  grid-template-columns: 58fr 42fr;
  gap: 64px;
  align-items: start;
}
.cs-title-en--left { text-align: left; margin-bottom: 28px; }

/* 左栏信息：单列信息列表（复用 .cs-info-list 项样式，改为纵向堆叠） */
.cs-info-list--stack { grid-template-columns: 1fr; margin-top: 8px; }
.cs-info-list--stack li { padding: 20px 4px; }
.cs-contact-phone {
  font-size: 26px !important;
  font-weight: 700 !important;
  color: var(--cs-red) !important;
  letter-spacing: 1px;
  font-family: var(--cs-font-sans);
}
.cs-contact-qr {
  width: 140px; height: 140px;
  object-fit: cover;
  border: 1px solid var(--cs-border);
}

/* 右栏表单：容器 max-width 450px */
.cs-contact-formwrap { max-width: 450px; width: 100%; justify-self: end; }

.cs-form { margin-top: 8px; }
.cs-form-row { margin-bottom: 18px; }
.cs-form-row label {
  display: block;
  font-size: 13px; color: var(--cs-text);
  letter-spacing: 1px; margin-bottom: 8px; font-weight: 600;
}
.cs-form-row label em { color: var(--cs-red); font-style: normal; }
.cs-form-row input,
.cs-form-row select,
.cs-form-row textarea {
  width: 100%;
  padding: 11px 14px;
  font-size: 14px; color: var(--cs-text);
  background: #fff;
  border: 1px solid #ddd;
  outline: none;
  font-family: inherit;
  transition: border-color 0.3s;
}
.cs-form-row textarea { resize: vertical; line-height: 1.8; }
.cs-form-row input:focus,
.cs-form-row select:focus,
.cs-form-row textarea:focus { border-color: var(--cs-red); }
.cs-form-row input::placeholder,
.cs-form-row textarea::placeholder { color: #bbb; }
.cs-form-row select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23999' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 34px;
  cursor: pointer;
}

/* 蜜罐字段：视觉隐藏但对垃圾脚本可见 */
.cs-hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px; height: 1px;
  overflow: hidden;
}

/* 提示条 */
.cs-form-msg {
  display: none;
  margin: 0 0 16px;
  padding: 11px 14px;
  font-size: 13px; line-height: 1.7; letter-spacing: 0.5px;
}
.cs-form-msg.is-ok { display: block; background: #f0f7f0; color: #2e7d32; border: 1px solid #cde5cd; }
.cs-form-msg.is-err { display: block; background: #fdf1f2; color: var(--cs-red); border: 1px solid #f2cfd4; }

.cs-form-submit { width: 100%; padding: 14px 36px; }
.cs-form-submit:disabled { opacity: 0.6; cursor: not-allowed; }

/* ========== 地图区（400px 全宽） ========== */
.cs-contact-map { line-height: 0; }
.cs-contact-map iframe {
  display: block;
  width: 100%;
  height: 400px;
  border: 0;
}

/* ========== 响应式（移动端纵排） ========== */
@media (max-width: 900px) {
  .cs-contact-grid { grid-template-columns: 1fr; gap: 48px; }
  .cs-contact-formwrap { justify-self: stretch; max-width: 450px; }
}

/* ========== 收尾区（Logo 字标 + 口号 + 微信二维码） ========== */
.cs-contact-close {
  margin-top: 52px; padding-top: 34px;
  border-top: 1px solid var(--cs-border);
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 32px; flex-wrap: wrap;
}
.cs-contact-brand { display: flex; flex-direction: column; gap: 14px; }
.cs-contact-logo { max-width: 300px; height: auto; display: block; }
.cs-contact-slogan {
  font-size: 14px; letter-spacing: 3px; color: var(--cs-muted);
}
.cs-contact-qrbox { text-align: center; }
.cs-contact-qrbox img { display: block; margin: 0 auto 8px; }
.cs-contact-qrbox figcaption {
  font-size: 11px; letter-spacing: 2px; color: var(--cs-muted);
}

/* ========== 内容居中排版（标题行 + 四行信息 + 收尾区） ========== */
.cs-contact-section .cs-title-row { justify-content: center; text-align: center; }
.cs-contact-section .cs-info-list { max-width: 620px; margin: 0 auto; }
.cs-contact-section .cs-info-list li { text-align: center; }
.cs-contact-section .cs-info-list h3::before { display: none; }
.cs-contact-section .cs-contact-close { justify-content: center; gap: 64px; }
.cs-contact-section .cs-contact-brand { align-items: center; text-align: center; }

/* CS-PATCH-BEGIN 20260913-2 */
/* 1) 收尾区口号放大 1.5×（14px → 21px） */
.cs-contact-section .cs-contact-slogan { font-size: 21px; }

/* 2) 「联系方式」区域整体缩至 2/3（标题行 + 四行信息） */
.cs-contact-section .cs-title-row { padding-top: 29px; gap: 11px; }
.cs-contact-section .cs-title-row-cn { font-size: 17px; }
.cs-contact-section .cs-title-row-en { font-size: 9px; letter-spacing: 3px; }
.cs-contact-section .cs-info-list { max-width: 413px; }
.cs-contact-section .cs-info-list--stack { margin-top: 5px; }
.cs-contact-section .cs-info-list--stack li { padding: 13px 4px; }
.cs-contact-section .cs-info-list h3 { font-size: 9px; margin-bottom: 5px; }
.cs-contact-section .cs-info-list h3::before { width: 2px; height: 8px; margin-right: 7px; }
.cs-contact-section .cs-info-list p { font-size: 9px; line-height: 1.8; }
.cs-contact-section .cs-contact-phone { font-size: 17px !important; letter-spacing: 1px; }

/* 3) 二维码 figure：与品牌区垂直居中对齐（原 flex-end 导致右上悬浮），间距 64 → 72px */
.cs-contact-section .cs-contact-close { align-items: center; gap: 72px; }
/* CS-PATCH-END 20260913-2 */

/* CS-PATCH-BEGIN 20260914-contactreadability */
/* 客户反馈：2/3 缩版偏小，标题行 + 四行信息整体抬到可读下限（正文/副标题/小标题 9px→12px，中文标题/电话 17px→20px）*/
.cs-contact-section .cs-title-row { padding-top: 34px; gap: 13px; }
.cs-contact-section .cs-title-row-cn { font-size: 20px; }
.cs-contact-section .cs-title-row-en { font-size: 12px; letter-spacing: 4px; }
.cs-contact-section .cs-info-list { max-width: 470px; }
.cs-contact-section .cs-info-list--stack { margin-top: 7px; }
.cs-contact-section .cs-info-list--stack li { padding: 16px 4px; }
.cs-contact-section .cs-info-list h3 { font-size: 12px; margin-bottom: 6px; }
.cs-contact-section .cs-info-list h3::before { width: 3px; height: 10px; margin-right: 8px; }
.cs-contact-section .cs-info-list p { font-size: 12px; line-height: 1.8; }
.cs-contact-section .cs-contact-phone { font-size: 20px !important; letter-spacing: 1px; }
/* CS-PATCH-END 20260914-contactreadability */

/* CS-PATCH-BEGIN 20260914-noredall */
/* 表单错误提示：浅红底/红描边改中性灰 */
.cs-form-msg.is-err { background: #f5f5f5 !important; border-color: #ddd !important; }
/* CS-PATCH-END 20260914-noredall */

/* CS-PATCH-BEGIN 20260914-allpagescenter */
/* 联系方式（含服务页底部同源区块）：内容区整块浅灰底与面板内边距已去掉 20260914-nogray5，回落 .cs-container 默认边距 */
/* CS-PATCH-END 20260914-allpagescenter */
