.page-contact{
  --pc-card-bg:#FBF8F1;
  --pc-dash:rgba(192,138,46,.42);
  background:var(--paper);
  color:var(--on-light);
  overflow-x:hidden;
}
.page-contact img{
  display:block;
  max-width:100%;
  height:auto;
}
.page-contact .wrap{
  padding-left:var(--gutter);
  padding-right:var(--gutter);
}

/* ---------- 首屏 ---------- */
.page-contact .pc-hero{
  position:relative;
  background:
    radial-gradient(120% 150% at 6% -10%, rgba(44,66,87,.62) 0%, rgba(14,27,44,0) 62%),
    var(--ink);
  color:var(--on-dark);
  padding:clamp(1.25rem,3.5vw,2rem) 0 clamp(2.5rem,6vw,4.5rem);
  border-bottom:1px solid var(--steel);
}
.page-contact .pc-hero::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  height:2px;
  width:min(38%,420px);
  background:var(--copper);
}
.page-contact .pc-hero__grid{
  display:grid;
  gap:1.5rem;
  margin-top:clamp(1.5rem,4vw,2.75rem);
}
.page-contact .pc-hero__title{
  margin:.8rem 0 0;
  font-size:var(--fs-hero);
  font-weight:900;
  line-height:1.04;
  letter-spacing:-.02em;
}
.page-contact .pc-hero__lead{
  margin:0;
  font-size:var(--fs-body);
  line-height:1.85;
  color:var(--on-dark-dim);
}
.page-contact .pc-hero__meta{
  margin:1.25rem 0 0;
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.45rem .75rem;
  border:1px solid var(--steel);
  font-family:var(--font-mono);
  font-size:var(--fs-mono);
  letter-spacing:.08em;
  color:var(--copper-light);
}
.page-contact .pc-hero__meta::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--signal);
}

/* ---------- 三种方式 ---------- */
.page-contact .pc-stage{
  padding:clamp(2.25rem,5.5vw,4.25rem) 0 clamp(2rem,5vw,3.5rem);
  background:var(--paper);
}
.page-contact .pc-stage__grid{
  display:grid;
  gap:1.25rem;
  grid-template-columns:minmax(0,1fr);
}
.page-contact .pc-card{
  grid-column:1 / -1;
  background:var(--ink);
  color:var(--on-dark);
  border:1px solid var(--copper);
  padding:clamp(1.4rem,3.2vw,2.25rem);
  box-shadow:8px 8px 0 rgba(192,138,46,.15);
  display:flex;
  flex-direction:column;
  gap:1rem;
}
.page-contact .pc-card__title{
  margin:0 0 .35rem;
  font-size:var(--fs-h3);
  font-weight:900;
  letter-spacing:-.01em;
  line-height:1.22;
}
.page-contact .pc-channel{
  border-top:1px dashed var(--pc-dash);
  padding-top:1rem;
  display:flex;
  flex-direction:column;
  gap:.4rem;
}
.page-contact .pc-channel__key{
  font-family:var(--font-mono);
  font-size:var(--fs-mono);
  letter-spacing:.08em;
  color:var(--copper-light);
}
.page-contact .pc-channel__val{
  font-family:var(--font-mono);
  font-size:clamp(1rem,2.7vw,1.35rem);
  font-weight:500;
  letter-spacing:.01em;
  color:var(--paper);
  text-decoration:none;
  word-break:break-word;
  border-bottom:1px solid transparent;
  transition:color .2s var(--ease),border-color .2s var(--ease);
  width:fit-content;
  max-width:100%;
}
.page-contact a.pc-channel__val:hover,
.page-contact a.pc-channel__val:focus-visible{
  color:var(--copper-light);
  border-bottom-color:var(--copper-light);
}
.page-contact a.pc-channel__val:focus-visible{
  outline:2px solid var(--copper-light);
  outline-offset:3px;
}
.page-contact .pc-channel__val--addr{
  font-family:var(--font-sans);
  font-size:var(--fs-body);
  line-height:1.7;
  font-weight:500;
  letter-spacing:0;
}
.page-contact .pc-channel__use{
  margin:0;
  font-size:var(--fs-sm);
  line-height:1.75;
  color:var(--on-dark-dim);
}

