.page-contact{
  --ct-plate:#F6F2E7;
  --ct-plate-2:#EBE3D2;
  --ct-plate-line:rgba(169,121,46,.5);
  --ct-dim:rgba(246,242,231,.55);
  --ct-soft:rgba(246,242,231,.8);
  --ct-panel:rgba(20,53,42,.55);
  background:
    radial-gradient(900px 520px at 88% -8%, rgba(46,102,83,.34), transparent 62%),
    radial-gradient(680px 420px at -8% 28%, rgba(91,37,48,.2), transparent 62%),
    var(--kp-ink);
  color:var(--kp-porcelain);
  overflow-x:hidden;
  padding-bottom:clamp(10px,3vw,26px);
}
.page-contact h1,
.page-contact h2,
.page-contact h3{
  margin:0;
  font-family:var(--kp-font-display);
  font-weight:800;
  letter-spacing:.02em;
}
.page-contact p{margin:0}
.page-contact a{color:var(--kp-gold-hi)}

.page-contact .ct-sec{padding-block:clamp(30px,5.5vw,58px)}
.page-contact .ct-sec--hero{padding-block:clamp(16px,3vw,30px) clamp(26px,5vw,48px)}
.page-contact .ct-sec--last{padding-bottom:clamp(40px,7vw,80px)}

/* 首屏 5/7 分屏 */
.page-contact .ct-hero{display:grid;gap:26px;align-items:start}
.page-contact .ct-kicker{
  font-family:var(--kp-font-mono);
  font-size:11px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--kp-gold-hi);
  margin-bottom:12px;
}
.page-contact .ct-hero h1{
  font-size:clamp(28px,6vw,50px);
  line-height:1.2;
  color:#FBF8EF;
  max-width:16em;
}
.page-contact .ct-lead{
  margin-top:18px;
  font-size:clamp(15px,1.8vw,17px);
  line-height:1.9;
  color:var(--ct-soft);
  max-width:54ch;
}
.page-contact .ct-lead--small{font-size:15px;line-height:1.85;margin-bottom:18px}
.page-contact .ct-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.page-contact .ct-chip{
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:10px 15px;
  border:1px solid var(--kp-line);
  border-radius:12px;
  background:var(--ct-panel);
  backdrop-filter:blur(6px);
}
.page-contact .ct-chip__k{
  font-family:var(--kp-font-mono);
  font-size:10.5px;
  letter-spacing:.2em;
  color:var(--ct-dim);
}
.page-contact .ct-chip__v{
  font-family:var(--kp-font-mono);
  font-size:13.5px;
  color:var(--kp-porcelain);
  word-break:break-all;
}
.page-contact .ct-hero__media{margin:0;border-radius:var(--kp-radius);overflow:hidden}
.page-contact .kp-media__img{display:block;width:100%;height:auto;object-fit:cover}

