.page-contact{
  --fb-radius:2px;
  --fb-pad:clamp(16px,3vw,26px);
  background:var(--cream);
  color:var(--ink);
}
.page-contact .section{padding:clamp(34px,5vw,64px) 0;}
.page-contact .section--tight{padding:clamp(24px,3.5vw,40px) 0;}

/* 面包屑与页眉上下文 */
.page-contact .fb-crumb-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px 20px;
  padding-top:clamp(14px,3vw,26px);
}
.page-contact .fb-context{
  margin:0;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.08em;
  color:var(--rock);
}

/* 首屏 */
.page-contact .fb-hero{
  position:relative;
  overflow:hidden;
  padding:clamp(22px,4.5vw,54px) 0 clamp(26px,4.5vw,56px);
}
.page-contact .fb-hero::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:repeating-linear-gradient(118deg,transparent 0 42px,rgba(216,209,194,.5) 42px 43px);
  opacity:.6;
}
.page-contact .fb-hero-grid{
  position:relative;
  display:grid;
  gap:clamp(22px,4vw,40px);
}
.page-contact h1{
  margin:14px 0 0;
  font-family:var(--font-head);
  font-weight:800;
  font-size:clamp(30px,6vw,58px);
  line-height:1.12;
  letter-spacing:.03em;
  color:var(--indigo);
}
.page-contact .fb-hero-main .lede{
  margin:18px 0 0;
  max-width:50ch;
  font-size:clamp(14.5px,1.6vw,17px);
  line-height:1.9;
  color:var(--ink);
}
.page-contact .fb-jump{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:26px;
}
.page-contact .fb-hero-meta{
  list-style:none;
  margin:28px 0 0;
  padding:0;
  display:grid;
  gap:10px;
  font-size:13.5px;
  color:var(--rock);
}
.page-contact .fb-hero-meta li{
  position:relative;
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:8px;
  padding-left:16px;
}
.page-contact .fb-hero-meta li::before{
  content:"";
  position:absolute;
  left:0;
  top:.62em;
  width:7px;
  height:2px;
  background:var(--gold);
}
.page-contact .fb-hero-meta .mono{color:var(--indigo);}

/* 状态卡 */
.page-contact .fb-status-card{
  position:relative;
  overflow:hidden;
  padding:var(--fb-pad);
  background:var(--indigo);
  color:var(--cloud);
  border-radius:var(--fb-radius);
  box-shadow:var(--shadow-2);
}
.page-contact .fb-status-card::after{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg,var(--gold) 0 34%,var(--vermilion) 34% 50%,var(--turquoise) 50% 66%,var(--cloud) 66% 100%);
}
.page-contact .fb-status-kicker{
  margin:10px 0 0;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.14em;
  color:var(--gold-light);
}
.page-contact .fb-status-num{
  margin:8px 0 0;
  font-family:var(--font-mono);
  font-weight:600;
  font-size:clamp(46px,10vw,70px);
  line-height:.95;
  color:var(--gold-light);
}
.page-contact .fb-status-unit{
  margin:8px 0 0;
  max-width:28ch;
  font-size:13.5px;
  line-height:1.75;
  color:rgba(247,243,232,.84);
}
.page-contact .fb-status-list{
  list-style:none;
  margin:20px 0 0;
  padding:14px 0 0;
  border-top:1px solid rgba(247,243,232,.18);
  display:grid;
  gap:10px;
}
.page-contact .fb-status-list li{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:6px 12px;
  font-size:12.5px;
  color:rgba(247,243,232,.8);
}
.page-contact .fb-status-list .mono{color:var(--gold-light);}
.page-contact .fb-status-media{
  margin-top:20px;
  border:1px solid rgba(247,243,232,.18);
  background:rgba(247,243,232,.06);
}
.page-contact .fb-status-media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}

/* 区块标题 */
.page-contact .fb-section-head{margin-bottom:clamp(18px,3vw,30px);}
.page-contact .fb-section-head h2,
.page-contact .fb-help-copy h2,
.page-contact .fb-channel-panel h2,
.page-contact .fb-drawer h2{
  margin:10px 0 0;
  font-family:var(--font-head);
  font-weight:800;
  font-size:clamp(21px,3.2vw,32px);
  line-height:1.24;
  letter-spacing:.03em;
  color:var(--indigo);
}
.page-contact .fb-section-note{
  margin:12px 0 0;
  max-width:58ch;
  font-size:14px;
  line-height:1.85;
  color:var(--rock);
}