.page-contact .pc-stage__figure{
  margin:0;
  border:1px solid var(--paper-2);
  box-shadow:8px 8px 0 rgba(192,138,46,.16);
  background:var(--ink-2);
  overflow:hidden;
  aspect-ratio:3 / 4;
}
.page-contact .pc-stage__figure img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .4s var(--ease);
}
.page-contact .pc-stage__figure:hover img{
  transform:scale(1.03);
}

.page-contact .pc-prep{
  background:var(--pc-card-bg);
  border:1px solid var(--paper-2);
  border-top:3px solid var(--copper);
  padding:clamp(1.25rem,3vw,2rem);
  box-shadow:8px 8px 0 var(--paper-2);
}
.page-contact .pc-prep__title{
  margin:.7rem 0 0;
  font-size:var(--fs-h4);
  font-weight:900;
  line-height:1.35;
  letter-spacing:-.01em;
}
.page-contact .pc-check{
  list-style:none;
  margin:1.35rem 0 0;
  padding:0;
  display:grid;
  gap:.9rem;
}
.page-contact .pc-check__item{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:.75rem;
  align-items:start;
  border-top:1px solid var(--paper-2);
  padding-top:.9rem;
}
.page-contact .pc-check__item:first-child{
  border-top:0;
  padding-top:0;
}
.page-contact .pc-check__box{
  appearance:none;
  -webkit-appearance:none;
  width:20px;
  height:20px;
  margin:.15rem 0 0;
  border:1px solid var(--stone);
  background:transparent;
  position:relative;
  cursor:pointer;
  flex:none;
  transition:background .18s var(--ease),border-color .18s var(--ease);
}
.page-contact .pc-check__box:checked{
  background:var(--copper);
  border-color:var(--copper);
}
.page-contact .pc-check__box:checked::after{
  content:"";
  position:absolute;
  left:6px;
  top:2px;
  width:6px;
  height:11px;
  border:2px solid var(--ink);
  border-top:0;
  border-left:0;
  transform:rotate(42deg);
}
.page-contact .pc-check__box:focus-visible{
  outline:2px solid var(--copper-light);
  outline-offset:2px;
}
.page-contact .pc-check__label{
  display:grid;
  gap:.28rem;
  cursor:pointer;
}
.page-contact .pc-check__no{
  font-family:var(--font-mono);
  font-size:var(--fs-mono);
  letter-spacing:.08em;
  color:var(--copper);
}
.page-contact .pc-check__name{
  font-size:var(--fs-body);
  font-weight:700;
  line-height:1.5;
}
.page-contact .pc-check__desc{
  font-size:var(--fs-sm);
  line-height:1.75;
  color:var(--stone);
}
.page-contact .pc-check__box:checked ~ .pc-check__label .pc-check__name{
  color:var(--stone);
}
.page-contact .pc-prep__note{
  margin:1.35rem 0 0;
  padding-top:1rem;
  border-top:1px solid var(--paper-2);
  font-size:var(--fs-sm);
  line-height:1.8;
  color:var(--steel);
}

.page-contact .pc-response{
  margin-top:1.5rem;
  display:grid;
  gap:.45rem;
  padding:1rem 1.25rem;
  background:var(--pc-card-bg);
  border-left:4px solid var(--copper);
  border-top:1px solid var(--paper-2);
  border-right:1px solid var(--paper-2);
  border-bottom:1px solid var(--paper-2);
}
.page-contact .pc-response__text{
  margin:0;
  font-size:var(--fs-sm);
  line-height:1.8;
  color:var(--steel);
}

