.page-contact{
  --ct-gap:clamp(20px,3vw,40px);
  --ct-pad:clamp(18px,2.4vw,30px);
  background:var(--ink);
  color:var(--paper);
  padding-bottom:clamp(52px,7vw,96px);
  overflow-x:hidden;
}

/* ---------- 顶部与首屏 ---------- */
.page-contact .ct-topbar{
  padding-top:calc(var(--header-h) + 26px);
}
.page-contact .ct-topbar .breadcrumb{
  margin:0 0 clamp(14px,2vw,22px);
}

.page-contact .ct-hero-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--ct-gap);
  align-items:end;
}
.page-contact .ct-hero-copy{ min-width:0; }
.page-contact .ct-hero-copy .eyebrow{ margin:0 0 12px; }
.page-contact h1{
  margin:0;
  max-width:20ch;
  font-family:var(--font-sans);
  font-size:clamp(30px,4.6vw,56px);
  line-height:1.07;
  letter-spacing:-.02em;
  font-weight:800;
  color:var(--paper);
}
.page-contact .ct-lede{
  margin:clamp(16px,2vw,24px) 0 0;
  max-width:54ch;
  font-size:var(--fs-body);
  line-height:1.75;
  color:var(--paper-86);
}
.page-contact .ct-quick{
  display:flex;
  flex-wrap:wrap;
  gap:8px 20px;
  margin:clamp(18px,2.4vw,26px) 0 0;
  padding:0;
  list-style:none;
  font-size:13px;
  letter-spacing:.04em;
  color:var(--steel);
}
.page-contact .ct-quick li{
  display:flex;
  align-items:center;
  gap:8px;
}
.page-contact .ct-quick li::before{
  content:"";
  display:block;
  flex:0 0 auto;
  width:6px;
  height:6px;
  background:var(--orange);
}

.page-contact .ct-hero-media{
  margin:0;
  overflow:hidden;
  border:1px solid var(--hair);
  background:linear-gradient(150deg,var(--ink-2),var(--night));
}
.page-contact .ct-hero-media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  filter:saturate(.85) contrast(1.05);
}

/* ---------- 三渠道宽幅联系卡 ---------- */
.page-contact .ct-channels{
  padding:clamp(40px,6vw,76px) 0 0;
}
.page-contact .ct-band{
  position:relative;
  overflow:hidden;
  padding:var(--ct-pad);
  border:1px solid var(--line-soft);
  background:var(--ink-2);
}
.page-contact .ct-band-tex{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.16;
  pointer-events:none;
  mix-blend-mode:screen;
}
.page-contact .ct-band-head{
  position:relative;
  display:grid;
  gap:6px;
  margin-bottom:clamp(16px,2.4vw,26px);
  padding-bottom:14px;
  border-bottom:1px solid var(--hair);
}
.page-contact .ct-band-head h2{
  margin:0;
  font-size:var(--fs-sub);
  line-height:1.3;
  letter-spacing:-.01em;
  font-weight:700;
  color:var(--paper);
}
.page-contact .ct-band-head p{
  margin:0;
  font-size:14px;
  line-height:1.7;
  color:var(--steel);
}

.page-contact .ct-channel-grid{
  position:relative;
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(12px,1.8vw,20px);
  margin:0;
  padding:0;
  list-style:none;
}
.page-contact .ct-channel{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:clamp(16px,2vw,24px);
  background:var(--glass-72);
  border:1px solid var(--line-soft);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  transition:transform .18s var(--ease),border-color .18s var(--ease),background-color .18s var(--ease);
}
.page-contact .ct-channel:hover,
.page-contact .ct-channel:focus-within{
  transform:translateY(-4px);
  border-color:var(--orange);
  background:rgba(28,61,52,.90);
}
.page-contact .ct-channel-tag{
  align-self:flex-start;
  padding:3px 8px;
  font-family:var(--font-mono);
  font-size:11px;
  line-height:1.4;
  letter-spacing:.16em;
  color:var(--orange-soft);
  border:1px solid var(--line-soft);
}
.page-contact .ct-channel-label{
  margin:0;
  font-size:13px;
  letter-spacing:.12em;
  color:var(--steel);
}
.page-contact .ct-channel-value{
  margin:0;
  font-family:var(--font-mono);
  font-size:clamp(16px,1.8vw,22px);
  font-weight:700;
  line-height:1.3;
  letter-spacing:-.01em;
  color:var(--paper);
  overflow-wrap:anywhere;
  word-break:break-word;
  user-select:all;
  -webkit-user-select:all;
}
.page-contact .ct-channel--mail .ct-channel-value{
  font-size:clamp(16px,1.7vw,23px);
  color:var(--orange-soft);
}
.page-contact .ct-channel-value--addr{
  font-family:var(--font-sans);
  font-size:clamp(15px,1.4vw,18px);
  line-height:1.55;
  font-weight:700;
  user-select:text;
  -webkit-user-select:text;
}
.page-contact .ct-channel-note{
  margin:0;
  font-size:14px;
  line-height:1.7;
  color:var(--paper-86);
}

