.page-contact{
  --ct-line:#16332C;
  --ct-line-strong:#1FA98F;
  --ct-panel:#0B1D19;
  --ct-ink:#05100E;
  --ct-gold:#F2B233;
  --ct-cyan:#6FF0D4;
  --ct-mist:#93A9A2;
  --ct-warn:#FF7A4D;
  color:var(--white);
  padding:clamp(20px,4vw,44px) 0 clamp(56px,9vw,112px);
  background:
    radial-gradient(1000px 480px at 92% -6%, rgba(111,240,212,.08), transparent 70%),
    radial-gradient(820px 420px at 0% 16%, rgba(242,178,51,.05), transparent 72%);
}

.page-contact .breadcrumb{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.1em;
}

/* ---------- 首屏 ---------- */
.ct-hero{
  position:relative;
  margin-top:18px;
  padding:clamp(22px,4vw,44px) 0 clamp(26px,4vw,46px);
  border-top:1px solid var(--ct-line);
  border-bottom:1px solid var(--ct-line);
  background-image:
    linear-gradient(to right, rgba(22,51,44,.5) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(22,51,44,.5) 1px, transparent 1px);
  background-size:88px 88px;
  background-position:-1px -1px;
}

.ct-kicker{
  margin:0 0 18px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.24em;
  color:var(--ct-cyan);
}

.ct-title{
  margin:0 0 22px;
  max-width:19ch;
  font-family:var(--font-display);
  font-weight:900;
  font-size:clamp(30px,5.4vw,60px);
  line-height:1.08;
  letter-spacing:-.02em;
  color:var(--white);
}

.ct-title em{
  font-style:normal;
  color:var(--ct-cyan);
}

.ct-lead{
  margin:0;
  max-width:62ch;
  font-size:16px;
  line-height:1.9;
  color:var(--ct-mist);
}

.ct-facts{
  list-style:none;
  margin:clamp(24px,4vw,36px) 0 0;
  padding:0;
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  background:var(--ct-line);
  border:1px solid var(--ct-line);
}

.ct-fact{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:14px 16px;
  background:var(--ct-ink);
  min-width:0;
}

.ct-fact-num{
  font-family:var(--font-mono);
  font-size:15px;
  letter-spacing:.04em;
  color:var(--ct-cyan);
}

.ct-fact-label{
  font-size:11px;
  letter-spacing:.16em;
  color:var(--ct-mist);
}

/* ---------- 章节骨架 ---------- */
.ct-section{
  margin-top:clamp(46px,8vw,92px);
  scroll-margin-top:88px;
}

.page-contact .section-head{
  margin-bottom:clamp(18px,2.6vw,30px);
}

.page-contact .section-lead{
  max-width:58ch;
}

/* ---------- 01 渠道 ---------- */
.ct-channels{
  display:grid;
  gap:clamp(20px,3vw,32px);
}

.ct-card-list{
  display:grid;
  gap:14px;
  min-width:0;
}

.ct-card{
  background:var(--ct-panel);
  border:1px solid var(--ct-line);
  padding:clamp(18px,2.6vw,26px);
  min-width:0;
  transition:border-color .2s ease;
}

.ct-card:hover{
  border-color:var(--ct-line-strong);
}

.ct-card--mail{
  border-left:3px solid var(--ct-gold);
  padding-block:clamp(22px,3.2vw,36px);
  background:linear-gradient(160deg, rgba(242,178,51,.09), transparent 62%), var(--ct-panel);
}

.ct-card--phone{
  border-left:2px solid var(--ct-cyan);
  margin-left:clamp(0px,2vw,26px);
}

.ct-card--coop{
  border-left:1px solid var(--ct-line);
  background:linear-gradient(165deg, rgba(31,169,143,.1), transparent 68%), var(--ct-panel);
}

.ct-card-tag{
  margin:0 0 10px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.2em;
  color:var(--ct-mist);
  text-transform:uppercase;
}

.ct-card--mail .ct-card-tag{color:var(--ct-gold);}
.ct-card--phone .ct-card-tag{color:var(--ct-cyan);}

.ct-card-title{
  margin:0 0 10px;
  font-size:clamp(19px,2.2vw,24px);
  font-weight:800;
  letter-spacing:-.01em;
  color:var(--white);
}