/* 表单与状态抽屉 */
.page-contact .fb-form-grid{
  display:grid;
  gap:clamp(18px,3.5vw,34px);
}
.page-contact .fb-form-col{
  align-self:start;
  padding:clamp(14px,2.6vw,24px);
  background:var(--cloud);
  border:1px solid var(--mist);
  border-radius:var(--fb-radius);
  box-shadow:var(--shadow-1);
}
.page-contact .fb-field{
  padding:14px 0;
  border-bottom:1px solid var(--mist);
}
.page-contact .fb-field:first-child{padding-top:2px;}
.page-contact .fb-field:last-of-type{border-bottom:none;}
.page-contact .fb-label{
  display:flex;
  align-items:baseline;
  gap:8px;
  margin-bottom:8px;
  font-family:var(--font-head);
  font-weight:800;
  font-size:13.5px;
  letter-spacing:.04em;
  color:var(--ink);
}
.page-contact .fb-idx{
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.06em;
  color:var(--gold);
}
.page-contact .fb-input{
  width:100%;
  box-sizing:border-box;
  padding:10px 12px;
  font-family:var(--font-body);
  font-size:14px;
  line-height:1.6;
  color:var(--ink);
  background:var(--cream);
  border:1px solid var(--mist);
  border-radius:var(--fb-radius);
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease),background .18s var(--ease);
}
.page-contact .fb-input::placeholder{color:rgba(86,106,140,.65);}
.page-contact .fb-input:focus{
  outline:none;
  background:#fff;
  border-color:var(--turquoise);
  box-shadow:0 0 0 3px rgba(46,125,112,.16);
}
.page-contact .fb-textarea{
  min-height:104px;
  resize:vertical;
}
.page-contact .fb-hint{
  margin:7px 0 0;
  font-size:12.5px;
  line-height:1.7;
  color:var(--rock);
}
.page-contact .fb-submit-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  margin-top:20px;
  padding-top:16px;
  border-top:1px solid var(--mist);
}
.page-contact .fb-submit-row .fb-hint{
  flex:1 1 220px;
  margin:0;
}
.page-contact .fb-drawer{
  align-self:start;
  padding:var(--fb-pad);
  background:var(--cloud);
  border:1px solid var(--mist);
  border-left:3px solid var(--gold);
  border-radius:var(--fb-radius);
  box-shadow:var(--shadow-1);
}
.page-contact .fb-drawer h2{margin-top:8px;font-size:clamp(19px,2.6vw,24px);}
.page-contact .fb-timeline{
  position:relative;
  list-style:none;
  margin:18px 0 0;
  padding:0;
}
.page-contact .fb-timeline::before{
  content:"";
  position:absolute;
  left:4px;
  top:8px;
  bottom:24px;
  width:1px;
  background:var(--mist);
}
.page-contact .fb-timeline li{
  position:relative;
  padding:0 0 18px 26px;
}
.page-contact .fb-timeline li::before{
  content:"";
  position:absolute;
  left:0;
  top:5px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--turquoise);
  box-shadow:0 0 0 3px rgba(46,125,112,.14);
}
.page-contact .fb-timeline li:nth-child(2)::before{
  background:var(--gold);
  box-shadow:0 0 0 3px rgba(199,161,90,.18);
}
.page-contact .fb-timeline li:nth-child(3)::before{
  background:var(--rock);
  box-shadow:0 0 0 3px rgba(86,106,140,.16);
}
.page-contact .fb-timeline h3{
  margin:0;
  font-family:var(--font-head);
  font-weight:800;
  font-size:14px;
  letter-spacing:.02em;
  color:var(--ink);
}
.page-contact .fb-timeline p{
  margin:5px 0 0;
  font-size:13px;
  line-height:1.78;
  color:var(--rock);
}
.page-contact .fb-drawer-note{
  margin:6px 0 18px;
  padding-top:14px;
  border-top:1px solid var(--mist);
  font-size:12.5px;
  line-height:1.9;
  color:var(--rock);
}

/* 常见反馈类型 */
.page-contact .fb-types{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(12px,2vw,16px);
}
.page-contact .fb-type{
  padding:var(--fb-pad);
  background:var(--cloud);
  border-top:3px solid var(--mist);
}
.page-contact .fb-type:nth-child(1){border-top-color:var(--vermilion);}
.page-contact .fb-type:nth-child(2){border-top-color:var(--gold);}
.page-contact .fb-type:nth-child(3){border-top-color:var(--turquoise);}
.page-contact .fb-type:nth-child(4){border-top-color:var(--rock);}
.page-contact .fb-type-idx{
  margin:0;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.14em;
  color:var(--rock);
}
.page-contact .fb-type h3{
  margin:8px 0 0;
  font-family:var(--font-head);
  font-weight:800;
  font-size:16px;
  letter-spacing:.03em;
  color:var(--indigo);
}
.page-contact .fb-type p{
  margin:8px 0 0;
  font-size:13.5px;
  line-height:1.8;
  color:var(--ink);
}
.page-contact .fb-type .fb-type-hint{
  margin-top:12px;
  padding-top:10px;
  border-top:1px solid var(--mist);
  font-size:12px;
  line-height:1.7;
  color:var(--rock);
}

