.page-contact{
  --contact-line: rgba(154,163,168,.42);
  --contact-soft: #4A565A;
  padding-bottom: clamp(48px,7vw,88px);
}

/* ---------- 面包屑与页头 ---------- */
.page-contact .breadcrumb{
  padding-top: clamp(20px,4vw,40px);
  font-size: var(--fs-13);
  color: var(--muted);
}
.page-contact .breadcrumb a{
  color: var(--muted);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.page-contact .breadcrumb a:hover,
.page-contact .breadcrumb a:focus-visible{
  color: var(--green);
  border-bottom-color: var(--orange);
}
.page-contact .crumb-sep{ margin: 0 .5em; color: var(--silver); }
.page-contact .breadcrumb [aria-current="page"]{ color: var(--ink); }

.page-contact .contact-head{
  max-width: 68ch;
  padding: clamp(22px,3.6vw,38px) 0 clamp(28px,4.4vw,52px);
  border-bottom: 1px solid var(--line);
}
.page-contact .contact-head .h-editorial{ margin: 10px 0 0; }
.page-contact .contact-head .lede{
  margin: 18px 0 0;
  color: var(--contact-soft);
}

/* ---------- 章节节奏 ---------- */
.page-contact .contact-routes,
.page-contact .contact-brief,
.page-contact .contact-partner,
.page-contact .contact-region{
  padding-block: clamp(40px,6vw,78px);
}
.page-contact .contact-brief{ background: var(--paper-2); }
.page-contact .section-note{
  margin-top: 12px;
  font-size: var(--fs-14);
  line-height: 1.75;
  color: var(--muted);
}

/* ---------- 渠道 + 响应节奏 ---------- */
.page-contact .routes-grid{
  display: grid;
  gap: clamp(30px,4.4vw,54px);
}
.page-contact .routes-channels,
.page-contact .routes-rhythm{
  position: relative;
  z-index: 1;
  min-width: 0;
}

.page-contact .channel-stack{
  display: grid;
  gap: 16px;
  margin-top: 22px;
}
.page-contact .channel{
  background: var(--paper);
  border-left: 3px solid var(--orange);
  padding: clamp(16px,2.2vw,24px);
  min-width: 0;
  transition: transform var(--dur) var(--ease),
              box-shadow var(--dur) var(--ease),
              border-color var(--dur) var(--ease);
}
.page-contact .channel:hover,
.page-contact .channel:focus-within{
  border-left-color: var(--cyan);
}
.page-contact .channel-label{
  margin: 0;
  font-size: var(--fs-12);
  letter-spacing: .16em;
  color: var(--muted);
}
.page-contact .channel-value{
  margin: 8px 0 0;
  font-family: var(--font-mono);
  font-size: clamp(15px,1.9vw,21px);
  line-height: 1.45;
  letter-spacing: -.01em;
  color: var(--green);
  overflow-wrap: anywhere;
}
.page-contact .channel-desc{
  margin: 10px 0 0;
  font-size: var(--fs-14);
  line-height: 1.75;
  color: var(--contact-soft);
}
.page-contact .channel-list{
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  display: grid;
  gap: 6px;
  font-size: var(--fs-13);
  line-height: 1.65;
  color: var(--muted);
  transition: color var(--dur) var(--ease);
}
.page-contact .channel-list li{
  position: relative;
  padding-left: 16px;
}
.page-contact .channel-list li::before{
  content: "";
  position: absolute;
  left: 0;
  top: .68em;
  width: 8px;
  height: 1px;
  background: var(--silver);
}
.page-contact .channel:hover .channel-list,
.page-contact .channel:focus-within .channel-list{
  color: var(--ink);
}

.page-contact .rhythm{
  list-style: none;
  margin: 22px 0 0;
  padding: 0 0 0 24px;
  border-left: 1px solid var(--line);
}
.page-contact .rhythm-step{
  position: relative;
  padding: 0 0 22px 16px;
  min-width: 0;
}
.page-contact .rhythm-step:last-child{ padding-bottom: 0; }
.page-contact .rhythm-step::before{
  content: "";
  position: absolute;
  left: -30px;
  top: 6px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--paper);
  border: 2px solid var(--green);
  transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.page-contact .rhythm-step:first-child::before{
  background: var(--orange);
  border-color: var(--orange);
}
.page-contact .rhythm-step:hover::before,
.page-contact .rhythm-step:focus-within::before{
  background: var(--cyan);
  border-color: var(--cyan);
}
.page-contact .rhythm-time{
  margin: 0;
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  letter-spacing: .04em;
  color: var(--green);
}
.page-contact .rhythm-title{
  margin: 4px 0 0;
  font-size: var(--fs-16);
  font-weight: 700;
  color: var(--ink);
}
.page-contact .rhythm-text{
  margin: 4px 0 0;
  font-size: var(--fs-14);
  line-height: 1.75;
  color: var(--muted);
}

.page-contact .contact-figure{ margin: 26px 0 0; }
.page-contact .contact-figure img{
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 1;
  object-fit: cover;
  display: block;
}

/* ---------- 纠错与咨询写法 ---------- */
.page-contact .brief-grid{
  display: grid;
  gap: clamp(26px,3.6vw,46px);
}
.page-contact .brief-aside{
  margin: 0;
  padding-top: 14px;
  border-top: 2px solid var(--orange);
  font-family: var(--font-serif);
  font-size: var(--fs-16);
  line-height: 1.8;
  color: var(--green);
}
.page-contact .brief-main{ min-width: 0; }
.page-contact .brief-list{
  list-style: none;
  margin: 22px 0 0;
  padding: 0;
  display: grid;
  gap: 2px;
}
.page-contact .brief-item{
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  column-gap: 18px;
  padding: 16px 0;
  border-top: 1px solid var(--contact-line);
}
.page-contact .brief-num{
  grid-row: 1 / span 2;
  font-family: var(--font-mono);
  font-size: var(--fs-20);
  line-height: 1.3;
  color: var(--orange);
}
.page-contact .brief-title{
  margin: 0;
  font-size: var(--fs-16);
  font-weight: 700;
  color: var(--ink);
}
.page-contact .brief-item p{
  margin: 6px 0 0;
  font-size: var(--fs-14);
  line-height: 1.75;
  color: var(--contact-soft);
}

.page-contact .brief-side{
  min-width: 0;
  padding: clamp(18px,2.4vw,26px);
  background: var(--paper);
  border-top: 3px solid var(--green);
}
.page-contact .brief-side-label{
  margin: 0;
  font-size: var(--fs-12);
  letter-spacing: .16em;
  color: var(--muted);
}
.page-contact .brief-side-list{
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  display: grid;
  gap: 12px;
}
.page-contact .brief-side-list li{
  display: grid;
  gap: 3px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--contact-line);
}
.page-contact .brief-side-list li:last-child{
  padding-bottom: 0;
  border-bottom: 0;
}
.page-contact .brief-side-name{
  font-size: var(--fs-14);
  font-weight: 700;
  color: var(--green);
}
.page-contact .brief-side-desc{
  font-size: var(--fs-13);
  line-height: 1.7;
  color: var(--muted);
}
.page-contact .brief-side .link-more{
  display: inline-block;
  margin-top: 18px;
}