/* ---------- 章节公共头 ---------- */
.page-contact .ct-section{
  padding:clamp(48px,7vw,88px) 0 0;
}
.page-contact .ct-sec-head{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:start;
  gap:clamp(12px,2vw,26px);
  padding-bottom:clamp(16px,2vw,24px);
  border-bottom:1px solid var(--line-soft);
}
.page-contact .ct-sec-head .chapter-num{
  font-family:var(--font-mono);
  font-size:clamp(34px,5vw,62px);
  font-weight:700;
  line-height:.9;
  color:var(--paper);
  opacity:.16;
}
.page-contact .ct-sec-title h2{
  margin:0;
  font-size:var(--fs-section);
  line-height:1.15;
  letter-spacing:-.02em;
  font-weight:800;
  color:var(--paper);
}
.page-contact .ct-sec-title p{
  margin:10px 0 0;
  max-width:62ch;
  font-size:var(--fs-body);
  line-height:1.72;
  color:var(--paper-86);
}

/* ---------- 反馈清单 ---------- */
.page-contact .ct-prep-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--ct-gap);
  margin-top:clamp(22px,3vw,34px);
}
.page-contact .ct-prep-main{
  min-width:0;
  display:grid;
  gap:clamp(24px,3vw,34px);
}
.page-contact .ct-prep-block h3,
.page-contact .ct-prep-side h3,
.page-contact .ct-addr-side h3{
  margin:0 0 12px;
  font-size:var(--fs-sub);
  line-height:1.35;
  letter-spacing:-.01em;
  font-weight:700;
  color:var(--paper);
}
.page-contact .ct-checks{
  display:grid;
  gap:2px;
  margin:0;
  padding:0;
  list-style:none;
  border-top:1px solid var(--hair);
}
.page-contact .ct-checks li{ border-bottom:1px solid var(--hair); }
.page-contact .ct-checks label{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:12px 2px;
  font-size:15px;
  line-height:1.6;
  color:var(--paper-86);
  cursor:pointer;
  transition:color .16s var(--ease);
}
.page-contact .ct-checks label:hover{ color:var(--paper); }
.page-contact .ct-checks input{
  -webkit-appearance:none;
  appearance:none;
  flex:0 0 auto;
  display:grid;
  place-content:center;
  width:16px;
  height:16px;
  margin:3px 0 0;
  border:1px solid var(--grass);
  border-radius:0;
  background:transparent;
  cursor:pointer;
  transition:background-color .16s var(--ease),border-color .16s var(--ease);
}
.page-contact .ct-checks input::after{
  content:"";
  width:9px;
  height:5px;
  margin-top:-3px;
  border-left:2px solid var(--ink);
  border-bottom:2px solid var(--ink);
  transform:rotate(-45deg) scale(0);
  transition:transform .14s var(--ease);
}
.page-contact .ct-checks input:hover{ border-color:var(--orange-soft); }
.page-contact .ct-checks input:checked{
  background:var(--orange);
  border-color:var(--orange);
}
.page-contact .ct-checks input:checked::after{ transform:rotate(-45deg) scale(1); }
.page-contact .ct-checks input:focus-visible{
  outline:2px solid var(--orange);
  outline-offset:3px;
}
.page-contact .ct-checks-done{
  display:none;
  margin:12px 0 0;
  padding:10px 14px;
  font-size:14px;
  line-height:1.6;
  color:var(--paper);
  background:rgba(255,106,43,.10);
  border-left:3px solid var(--orange);
}
.page-contact .ct-prep-block:not(:has(input:not(:checked))) .ct-checks-done{
  display:block;
}

.page-contact .ct-prep-side,
.page-contact .ct-addr-side{
  align-self:start;
  padding:var(--ct-pad);
  background:var(--glass-72);
  border:1px solid var(--line-soft);
}
.page-contact .ct-prep-side > p,
.page-contact .ct-addr-side > p{
  margin:0;
  font-size:14px;
  line-height:1.7;
  color:var(--paper-86);
}
.page-contact .ct-side-list{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
  font-size:14px;
  line-height:1.7;
  color:var(--paper-86);
}
.page-contact .ct-side-list li{
  position:relative;
  padding-left:18px;
}
.page-contact .ct-side-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.72em;
  width:8px;
  height:1px;
  background:var(--orange);
}
.page-contact .ct-side-note{
  margin:16px 0 0;
  font-size:13px;
  line-height:1.75;
  color:var(--steel);
}
.page-contact .ct-side-note a{
  color:var(--orange-soft);
  text-decoration:none;
  border-bottom:1px solid var(--line-soft);
  transition:border-color .16s var(--ease);
}
.page-contact .ct-side-note a:hover{ border-bottom-color:var(--orange); }

