.page-contact{
  --pc-gap: clamp(18px, 3.2vw, 30px);
  --pc-pad: clamp(18px, 2.6vw, 26px);
  --pc-sec: clamp(34px, 5.5vw, 64px);
  color: var(--text);
}

/* 面包屑 */
.page-contact .contact-top{padding-top: clamp(20px, 4vw, 40px);}
.page-contact .breadcrumbs{margin:0 0 18px;}
.page-contact .breadcrumbs ol{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px;
  margin:0; padding:0; list-style:none;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; color:var(--mist);
}
.page-contact .breadcrumbs li{display:flex; align-items:center; gap:8px;}
.page-contact .breadcrumbs li + li::before{content:"/"; color:var(--line);}
.page-contact .breadcrumbs a{color:var(--mist); text-decoration:none; transition:color .2s var(--ease);}
.page-contact .breadcrumbs a:hover{color:var(--lemon);}
.page-contact .breadcrumbs [aria-current="page"]{color:var(--lemon);}

/* 首屏 */
.page-contact .eyebrow{
  margin:0; font-family:var(--font-mono); font-size:12px;
  letter-spacing:.18em; text-transform:uppercase; color:var(--lemon);
}
.page-contact h1{
  margin:12px 0 16px;
  font-size:clamp(30px, 5.6vw, 52px);
  line-height:1.08; letter-spacing:-.02em; font-weight:900; color:var(--paper);
}
.page-contact .lede{
  margin:0; max-width:58ch;
  font-size:clamp(15px, 1.6vw, 17px); line-height:1.72; color:var(--text-dim);
}
.page-contact .contact-hero{
  display:grid; gap:var(--pc-gap);
  padding-bottom:var(--pc-sec);
  border-bottom:1px dashed var(--line);
}
.page-contact .contact-hero__tags{
  display:flex; flex-wrap:wrap; gap:8px;
  margin:20px 0 0; padding:0; list-style:none;
}
.page-contact .tag{
  display:inline-block; padding:3px 9px;
  font-family:var(--font-mono); font-size:11px; letter-spacing:.08em;
  border:1px solid currentColor; border-radius:2px; white-space:nowrap;
}
.page-contact .tag--cyan{color:var(--cyan);}
.page-contact .tag--lemon{color:var(--lemon);}
.page-contact .tag--coral{color:var(--coral);}

.page-contact .contact-hero__visual{
  margin:0; padding:10px;
  border:1px solid var(--line); border-radius:var(--radius);
  background:
    linear-gradient(150deg, rgba(63,224,197,.14), rgba(11,27,43,0) 62%),
    var(--panel);
}
.page-contact .contact-hero__visual img{
  display:block; width:100%; height:auto; aspect-ratio:3 / 2;
  object-fit:cover; filter:saturate(.9);
}
.page-contact .contact-hero__caption{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-top:10px; font-family:var(--font-mono); font-size:11.5px;
  letter-spacing:.1em; color:var(--mist);
}
.page-contact .hero-light{
  width:9px; height:9px; border-radius:50%; background:var(--cyan);
  box-shadow:0 0 0 4px rgba(63,224,197,.16);
  animation:pulse-contact 3.4s ease-in-out infinite;
}
@keyframes pulse-contact{
  0%,100%{opacity:.45; box-shadow:0 0 0 3px rgba(63,224,197,.12);}
  50%{opacity:1; box-shadow:0 0 0 6px rgba(63,224,197,.2);}
}

/* 分屏联系板 */
.page-contact .contact-board{
  display:grid; gap:var(--pc-gap);
  padding:var(--pc-sec) 0;
  border-bottom:1px dashed var(--line);
}
.page-contact .section__head h2,
.page-contact .contact-board h2{
  margin:10px 0 12px;
  font-size:clamp(22px, 3vw, 32px);
  line-height:1.2; font-weight:900; color:var(--paper);
}
.page-contact .channel-list{
  display:grid; gap:12px; margin:24px 0 0; padding:0; list-style:none;
}
.page-contact .channel{
  display:grid; grid-template-columns:auto minmax(0, 1fr); gap:4px 14px;
  padding:var(--pc-pad);
  background:var(--panel);
  border:1px solid var(--line); border-radius:var(--radius);
  transition:transform .25s var(--ease), border-color .25s var(--ease);
}
.page-contact .channel:hover{transform:translateY(-3px); border-color:var(--lemon);}
.page-contact .channel__index{
  padding-top:4px; font-family:var(--font-mono);
  font-size:12px; letter-spacing:.1em; color:var(--lemon);
}
.page-contact .channel__body h3{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px;
  margin:0 0 6px; font-size:18px; line-height:1.3; color:var(--paper);
}
.page-contact .channel__value{
  margin:0 0 8px;
  font-family:var(--font-mono); font-size:14px; letter-spacing:.02em;
  color:var(--cyan); overflow-wrap:anywhere;
}
.page-contact .channel__body p{margin:0; font-size:14px; line-height:1.68; color:var(--text-dim);}

