.page-contact{
  --ct-gap:clamp(14px,2.2vw,24px);
  --ct-panel-pad:clamp(18px,2.6vw,30px);
  overflow-x:hidden;
}

/* ---------- 首屏 ---------- */
.page-contact .ct-hero{
  position:relative;
  padding:clamp(24px,5vw,56px) 0 clamp(30px,5.5vw,68px);
  border-bottom:1px solid var(--line);
  isolation:isolate;
}
.page-contact .ct-hero::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:auto auto -60% 40%;
  width:min(760px,110%);
  height:440px;
  background:radial-gradient(closest-side,rgba(212,175,55,.20),transparent 74%);
  pointer-events:none;
}
.page-contact .ct-hero::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:10% -12% auto auto;
  width:min(520px,90%);
  height:300px;
  background:radial-gradient(closest-side,rgba(255,107,74,.16),transparent 76%);
  pointer-events:none;
}
.page-contact .crumb-sep{
  margin:0 .45em;
  color:var(--dim);
}
.page-contact .ct-hero-title{
  font-family:var(--font-display);
  font-weight:800;
  font-size:clamp(2.1rem,7.6vw,4.35rem);
  line-height:1.03;
  letter-spacing:-.022em;
  margin:.36em 0 .42em;
  max-width:17ch;
}
.page-contact .ct-hero-lead{
  max-width:64ch;
  margin:0;
  color:var(--mist);
  font-size:clamp(.98rem,1.35vw,1.12rem);
  line-height:1.78;
}
.page-contact .ct-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:clamp(20px,3vw,32px);
}

/* ---------- 联系方式 ---------- */
.page-contact .ct-channels-grid{
  gap:var(--ct-gap);
}
.page-contact .ct-cards{
  display:grid;
  gap:var(--ct-gap);
  align-content:start;
}
.page-contact .ct-card{
  display:grid;
  gap:11px;
  padding:var(--ct-panel-pad);
  border-radius:var(--r-md);
  border:1px solid var(--line);
  justify-items:start;
  transition:border-color .25s ease,transform .25s ease,box-shadow .25s ease;
}
.page-contact .ct-card:hover{
  border-color:var(--line-gold);
  transform:translateY(-2px);
  box-shadow:var(--shadow-card);
}
.page-contact .ct-card-head{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  width:100%;
}
.page-contact .ct-card-when{
  font-size:.76rem;
  letter-spacing:.02em;
  color:var(--steel);
}
.page-contact .ct-value{
  margin:0;
  font-size:clamp(1.02rem,2.7vw,1.55rem);
  line-height:1.35;
  color:var(--white);
  overflow-wrap:anywhere;
  word-break:break-word;
}
.page-contact .ct-value--addr{
  font-family:var(--font-body);
  font-weight:600;
  font-size:clamp(.98rem,1.9vw,1.18rem);
  line-height:1.6;
  color:var(--mist);
}
.page-contact .ct-card-hint{
  margin:0;
  font-size:.86rem;
  line-height:1.7;
  color:var(--steel);
  max-width:52ch;
}