/* ---------- 回复时段 ---------- */
.page-contact .ct-timeline{
  display:grid;
  gap:0;
  margin:clamp(20px,3vw,30px) 0 0;
  padding:0;
  list-style:none;
}
.page-contact .ct-timeline li{
  display:grid;
  gap:8px;
  padding:clamp(16px,2vw,22px) 0;
  border-bottom:1px solid var(--hair);
}
.page-contact .ct-time{
  padding-top:2px;
  font-family:var(--font-mono);
  font-size:15px;
  font-weight:700;
  letter-spacing:.02em;
  color:var(--orange);
}
.page-contact .ct-timeline p{
  margin:0;
  max-width:72ch;
  font-size:var(--fs-body);
  line-height:1.72;
  color:var(--paper-86);
}
.page-contact .ct-timeline strong{
  font-weight:700;
  color:var(--paper);
}

/* ---------- 地址与备案 ---------- */
.page-contact .ct-addr-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--ct-gap);
}
.page-contact .ct-addr-main{ min-width:0; }
.page-contact .ct-addr-main .chapter-num{
  display:block;
  margin-bottom:10px;
  font-family:var(--font-mono);
  font-size:clamp(30px,4vw,48px);
  font-weight:700;
  line-height:1;
  color:var(--paper);
  opacity:.16;
}
.page-contact .ct-addr-main h2{
  margin:0 0 12px;
  font-size:var(--fs-section);
  line-height:1.15;
  letter-spacing:-.02em;
  font-weight:800;
  color:var(--paper);
}
.page-contact .ct-addr-main > p{
  margin:0 0 20px;
  max-width:58ch;
  font-size:var(--fs-body);
  line-height:1.72;
  color:var(--paper-86);
}
.page-contact .ct-addr-list{
  display:grid;
  gap:0;
  margin:0;
  padding:0;
  border-top:1px solid var(--hair);
}
.page-contact .ct-addr-list > div{
  display:grid;
  gap:4px;
  padding:12px 0;
  border-bottom:1px solid var(--hair);
}
.page-contact .ct-addr-list dt{
  font-size:12px;
  letter-spacing:.16em;
  color:var(--steel);
}
.page-contact .ct-addr-list dd{
  margin:0;
  font-family:var(--font-mono);
  font-size:13px;
  line-height:1.6;
  color:var(--paper);
  overflow-wrap:anywhere;
}
.page-contact .ct-addr-list dd.ct-dd-text{
  font-family:var(--font-sans);
  font-size:15px;
  font-weight:700;
}

/* ---------- 页尾延伸 ---------- */
.page-contact .ct-close{
  padding:clamp(48px,6vw,76px) 0 0;
}
.page-contact .ct-close-inner{
  max-width:78ch;
  margin:0;
  padding-top:clamp(16px,2vw,22px);
  border-top:1px solid var(--line-soft);
  font-size:14px;
  line-height:1.78;
  color:var(--steel);
}
.page-contact .ct-close-inner a{
  color:var(--orange-soft);
  text-decoration:none;
  border-bottom:1px solid var(--line-soft);
  transition:border-color .16s var(--ease);
}
.page-contact .ct-close-inner a:hover{ border-bottom-color:var(--orange); }

/* ---------- 响应式 ---------- */
@media (min-width:560px){
  .page-contact .ct-addr-list > div{
    grid-template-columns:112px minmax(0,1fr);
    gap:16px;
    align-items:baseline;
  }
}

@media (min-width:720px){
  .page-contact .ct-timeline li{
    grid-template-columns:148px minmax(0,1fr);
    gap:24px;
    align-items:start;
  }
}

@media (min-width:820px){
  .page-contact .ct-channel-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (min-width:900px){
  .page-contact .ct-hero-grid{
    grid-template-columns:minmax(0,7fr) minmax(0,4fr);
    gap:clamp(24px,4vw,56px);
  }
}

@media (min-width:940px){
  .page-contact .ct-prep-grid,
  .page-contact .ct-addr-grid{
    gap:clamp(24px,4vw,56px);
  }
  .page-contact .ct-prep-grid{
    grid-template-columns:minmax(0,7fr) minmax(0,4fr);
  }
  .page-contact .ct-addr-grid{
    grid-template-columns:minmax(0,7fr) minmax(0,4fr);
    align-items:start;
  }
}

@media (max-width:420px){
  .page-contact .ct-sec-head{
    grid-template-columns:1fr;
    gap:8px;
  }
  .page-contact .ct-sec-head .chapter-num{
    font-size:30px;
  }
  .page-contact .ct-quick{ font-size:12px; }
}
<<<END>>>