.ct-card-value{
  margin:0 0 14px;
  font-family:var(--font-mono);
  font-size:clamp(15px,1.7vw,19px);
  color:var(--white);
  overflow-wrap:anywhere;
  user-select:all;
  padding-bottom:8px;
  border-bottom:1px dashed var(--ct-line-strong);
}

.ct-card-desc{
  margin:0;
  font-size:15px;
  line-height:1.85;
  color:var(--ct-mist);
}

.ct-card-note{
  margin:16px 0 0;
  padding-top:12px;
  border-top:1px solid var(--ct-line);
  font-size:12.5px;
  line-height:1.7;
  color:var(--ct-mist);
}

.ct-channel-aside{
  display:grid;
  gap:16px;
  align-content:start;
  min-width:0;
}

.ct-media{
  margin:0;
  border:1px solid var(--ct-line);
  background:var(--ct-ink);
  overflow:hidden;
}

.ct-media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
  filter:saturate(.65) contrast(1.06) brightness(.9);
}

.ct-media .media-caption{
  padding:10px 14px;
  font-size:12px;
  line-height:1.7;
  color:var(--ct-cyan);
  letter-spacing:.04em;
  border-top:1px solid var(--ct-line);
}

.ct-peak{
  border:1px solid var(--ct-line);
  border-left:2px solid var(--ct-gold);
  background:var(--ct-panel);
  padding:clamp(16px,2.4vw,22px);
}

.ct-peak-title{
  margin:0 0 8px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.2em;
  color:var(--ct-gold);
}

.ct-peak-text{
  margin:0;
  font-size:14px;
  line-height:1.8;
  color:var(--ct-mist);
}

/* ---------- 02 准备清单 ---------- */
.ct-prepare{
  display:grid;
  gap:clamp(20px,3vw,32px);
}

.ct-steps{
  list-style:none;
  margin:0;
  padding:0;
  min-width:0;
}

.ct-step{
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  gap:14px;
  padding:18px 0;
  border-top:1px solid var(--ct-line);
}

.ct-step:first-child{
  border-top:1px solid var(--ct-line-strong);
}

.ct-step-num{
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.1em;
  color:var(--ct-cyan);
  padding-top:3px;
}

.ct-step h3{
  margin:0 0 8px;
  font-size:clamp(16px,1.8vw,18px);
  font-weight:700;
  color:var(--white);
}

.ct-step p{
  margin:0;
  font-size:15px;
  line-height:1.85;
  color:var(--ct-mist);
}

.ct-note-panel{
  position:relative;
  align-self:start;
  background:var(--ct-panel);
  border:1px solid var(--ct-line);
  padding:clamp(20px,3vw,28px);
  min-width:0;
}

.ct-note-panel::before,
.ct-note-panel::after{
  content:"";
  position:absolute;
  width:12px;
  height:12px;
  border:1px solid var(--ct-cyan);
  opacity:.8;
}

.ct-note-panel::before{
  top:-1px;
  left:-1px;
  border-right:0;
  border-bottom:0;
}

.ct-note-panel::after{
  bottom:-1px;
  right:-1px;
  border-left:0;
  border-top:0;
}

.ct-note-title{
  margin:0 0 12px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.2em;
  color:var(--ct-cyan);
}

.ct-note-text{
  margin:0;
  font-size:14.5px;
  line-height:1.85;
  color:var(--ct-mist);
}

.ct-note-link{
  margin:18px 0 0;
  font-size:14px;
}

.ct-note-link a{
  color:var(--ct-white, var(--white));
  text-decoration:none;
  border-bottom:1px solid var(--ct-gold);
  padding-bottom:2px;
}

.ct-note-link a:hover,
.ct-note-link a:focus-visible{
  color:var(--ct-gold);
}

/* ---------- 03 回复节奏 ---------- */
.ct-timeline{
  border-top:1px solid var(--ct-line);
}

.ct-row{
  display:grid;
  gap:8px;
  padding:20px 0;
  border-bottom:1px solid var(--ct-line);
}

.ct-row-time{
  margin:0;
  font-family:var(--font-mono);
  font-size:13.5px;
  letter-spacing:.06em;
  color:var(--ct-cyan);
}

.ct-row--warn .ct-row-time{
  color:var(--ct-warn);
}

.ct-row-body h3{
  margin:0 0 8px;
  font-size:clamp(16px,1.8vw,18px);
  font-weight:700;
  color:var(--white);
}