/* ---------- 抽象点阵 ---------- */
.page-contact .ct-map{
  padding:var(--ct-panel-pad);
  border-radius:var(--r-md);
  border:1px solid var(--line);
  display:grid;
  gap:16px;
}
.page-contact .ct-map-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.page-contact .ct-map-label{
  font-size:.76rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--steel);
}
.page-contact .ct-dots{
  position:relative;
  height:clamp(160px,26vw,210px);
  border-radius:var(--r-sm);
  border:1px solid var(--line);
  background-color:rgba(6,20,40,.55);
  background-image:radial-gradient(rgba(140,163,184,.42) 1.5px,transparent 1.6px);
  background-size:20px 20px;
  background-position:center;
  -webkit-mask-image:radial-gradient(circle at 50% 50%,#000 0%,#000 58%,transparent 88%);
  mask-image:radial-gradient(circle at 50% 50%,#000 0%,#000 58%,transparent 88%);
  overflow:hidden;
}
.page-contact .ct-node{
  position:absolute;
  width:9px;
  height:9px;
  margin:-4.5px 0 0 -4.5px;
  border-radius:50%;
  background:var(--steel);
  box-shadow:0 0 0 4px rgba(140,163,184,.14);
}
.page-contact .ct-node--gold{
  background:var(--gold);
  box-shadow:0 0 0 5px rgba(212,175,55,.20);
}
.page-contact .ct-node--coral{
  background:var(--coral);
  box-shadow:0 0 0 6px rgba(255,107,74,.22);
}
@media (prefers-reduced-motion:no-preference){
  .page-contact .ct-node--coral{
    animation:ctPulse 2.8s ease-in-out infinite;
  }
}
@keyframes ctPulse{
  0%,100%{transform:scale(1);opacity:1;}
  50%{transform:scale(1.6);opacity:.6;}
}
.page-contact .ct-map-note{
  margin:0;
  font-size:.86rem;
  line-height:1.75;
  color:var(--steel);
}

/* ---------- 反馈指引 ---------- */
.page-contact .ct-feedback-grid{
  gap:var(--ct-gap);
}
.page-contact .tabs{
  width:100%;
}
.page-contact .ct-steps{
  list-style:none;
  counter-reset:ctstep;
  display:grid;
  gap:12px;
  margin:clamp(16px,2.4vw,22px) 0 0;
  padding:0;
}
.page-contact .ct-steps li{
  counter-increment:ctstep;
  position:relative;
  padding:15px 18px 15px clamp(52px,7vw,60px);
  border-radius:var(--r-sm);
  background:var(--glass-soft);
  border:1px solid var(--line);
  font-size:.92rem;
  line-height:1.75;
  color:var(--mist);
  transition:border-color .22s ease,background .22s ease;
}
.page-contact .ct-steps li:hover{
  border-color:var(--line-strong);
}
.page-contact .ct-steps li::before{
  content:counter(ctstep,decimal-leading-zero);
  position:absolute;
  left:18px;
  top:15px;
  font-family:var(--font-mono);
  font-size:.78rem;
  letter-spacing:.05em;
  color:var(--gold);
}
.page-contact .ct-steps strong{
  color:var(--white);
  font-weight:600;
}
.page-contact .ct-feedback-figure{
  display:grid;
  gap:var(--ct-gap);
  align-content:start;
}
.page-contact .figure{
  margin:0;
  display:grid;
  gap:10px;
}
.page-contact .figure-frame{
  border-radius:var(--r-md);
  overflow:hidden;
  border:1px solid var(--line);
  background:var(--ink-card);
}
.page-contact .figure-frame img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}
.page-contact .figure-caption{
  font-size:.78rem;
  line-height:1.6;
  color:var(--dim);
}
.page-contact .ct-tip{
  padding:var(--ct-panel-pad);
  border-radius:var(--r-md);
  border:1px solid var(--line-gold);
  background:linear-gradient(150deg,rgba(212,175,55,.12),rgba(140,163,184,.06));
}
.page-contact .ct-tip-title{
  margin:0 0 8px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:1rem;
  letter-spacing:.01em;
  color:var(--gold-warm);
}
.page-contact .ct-tip p:last-child{
  margin:0;
  font-size:.87rem;
  line-height:1.75;
  color:var(--mist);
}

/* ---------- 服务时间 ---------- */
.page-contact .ct-hours{
  background:linear-gradient(180deg,rgba(6,20,40,.92),rgba(10,30,60,.42));
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.page-contact .ct-hours-grid{
  gap:var(--ct-gap);
  align-items:center;
}
.page-contact .ct-hours-list{
  list-style:none;
  margin:clamp(18px,2.6vw,26px) 0 0;
  padding:0;
  display:grid;
  gap:2px;
}
.page-contact .ct-hours-list li{
  display:grid;
  gap:6px;
  padding:15px 0;
  border-top:1px dashed var(--line);
}
.page-contact .ct-hours-list li:last-child{
  border-bottom:1px dashed var(--line);
}
.page-contact .ct-hours-key{
  font-size:.86rem;
  letter-spacing:.04em;
  color:var(--gold);
}
.page-contact .ct-hours-val{
  font-size:.92rem;
  line-height:1.75;
  color:var(--mist);
}

/* ---------- 合作与建议 ---------- */
.page-contact .ct-collab-card{
  padding:clamp(22px,3.6vw,44px);
  border-radius:var(--r-lg);
  display:grid;
  gap:clamp(18px,2.6vw,26px);
}
.page-contact .ct-collab-copy{
  display:grid;
  gap:12px;
}
.page-contact .ct-collab-copy .section-title{
  margin:0;
}
.page-contact .ct-collab-copy p{
  margin:0;
  max-width:66ch;
  font-size:.95rem;
  line-height:1.8;
  color:var(--mist);
}
.page-contact .ct-collab-list{
  list-style:none;
  margin:6px 0 0;
  padding:0;
  display:grid;
  gap:12px;
}
.page-contact .ct-collab-list li{
  position:relative;
  padding-left:20px;
  font-size:.9rem;
  line-height:1.78;
  color:var(--mist);
}
.page-contact .ct-collab-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.62em;
  width:8px;
  height:8px;
  border-radius:2px;
  background:var(--coral);
  transform:rotate(45deg);
}
.page-contact .ct-collab-list strong{
  color:var(--white);
  font-weight:600;
}
.page-contact .ct-collab-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.page-contact .ct-collab-foot{
  margin:0;
  font-size:.84rem;
  line-height:1.8;
  color:var(--steel);
}
.page-contact .ct-collab-foot a{
  color:var(--gold-warm);
}

/* ---------- 响应式 ---------- */
@media (min-width:760px){
  .page-contact .ct-cards{
    grid-template-columns:1fr;
  }
  .page-contact .ct-card{
    grid-template-columns:1fr;
  }
  .page-contact .ct-hours-list li{
    grid-template-columns:clamp(140px,16vw,190px) 1fr;
    gap:20px;
    align-items:baseline;
  }
  .page-contact .ct-collab-card{
    grid-template-columns:1fr;
  }
}

@media (min-width:1040px){
  .page-contact .ct-hero-title{
    font-size:clamp(3rem,5vw,4.35rem);
  }
  .page-contact .ct-map .ct-dots{
    height:230px;
  }
}

@media (max-width:520px){
  .page-contact .ct-card-head{
    justify-content:flex-start;
  }
  .page-contact .ct-collab-actions .btn{
    flex:1 1 100%;
    text-align:center;
  }
}
<<<END>>>