/* ============================================================
   page-contact.css — 联系我们 contact.html 独有样式
   签名布局：三栏磁贴 + 大表单（磁贴 / 表单到访分屏 / 时间表 / FAQ）
   命名空间：body.page-contact
   ============================================================ */

/* ---------- 1. Hero ---------- */
body.page-contact .ctc-hero h1{max-width:640px}

/* ---------- 2. 三栏磁贴 ---------- */
body.page-contact .contact-tiles{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
}
body.page-contact .ctc-tile{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  background:#fff;border:1px solid var(--c-line);border-radius:var(--radius-lg);
  padding:36px 26px;box-shadow:var(--shadow-card);
  transition:transform .35s var(--ease),border-color .35s;
}
body.page-contact .ctc-tile:hover{transform:translateY(-6px);border-color:var(--c-purple-300)}
body.page-contact .ctc-icon{
  width:60px;height:60px;border-radius:20px;display:flex;align-items:center;justify-content:center;
  background:var(--grad-main);color:#fff;box-shadow:0 10px 24px rgba(197,174,239,.4);
  margin-bottom:18px;
}
body.page-contact .ctc-tile h3{font-size:16px;margin-bottom:8px}
body.page-contact .ctc-big{
  font-size:24px;font-weight:800;color:var(--c-ink);letter-spacing:.02em;margin-bottom:8px;
}
body.page-contact .ctc-tile p{font-size:13px;color:var(--c-muted)}
body.page-contact .ctc-go{
  margin-top:14px;font-size:13px;font-weight:700;color:var(--c-purple-400);
}

/* ---------- 2b. 快捷入口横卷 ---------- */
body.page-contact .quick-strip{margin-top:34px}
body.page-contact .quick-chip{
  flex:0 0 auto;padding:9px 20px;border-radius:999px;font-size:13.5px;font-weight:600;
  background:#fff;border:1.5px solid var(--c-line);color:var(--c-text);transition:all .25s;
}
body.page-contact .quick-chip:hover{
  background:var(--grad-main);color:#fff;border-color:transparent;
  transform:translateY(-2px);box-shadow:0 8px 18px rgba(197,174,239,.35);
}

/* ---------- 3. 表单 + 到访分屏 ---------- */
body.page-contact .form-split{
  display:grid;grid-template-columns:1.15fr 1fr;gap:44px;align-items:start;
}
body.page-contact .form-panel{
  background:#fff;border:1px solid var(--c-line);border-radius:var(--radius-lg);
  padding:36px 32px;box-shadow:var(--shadow-card);
}
body.page-contact .form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
body.page-contact .form-submit{width:100%;border:none}
body.page-contact .form-note{margin-top:12px;font-size:12px;color:var(--c-muted)}
body.page-contact .visit-panel{display:flex;flex-direction:column;gap:16px}
body.page-contact .visit-panel img{
  border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);width:100%;height:auto;
}
body.page-contact .visit-panel h3{margin-top:6px}
body.page-contact .visit-list{display:flex;flex-direction:column;gap:14px}
body.page-contact .visit-list li{
  background:#fff;border:1px solid var(--c-line);border-radius:var(--radius-md);
  padding:14px 18px;display:flex;flex-direction:column;gap:4px;
}
body.page-contact .visit-list strong{font-size:14px;color:var(--c-ink)}
body.page-contact .visit-list span{font-size:13px;color:var(--c-text)}

/* ---------- 4. 服务时间表 ---------- */
body.page-contact .time-table{
  max-width:780px;margin:0 auto;
  background:#fff;border:1px solid var(--c-line);border-radius:var(--radius-lg);
  overflow:hidden;box-shadow:var(--shadow-card);
}
body.page-contact .time-row{
  display:grid;grid-template-columns:160px 180px 1fr;gap:16px;align-items:center;
  padding:20px 28px;border-bottom:1px solid var(--c-line);
}
body.page-contact .time-row:last-child{border-bottom:0}
body.page-contact .time-day{font-weight:700;color:var(--c-ink)}
body.page-contact .time-hours{
  font-weight:800;color:var(--c-purple-400);
}
body.page-contact .time-note{font-size:13px;color:var(--c-muted)}

/* ---------- 5. FAQ ---------- */
body.page-contact .faq-list{display:grid;grid-template-columns:1fr 1fr;gap:18px}
body.page-contact .faq-item{
  background:#fff;border:1px solid var(--c-line);border-radius:var(--radius-md);
  padding:18px 22px;box-shadow:var(--shadow-card);
}
body.page-contact .faq-item summary{
  cursor:pointer;font-weight:700;color:var(--c-ink);font-size:15px;list-style:none;
  display:flex;align-items:center;gap:8px;
}
body.page-contact .faq-item summary::before{
  content:"Q";flex:none;width:22px;height:22px;border-radius:8px;
  background:var(--c-pink-100);color:var(--c-pink-400);
  display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;
}
body.page-contact .faq-item p{margin-top:10px;font-size:13.5px}
body.page-contact .faq-item a{color:var(--c-purple-400);font-weight:600;border-bottom:1px dashed var(--c-purple-300)}

/* ---------- 6. 服务承诺 + 位置说明 ---------- */
body.page-contact .promise4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
body.page-contact .promise4-card{
  background:#fff;border:1px solid var(--c-line);border-radius:var(--radius-lg);
  padding:22px 20px;box-shadow:var(--shadow-card);transition:transform .3s var(--ease);
}
body.page-contact .promise4-card:hover{transform:translateY(-4px)}
body.page-contact .p4-no{
  font-size:13px;font-weight:800;letter-spacing:.1em;
  background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;
}
body.page-contact .promise4-card h4{font-size:15.5px;margin:8px 0 8px}
body.page-contact .promise4-card p{font-size:13px}
body.page-contact .promise4-card a{color:var(--c-purple-400);font-weight:600;border-bottom:1px dashed var(--c-purple-300)}
body.page-contact .location-text{max-width:820px}
body.page-contact .location-text p{font-size:14.5px;margin-bottom:14px}
body.page-contact .location-text a{color:var(--c-purple-400);font-weight:600;border-bottom:1px dashed var(--c-purple-300)}

/* ---------- 7. CTA ---------- */
body.page-contact .cta-band{background:var(--grad-dark);padding:72px 0;text-align:center}
body.page-contact .cta-in h2{color:#fff}
body.page-contact .cta-in h2 .grad-text{
  background:linear-gradient(120deg,#F2A6CC,#C5AEEF);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
body.page-contact .cta-in p{color:#C9BBD3;max-width:640px;margin:16px auto 0}
body.page-contact .cta-buttons{margin-top:28px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
body.page-contact .cta-buttons .btn-ghost{background:transparent;border-color:rgba(255,255,255,.35);color:#fff}

/* ---------- 7. 响应式 ---------- */
@media (max-width:1100px){
  body.page-contact .contact-tiles{grid-template-columns:1fr;max-width:520px;margin:0 auto}
  body.page-contact .form-split{grid-template-columns:1fr}
}
@media (max-width:768px){
  body.page-contact .form-row{grid-template-columns:1fr}
  body.page-contact .faq-list{grid-template-columns:1fr}
  body.page-contact .promise4{grid-template-columns:repeat(2,1fr)}
  body.page-contact .time-row{grid-template-columns:1fr;gap:4px;padding:16px 20px}
}
@media (max-width:480px){
  body.page-contact .promise4{grid-template-columns:1fr}
  body.page-contact .form-panel{padding:24px 18px}
}