.page-contact .hand-note{
  margin:20px 0 0; padding:14px 18px;
  font-family:var(--font-hand); font-size:15px; line-height:1.8;
  color:var(--ink); background:var(--lemon);
  border-radius:2px; transform:rotate(-1.1deg);
  box-shadow:0 16px 26px -20px rgba(0,0,0,.95);
}
.page-contact .hand-note a{
  color:var(--ink);
  text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:3px;
}

/* 右侧清单与时段 */
.page-contact .contact-board__side{
  padding:var(--pc-pad);
  background:var(--paper); color:var(--ink);
  border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:10px 10px 0 -2px rgba(43,66,87,.42);
}
.page-contact .contact-board__side .eyebrow{color:var(--coral);}
.page-contact .contact-board__side h2{
  margin:8px 0 18px; font-size:clamp(20px, 2.4vw, 26px);
  line-height:1.25; color:var(--ink);
}
.page-contact .checklist{
  display:grid; gap:14px; margin:0; padding:0; list-style:none;
}
.page-contact .checklist li{
  display:grid; grid-template-columns:auto minmax(0, 1fr); gap:10px;
}
.page-contact .checklist__num{
  display:grid; place-items:center; width:24px; height:24px;
  font-family:var(--font-mono); font-size:12px; font-weight:600;
  color:var(--ink); background:var(--lemon); border-radius:2px;
}
.page-contact .checklist h3{margin:0 0 3px; font-size:15px; line-height:1.4; color:var(--ink);}
.page-contact .checklist p{margin:0; font-size:13.5px; line-height:1.6; color:rgba(11,27,43,.72);}

.page-contact .hours{
  margin-top:22px; padding-top:16px;
  border-top:1px dashed rgba(11,27,43,.26);
}
.page-contact .hours__title{margin:0 0 10px; font-size:14px; letter-spacing:.04em; color:var(--ink);}
.page-contact .hours__track{
  height:8px; border-radius:99px;
  background:linear-gradient(90deg, var(--cyan), var(--lemon) 70%, var(--coral));
}
.page-contact .hours__labels{
  display:flex; justify-content:space-between; gap:4px;
  margin-top:8px; font-family:var(--font-mono); font-size:11px;
  color:rgba(11,27,43,.6);
}
.page-contact .hours__note{
  margin:10px 0 0; font-size:13px; line-height:1.6; color:rgba(11,27,43,.66);
}

/* 回复节奏 */
.page-contact .contact-rhythm{
  padding:var(--pc-sec) 0;
  border-bottom:1px dashed var(--line);
}
.page-contact .rhythm-rail{
  display:grid; gap:14px; margin:26px 0 0; padding:0; list-style:none;
  counter-reset:none;
}
.page-contact .rhythm-step{
  position:relative;
  padding:20px 18px 22px;
  background:rgba(19,41,61,.6);
  border-top:2px solid var(--line);
}
.page-contact .rhythm-step::before{
  content:""; position:absolute; top:-5px; left:18px;
  width:8px; height:8px; border-radius:50%;
  background:var(--cyan); box-shadow:0 0 0 4px rgba(63,224,197,.14);
}
.page-contact .rhythm-step__num{
  display:block; margin-bottom:8px;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.14em; color:var(--lemon);
}
.page-contact .rhythm-step h3{margin:0 0 6px; font-size:16px; line-height:1.35; color:var(--paper);}
.page-contact .rhythm-step p{margin:0; font-size:14px; line-height:1.68; color:var(--text-dim);}

