.page-contact{
  --pc-ink:#0B241D;
  --pc-coal:#111413;
  --pc-silver:#D8E4E1;
  --pc-indigo:#23405F;
  --pc-orange:#F08A3C;
  --pc-amber:#E8B23A;
  --pc-stone:#6F7A76;
  --pc-cream:#F4F0E6;
  --pc-moss:#4F6B58;
  --pc-line:rgba(216,228,225,.15);
  --pc-line-strong:rgba(216,228,225,.34);

  background:var(--pc-ink);
  color:var(--pc-silver);
  font-family:var(--font-body);
  line-height:1.65;
  overflow-x:hidden;
}

.page-contact h2{
  font-family:var(--font-head);
  font-weight:900;
  font-size:clamp(1.5rem,3.2vw,2.25rem);
  letter-spacing:-.02em;
  line-height:1.15;
  margin:10px 0 14px;
  color:var(--pc-cream);
}

.page-contact h3{
  font-family:var(--font-head);
  font-weight:700;
  letter-spacing:-.01em;
}

.page-contact .btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:12px 22px;
  font-family:var(--font-mono);
  font-size:.8125rem;
  letter-spacing:.06em;
  text-decoration:none;
  border:1px solid var(--pc-line-strong);
  clip-path:polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
  transition:background var(--t-fast), color var(--t-fast), border-color var(--t-fast);
}
.page-contact .btn--primary{
  background:var(--pc-orange);
  border-color:var(--pc-orange);
  color:#111413;
}
.page-contact .btn--primary:hover{ background:#f79c57; border-color:#f79c57; }
.page-contact .btn--ghost{
  background:transparent;
  color:var(--pc-silver);
}
.page-contact .btn--ghost:hover{ border-color:var(--pc-orange); color:var(--pc-orange); }
.page-contact .btn:focus-visible{ outline:2px solid var(--pc-amber); outline-offset:3px; }

/* 首屏 */
.page-contact .contact-hero{
  position:relative;
  padding:clamp(24px,4vw,40px) 0 clamp(40px,6vw,72px);
  border-bottom:1px solid var(--pc-line);
  background:
    radial-gradient(140% 120% at 88% -10%, rgba(35,64,95,.6) 0%, rgba(11,36,29,0) 62%),
    linear-gradient(180deg,#0B241D 0%,#0e2b23 100%);
}
.page-contact .contact-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(216,228,225,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(216,228,225,.05) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,.75), transparent 80%);
          mask-image:linear-gradient(180deg, rgba(0,0,0,.75), transparent 80%);
  pointer-events:none;
}
.page-contact .contact-hero > .wrap{ position:relative; z-index:1; }

.page-contact .breadcrumb{
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.08em;
  color:var(--pc-stone);
  margin-bottom:clamp(24px,4vw,40px);
}
.page-contact .breadcrumb ol{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
  padding:0;
}
.page-contact .breadcrumb li + li::before{
  content:"/";
  margin-right:8px;
  color:var(--pc-line-strong);
}
.page-contact .breadcrumb a{ color:var(--pc-stone); text-decoration:none; }
.page-contact .breadcrumb a:hover{ color:var(--pc-orange); }
.page-contact .breadcrumb li[aria-current]{ color:var(--pc-silver); }

.page-contact .hero-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:32px;
}
.page-contact .hero-copy h1{
  font-family:var(--font-head);
  font-weight:900;
  font-size:clamp(2.125rem,6vw,4.25rem);
  letter-spacing:-.02em;
  line-height:1.04;
  margin:14px 0 20px;
  color:var(--pc-cream);
}
.page-contact .hero-lede{
  max-width:56ch;
  margin:0;
  font-size:1.0625rem;
  color:rgba(216,228,225,.82);
}
.page-contact .hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:28px 0 0;
}