/* 章节头 */
.page-contact .ct-head{
  display:flex;
  gap:14px;
  align-items:flex-start;
  border-top:1px solid var(--kp-line);
  padding-top:16px;
  margin-bottom:clamp(18px,3vw,30px);
}
.page-contact .ct-num{
  font-family:var(--kp-font-mono);
  font-size:clamp(26px,5vw,42px);
  line-height:.95;
  letter-spacing:-.02em;
  color:rgba(228,194,125,.34);
  flex:none;
}
.page-contact .ct-eyebrow{
  font-family:var(--kp-font-mono);
  font-size:11px;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:var(--kp-gold-hi);
  margin-bottom:8px;
}
.page-contact .ct-head h2{font-size:clamp(21px,3.4vw,31px);line-height:1.3;color:#FBF8EF}

/* 联系铭牌 */
.page-contact .ct-plates{display:grid;gap:14px}
.page-contact .ct-plate{
  position:relative;
  padding:18px 20px;
  border:1px solid var(--ct-plate-line);
  border-radius:14px;
  background:linear-gradient(165deg,var(--ct-plate),var(--ct-plate-2));
  color:var(--kp-char);
  box-shadow:0 22px 46px -34px #000, inset 0 1px 0 rgba(255,255,255,.75);
  transition:transform .2s ease, box-shadow .2s ease;
}
.page-contact .ct-plate:hover{transform:translateY(-3px);box-shadow:0 28px 52px -34px #000, inset 0 1px 0 rgba(255,255,255,.85)}
.page-contact .ct-plate__label{
  font-family:var(--kp-font-mono);
  font-size:10.5px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:#7A5A1F;
}
.page-contact .ct-plate__title{
  margin-top:7px;
  font-size:18px;
  color:#14352A;
}
.page-contact .ct-plate__value{
  margin-top:11px;
  font-family:var(--kp-font-mono);
  font-size:clamp(15px,2.2vw,19px);
  line-height:1.5;
  color:#101512;
  word-break:break-all;
}
.page-contact .ct-plate__body{
  margin-top:10px;
  font-size:14px;
  line-height:1.8;
  color:rgba(16,21,18,.74);
}
.page-contact .ct-plate__foot{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin-top:14px;
  padding-top:12px;
  border-top:1px dashed rgba(169,121,46,.4);
}
.page-contact .ct-mono-note{font-family:var(--kp-font-mono);font-size:12px;color:#5B2530}

.page-contact .ct-plate .kp-copy{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 14px;
  border:1px solid rgba(169,121,46,.55);
  border-radius:999px;
  background:rgba(169,121,46,.12);
  color:#14352A;
  font-family:var(--kp-font-body);
  font-size:12.5px;
  font-weight:600;
  cursor:pointer;
  transition:background .18s ease, color .18s ease, border-color .18s ease;
}
.page-contact .ct-plate .kp-copy:hover{background:rgba(169,121,46,.26)}
.page-contact .ct-plate .kp-copy.is-copied{background:var(--kp-ok);border-color:var(--kp-ok);color:#F6F2E7}

/* 反馈表单 */
.page-contact .ct-form{display:grid;gap:22px}
.page-contact .ct-steps{padding:18px 20px;border-left:2px solid var(--kp-line-strong);background:rgba(11,26,21,.4);border-radius:0 14px 14px 0}
.page-contact .ct-steps__title{
  font-family:var(--kp-font-mono);
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--kp-gold-hi);
  margin-bottom:14px;
}
.page-contact .ct-steps ol{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.page-contact .ct-step{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start}
.page-contact .ct-step__num{
  font-family:var(--kp-font-mono);
  font-size:13px;
  color:var(--kp-gold-hi);
  border:1px solid var(--kp-line-strong);
  border-radius:6px;
  padding:1px 6px;
}
.page-contact .ct-step__text{font-size:14px;line-height:1.8;color:var(--ct-soft)}
.page-contact .ct-inline-link{
  display:inline-block;
  margin-top:16px;
  font-size:13.5px;
  color:var(--kp-gold-hi);
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-color:rgba(228,194,125,.45);
}
.page-contact .ct-inline-link:hover{color:#FBF8EF}

.page-contact .ct-form-panel{
  padding:clamp(16px,3vw,28px);
  border:1px solid var(--kp-line);
  border-radius:var(--kp-radius);
  background:var(--ct-panel);
  backdrop-filter:blur(6px);
}
.page-contact .ct-fields{display:grid;gap:16px}
.page-contact .ct-field{display:block}
.page-contact .ct-field label{display:block;font-size:14px;font-weight:600;color:#FBF8EF}
.page-contact .ct-field__hint{
  margin-top:4px;
  font-family:var(--kp-font-mono);
  font-size:11.5px;
  line-height:1.6;
  color:var(--ct-dim);
}
.page-contact .ct-field input,
.page-contact .ct-field textarea{
  box-sizing:border-box;
  width:100%;
  margin-top:8px;
  padding:11px 13px;
  border:1px solid rgba(228,194,125,.24);
  border-radius:10px;
  background:rgba(11,26,21,.72);
  color:var(--kp-porcelain);
  font-family:var(--kp-font-mono);
  font-size:14px;
  line-height:1.6;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.page-contact .ct-field textarea{resize:vertical;min-height:120px}
.page-contact .ct-field input::placeholder,
.page-contact .ct-field textarea::placeholder{color:rgba(246,242,231,.34)}
.page-contact .ct-field input:hover,
.page-contact .ct-field textarea:hover{border-color:rgba(228,194,125,.42)}
.page-contact .ct-field input:focus-visible,
.page-contact .ct-field textarea:focus-visible{
  outline:2px solid var(--kp-amber);
  outline-offset:2px;
  border-color:var(--kp-amber);
}
.page-contact .ct-submit{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  align-items:center;
  margin-top:22px;
  padding-top:18px;
  border-top:1px solid var(--kp-line);
}
.page-contact .ct-submit__note{font-size:13.5px;line-height:1.8;color:var(--ct-dim);flex:1 1 240px;word-break:break-word}

/* 材料清单 */
.page-contact .ct-check-layout{display:grid;gap:22px;align-items:start}
.page-contact .ct-check-media{margin:0;border-radius:var(--kp-radius);overflow:hidden}
.page-contact .ct-check{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.page-contact .ct-check li{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  align-items:start;
  padding:12px 14px;
  border-radius:10px;
  border-left:3px solid var(--kp-gold);
  background:linear-gradient(165deg,var(--ct-plate),var(--ct-plate-2));
  color:var(--kp-char);
}
.page-contact .ct-check input[type="checkbox"]{
  width:18px;
  height:18px;
  margin:2px 0 0;
  accent-color:var(--kp-gold);
  cursor:pointer;
}
.page-contact .ct-check input[type="checkbox"]:focus-visible{outline:2px solid var(--kp-amber);outline-offset:2px}
.page-contact .ct-check label{font-size:14px;line-height:1.7;cursor:pointer}

/* 处理流程 */
.page-contact .ct-flow{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:0;
}
.page-contact .ct-flow li{
  position:relative;
  padding:0 0 22px 30px;
  border-left:1px solid var(--kp-line);
}
.page-contact .ct-flow li:last-child{padding-bottom:0;border-left-color:transparent}
.page-contact .ct-flow li::before{
  content:"";
  position:absolute;
  left:-4.5px;
  top:4px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--kp-gold-hi);
  box-shadow:0 0 0 3px rgba(228,194,125,.16);
}
.page-contact .ct-flow__step{
  font-family:var(--kp-font-display);
  font-size:18px;
  font-weight:800;
  letter-spacing:.06em;
  color:var(--kp-gold-hi);
  margin-bottom:8px;
}
.page-contact .ct-flow__text{font-size:14.5px;line-height:1.85;color:var(--ct-soft)}

.page-contact .ct-data-band{
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
  align-items:baseline;
  margin-top:26px;
  padding:14px 18px;
  border-radius:12px;
  background:var(--kp-slate);
  border-left:3px solid var(--kp-gold-hi);
}
.page-contact .ct-data-band .kp-data-band__label{font-size:12.5px;letter-spacing:.12em;color:rgba(246,242,231,.72)}
.page-contact .ct-data-band .kp-data-band__value{font-size:15px;color:#FBF8EF}

/* 问题分流 */
.page-contact .ct-routes{display:grid;gap:14px}
.page-contact .ct-route{
  padding:20px;
  border:1px solid var(--kp-line);
  border-radius:14px;
  background:rgba(20,53,42,.42);
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
}
.page-contact .ct-route:hover{transform:translateY(-3px);border-color:var(--kp-line-strong);background:rgba(20,53,42,.66)}
.page-contact .ct-route h3{margin-top:12px;font-size:17px;line-height:1.45;color:#FBF8EF}
.page-contact .ct-route p{margin-top:9px;font-size:14px;line-height:1.8;color:var(--ct-soft)}
.page-contact .ct-route__link{
  display:inline-block;
  margin-top:14px;
  font-size:13.5px;
  font-weight:600;
  color:var(--kp-gold-hi);
  text-decoration:none;
  border-bottom:1px solid rgba(228,194,125,.45);
  padding-bottom:2px;
}
.page-contact .ct-route__link:hover{color:#FBF8EF;border-bottom-color:var(--kp-gold-hi)}
.page-contact .ct-route__link:focus-visible,
.page-contact .ct-inline-link:focus-visible{outline:2px solid var(--kp-amber);outline-offset:3px}

/* 地址区 */
.page-contact .ct-address{
  display:grid;
  gap:20px;
  padding:clamp(18px,3.4vw,32px);
  border:1px solid var(--kp-line);
  border-radius:var(--kp-radius);
  background:
    linear-gradient(rgba(11,26,21,.86),rgba(11,26,21,.86)),
    repeating-linear-gradient(0deg, rgba(228,194,125,.16) 0 1px, transparent 1px 32px),
    repeating-linear-gradient(90deg, rgba(228,194,125,.16) 0 1px, transparent 1px 32px),
    var(--kp-panel);
}
.page-contact .ct-address h2{font-size:clamp(20px,3.2vw,28px);line-height:1.35;margin-top:6px;color:#FBF8EF}
.page-contact .ct-address__text{margin-top:14px;font-size:15px;line-height:1.9;color:var(--ct-soft);max-width:56ch}
.page-contact .ct-address__text--dim{color:var(--ct-dim);font-size:14px}
.page-contact .ct-address__plate{
  padding:20px;
  border:1px solid var(--ct-plate-line);
  border-radius:14px;
  background:linear-gradient(165deg,var(--ct-plate),var(--ct-plate-2));
  color:var(--kp-char);
  align-self:start;
}
.page-contact .ct-address__addr{
  margin-top:10px;
  font-family:var(--kp-font-display);
  font-size:18px;
  font-weight:800;
  line-height:1.6;
  color:#14352A;
}
.page-contact .ct-address__meta{
  margin-top:10px;
  font-size:12.5px;
  color:#5B2530;
  word-break:break-word;
}
.page-contact .ct-address__plate .ct-inline-link{color:#5B2530;text-decoration-color:rgba(91,37,48,.4);margin-top:14px}
.page-contact .ct-address__plate .ct-inline-link:hover{color:#14352A}

@media (min-width:720px){
  .page-contact .ct-routes{grid-template-columns:repeat(2,1fr)}
  .page-contact .ct-fields{grid-template-columns:repeat(2,1fr)}
  .page-contact .ct-field--wide{grid-column:1/-1}
}

@media (min-width:900px){
  .page-contact .ct-hero{grid-template-columns:7fr 5fr;gap:clamp(28px,4vw,52px)}
  .page-contact .ct-hero h1{margin-top:4px}
  .page-contact .ct-plates{grid-template-columns:7fr 5fr}
  .page-contact .ct-plate--primary{grid-row:span 2}
  .page-contact .ct-plate--address{grid-column:1/-1}
  .page-contact .ct-form{grid-template-columns:4fr 8fr;gap:clamp(24px,3.4vw,40px)}
  .page-contact .ct-steps{position:sticky;top:96px}
  .page-contact .ct-check-layout{grid-template-columns:5fr 7fr;gap:clamp(24px,3.4vw,44px)}
  .page-contact .ct-flow{grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.6vw,32px)}
  .page-contact .ct-flow li{
    padding:22px 0 0;
    border-left:none;
    border-top:1px solid var(--kp-line);
  }
  .page-contact .ct-flow li:last-child{border-top-color:var(--kp-line)}
  .page-contact .ct-flow li::before{left:0;top:-4.5px}
  .page-contact .ct-address{grid-template-columns:8fr 4fr;gap:clamp(24px,3.4vw,44px);align-items:start}
}

@media (min-width:1100px){
  .page-contact .ct-hero{gap:64px}
  .page-contact .ct-chip__v{font-size:14.5px}
}

@media (prefers-reduced-motion:reduce){
  .page-contact .ct-plate:hover,
  .page-contact .ct-route:hover{transform:none}
}
<<<END>>>