/* ---------- 商务与内容合作 ---------- */
.page-contact .partner-head{ max-width: 62ch; }
.page-contact .partner-grid{
  display: grid;
  gap: 16px;
  margin-top: 30px;
}
.page-contact .partner-card{
  min-width: 0;
  padding: clamp(18px,2.4vw,28px);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.page-contact .partner-card--paper{
  background: var(--paper);
  border-top: 3px solid var(--orange);
  color: var(--ink);
}
.page-contact .partner-card--night{
  background: var(--green-deep);
  border-top: 3px solid var(--cyan);
  color: var(--paper);
}
.page-contact .partner-card:hover,
.page-contact .partner-card:focus-within{
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(20,24,26,.16);
}
.page-contact .partner-tag{
  margin: 0;
  font-family: var(--font-mono);
  font-size: var(--fs-12);
  letter-spacing: .1em;
}
.page-contact .partner-card--paper .partner-tag{ color: var(--muted); }
.page-contact .partner-card--night .partner-tag{ color: var(--cyan); }
.page-contact .partner-name{
  margin: 10px 0 0;
  font-size: var(--fs-20);
  line-height: 1.45;
  font-weight: 700;
}
.page-contact .partner-card p:not(.partner-tag){
  margin: 12px 0 0;
  font-size: var(--fs-14);
  line-height: 1.8;
}
.page-contact .partner-card--paper p:not(.partner-tag){ color: var(--contact-soft); }
.page-contact .partner-card--night p:not(.partner-tag){ color: var(--cyan-soft); }

.page-contact .partner-foot{
  display: grid;
  gap: 22px;
  margin-top: 30px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
}
.page-contact .partner-foot-label{
  margin: 0;
  font-size: var(--fs-12);
  letter-spacing: .14em;
  color: var(--muted);
}
.page-contact .module-chips{
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.page-contact .needs-list{
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
  display: grid;
  gap: 8px;
  font-size: var(--fs-14);
  line-height: 1.7;
  color: var(--contact-soft);
}
.page-contact .needs-list li{
  position: relative;
  padding-left: 18px;
}
.page-contact .needs-list li::before{
  content: "";
  position: absolute;
  left: 0;
  top: .72em;
  width: 10px;
  height: 1px;
  background: var(--orange);
}

/* ---------- 服务地区 ---------- */
.page-contact .region-grid{
  display: grid;
  gap: clamp(26px,3.6vw,46px);
  align-items: start;
}
.page-contact .region-text{ min-width: 0; }
.page-contact .region-text > p{
  margin: 16px 0 0;
  font-size: var(--fs-16);
  line-height: 1.85;
  color: var(--contact-soft);
}
.page-contact .region-stats{
  list-style: none;
  margin: 26px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 16px;
}
.page-contact .region-stats li{
  min-width: 0;
  padding-left: 12px;
  border-left: 2px solid var(--cyan);
}
.page-contact .region-stats .stat-num{
  display: block;
  font-family: var(--font-mono);
  font-size: clamp(24px,4.4vw,34px);
  line-height: 1.1;
  color: var(--green);
  font-variant-numeric: tabular-nums;
}
.page-contact .region-stats .stat-label{
  display: block;
  margin-top: 6px;
  font-size: var(--fs-13);
  line-height: 1.6;
  color: var(--muted);
}
.page-contact .region-text .link-more{
  display: inline-block;
  margin-top: 26px;
}
.page-contact .region-figure{ margin: 0; }
.page-contact .region-figure img{
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
}

/* ---------- 延伸入口 ---------- */
.page-contact .contact-more{
  padding-top: clamp(30px,4.4vw,54px);
  border-top: 1px solid var(--line);
}
.page-contact .contact-more-label{
  margin: 0;
  font-size: var(--fs-12);
  letter-spacing: .16em;
  color: var(--muted);
}
.page-contact .contact-more-links{
  display: grid;
  gap: 12px;
  margin-top: 16px;
}

/* ---------- 响应式 ---------- */
@media (min-width: 620px){
  .page-contact .contact-more-links{
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 20px;
  }
  .page-contact .partner-foot{
    grid-template-columns: minmax(0,1.3fr) minmax(0,1fr);
  }
  .page-contact .channel:nth-child(2){ margin-left: clamp(10px,2.4vw,26px); }
  .page-contact .channel:nth-child(3){ margin-left: clamp(4px,1.2vw,12px); }
}

@media (min-width: 900px){
  .page-contact .brief-grid{
    grid-template-columns: minmax(0,2fr) minmax(0,5fr) minmax(0,5fr);
  }
  .page-contact .partner-grid{
    grid-template-columns: minmax(0,1.2fr) minmax(0,.92fr) minmax(0,1fr);
    align-items: start;
  }
  .page-contact .partner-card:nth-child(2){ margin-top: 30px; }
  .page-contact .partner-card:nth-child(3){ margin-top: 12px; }
  .page-contact .region-grid{
    grid-template-columns: minmax(0,5fr) minmax(0,7fr);
  }
}

@media (min-width: 980px){
  .page-contact .routes-grid{
    grid-template-columns: minmax(0,7fr) minmax(0,5fr);
    position: relative;
  }
  .page-contact .routes-grid::after{
    content: "";
    position: absolute;
    left: 40%;
    right: 4%;
    top: 34%;
    height: 1px;
    background: linear-gradient(90deg, rgba(154,163,168,0), var(--line-strong), rgba(154,163,168,0));
    transform: rotate(-7deg);
    transform-origin: left center;
    pointer-events: none;
    z-index: 0;
  }
  .page-contact .region-stats{
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 20px 24px;
  }
}

@media (max-width: 480px){
  .page-contact .channel:nth-child(2),
  .page-contact .channel:nth-child(3){ margin-left: 0; }
  .page-contact .region-stats{ grid-template-columns: minmax(0,1fr); }
  .page-contact .brief-item{ column-gap: 12px; }
}
<<<END>>>