.page-contact .hero-dial{
  position:relative;
  padding:22px 22px 24px;
  border:1px solid var(--pc-line-strong);
  border-left:3px solid var(--pc-orange);
  background:rgba(17,20,19,.62);
}
.page-contact .hero-dial::after{
  content:"06";
  position:absolute;
  right:16px;
  top:12px;
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.14em;
  color:var(--pc-stone);
}
.page-contact .dial-label{
  margin:0 0 8px;
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.1em;
  color:var(--pc-stone);
}
.page-contact .dial-number{
  margin:0;
  font-family:var(--font-mono);
  font-weight:600;
  font-size:clamp(1.625rem,5vw,2.5rem);
  line-height:1.1;
  letter-spacing:0;
  color:var(--pc-orange);
  word-break:break-all;
  -webkit-user-select:all;
          user-select:all;
}
.page-contact .dial-note{
  margin:12px 0 0;
  font-size:.8125rem;
  color:rgba(216,228,225,.68);
}

/* 联系通道 */
.page-contact .channels{
  padding:clamp(44px,7vw,80px) 0;
  background:var(--pc-ink);
}
.page-contact .ch-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:36px;
  align-items:start;
}
.page-contact .ch-aside .figure{ margin:0 0 18px; }
.page-contact .ch-aside img{
  display:block;
  width:100%;
  height:auto;
  border:1px solid var(--pc-line);
  filter:saturate(.55) contrast(1.06) brightness(.92);
}
.page-contact .figure-caption{
  margin:10px 0 0;
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.04em;
  line-height:1.6;
  color:var(--pc-stone);
}

.page-contact .ch-list{
  display:grid;
  border-top:1px solid var(--pc-line);
}
.page-contact .ch-item{
  display:grid;
  grid-template-columns:1fr;
  gap:6px;
  padding:20px 0;
  border-bottom:1px solid var(--pc-line);
}
.page-contact .ch-kind{
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.12em;
  color:var(--pc-stone);
}
.page-contact .ch-value{
  font-family:var(--font-mono);
  font-weight:600;
  font-size:clamp(1rem,2.6vw,1.25rem);
  line-height:1.35;
  color:var(--pc-cream);
  word-break:break-word;
  -webkit-user-select:all;
          user-select:all;
}
.page-contact .ch-value--addr{
  font-family:var(--font-body);
  font-weight:500;
  font-size:1rem;
}
.page-contact .ch-desc{
  margin:0;
  font-size:.9rem;
  color:rgba(216,228,225,.7);
}

/* 战报入口 */
.page-contact .bulletin{
  padding:0 0 clamp(44px,7vw,80px);
  background:var(--pc-ink);
}
.page-contact .bulletin-card{
  position:relative;
  display:grid;
  grid-template-columns:1fr;
  border:1px solid var(--pc-line);
  background:var(--pc-coal);
  overflow:hidden;
  clip-path:polygon(0 0, calc(100% - 30px) 0, 100% 30px, 100% 100%, 0 100%);
}
.page-contact .bulletin-media{
  position:relative;
  min-height:220px;
}
.page-contact .bulletin-media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.5) contrast(1.1) brightness(.78);
}
.page-contact .bulletin-body{ padding:30px 22px 34px; }
.page-contact .bulletin-body p{
  max-width:52ch;
  margin:0 0 24px;
  font-size:.9375rem;
  color:rgba(216,228,225,.78);
}
.page-contact .bulletin-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