/* ---------- 区域服务 ---------- */
.page-contact .pc-network{
  background:var(--ink-2);
  color:var(--on-dark);
  border-top:1px solid var(--steel);
  border-bottom:1px solid var(--steel);
  padding:clamp(2.5rem,6vw,4.5rem) 0;
}
.page-contact .pc-network__grid{
  display:grid;
  gap:2rem;
  grid-template-columns:minmax(0,1fr);
}
.page-contact .pc-network__title{
  margin:.75rem 0 0;
  font-size:var(--fs-h2);
  font-weight:900;
  line-height:1.12;
  letter-spacing:-.02em;
}
.page-contact .pc-network__lead{
  margin:1rem 0 0;
  font-size:var(--fs-body);
  line-height:1.85;
  color:var(--on-dark-dim);
  max-width:56ch;
}
.page-contact .pc-map{
  position:relative;
  margin:1.75rem 0 0;
  border:1px solid var(--steel);
  background:var(--ink);
  overflow:visible;
}
.page-contact .pc-map img{
  width:100%;
  height:auto;
}
.page-contact .pc-map__node{
  position:absolute;
  width:13px;
  height:13px;
  border-radius:50%;
  background:var(--copper);
  box-shadow:0 0 0 6px rgba(192,138,46,.2);
  cursor:help;
}
.page-contact .pc-map__node:nth-of-type(1){ left:16%; top:34%; }
.page-contact .pc-map__node:nth-of-type(2){ left:38%; top:62%; }
.page-contact .pc-map__node:nth-of-type(3){ left:57%; top:28%; }
.page-contact .pc-map__node:nth-of-type(4){ left:73%; top:58%; }
.page-contact .pc-map__node:nth-of-type(5){ left:87%; top:38%; }
.page-contact .pc-map__tip{
  position:absolute;
  left:50%;
  bottom:calc(100% + 12px);
  transform:translate(-50%,6px);
  white-space:nowrap;
  padding:.3rem .55rem;
  background:var(--paper);
  color:var(--on-light);
  font-family:var(--font-mono);
  font-size:var(--fs-mono);
  letter-spacing:.06em;
  border-left:3px solid var(--copper);
  opacity:0;
  pointer-events:none;
  transition:opacity .2s var(--ease),transform .2s var(--ease);
}
.page-contact .pc-map__node:hover .pc-map__tip,
.page-contact .pc-map__node:focus-within .pc-map__tip{
  opacity:1;
  transform:translate(-50%,0);
}

.page-contact .pc-network__side{
  display:grid;
  gap:1.25rem;
  align-content:start;
}
.page-contact .pc-when{
  border:1px solid var(--steel);
  background:rgba(14,27,44,.55);
  padding:1.1rem 1.2rem 1.25rem;
}
.page-contact .pc-when .tag{
  display:inline-block;
  margin-bottom:.75rem;
}
.page-contact .pc-when__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.7rem;
}
.page-contact .pc-when__list li{
  position:relative;
  padding-left:1.1rem;
  font-size:var(--fs-sm);
  line-height:1.78;
  color:var(--on-dark-dim);
}
.page-contact .pc-when__list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.68em;
  width:6px;
  height:1px;
  background:var(--copper);
}
.page-contact .pc-network__note{
  margin:0;
  padding-top:1rem;
  border-top:1px dashed var(--pc-dash);
  font-size:var(--fs-sm);
  line-height:1.8;
  color:var(--on-dark-dim);
}

/* ---------- 合作与采购 ---------- */
.page-contact .pc-partner{
  padding:clamp(2.5rem,6vw,4.5rem) 0;
  background:var(--paper);
}
.page-contact .pc-partner__head{
  max-width:62ch;
}
.page-contact .pc-partner__title{
  margin:.7rem 0 0;
  font-size:var(--fs-h2);
  font-weight:900;
  line-height:1.14;
  letter-spacing:-.02em;
}
.page-contact .pc-partner__lead{
  margin:1rem 0 0;
  font-size:var(--fs-body);
  line-height:1.85;
  color:var(--stone);
}
.page-contact .pc-partner__grid{
  margin-top:2rem;
  display:grid;
  gap:1rem;
  grid-template-columns:minmax(0,1fr);
}
.page-contact .pc-partner__card{
  display:flex;
  flex-direction:column;
  gap:.6rem;
  padding:1.35rem 1.4rem 1.5rem;
  background:var(--pc-card-bg);
  border:1px solid var(--paper-2);
  border-top:3px solid var(--copper);
  box-shadow:6px 6px 0 var(--paper-2);
  transition:transform .28s var(--ease),box-shadow .28s var(--ease);
}
.page-contact .pc-partner__card:hover{
  transform:translateY(-4px);
  box-shadow:6px 10px 0 var(--paper-2);
}
.page-contact .pc-partner__no{
  font-family:var(--font-mono);
  font-size:var(--fs-mono);
  letter-spacing:.08em;
  color:var(--copper);
}
.page-contact .pc-partner__name{
  margin:0;
  font-size:var(--fs-h4);
  font-weight:900;
  letter-spacing:-.01em;
  line-height:1.3;
}
.page-contact .pc-partner__text{
  margin:0;
  font-size:var(--fs-sm);
  line-height:1.8;
  color:var(--steel);
}
.page-contact .pc-partner__need{
  margin:.2rem 0 0;
  padding-top:.75rem;
  border-top:1px dashed var(--paper-2);
  font-size:var(--fs-sm);
  line-height:1.8;
  color:var(--moss);
}