/* 版本对照与入口协助 */
.page-contact .fb-help-grid{
  display:grid;
  gap:clamp(20px,4vw,36px);
}
.page-contact .fb-help-copy p{
  margin:14px 0 0;
  font-size:14px;
  line-height:1.9;
  color:var(--ink);
}
.page-contact .fb-help-links{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}
.page-contact .fb-help-links a{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:6px 14px;
  padding:14px 16px;
  text-decoration:none;
  font-size:14px;
  color:var(--ink);
  background:var(--cloud);
  border:1px solid var(--mist);
  border-radius:var(--fb-radius);
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease),transform .18s var(--ease);
}
.page-contact .fb-help-links a:hover,
.page-contact .fb-help-links a:focus-visible{
  border-color:var(--gold);
  box-shadow:var(--shadow-1);
  transform:translateY(-1px);
}
.page-contact .fb-help-links .mono{
  font-size:11.5px;
  color:var(--rock);
}

/* 联系方式 */
.page-contact .fb-channels{
  display:grid;
  gap:clamp(20px,4vw,32px);
}
.page-contact .fb-channel-panel{
  position:relative;
  overflow:hidden;
  padding:clamp(20px,3.4vw,34px);
  background:var(--indigo);
  color:var(--cloud);
  border-radius:var(--fb-radius);
  box-shadow:var(--shadow-2);
}
.page-contact .fb-channel-panel::after{
  content:"";
  position:absolute;
  right:-46px;
  top:-46px;
  width:170px;
  height:170px;
  border:1px solid rgba(199,161,90,.35);
  border-radius:50%;
  box-shadow:0 0 0 24px rgba(199,161,90,.07),0 0 0 52px rgba(199,161,90,.045);
  pointer-events:none;
}
.page-contact .fb-channel-panel h2{
  position:relative;
  margin-top:8px;
  color:var(--cloud);
}
.page-contact .fb-contact-list{
  position:relative;
  margin:18px 0 0;
  padding:0;
}
.page-contact .fb-contact-list dt{
  margin-top:16px;
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.12em;
  color:var(--gold-light);
}
.page-contact .fb-contact-list dd{
  margin:5px 0 0;
  padding-bottom:14px;
  border-bottom:1px solid rgba(247,243,232,.16);
  font-size:15px;
  line-height:1.7;
  color:var(--cloud);
}
.page-contact .fb-contact-list dd:last-child{border-bottom:none;padding-bottom:0;}
.page-contact .fb-contact-link{
  color:var(--cloud);
  text-decoration:none;
  border-bottom:1px solid rgba(199,161,90,.55);
  word-break:break-all;
}
.page-contact .fb-contact-link:hover,
.page-contact .fb-contact-link:focus-visible{
  color:var(--gold-light);
  border-bottom-color:var(--gold-light);
}
.page-contact .fb-contact-note{
  position:relative;
  margin:18px 0 0;
  padding-top:14px;
  border-top:1px solid rgba(247,243,232,.2);
  font-size:12.5px;
  line-height:1.85;
  color:rgba(247,243,232,.76);
}
.page-contact .fb-channel-figure{margin:0;}
.page-contact .fb-channel-media{
  border:1px solid var(--mist);
  background:var(--sand);
}
.page-contact .fb-channel-media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}
.page-contact .fb-channel-figure figcaption{
  margin-top:10px;
  font-size:12.5px;
  line-height:1.75;
  color:var(--rock);
}

/* 回到顶部 */
.page-contact .fb-top-row{padding:0 0 clamp(26px,4vw,44px);}
.page-contact .fb-top{
  margin:0;
  text-align:right;
}

/* 断点 */
@media (min-width:600px){
  .page-contact .fb-types{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (min-width:900px){
  .page-contact .fb-hero-grid{
    grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
    align-items:start;
  }
  .page-contact .fb-help-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:start;}
  .page-contact .fb-channels{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;}
}
@media (min-width:980px){
  .page-contact .fb-form-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);}
  .page-contact .fb-form-col{position:sticky;top:92px;}
  .page-contact .fb-drawer{position:sticky;top:92px;}
}
@media (min-width:1080px){
  .page-contact .fb-types{grid-template-columns:repeat(4,minmax(0,1fr));}
}
@media (prefers-reduced-motion:reduce){
  .page-contact .fb-help-links a{transition:none;}
  .page-contact .fb-help-links a:hover,
  .page-contact .fb-help-links a:focus-visible{transform:none;}
}
<<<END>>>