/* 反馈指引（浅色归档区） */
.page-contact .feedback{
  padding:clamp(44px,7vw,84px) 0;
  background:var(--pc-cream);
  color:#1d2422;
}
.page-contact .feedback .section-label{ color:var(--pc-stone); }
.page-contact .feedback h2{ color:#111413; }
.page-contact .feedback-lede{
  max-width:58ch;
  margin:0 0 28px;
  font-size:1rem;
  color:#3a423f;
}
.page-contact .steps{
  counter-reset:step;
  list-style:none;
  margin:0 0 30px;
  padding:0;
  border-top:1px solid rgba(11,36,29,.16);
}
.page-contact .steps li{
  counter-increment:step;
  position:relative;
  padding:18px 0 18px 58px;
  border-bottom:1px solid rgba(11,36,29,.16);
  font-size:.9375rem;
  line-height:1.7;
  color:#2c3432;
}
.page-contact .steps li::before{
  content:counter(step,decimal-leading-zero);
  position:absolute;
  left:0;
  top:20px;
  padding:3px 7px;
  font-family:var(--font-mono);
  font-weight:600;
  font-size:.72rem;
  letter-spacing:.06em;
  color:var(--pc-cream);
  background:#111413;
}
.page-contact .steps li strong{ color:#0B241D; font-weight:700; }

.page-contact .mail-template{
  border:1px solid rgba(11,36,29,.2);
  background:rgba(255,255,255,.55);
}
.page-contact .mail-template summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:16px 20px;
  cursor:pointer;
  list-style:none;
  font-family:var(--font-mono);
  font-size:.8125rem;
  letter-spacing:.06em;
  color:#0B241D;
  transition:background var(--t-fast);
}
.page-contact .mail-template summary::-webkit-details-marker{ display:none; }
.page-contact .mail-template summary:hover{ background:rgba(11,36,29,.05); }
.page-contact .mail-template summary::after{
  content:"+";
  font-family:var(--font-mono);
  font-size:1.125rem;
  line-height:1;
  color:var(--pc-orange);
}
.page-contact .mail-template[open] summary::after{ content:"–"; }
.page-contact .mail-template summary:focus-visible{ outline:2px solid var(--pc-orange); outline-offset:-2px; }
.page-contact .mail-template pre{
  margin:0;
  padding:0 20px 22px;
  font-family:var(--font-mono);
  font-size:.8125rem;
  line-height:1.75;
  color:#2c3432;
  white-space:pre-wrap;
  word-break:break-word;
}

/* 服务时间 */
.page-contact .service{
  padding:clamp(44px,7vw,80px) 0;
  background:var(--pc-indigo);
}
.page-contact .service .section-label{ color:rgba(216,228,225,.62); }
.page-contact .service-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  margin-top:28px;
  background:rgba(216,228,225,.22);
  border:1px solid rgba(216,228,225,.22);
}
.page-contact .service-card{
  padding:26px 22px;
  background:var(--pc-indigo);
}
.page-contact .service-num{
  font-family:var(--font-mono);
  font-weight:600;
  font-size:clamp(1.5rem,3.6vw,2rem);
  line-height:1.15;
  letter-spacing:-.01em;
  color:var(--pc-orange);
  margin-bottom:8px;
}
.page-contact .service-card h3{
  margin:0 0 8px;
  font-size:1rem;
  color:var(--pc-cream);
}
.page-contact .service-card p{
  margin:0;
  font-size:.875rem;
  color:rgba(216,228,225,.78);
}