/* ---------- 先看资料 ---------- */
.page-contact .pc-paths{
  padding:clamp(2rem,5vw,3.25rem) 0 clamp(3rem,6vw,4.5rem);
  background:var(--paper);
  border-top:1px solid var(--paper-2);
}
.page-contact .pc-paths__title{
  margin:0;
  font-size:var(--fs-h3);
  font-weight:900;
  letter-spacing:-.01em;
}
.page-contact .pc-paths__grid{
  margin-top:1.5rem;
  display:grid;
  gap:0;
  grid-template-columns:minmax(0,1fr);
  border-top:1px solid var(--paper-2);
}
.page-contact .pc-path{
  display:grid;
  gap:.3rem;
  padding:1.1rem 0 1.15rem;
  border-bottom:1px solid var(--paper-2);
  text-decoration:none;
  color:inherit;
  transition:background .22s var(--ease),padding-left .22s var(--ease);
}
.page-contact .pc-path__no{
  font-family:var(--font-mono);
  font-size:var(--fs-mono);
  letter-spacing:.08em;
  color:var(--copper);
}
.page-contact .pc-path__name{
  font-size:var(--fs-body);
  font-weight:700;
  line-height:1.5;
  border-bottom:2px solid transparent;
  width:fit-content;
  transition:border-color .2s var(--ease),color .2s var(--ease);
}
.page-contact .pc-path__desc{
  font-size:var(--fs-sm);
  line-height:1.75;
  color:var(--stone);
}
.page-contact .pc-path:hover{
  padding-left:.6rem;
  background:rgba(192,138,46,.06);
}
.page-contact .pc-path:hover .pc-path__name{
  color:var(--copper);
  border-bottom-color:var(--copper);
}
.page-contact .pc-path:focus-visible{
  outline:2px solid var(--copper-light);
  outline-offset:3px;
}

/* ---------- 响应式 ---------- */
@media (min-width:640px){
  .page-contact .pc-partner__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .page-contact .pc-stage__figure{
    aspect-ratio:4 / 3;
  }
}

@media (min-width:900px){
  .page-contact .pc-hero__grid{
    grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
    align-items:end;
    gap:2.5rem;
  }
  .page-contact .pc-network__grid{
    grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);
    gap:2.25rem;
  }
  .page-contact .pc-paths__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .page-contact .pc-path{
    padding:1.25rem 1.25rem 1.35rem 0;
    border-bottom:1px solid var(--paper-2);
  }
  .page-contact .pc-path:nth-child(odd){
    border-right:1px solid var(--paper-2);
    padding-right:1.5rem;
  }
  .page-contact .pc-path:nth-child(even){
    padding-left:1.5rem;
  }
}

@media (min-width:1040px){
  .page-contact .pc-stage__grid{
    grid-template-columns:minmax(0,1.06fr) minmax(0,.46fr) minmax(0,1fr);
    gap:1.5rem;
    align-items:stretch;
  }
  .page-contact .pc-card{
    grid-column:auto;
  }
  .page-contact .pc-stage__figure{
    aspect-ratio:auto;
    height:100%;
  }
  .page-contact .pc-stage__figure img{
    height:100%;
  }
  .page-contact .pc-partner__grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .page-contact .pc-paths__grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    border-bottom:1px solid var(--paper-2);
  }
  .page-contact .pc-path{
    border-bottom:0;
    padding:1.4rem 1.5rem 1.5rem 0;
  }
  .page-contact .pc-path + .pc-path{
    border-left:1px solid var(--paper-2);
    padding-left:1.5rem;
  }
  .page-contact .pc-path:nth-child(odd){
    border-right:0;
  }
}
<<<END>>>