.ct-row-body p{
  margin:0;
  max-width:64ch;
  font-size:15px;
  line-height:1.85;
  color:var(--ct-mist);
}

/* ---------- 04 合作 ---------- */
.ct-exchange{
  display:grid;
  gap:1px;
  background:var(--ct-line);
  border:1px solid var(--ct-line);
}

.ct-exchange-col{
  background:var(--ct-panel);
  padding:clamp(20px,3vw,30px);
  min-width:0;
}

.ct-exchange-col--alt{
  background:linear-gradient(170deg, rgba(111,240,212,.09), transparent 70%), var(--ct-panel);
}

.ct-exchange-col h3{
  margin:0 0 18px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.16em;
  color:var(--ct-cyan);
}

.ct-exchange-col ul{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}

.ct-exchange-col li{
  position:relative;
  padding-left:18px;
  font-size:14.5px;
  line-height:1.8;
  color:var(--ct-mist);
}

.ct-exchange-col li::before{
  content:"";
  position:absolute;
  left:0;
  top:.78em;
  width:9px;
  height:1px;
  background:var(--ct-cyan);
}

.ct-exchange-foot{
  margin:18px 0 0;
  font-size:14px;
  line-height:1.8;
  color:var(--ct-mist);
}

.ct-exchange-foot a{
  color:var(--white);
  text-decoration:none;
  border-bottom:1px solid var(--ct-line-strong);
  padding-bottom:2px;
}

.ct-exchange-foot a:hover,
.ct-exchange-foot a:focus-visible{
  color:var(--ct-cyan);
}

/* ---------- 05 纠错 ---------- */
.ct-correct{
  display:grid;
  gap:1px;
  background:var(--ct-line);
  border:1px solid var(--ct-line);
  border-left:3px solid var(--ct-warn);
}

.ct-correct-main{
  background:var(--ct-panel);
  padding:clamp(20px,3vw,30px);
  min-width:0;
}

.ct-correct-main h3{
  margin:0 0 14px;
  font-size:clamp(17px,2vw,20px);
  font-weight:800;
  color:var(--white);
}

.ct-correct-format{
  display:inline-block;
  margin:0 0 16px;
  padding:8px 12px;
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.05em;
  color:var(--ct-gold);
  background:rgba(242,178,51,.1);
  border:1px dashed rgba(242,178,51,.5);
}

.ct-correct-main p{
  margin:0 0 12px;
  max-width:62ch;
  font-size:15px;
  line-height:1.85;
  color:var(--ct-mist);
}

.ct-correct-main p:last-child{
  margin-bottom:0;
}

.ct-correct-side{
  background:var(--ct-ink);
  padding:clamp(20px,3vw,30px);
  min-width:0;
}

.ct-correct-label{
  margin:0 0 10px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.2em;
  color:var(--ct-mist);
}

.ct-correct-mail{
  margin:0 0 14px;
  font-family:var(--font-mono);
  font-size:clamp(14px,1.7vw,17px);
  color:var(--ct-cyan);
  overflow-wrap:anywhere;
  user-select:all;
}

.ct-correct-hint{
  margin:0;
  font-size:12.5px;
  line-height:1.7;
  color:var(--ct-mist);
}

/* ---------- 06 地址 ---------- */
.ct-address{
  display:grid;
  gap:clamp(22px,3vw,36px);
}

.ct-address-label{
  margin:0 0 12px;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.2em;
  color:var(--ct-cyan);
}

.ct-address-line{
  margin:0 0 22px;
  font-size:clamp(18px,2.4vw,24px);
  font-weight:700;
  line-height:1.6;
  letter-spacing:-.01em;
  color:var(--white);
}

.ct-address-meta{
  margin:0;
  display:grid;
  gap:1px;
  background:var(--ct-line);
  border:1px solid var(--ct-line);
}

.ct-address-meta > div{
  display:grid;
  gap:6px;
  padding:14px 16px;
  background:var(--ct-panel);
}

.ct-address-meta dt{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.18em;
  color:var(--ct-mist);
}

.ct-address-meta dd{
  margin:0;
  font-size:14.5px;
  line-height:1.75;
  color:var(--white);
}

.ct-address-note{
  margin:16px 0 0;
  font-size:13px;
  line-height:1.75;
  color:var(--ct-mist);
}