/* 按场景选择 */
.page-contact .routing{
  padding:clamp(44px,7vw,80px) 0;
  background:var(--pc-coal);
  border-top:1px solid var(--pc-line);
}
.page-contact .routing-map{
  margin:24px 0 30px;
  padding:18px 18px 14px;
  border:1px solid var(--pc-line);
  background:rgba(216,228,225,.03);
  color:var(--pc-silver);
}
.page-contact .routing-map svg{
  display:block;
  width:100%;
  height:auto;
  max-height:140px;
}
.page-contact .route-map-note{
  margin:10px 0 0;
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.08em;
  line-height:1.6;
  color:var(--pc-stone);
}
.page-contact .route-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
}
.page-contact .route-card{
  position:relative;
  padding:24px 22px 26px;
  border:1px solid var(--pc-line);
  background:rgba(216,228,225,.025);
  clip-path:polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
  transition:border-color var(--t-fast), background var(--t-fast);
}
.page-contact .route-card:hover{
  border-color:rgba(240,138,60,.5);
  background:rgba(240,138,60,.06);
}
.page-contact .route-tag{
  display:inline-block;
  margin-bottom:12px;
  padding:3px 9px;
  font-family:var(--font-mono);
  font-size:.68rem;
  letter-spacing:.1em;
  color:#111413;
  background:var(--pc-moss);
}
.page-contact .route-tag--indigo{ background:var(--pc-indigo); color:var(--pc-cream); }
.page-contact .route-tag--moss{ background:var(--pc-moss); color:var(--pc-cream); }
.page-contact .route-tag--amber{ background:var(--pc-amber); color:#111413; }
.page-contact .route-tag--orange{ background:var(--pc-orange); color:#111413; }

.page-contact .route-card h3{
  margin:0 0 8px;
  font-size:1.0625rem;
  color:var(--pc-cream);
}
.page-contact .route-card p{
  margin:0 0 14px;
  font-size:.9rem;
  color:rgba(216,228,225,.72);
}
.page-contact .route-card p.route-mail{
  margin:0;
  font-family:var(--font-mono);
  font-size:.8125rem;
  font-weight:600;
  color:var(--pc-cream);
  word-break:break-word;
  -webkit-user-select:all;
          user-select:all;
}
.page-contact .route-link{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.08em;
  color:var(--pc-orange);
  text-decoration:none;
  border-bottom:1px solid rgba(240,138,60,.45);
  transition:border-color var(--t-fast), color var(--t-fast);
}
.page-contact .route-link:hover{ border-color:var(--pc-orange); color:#ffa864; }
.page-contact .route-link:focus-visible{ outline:2px solid var(--pc-amber); outline-offset:3px; }

/* 备案与站点信息 */
.page-contact .site-meta{
  padding:clamp(36px,5vw,56px) 0 clamp(48px,7vw,72px);
  background:var(--pc-ink);
  border-top:1px solid var(--pc-line);
}
.page-contact .meta-band{
  display:grid;
  grid-template-columns:1fr;
  gap:1px;
  background:var(--pc-line);
  border:1px solid var(--pc-line);
}
.page-contact .meta-cell{
  padding:18px 18px 20px;
  background:var(--pc-ink);
}
.page-contact .meta-key{
  display:block;
  margin-bottom:6px;
  font-family:var(--font-mono);
  font-size:.68rem;
  letter-spacing:.12em;
  color:var(--pc-stone);
}
.page-contact .meta-val{
  display:block;
  font-size:.9375rem;
  font-weight:600;
  color:var(--pc-cream);
  word-break:break-word;
}

/* 响应式 */
@media (min-width:640px){
  .page-contact .ch-item{
    grid-template-columns:132px minmax(0,1fr);
    gap:8px 20px;
    align-items:baseline;
  }
  .page-contact .ch-desc{ grid-column:1 / -1; }
}

@media (min-width:760px){
  .page-contact .service-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .page-contact .route-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .page-contact .meta-band{ grid-template-columns:repeat(4,minmax(0,1fr)); }
}

@media (min-width:900px){
  .page-contact .hero-grid{
    grid-template-columns:minmax(0,7fr) minmax(0,5fr);
    gap:56px;
    align-items:end;
  }
  .page-contact .bulletin-card{
    grid-template-columns:minmax(0,6fr) minmax(0,6fr);
    align-items:stretch;
  }
  .page-contact .bulletin-body{ padding:48px 44px; }
  .page-contact .bulletin-media{ min-height:100%; }
}

@media (min-width:960px){
  .page-contact .ch-grid{
    grid-template-columns:minmax(0,4fr) minmax(0,8fr);
    gap:48px;
  }
}

@media (prefers-reduced-motion:reduce){
  .page-contact .btn,
  .page-contact .route-card,
  .page-contact .route-link,
  .page-contact .mail-template summary{
    transition:none;
  }
}