/* 主题写法与折叠 */
.page-contact .contact-mail{
  padding:var(--pc-sec) 0;
  border-bottom:1px dashed var(--line);
}
.page-contact .contact-mail__grid{display:grid; gap:var(--pc-gap);}
.page-contact .contact-mail__intro h2{
  margin:10px 0 14px;
  font-size:clamp(22px, 3vw, 32px);
  line-height:1.22; font-weight:900; color:var(--paper);
}
.page-contact .inline-link{margin:18px 0 0;}
.page-contact .inline-link a{
  display:inline-block;
  font-family:var(--font-mono); font-size:13px; letter-spacing:.04em;
  color:var(--lemon); text-decoration:none;
  border-bottom:1px dashed var(--lemon); padding-bottom:2px;
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.page-contact .inline-link a:hover{color:var(--cyan); border-color:var(--cyan);}

.page-contact .mail-list{border-top:1px solid var(--line);}
.page-contact .mail-item{border-bottom:1px solid var(--line);}
.page-contact .mail-trigger{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  width:100%; padding:16px 0;
  background:none; border:0; cursor:pointer;
  font-family:var(--font-sans); font-size:16px; font-weight:700; line-height:1.4;
  color:var(--paper); text-align:left;
  transition:color .2s var(--ease);
}
.page-contact .mail-trigger:hover{color:var(--lemon);}
.page-contact .mail-trigger__mark{
  position:relative; flex:none; width:14px; height:14px;
}
.page-contact .mail-trigger__mark::before,
.page-contact .mail-trigger__mark::after{
  content:""; position:absolute; background:var(--lemon);
  transition:transform .25s var(--ease), opacity .25s var(--ease);
}
.page-contact .mail-trigger__mark::before{top:6px; left:0; width:14px; height:2px;}
.page-contact .mail-trigger__mark::after{top:0; left:6px; width:2px; height:14px;}
.page-contact .mail-trigger[aria-expanded="true"] .mail-trigger__mark::after{
  transform:scaleY(0); opacity:0;
}
.page-contact .mail-panel{padding:0 0 18px;}
.page-contact .mail-panel p{
  margin:0; font-size:14.5px; line-height:1.72; color:var(--text-dim);
}
.page-contact .mail-panel strong{
  font-family:var(--font-mono); font-weight:500; color:var(--cyan);
}

/* 沟通方式 */
.page-contact .contact-scope{padding:var(--pc-sec) 0;}
.page-contact .scope-grid{
  display:grid; gap:12px; margin-top:26px;
}
.page-contact .scope-card{
  padding:18px 18px 20px;
  border-left:2px solid var(--cyan);
  background:rgba(7,19,31,.55);
}
.page-contact .scope-card:nth-child(2){border-left-color:var(--coral);}
.page-contact .scope-card:nth-child(3){border-left-color:var(--lemon);}
.page-contact .scope-card h3{margin:0 0 6px; font-size:15.5px; line-height:1.4; color:var(--paper);}
.page-contact .scope-card p{margin:0; font-size:14px; line-height:1.68; color:var(--text-dim);}
.page-contact .scope-card a{color:var(--cyan); text-decoration:none; border-bottom:1px solid var(--cyan);}
.page-contact .scope-card a:hover{color:var(--lemon); border-color:var(--lemon);}

/* 地址与备案 */
.page-contact .contact-base{padding:0 0 var(--pc-sec);}
.page-contact .contact-base__card{
  display:grid;
  border:1px solid var(--line); border-radius:var(--radius);
  background:var(--night); overflow:hidden;
}
.page-contact .contact-base__text{padding:var(--pc-pad);}
.page-contact .contact-base__text h2{
  margin:10px 0 14px;
  font-size:clamp(20px, 2.6vw, 26px);
  line-height:1.25; font-weight:900; color:var(--paper);
}
.page-contact .contact-base__text p{margin:0 0 10px; font-size:14px; line-height:1.7; color:var(--text-dim);}
.page-contact .contact-base__addr{
  font-family:var(--font-mono); font-size:clamp(15px, 2vw, 18px);
  letter-spacing:.02em; color:var(--lemon); overflow-wrap:anywhere;
}
.page-contact .contact-base__icp{
  margin:16px 0 0 !important;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; color:var(--mist);
}
.page-contact .contact-base__figure{margin:0; min-height:220px;}
.page-contact .contact-base__figure img{
  display:block; width:100%; height:100%; min-height:220px; object-fit:cover;
}

/* 断点 */
@media (min-width:760px){
  .page-contact .channel-list{grid-template-columns:repeat(2, minmax(0, 1fr));}
  .page-contact .rhythm-rail{grid-template-columns:repeat(2, minmax(0, 1fr));}
  .page-contact .scope-grid{grid-template-columns:repeat(2, minmax(0, 1fr));}
}

@media (min-width:960px){
  .page-contact .contact-hero{
    grid-template-columns:minmax(0, 1.12fr) minmax(0, .88fr);
    align-items:center;
  }
  .page-contact .contact-board{
    grid-template-columns:minmax(0, 1.3fr) minmax(0, .82fr);
    align-items:start;
  }
  .page-contact .contact-mail__grid{
    grid-template-columns:minmax(0, .92fr) minmax(0, 1.08fr);
    gap:clamp(28px, 4vw, 56px);
  }
  .page-contact .contact-base__card{
    grid-template-columns:minmax(0, 1fr) minmax(0, .82fr);
  }
}

@media (min-width:1100px){
  .page-contact .rhythm-rail{grid-template-columns:repeat(4, minmax(0, 1fr));}
  .page-contact .scope-grid{grid-template-columns:repeat(4, minmax(0, 1fr));}
}

@media (max-width:420px){
  .page-contact .channel{padding:16px;}
  .page-contact .hand-note{transform:none;}
  .page-contact .contact-board__side{box-shadow:6px 6px 0 -2px rgba(43,66,87,.42);}
}

@media (prefers-reduced-motion: reduce){
  .page-contact .hero-light{animation:none;}
  .page-contact .channel,
  .page-contact .mail-trigger,
  .page-contact .mail-trigger__mark::before,
  .page-contact .mail-trigger__mark::after{transition:none;}
}