.ct-map{
  position:relative;
  margin:0;
  border:1px solid var(--ct-line);
  background:var(--ct-ink);
  overflow:hidden;
  min-width:0;
}

.ct-map img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3 / 2;
  object-fit:cover;
  opacity:.32;
  filter:grayscale(1) contrast(1.1);
}

.ct-map-grid{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(to right, rgba(31,169,143,.28) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(31,169,143,.28) 1px, transparent 1px);
  background-size:44px 44px;
  pointer-events:none;
}

.ct-map-grid::before,
.ct-map-grid::after{
  content:"";
  position:absolute;
  background:linear-gradient(to bottom, transparent, var(--ct-cyan), transparent);
  opacity:.75;
}

.ct-map-grid::before{
  left:50%;
  top:0;
  bottom:0;
  width:1px;
}

.ct-map-grid::after{
  top:50%;
  left:0;
  right:0;
  height:1px;
  background:linear-gradient(to right, transparent, var(--ct-cyan), transparent);
}

.ct-map-pin{
  position:absolute;
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.14em;
  color:var(--ct-cyan);
  padding-left:14px;
}

.ct-map-pin::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:7px;
  height:7px;
  margin-top:-3.5px;
  border:1px solid var(--ct-cyan);
  background:rgba(111,240,212,.25);
}

.ct-map-pin--a{
  left:50%;
  top:50%;
  transform:translate(-6px,-24px);
  color:var(--ct-gold);
}

.ct-map-pin--a::before{
  border-color:var(--ct-gold);
  background:rgba(242,178,51,.3);
}

.ct-map-pin--b{
  left:8%;
  bottom:14%;
}

.ct-map-pin--c{
  right:8%;
  top:14%;
  color:var(--ct-mist);
}

.ct-map-pin--c::before{
  border-color:var(--ct-mist);
  background:transparent;
}

.ct-map .media-caption{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:10px 14px;
  font-size:11.5px;
  line-height:1.6;
  letter-spacing:.04em;
  color:var(--ct-mist);
  background:linear-gradient(to top, rgba(5,16,14,.94), rgba(5,16,14,0));
}

/* ---------- 尾部延伸 ---------- */
.ct-next{
  margin-top:clamp(46px,8vw,88px);
  padding-top:clamp(24px,3vw,36px);
  border-top:1px solid var(--ct-line-strong);
}

.ct-next-title{
  margin:0 0 18px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.16em;
  color:var(--ct-cyan);
}

.ct-next-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:1px;
  background:var(--ct-line);
  border:1px solid var(--ct-line);
}

.ct-next-list li{
  background:var(--ct-panel);
}

.ct-next-list a{
  display:block;
  padding:16px 18px;
  font-size:14.5px;
  line-height:1.7;
  color:var(--white);
  text-decoration:none;
  border-left:2px solid transparent;
  transition:border-color .2s ease, background .2s ease;
}

.ct-next-list a:hover,
.ct-next-list a:focus-visible{
  border-left-color:var(--ct-gold);
  background:rgba(111,240,212,.06);
  color:var(--ct-cyan);
}

/* ---------- 媒体查询 ---------- */
@media (min-width:700px){
  .ct-facts{
    grid-template-columns:repeat(3, minmax(0,1fr));
  }

  .ct-address-meta > div{
    grid-template-columns:110px minmax(0,1fr);
    gap:16px;
    align-items:baseline;
  }
}

@media (min-width:760px){
  .ct-row{
    grid-template-columns:200px minmax(0,1fr);
    gap:24px;
    align-items:start;
    padding:22px 0;
  }

  .ct-correct{
    grid-template-columns:minmax(0,7fr) minmax(0,4fr);
  }
}

@media (min-width:900px){
  .ct-prepare{
    grid-template-columns:minmax(0,7fr) minmax(0,4fr);
    align-items:start;
  }

  .ct-exchange{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  }

  .ct-address{
    grid-template-columns:minmax(0,6fr) minmax(0,6fr);
    align-items:start;
  }
}

@media (min-width:960px){
  .ct-channels{
    grid-template-columns:minmax(0,7fr) minmax(0,5fr);
    align-items:start;
  }

  .ct-channel-aside{
    position:sticky;
    top:88px;
  }
}

@media (prefers-reduced-motion:reduce){
  .ct-card,
  .ct-next-list a{
    transition:none;
  }
}
<<<END>>>

.page-contact {
  --ct-white: currentColor;
}
